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

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

/* 2. PCヘッダーロゴ：上下の余白を均等に */
@media screen and (min-width: 768px) {
    .header_logo_link { display: flex; align-items: center; padding: 10px 0; }
    .header-logo-sub.pc { display: block; margin-top: 0; }
}

/* 3. 下層ページMV：テンプレ既定の h1_bg.jpg を案件画像に差し替え＋暗幕 */
.heading1_wrap { background-image: url(../img/page-mv.jpg); }
.heading1_wrap::before { content: ""; position: absolute; inset: 0; background: rgba(0, 0, 0, .45); pointer-events: none; }
.heading1_wrap > * { position: relative; z-index: 1; }

/* 4. TOPコース背景（セクションはHS非表示でコメントアウト中。既定 course1.jpg を参照させない） */
.top_access { background-image: url(../img/ph_top-course-bg.jpg); }

/* 5. News欄削除に伴い、Instagram一覧の下余白を確保（PCは既定0） */
@media screen and (min-width: 768px) {
    .top_insta { padding-bottom: 80px; }
}

/* 6. グロナビ：予約ボタン＋Instagramアイコン（最右） */
.gnav_resv { display: flex; align-items: center; }
.gnav_insta { display: flex; align-items: center; line-height: 1; }
.gnav_insta a { display: flex; align-items: center; line-height: 1; }
.gnav_insta img,
.gmenu_sp_insta img,
.footer_link_menu_insta img { width: var(--insta-icon); height: var(--insta-icon); object-fit: contain; display: block; }
.gnav_wrap { align-items: center; }

/* SPドロワー */
.gmenu_sp_insta { display: flex !important; align-items: center; justify-content: center; width: var(--insta-icon); margin: 0 auto; line-height: 1; }
.gnav_insta_sp { display: flex; justify-content: center; padding-top: 12px; }
.header_nav_list_sp .gmenu_sp.btn { margin: 2rem auto 0; color: #fff; width: 120px; }

/* フッター：予約は白の細枠の抜きチップ、Instagramは最右 */
.footer_link_list { align-items: center; }
.fmenu_resv { display: inline-block; padding: 6px 18px; border: 1px solid rgba(255, 255, 255, .45); color: #fff; line-height: 1.4; }
.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; }

/* 7. 追従予約ボタン（右端固定）とグロナビ右端が重ならないように */
@media screen and (min-width: 768px) and (max-width: 1100px) {
    .gnav { margin-right: 100px; }
}

/* 8. ギャラリー：画像の高さを揃える（中央トリミング・歪めない） */
.gallery_content_sec_item img { aspect-ratio: 3 / 2; height: auto; object-fit: cover; object-position: center; }

/* 9. TOPループスライダー（HS非表示でコメントアウト中。復帰時の見切れ防止） */
#loopslider ul li img { width: 100%; height: 100%; object-fit: cover; object-position: center; display: block; }

/* 10. 食べログ連携メニュー：tabelog.css の width:770px 固定で768〜810px幅がはみ出すのを防ぐ */
[class^="CMS-"] .rstdtl-menu-lst { max-width: 100%; box-sizing: border-box; }