@charset "UTF-8";
/* =========================================================
   おだか家 案件用の上書き（テンプレ本体CSSは触らない）
   ========================================================= */

/* 1. ダークモード対策：背景は html だけに敷く（body に敷くとTOPメニューのベージュ帯 z-index:-1 が消える） */
:root { color-scheme: light; --insta-icon: 28px; }
html { background-color: #fff; }

/* 2. ヘッダーロゴ（PCのみ）：inline の img がベースライン分下に寄るのを補正
      ※SPはテンプレ既定どおり .pc で非表示（MV下にロゴを出さない）。display はPC幅に限定すること */
@media screen and (min-width: 768px) {
    .header_logo_link { display: flex; align-items: center; }
    .header_logo_link img.header-logo-sub { display: block; margin-top: 0; }
    .header_inner { padding: 12px 0; }
}

/* 3. Instagram アイコン（グロナビ最右／SPドロワー／フッター）：サイズ統一・上下位置合わせ */
.gnav_insta { display: flex; align-items: center; line-height: 1; }
.gnav_insta a { display: flex; align-items: center; line-height: 1; padding: 0 0 0 6px; }
.gnav_insta img { width: var(--insta-icon); height: var(--insta-icon); object-fit: contain; display: block; }
.gnav_insta_sp { display: flex; justify-content: center; padding-top: 12px; }
.gmenu_sp_insta { display: flex !important; align-items: center; justify-content: center; width: var(--insta-icon); margin: 0 auto; line-height: 1; }
.gmenu_sp_insta img { width: var(--insta-icon); height: var(--insta-icon); object-fit: contain; display: block; }
.footer_link_list { align-items: center; }
.footer_link_menu_insta { display: flex; align-items: center; justify-content: center; }
.footer_link_menu_insta .fmenu { display: flex; align-items: center; justify-content: center; line-height: 1; }
.footer_link_menu_insta img { width: var(--insta-icon); height: var(--insta-icon); object-fit: contain; display: block; }

/* 4. 下層ページMV（CSS背景）：案件画像に差し替え＋白見出し用の暗幕 */
.heading1_wrap { background-image: url(../img/page-mv.jpg); }
.heading1_wrap::before { content: ""; position: absolute; inset: 0; background: rgba(0, 0, 0, .45); }
.heading1_wrap .heading1 { z-index: 1; }

/* 5. TOPコースの背景（PC=style.css / SP=style_responsive.css の2重指定を両方上書き） */
.top_access { background-image: url(../img/top-course-bg.jpg); }
@media screen and (max-width: 767px) {
    .top_access { background-image: url(../img/top-course-bg.jpg); }
}

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

/* 7. ギャラリー：比率の違う写真が混ざっても行の高さを揃える（長方形グリッド型） */
.gallery_content_sec_item img { aspect-ratio: 3 / 2; height: auto; object-fit: cover; object-position: center; }

/* 8. グロナビ右端と追従予約ボタン（#op_btn）の重なり回避 */
@media screen and (min-width: 768px) and (max-width: 1100px) {
    .gnav { margin-right: 100px; }
}

/* 9. 食べログ連携メニュー：tabelog.css の width:770px 固定で 768〜800px 付近が横にはみ出すのを防ぐ */
.rstdtl-menu-lst { max-width: 100%; box-sizing: border-box; }