@charset "utf-8";
/* ===== 酒房食彩もぐ カスタム上書き（テンプレ本体CSSは触らない） ===== */

/* 画像ロゴ（縦長・白抜き）をヘッダー高さに収める（巨大化・MV被り防止） */
header .inner { align-items: center; }           /* ロゴを縦中央に */
header h1 { width: auto !important; position: relative; z-index: 999; }
header h1 a { display: inline-block; line-height: 0; }
header h1 img { width: auto !important; max-width: none; }
@media (min-width: 768px) {
    /* PCはロゴを大きくしてヘッダー帯(130px)から下に張り出させる（MVに重ねる） */
    header { position: relative; z-index: 20; overflow: visible; }
    header .inner { align-items: flex-start; }
    header h1 { z-index: 999; }
    header h1 img { height: 165px !important; }
}
@media (max-width: 767px) {
    /* SPヘッダー高さ60px → ロゴは高さ46pxで収め、言語切替ウィジェット・ハンバーガーに被らないよう中央に。
       SPでは .inner が block のため h1 自体を flex で中央寄せする */
    header h1 { width: 100% !important; margin: 0; display: flex; align-items: center; justify-content: center; height: 60px; }
    header h1 img { height: 46px !important; }
}

/* グロナビ：Instagramアイコン・予約リンク */
/* 各ナビの項目を縦中央で揃える（アイコンだけ上に浮く現象の防止） */
ul.gnav,
.persist-header ul { align-items: center; }
.gnav_insta { display: inline-flex; align-items: center; }
.gnav_insta a { display: inline-flex; align-items: center; padding: 0 6px; line-height: 1; }
.gnav_insta img { width: 22px; height: 22px; object-fit: contain; display: block; vertical-align: middle; }
/* アイコンは白（テンプレ白ナビに合わせる。念のためCSSでも白化） */
.gnav_insta img { filter: brightness(0) invert(1); }
.gnav_resv a { font-weight: 700; }
.drawer-menu .gnav_insta img { width: 26px; height: 26px; }

/* TOPギャラリーのループスライダー：各画像を中央基準でトリミング（見切れ防止） */
#loopslider ul li img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}

/* TOPメニュー（料理・飲物）PC背景を実画像に差し替え（テンプレ既定 food1/drink1 の上書き） */
@media (min-width: 768px) {
    .top-food .bg { background-image: url(../img/top-menu-1.jpg); }
    .top-drink .bg { background-image: url(../img/top-menu-2.jpg); }
}

/* ギャラリーページ：テンプレ既定の正円トリミング（中央基準）を維持。
   ※以前 aspect-ratio を当てて縦が潰れ楕円化していたため撤去し、正円に戻す。 */
.gallery-list li img.object-fit-img {
    object-fit: cover;
    object-position: center;
}