@charset "UTF-8";
/* =========================================================
   スピエディーノ フッジ 専用スキン（site.css）
   ---------------------------------------------------------
   業種テーマ「イタリアン」（黒地・同心円・斜線）を、指示書の
   「ベージュ地／ポイント 深緑と白／ボタン 朱色／見出し 太めの明朝・本文 明朝」に塗り替える。
   読み込み：header.php（全フロントページ共通）→ custom.css より後なので同じ詳細度なら勝つ。
   テーマ側が !important を付けている宣言は、body を前置＋!important で上書きする。
   ページごとの出し分けは <html> のクラス（header.php が付ける sf-p-index / sf-p-concept /
   sf-p-menu / sf-p-courses / sf-p-gallery / sf-p-access）で行う。ブロックの id には依存しない。
   計画書：docs/site_plan_2026-09-28.md（§2 デザイン仕様）
========================================================= */

/* ---------- 0. トークン ---------- */
:root {
  --sf-beige: #F3ECE0;
  --sf-beige-2: #EAE0CF;
  --sf-paper: #FBF8F2;
  --sf-green: #1F4A36;
  --sf-green-2: #2C5E46;
  --sf-green-deep: #16362A;
  --sf-vermilion: #D2451F;
  --sf-vermilion-hover: #B83B1A;
  --sf-ink: #2A2520;
  --sf-ink-mute: #6E6458;
  --sf-line: rgba(31, 74, 54, .18);
  --sf-line-strong: rgba(31, 74, 54, .35);
  --sf-dot-green: #266240;
  --sf-dot-red: #B52321;
  --sf-serif: "Noto Serif JP", "Shippori Mincho", "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", serif;
  --sf-en: "Cormorant Garamond", "Noto Serif JP", serif;
  --sf-shadow: 0 10px 30px rgba(31, 74, 54, .08);
  --sf-header-h: 84px;
  --sf-pad-y: 104px;

  /* テーマ（イタリアン）の変数を塗り替える＝テーマ CSS の var() 参照がまとめてこの配色になる */
  --bg-base: var(--sf-beige);
  --bg-paper: var(--sf-paper);
  --bg-warm: var(--sf-beige-2);
  --ink: var(--sf-ink);
  --text-main: var(--sf-ink);
  --text-sub: var(--sf-ink-mute);
  --text-muted: var(--sf-ink-mute);
  --gold: var(--sf-green);
  --gold-light: var(--sf-green);
  --vermilion: var(--sf-vermilion);
  --line: var(--sf-line);
  --line-dark: var(--sf-line);
  --font-serif: var(--sf-serif);
  --font-en: var(--sf-en);
}
@media (max-width: 992px) { :root { --sf-header-h: 64px; --sf-pad-y: 76px; } }
@media (max-width: 767px) { :root { --sf-pad-y: 64px; } }

/* ---------- 1. 全体 ---------- */
html { scroll-padding-top: calc(var(--sf-header-h) + 12px); }
body {
  background: var(--sf-beige) !important;
  color: var(--sf-ink) !important;
  font-family: var(--sf-serif) !important;
  font-weight: 400;
  letter-spacing: .04em;
  font-variant-numeric: lining-nums;   /* Cormorant Garamond の数字は既定が小文字風（オールドスタイル）なので、価格・電話を読みやすい字形に */
  -webkit-font-smoothing: antialiased;
}
body a { color: inherit; }
body ::selection { background: rgba(31, 74, 54, .18); }
.sf-anchor { display: block; position: relative; top: calc(-1 * var(--sf-header-h) - 16px); visibility: hidden; height: 0; }

/* ---------- 2. 共通パーツ（見出し・ボタン・3粒） ---------- */
/* セクション見出し：英字（深緑・細身のセリフ）→ 和文（太め明朝）→ ロゴの3粒 */
.sf-sec-head { margin: 0 0 44px; }
.sf-sec-head--center { text-align: center; }
.sf-eyebrow {
  margin: 0 0 10px; color: var(--sf-green); font-family: var(--sf-en); font-size: 15px; font-weight: 600;
  letter-spacing: .24em; line-height: 1.3; text-transform: uppercase;
}
.sf-heading {
  margin: 0; color: var(--sf-ink); font-family: var(--sf-serif); font-size: clamp(24px, 2.4vw, 32px); font-weight: 700;
  letter-spacing: .14em; line-height: 1.6;
}
.sf-dots { display: inline-flex; gap: 7px; margin-top: 18px; }
.sf-dots i { display: block; width: 8px; height: 8px; border-radius: 50%; background: var(--sf-dot-green); }
.sf-dots i:nth-child(2) { background: #fff; box-shadow: inset 0 0 0 1px rgba(42, 37, 32, .35); }
.sf-dots i:nth-child(3) { background: var(--sf-dot-red); }
.sf-lead { margin: 0 auto 36px; max-width: 760px; font-size: 15px; line-height: 2.1; text-align: center; }
.sf-center { text-align: center; margin-top: 44px; }

/* ボタン：朱色地・白文字・角なし。右に細い矢印線 */
.sf-btn,
body .fc-block-btn.fc-block-btn-primary,
body .link-button-btn.link-button-btn-primary,
body .btn-menu-more,
body .fc-instagram-embed-action a {
  display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 14px !important;
  min-width: 220px !important; min-height: 54px !important; padding: 0 36px !important;
  border: 1px solid var(--sf-vermilion) !important; border-radius: 0 !important;
  background: var(--sf-vermilion) !important; color: #fff !important; box-shadow: none !important;
  font-family: var(--sf-serif) !important; font-size: 14px !important; font-weight: 600 !important; letter-spacing: .14em !important;
  line-height: 1.4 !important; text-decoration: none !important; text-transform: none !important;
  transition: background .25s ease, border-color .25s ease, color .25s ease !important;
}
.sf-btn::after,
body .fc-block-btn.fc-block-btn-primary::after,
body .link-button-btn.link-button-btn-primary::after,
body .btn-menu-more::after,
body .fc-instagram-embed-action a::after {
  content: "" !important; display: block !important; width: 22px !important; height: 7px !important;
  border-bottom: 1px solid currentColor !important; border-right: 1px solid currentColor !important;
  transform: skewX(45deg) translateY(-3px) !important; transition: width .25s ease !important;
}
.sf-btn:hover,
body .fc-block-btn.fc-block-btn-primary:hover,
body .link-button-btn.link-button-btn-primary:hover,
body .btn-menu-more:hover,
body .fc-instagram-embed-action a:hover {
  background: var(--sf-vermilion-hover) !important; border-color: var(--sf-vermilion-hover) !important; color: #fff !important; transform: none !important; opacity: 1 !important;
}
.sf-btn:hover::after,
body .fc-block-btn:hover::after,
body .btn-menu-more:hover::after,
body .fc-instagram-embed-action a:hover::after { width: 30px !important; }

/* 枠線ボタン（電話など）：深緑の枠・文字 */
.sf-btn--line,
body .link-button-btn.link-button-btn-outline,
body .fc-block-btn.fc-block-btn-outline {
  display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 12px !important;
  min-width: 220px !important; min-height: 54px !important; padding: 0 32px !important;
  border: 1px solid var(--sf-green) !important; border-radius: 0 !important; background: transparent !important; color: var(--sf-green) !important;
  font-family: var(--sf-serif) !important; font-size: 15px !important; font-weight: 600 !important; letter-spacing: .12em !important; text-decoration: none !important;
  transition: background .25s ease, color .25s ease !important;
}
.sf-btn--line::after { display: none !important; }
.sf-btn--line:hover,
body .link-button-btn.link-button-btn-outline:hover,
body .fc-block-btn.fc-block-btn-outline:hover { background: var(--sf-green) !important; color: #fff !important; }

/* ブロックの「もっと見る」ボタンの置き場所 */
body .fc-block-btn-wrap { margin-top: 36px !important; text-align: left; }

/* 帯（カスタムHTML）の共通 */
.sf-band { position: relative; padding: var(--sf-pad-y) 24px; background: var(--sf-beige); color: var(--sf-ink); }
.sf-band--beige2 { background: var(--sf-beige-2); }
.sf-band--paper { background: var(--sf-paper); }
.sf-band--green { background: var(--sf-green-deep); color: #fff; }
.sf-inner { max-width: 1120px; margin: 0 auto; }
.sf-inner--narrow { max-width: 860px; }

/* ---------- 3. ヘッダー（global_header） ---------- */
body .global-header {
  height: var(--sf-header-h) !important; padding: 0 clamp(20px, 3vw, 44px) !important;
  display: flex !important; align-items: center !important; gap: 28px !important;
  background: rgba(251, 248, 242, .96) !important; border-bottom: 1px solid var(--sf-line) !important;
  backdrop-filter: blur(8px) !important; -webkit-backdrop-filter: blur(8px) !important; box-shadow: none !important;
  transition: box-shadow .3s ease !important;
}
body .global-header.is-scrolled { background: rgba(251, 248, 242, .98) !important; box-shadow: 0 6px 24px rgba(31, 74, 54, .08) !important; }
body .header-logo { flex: 0 0 auto; margin-right: auto; }
body .header-logo img { display: block; max-height: 58px !important; width: auto !important; }
/* SEO 用 H1（ヘッダー右上の小さな文字）：深緑の薄い文字で上辺に */
body .header-page-eyebrow {
  top: 5px !important; right: clamp(20px, 3vw, 44px) !important; max-width: 60% !important;
  color: var(--sf-ink-mute) !important; opacity: .85 !important; font-family: var(--sf-serif) !important; font-size: 10.5px !important; letter-spacing: .08em !important;
}
body .desktop-nav { display: flex !important; align-items: center !important; gap: clamp(18px, 1.9vw, 34px) !important; margin: 10px 0 0 !important; }
body .desktop-nav a {
  position: relative; display: inline-flex !important; flex-direction: column; align-items: center; gap: 4px;
  padding: 6px 0 !important; color: var(--sf-green) !important;
  font-family: var(--sf-en) !important; font-size: 16px !important; font-weight: 600 !important; letter-spacing: .14em !important;
  line-height: 1 !important; text-transform: uppercase !important; white-space: nowrap !important;
}
/* 英字の下に小さな和文（ナビの行き先ごと） */
body .desktop-nav a::after {
  position: static !important; width: auto !important; height: auto !important; background: none !important;
  color: var(--sf-ink-mute); font-family: var(--sf-serif); font-size: 10px; font-weight: 500; letter-spacing: .12em; text-transform: none;
  transition: color .25s ease !important;
}
body .desktop-nav a[href$="index.php"]::after, body .desktop-nav a[href="/"]::after { content: "トップ"; }
body .desktop-nav a[href*="slug=concept"]::after { content: "こだわり"; }
body .desktop-nav a[href$="menu.php"]::after { content: "フード・ドリンク"; }
body .desktop-nav a[href$="courses.php"]::after { content: "コース・ランチ"; }
body .desktop-nav a[href*="slug=gallery"]::after { content: "ギャラリー"; }
body .desktop-nav a[href*="slug=access"]::after { content: "店舗案内"; }
/* 今いるページ・ホバー：上に深緑の短い線 */
body .desktop-nav a::before {
  content: ""; position: absolute; left: 50%; top: -6px; width: 0; height: 1px; background: var(--sf-green); transform: translateX(-50%); transition: width .25s ease;
}
body .desktop-nav a:hover::before, body .desktop-nav a.active::before { width: 24px; }
body .desktop-nav a:hover::after, body .desktop-nav a.active::after { color: var(--sf-green); }

body .header-btns { display: flex !important; align-items: center !important; gap: 12px !important; margin: 0 !important; }
body .btn-header-tel {
  display: inline-flex !important; align-items: center !important; gap: 8px !important; height: 46px !important; padding: 0 18px !important;
  border: 1px solid var(--sf-green) !important; color: var(--sf-green) !important; background: transparent !important;
  font-family: var(--sf-en) !important; font-size: 19px !important; font-weight: 600 !important; letter-spacing: .06em !important; white-space: nowrap !important;
  transition: background .25s ease, color .25s ease !important;
}
body .btn-header-tel i { font-size: 13px !important; }
body .btn-header-tel:hover { background: var(--sf-green) !important; color: #fff !important; }
body .btn-header-reserve {
  display: inline-flex !important; align-items: center !important; gap: 8px !important; min-width: 0 !important; height: 46px !important; padding: 0 22px !important;
  border: 1px solid var(--sf-vermilion) !important; border-radius: 0 !important; background: var(--sf-vermilion) !important; color: #fff !important;
  font-family: var(--sf-serif) !important; font-size: 14px !important; font-weight: 600 !important; letter-spacing: .14em !important; text-transform: none !important;
}
body .btn-header-reserve:hover { background: var(--sf-vermilion-hover) !important; border-color: var(--sf-vermilion-hover) !important; color: #fff !important; }
body .btn-header-reserve i { font-size: 14px !important; }
body .menu-trigger { border: 1px solid var(--sf-line-strong) !important; background: transparent !important; color: var(--sf-green) !important; border-radius: 0 !important; }

/* 狭い PC：電話は番号を隠してアイコンだけ（ロゴ＋ナビ 6＋ボタン 2 が 1 行に入る幅を実測して決める） */
@media (max-width: 1320px) {
  body .btn-header-tel { width: 46px !important; padding: 0 !important; justify-content: center !important; font-size: 0 !important; gap: 0 !important; }
  body .btn-header-tel i { font-size: 16px !important; }
}
@media (max-width: 1160px) {
  body .desktop-nav { gap: 16px !important; }
  body .desktop-nav a { font-size: 14px !important; letter-spacing: .1em !important; }
  body .header-logo img { max-height: 50px !important; }
}
@media (max-width: 992px) {
  body .global-header { gap: 12px !important; }
  body .header-logo img { max-height: 46px !important; }
  body .desktop-nav, body .header-btns { display: none !important; }
}

/* SP のメニュー（全画面） */
body .mobile-nav-overlay { background: var(--sf-green-deep) !important; gap: 18px !important; }
body .mobile-nav-overlay a:not(.btn-header-reserve) {
  display: flex; flex-direction: column; align-items: center; gap: 4px;
  color: #fff !important; font-family: var(--sf-en) !important; font-size: 22px !important; font-weight: 600 !important; letter-spacing: .16em !important;
}
body .mobile-nav-overlay a:not(.btn-header-reserve)::after { color: rgba(255, 255, 255, .62); font-family: var(--sf-serif); font-size: 11px; letter-spacing: .14em; }
body .mobile-nav-overlay a[href$="index.php"]::after { content: "トップ"; }
body .mobile-nav-overlay a[href*="slug=concept"]::after { content: "こだわり"; }
body .mobile-nav-overlay a[href$="menu.php"]::after { content: "フード・ドリンク"; }
body .mobile-nav-overlay a[href$="courses.php"]::after { content: "コース・ランチ"; }
body .mobile-nav-overlay a[href*="slug=gallery"]::after { content: "ギャラリー"; }
body .mobile-nav-overlay a[href*="slug=access"]::after { content: "店舗案内"; }
body .mobile-nav-overlay .btn-header-reserve { margin-top: 14px; height: 52px !important; padding: 0 44px !important; }
body .mobile-nav-overlay .menu-trigger { border-color: rgba(255, 255, 255, .4) !important; color: #fff !important; }

/* ---------- 4. TOP ヒーロー（hero_main） ---------- */
body .hero-wrapper { background: var(--sf-green-deep) !important; min-height: 600px !important; }
/* テーマが CSS に直書きしている飾り文字「豊富な経験を皿にのせ…」と同心円は消す（キャッチはブロックの入力で出す） */
body .hero-wrapper::before, body .hero-img-window::after, body .hero-title-box::before, body .hero-title-box::after { content: none !important; display: none !important; }
/* 写真を暗くする重ねは写真（.hero-slide-img）側に付ける。.hero-wrapper に付けるとスライドより上に重なり、キャッチの白文字まで暗くなる */
body .hero-wrapper::after { content: none !important; display: none !important; }
body .hero-slide-img::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background:
    radial-gradient(ellipse 70% 60% at 12% 88%, rgba(18, 14, 10, .62) 0%, rgba(18, 14, 10, 0) 70%),
    linear-gradient(0deg, rgba(18, 14, 10, .45) 0%, rgba(18, 14, 10, .08) 45%, rgba(18, 14, 10, .16) 100%);
}
body .hero-slide-caption { z-index: 5 !important; }
body .hero-cap-bottom-left .hero-slide-caption { left: clamp(24px, 7vw, 120px) !important; right: auto !important; bottom: clamp(56px, 12vh, 140px) !important; top: auto !important; text-align: left !important; transform: none !important; max-width: none !important; }
body .hero-slide-catch {
  margin: 0 !important; color: #fff !important; font-family: var(--sf-serif) !important; font-weight: 700 !important;
  font-size: clamp(26px, 3.2vw, 46px) !important; line-height: 1.75 !important; letter-spacing: .16em !important;
  text-shadow: 0 2px 24px rgba(0, 0, 0, .55), 0 1px 3px rgba(0, 0, 0, .5) !important; white-space: nowrap;
}
body .hero-slider-dots { z-index: 6 !important; }
body .hero-slider-dot { background: rgba(255, 255, 255, .5) !important; border: 0 !important; }
body .hero-slider-dot.is-active { background: #fff !important; }

/* ---------- 5. 下層ヒーロー（hero_page） ---------- */
body .page-hero-wrapper {
  min-height: 460px !important; padding: calc(var(--sf-header-h) + 70px) 20px 80px !important; background-color: var(--sf-green-deep) !important;
}
/* テーマの透かし文字「MENU」（全ページに出ていた）を消す */
body .page-hero-wrapper::before { content: none !important; display: none !important; }
body .page-hero-wrapper::after, body .ph-overlay { background: linear-gradient(180deg, rgba(20, 16, 12, .28), rgba(20, 16, 12, .42)) !important; }
body .ph-title {
  display: block !important; color: #fff !important; font-family: var(--sf-en) !important; font-weight: 600 !important;
  font-size: clamp(40px, 6vw, 76px) !important; letter-spacing: .16em !important; line-height: 1.1 !important; text-shadow: 0 2px 20px rgba(0, 0, 0, .35) !important;
}
body .ph-title::after { content: none !important; }
body .ph-desc {
  margin: 18px auto 0 !important; color: #fff !important; font-family: var(--sf-serif) !important; font-size: 15px !important; font-weight: 500 !important; letter-spacing: .3em !important;
}
body .ph-desc::before { content: ""; display: block; width: 36px; height: 1px; margin: 0 auto 16px; background: rgba(255, 255, 255, .8); }
/* ページごとの写真の見せ場（元データの構図に合わせる） */
.sf-p-concept body .page-hero-wrapper { background-position: center 42% !important; }
.sf-p-menu body .page-hero-wrapper { background-position: center 60% !important; }
.sf-p-courses body .page-hero-wrapper { background-position: center 55% !important; }
.sf-p-access body .page-hero-wrapper { background-position: center 40% !important; }

/* ---------- 6. 画像＋文章（concept_split） ---------- */
body .concept-section { padding: var(--sf-pad-y) clamp(24px, 6vw, 96px) !important; background: var(--sf-beige) !important; color: var(--sf-ink) !important; }
body .concept-section::before, body .concept-section::after, body .concept-img-wrapper::before { content: none !important; display: none !important; }
body .concept-container, body .concept-container.concept-reverse { max-width: 1120px !important; gap: clamp(40px, 6vw, 88px) !important; grid-template-columns: 1fr 1.05fr !important; }
body .concept-container.concept-reverse { grid-template-columns: 1.05fr 1fr !important; }
/* 写真の後ろに深緑の細線の枠（参考サイトの枠を踏襲） */
body .concept-img-wrapper::after {
  content: "" !important; position: absolute !important; z-index: 1 !important; right: -18px !important; bottom: -18px !important; left: 18px !important; top: 18px !important;
  width: auto !important; height: auto !important; border: 1px solid var(--sf-line-strong) !important;
}
body .concept-container.concept-reverse .concept-img-wrapper::after { left: -18px !important; right: 18px !important; }
body .concept-img-wrapper img { filter: none !important; aspect-ratio: 3 / 2 !important; }
body .concept-img-wrapper:hover img { transform: none !important; }
body .concept-content p.concept-eyebrow {
  margin: 0 0 14px !important; text-align: left !important; color: var(--sf-green) !important; font-family: var(--sf-en) !important; font-size: 16px !important; font-weight: 600 !important;
  letter-spacing: .26em !important; line-height: 1.3 !important; text-transform: uppercase !important;
}
body .concept-content p.concept-eyebrow::after { content: ""; display: block; width: 32px; height: 1px; margin-top: 16px; background: var(--sf-green); }
body .concept-title, body .concept-content h2 {
  margin: 0 0 26px !important; color: var(--sf-ink) !important; font-family: var(--sf-serif) !important; font-weight: 700 !important;
  font-size: clamp(22px, 2.2vw, 30px) !important; line-height: 1.75 !important; letter-spacing: .12em !important;
}
body .concept-text, body .concept-content p.concept-text {
  max-width: 540px !important; color: var(--sf-ink) !important; font-size: 15px !important; font-weight: 400 !important; line-height: 2.15 !important; letter-spacing: .06em !important;
}

/* ---------- 7. Instagram（instagram_feed） ---------- */
body .fc-instagram-embed-section { padding: var(--sf-pad-y) 24px !important; background: var(--sf-paper) !important; color: var(--sf-ink) !important; }
body .fc-instagram-embed-heading { margin-bottom: 36px !important; }
body .fc-instagram-embed-label { color: var(--sf-green) !important; font-family: var(--sf-en) !important; font-size: 15px !important; font-weight: 600 !important; letter-spacing: .24em !important; }
body .fc-instagram-embed-heading h2 { color: var(--sf-ink) !important; font-family: var(--sf-serif) !important; font-size: clamp(24px, 2.4vw, 32px) !important; font-weight: 700 !important; letter-spacing: .14em !important; }
body .fc-instagram-embed-heading h2::after { content: ""; display: block; width: 38px; height: 8px; margin: 18px auto 0; background: radial-gradient(circle at 4px 4px, var(--sf-dot-green) 3.5px, transparent 4px) 0 0 / 15px 8px no-repeat, radial-gradient(circle at 4px 4px, #fff 3.5px, rgba(42, 37, 32, .35) 4px, transparent 4.5px) 15px 0 / 15px 8px no-repeat, radial-gradient(circle at 4px 4px, var(--sf-dot-red) 3.5px, transparent 4px) 30px 0 / 15px 8px no-repeat; }
body .fc-instagram-embed-heading p { color: var(--sf-ink-mute) !important; font-size: 14px !important; }
/* ブロック自身が #fc-instagram-embed-xxxx 付きの !important で幅 1120px を出すので、:is() に存在しない ID を混ぜて詳細度をそろえて勝つ */
body .fc-instagram-embed-section :is(#sf-ig-width, .fc-instagram-embed-card--legacy) { max-width: 960px !important; width: 100% !important; }
body .fc-instagram-embed-card--legacy .instagram-media { border: 1px solid var(--sf-line) !important; }

/* ---------- 8. 店舗概要（store_info）・リンクボタン・地図 ---------- */
body .store-info-section { padding: var(--sf-pad-y) 24px 40px !important; background: var(--sf-beige-2) !important; color: var(--sf-ink) !important; }
body .store-info-title { color: var(--sf-ink) !important; font-family: var(--sf-serif) !important; font-size: clamp(24px, 2.4vw, 32px) !important; font-weight: 700 !important; letter-spacing: .14em !important; }
body .store-info-title::before { content: "ACCESS"; display: block; margin-bottom: 10px; color: var(--sf-green); font-family: var(--sf-en); font-size: 15px; font-weight: 600; letter-spacing: .24em; }
body .store-info-layout.has-image { display: grid !important; grid-template-columns: 1.1fr 1fr !important; gap: clamp(32px, 5vw, 64px) !important; align-items: center !important; }
body .store-info-table th, body .store-info-table td { padding: 20px 6px !important; border-bottom: 1px solid var(--sf-line) !important; font-size: 15px !important; line-height: 1.9 !important; }
body .store-info-table tr:first-child th, body .store-info-table tr:first-child td { border-top: 1px solid var(--sf-line) !important; }
body .store-info-table th { width: 118px !important; color: var(--sf-green) !important; font-weight: 600 !important; letter-spacing: .12em !important; }
body .store-info-table td { color: var(--sf-ink) !important; }
body .store-info-image img { border: 0 !important; border-radius: 0 !important; aspect-ratio: 4 / 3; max-height: none !important; }
body .link-button-section { padding: 8px 24px 56px !important; background: var(--sf-beige-2) !important; }
.sf-p-index body .gmap-section { background: var(--sf-beige-2) !important; padding-top: 48px !important; }
body .gmap-section { padding: var(--sf-pad-y) 24px !important; background: var(--sf-beige) !important; color: var(--sf-ink) !important; }
body .gmap-title { color: var(--sf-ink) !important; font-family: var(--sf-serif) !important; font-size: clamp(22px, 2.2vw, 28px) !important; font-weight: 700 !important; letter-spacing: .14em !important; }
body .gmap-desc { color: var(--sf-ink) !important; font-size: 14px !important; line-height: 2 !important; }
body .gmap-frame-wrap { border: 1px solid var(--sf-line) !important; border-radius: 0 !important; background: var(--sf-paper) !important; aspect-ratio: 21 / 9 !important; }
body .gmap-frame-wrap iframe { filter: saturate(.85) !important; }

/* ---------- 9. TOP の MENU 帯（10_top_menu.html） ---------- */
.sf-menucards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(24px, 3vw, 40px); }
.sf-menucard { display: flex; flex-direction: column; background: var(--sf-paper); color: var(--sf-ink); text-decoration: none; box-shadow: var(--sf-shadow); transition: transform .3s ease, box-shadow .3s ease; }
.sf-menucard:hover { transform: translateY(-4px); box-shadow: 0 16px 40px rgba(31, 74, 54, .14); }
.sf-menucard__img { display: block; overflow: hidden; aspect-ratio: 3 / 2; }
.sf-menucard__img img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .8s ease; }
.sf-menucard:hover .sf-menucard__img img { transform: scale(1.04); }
.sf-menucard__body { display: flex; flex-direction: column; align-items: flex-start; flex: 1; padding: 34px 36px 38px; }
.sf-menucard__en { color: var(--sf-green); font-family: var(--sf-en); font-size: 24px; font-weight: 600; letter-spacing: .16em; line-height: 1.3; }
.sf-menucard__text { flex: 1; margin: 16px 0 28px; font-size: 14.5px; line-height: 2.05; }

/* ---------- 10. ジャンプ帯（20_menu_tabs / 30_course_tabs） ---------- */
.sf-jumpwrap { padding: 64px 24px 0; background: var(--sf-beige); text-align: center; }
.sf-jump { display: inline-flex; gap: 16px; flex-wrap: wrap; justify-content: center; }
.sf-jump__btn {
  display: inline-flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; min-width: 200px; min-height: 76px; padding: 12px 28px;
  border: 1px solid var(--sf-green); background: var(--sf-paper); color: var(--sf-green); text-decoration: none; transition: background .25s ease, color .25s ease;
}
.sf-jump__btn:hover { background: var(--sf-green); color: #fff; }
.sf-jump__en { font-family: var(--sf-en); font-size: 22px; font-weight: 600; letter-spacing: .2em; line-height: 1; }
.sf-jump__ja { font-size: 12px; letter-spacing: .14em; }
.sf-jump__note { max-width: 760px; margin: 22px auto 0; color: var(--sf-ink-mute); font-size: 13px; line-height: 2; }

/* ---------- 11. メニュー（menu_category_grid） ---------- */
body .menu-grid-section { padding: 72px clamp(24px, 6vw, 96px) var(--sf-pad-y) !important; background: var(--sf-beige) !important; color: var(--sf-ink) !important; }
body .menu-grid-section + .menu-grid-section { background: var(--sf-paper) !important; padding-top: var(--sf-pad-y) !important; }
body .menu-grid-section::before, body .menu-grid-section::after, body .menu-grid-section .menu-main-title::after { content: none !important; display: none !important; }
/* 見出し：和文（大）の上に英字（説明文欄に入れた FOOD MENU 等）を出す */
body .menu-grid-section .menu-section-header { display: flex !important; flex-direction: column-reverse !important; align-items: center !important; margin-bottom: 56px !important; }
body .menu-grid-section .menu-main-title { margin: 0 !important; color: var(--sf-ink) !important; font-family: var(--sf-serif) !important; font-size: clamp(24px, 2.4vw, 32px) !important; font-weight: 700 !important; letter-spacing: .16em !important; }
body .menu-grid-section .menu-main-title::before { content: ""; display: block; }
body .menu-grid-section .menu-sub-text { margin: 0 0 10px !important; color: var(--sf-green) !important; font-family: var(--sf-en) !important; font-size: 15px !important; font-weight: 600 !important; letter-spacing: .24em !important; }
body .menu-cat-container { max-width: 1120px !important; column-count: 2; column-gap: clamp(40px, 5vw, 72px); }
body .menu-cat-block { break-inside: avoid; margin: 0 0 56px !important; display: inline-block; width: 100%; }
body .menu-cat-header { margin-bottom: 8px !important; padding-bottom: 12px !important; border-bottom: 1px solid var(--sf-green) !important; display: flex; align-items: baseline; gap: 12px; }
body .menu-cat-name { margin: 0 !important; color: var(--sf-green) !important; font-family: var(--sf-serif) !important; font-size: 19px !important; font-weight: 700 !important; letter-spacing: .14em !important; }
body .menu-item-card, body .menu-item-card.no-image {
  grid-template-columns: minmax(0, 1fr) auto !important; column-gap: 16px !important; row-gap: 2px !important; padding: 14px 0 !important;
  border-bottom: 1px dotted rgba(31, 74, 54, .3) !important; color: var(--sf-ink) !important;
}
body .menu-item-card:hover, body .menu-item-card.no-image:hover { border-color: rgba(31, 74, 54, .3) !important; }
body .mi-title, body .menu-item-card.no-image .mi-title { color: var(--sf-ink) !important; font-family: var(--sf-serif) !important; font-size: 15px !important; font-weight: 600 !important; letter-spacing: .06em !important; line-height: 1.7 !important; }
body .mi-text, body .menu-item-card.no-image .mi-text { color: var(--sf-ink-mute) !important; font-size: 12.5px !important; line-height: 1.8 !important; }
body .mi-meta, body .menu-item-card.no-image .mi-meta { min-width: 0 !important; }
body .mi-price, body .price-in, body .menu-item-card.no-image .mi-price, body .menu-item-card.no-image .price-in {
  color: var(--sf-green) !important; font-family: var(--sf-en) !important; font-size: 18px !important; font-weight: 600 !important; letter-spacing: .04em !important; font-variant-numeric: lining-nums;
}
body .mi-tax { display: none !important; }
/* 写真のある品目は左に小さな写真 */
body .menu-item-card.has-image { grid-template-columns: 76px minmax(0, 1fr) auto !important; column-gap: 16px !important; align-items: center !important; }
body .menu-item-card.has-image .mi-img-box { display: block !important; grid-column: 1; grid-row: 1 / span 2; width: 76px; height: 76px; overflow: hidden; }
body .menu-item-card.has-image .mi-img-box img { width: 100%; height: 100%; object-fit: cover; }
body .menu-item-card.has-image .mi-title { grid-column: 2 !important; grid-row: 1 !important; align-self: end; }
body .menu-item-card.has-image .mi-text { grid-column: 2 / -1 !important; grid-row: 2 !important; align-self: start; }
body .menu-item-card.has-image .mi-meta { grid-column: 3 !important; grid-row: 1 !important; align-self: end; }

/* ---------- 12. コース（course_list・blocks/course_list.php の簡易書式） ---------- */
body .course-list-section { padding: 72px clamp(24px, 5vw, 80px) var(--sf-pad-y) !important; background: var(--sf-beige) !important; color: var(--sf-ink) !important; }
body .course-list-section + .course-list-section { background: var(--sf-paper) !important; padding-top: var(--sf-pad-y) !important; }
body .course-list-section::before, body .course-list-section::after, body .course-list-title::after, body .course-list-img::before, body .course-list-img::after { content: none !important; display: none !important; }
body .course-list-header { display: flex !important; flex-direction: column-reverse !important; align-items: center !important; margin: 0 auto 52px !important; }
body .course-list-title { margin: 0 !important; color: var(--sf-ink) !important; font-family: var(--sf-serif) !important; font-size: clamp(24px, 2.4vw, 32px) !important; font-weight: 700 !important; letter-spacing: .16em !important; }
body .course-list-desc { margin: 0 0 10px !important; color: var(--sf-green) !important; font-family: var(--sf-en) !important; font-size: 15px !important; font-weight: 600 !important; letter-spacing: .24em !important; }
body .course-list-grid { max-width: 1120px !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 32px !important; align-items: stretch; }
body .course-list-grid:has(> .course-list-card.is-dinner:not(.is-lunch)) { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; max-width: 1040px !important; }
body .course-list-card, body .course-list-card:nth-child(even) {
  display: flex !important; flex-direction: column !important; background: #fff !important; color: var(--sf-ink) !important; box-shadow: var(--sf-shadow) !important;
}
body .course-list-card:nth-child(even) .course-list-img, body .course-list-card:nth-child(even) .course-list-body { order: initial !important; }
body .course-list-img { min-height: 0 !important; aspect-ratio: 3 / 2 !important; background: var(--sf-beige-2) !important; }
body .course-list-img img { filter: none !important; }
body .course-list-card:hover .course-list-img img { transform: none; }
body .course-list-body, body .course-list-card:nth-child(even) .course-list-body { flex: 1; padding: 28px 30px 32px !important; justify-content: flex-start !important; }
body .course-list-kicker { display: none !important; }
body .course-list-body h3 { margin: 0 0 12px !important; color: var(--sf-ink) !important; font-family: var(--sf-serif) !important; font-size: 20px !important; font-weight: 700 !important; letter-spacing: .1em !important; line-height: 1.6 !important; }
body .course-list-text { margin: 0 0 18px !important; color: var(--sf-ink) !important; font-size: 14px !important; line-height: 1.9 !important; letter-spacing: .04em !important; }
body .course-list-text p { margin: 0 !important; max-width: none !important; color: inherit !important; font-size: inherit !important; line-height: inherit !important; }
body .course-list-text .course-list-lead { margin-bottom: 14px !important; }
body .course-list-text .course-list-note { margin-top: 6px !important; color: var(--sf-vermilion) !important; font-size: 12.5px !important; }
body .course-list-meta { margin: 0 0 14px; padding: 10px 0; border-top: 1px solid var(--sf-line); border-bottom: 1px solid var(--sf-line); }
body .course-list-meta > div { display: grid; grid-template-columns: 7.5em minmax(0, 1fr); gap: 10px; padding: 3px 0; font-size: 13px; }
body .course-list-meta dt { margin: 0; color: var(--sf-green); font-weight: 600; letter-spacing: .08em; }
body .course-list-meta dd { margin: 0; }
body .course-list-items { display: flex; flex-wrap: wrap; gap: 6px 8px; margin: 0; padding: 0; list-style: none; }
body .course-list-items li { padding: 2px 10px; border: 1px solid var(--sf-line); background: var(--sf-paper); font-size: 12.5px; line-height: 1.7; }
body .course-list-price {
  margin: auto 0 18px !important; padding: 16px 0 0 !important; border: 0 !important; border-top: 1px solid var(--sf-line) !important; width: 100% !important;
  color: var(--sf-green) !important; font-family: var(--sf-en) !important; font-size: 28px !important; font-weight: 600 !important; letter-spacing: .04em !important; line-height: 1.2 !important;
}
body .course-list-price small { color: var(--sf-ink-mute) !important; font-family: var(--sf-serif) !important; font-size: 12px !important; }
body .course-list-price-regular { margin-right: 12px; color: var(--sf-ink-mute); font-size: 17px; text-decoration: line-through; text-decoration-thickness: 1px; }
body .course-list-reserve {
  width: 100% !important; height: 50px !important; border: 1px solid var(--sf-vermilion) !important; background: var(--sf-vermilion) !important; color: #fff !important;
  font-family: var(--sf-serif) !important; font-size: 14px !important; font-weight: 600 !important; letter-spacing: .12em !important; text-transform: none !important; gap: 8px;
}
body .course-list-reserve:hover { background: var(--sf-vermilion-hover) !important; border-color: var(--sf-vermilion-hover) !important; color: #fff !important; }
body .drink-option-list { border-top-color: var(--sf-line) !important; }
body .drink-option-row { color: var(--sf-ink) !important; border-bottom-color: var(--sf-line) !important; }

/* 飲み放題の内容・店舗概要の表（31_course_drink / 50_access_store_table） */
.sf-deflist { margin: 0 0 40px; border-top: 1px solid var(--sf-line); }
.sf-deflist > div { display: grid; grid-template-columns: 12em minmax(0, 1fr); gap: 24px; padding: 18px 4px; border-bottom: 1px solid var(--sf-line); }
.sf-deflist dt { margin: 0; color: var(--sf-green); font-weight: 600; letter-spacing: .1em; }
.sf-deflist dd { margin: 0; line-height: 1.9; font-size: 14.5px; }
.sf-note-box { padding: 30px 34px; background: var(--sf-paper); border-left: 3px solid var(--sf-green); }
.sf-note-box__title { margin: 0 0 8px; color: var(--sf-green); font-weight: 700; letter-spacing: .12em; }
.sf-note-box p { margin: 0; font-size: 14.5px; line-height: 2; }
.sf-drinkplan { background: var(--sf-beige-2); }
.sf-store { background: var(--sf-paper); }
.sf-store__table { width: 100%; border-collapse: collapse; border-top: 1px solid var(--sf-line); }
.sf-store__table th, .sf-store__table td { padding: 20px 8px; border-bottom: 1px solid var(--sf-line); text-align: left; vertical-align: top; font-size: 15px; line-height: 1.95; }
.sf-store__table th { width: 9em; color: var(--sf-green); font-weight: 600; letter-spacing: .12em; white-space: nowrap; }
.sf-store__sub { display: block; color: var(--sf-ink-mute); font-family: var(--sf-en); font-size: 15px; letter-spacing: .1em; }
.sf-store__tel { display: inline-flex; align-items: center; gap: 8px; color: var(--sf-green); font-family: var(--sf-en); font-size: 22px; font-weight: 600; letter-spacing: .06em; text-decoration: none; }
.sf-store__tel i { font-size: 14px; }

/* ---------- 13. 看板メニュー（60_policy_signature.html） ---------- */
.sf-signature__list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(28px, 4vw, 48px); }
.sf-dish { background: var(--sf-paper); box-shadow: var(--sf-shadow); display: flex; flex-direction: column; }
.sf-dish__img { margin: 0; aspect-ratio: 3 / 2; overflow: hidden; }
.sf-dish__img img { display: block; width: 100%; height: 100%; object-fit: cover; }
.sf-dish__body { padding: 30px 34px 34px; display: flex; flex-direction: column; flex: 1; }
.sf-dish__name { margin: 0 0 14px; font-family: var(--sf-serif); font-size: 21px; font-weight: 700; letter-spacing: .1em; line-height: 1.6; }
.sf-dish__name span { display: block; color: var(--sf-ink-mute); font-size: 13px; font-weight: 500; letter-spacing: .1em; }
.sf-dish__text { flex: 1; margin: 0 0 20px; font-size: 14.5px; line-height: 2.05; }
.sf-dish__prices { display: flex; flex-wrap: wrap; gap: 8px 22px; margin: 0; padding: 16px 0 0; border-top: 1px solid var(--sf-line); list-style: none; color: var(--sf-green); font-family: var(--sf-en); font-size: 24px; font-weight: 600; letter-spacing: .04em; }
.sf-dish__prices span { margin-right: 6px; font-size: 15px; letter-spacing: .1em; }
.sf-dish__prices small { font-family: var(--sf-serif); font-size: 12px; color: var(--sf-ink-mute); }
.sf-dish__tax { margin: 6px 0 0; color: var(--sf-ink-mute); font-size: 12px; }

/* ---------- 14. ギャラリー（image_grid） ---------- */
body .image-grid-section { padding: var(--sf-pad-y) clamp(20px, 4vw, 64px) !important; background: var(--sf-beige) !important; color: var(--sf-ink) !important; }
.sf-p-access body .image-grid-section { padding-top: 0 !important; }
body .image-grid-container { max-width: 1200px !important; }
body .image-grid { gap: 14px !important; }
body .image-grid-item { overflow: hidden; }
body .image-grid-item img { transition: transform .8s ease, filter .4s ease; }
body .image-grid-item:hover img { transform: scale(1.04); }

/* ---------- 15. 予約の帯（40_reserve_band.html） ---------- */
.sf-reserve { text-align: center; background: linear-gradient(rgba(22, 54, 42, .88), rgba(22, 54, 42, .88)), var(--sf-green-deep) url('/image/site/reserve_bg.jpg') center / cover no-repeat; }
.sf-reserve .sf-dots i { box-shadow: 0 0 0 1px rgba(255, 255, 255, .55); }
.sf-reserve .sf-eyebrow { color: #C8D8CD; }
.sf-reserve .sf-heading { color: #fff; }
.sf-reserve__text { margin: 0 0 32px; font-size: 15px; line-height: 2.1; }
.sf-reserve__btns { display: flex; flex-wrap: wrap; gap: 16px; justify-content: center; }
.sf-reserve .sf-btn--line { border-color: rgba(255, 255, 255, .7) !important; color: #fff !important; font-family: var(--sf-en) !important; font-size: 21px !important; letter-spacing: .06em !important; }
.sf-reserve .sf-btn--line:hover { background: #fff !important; color: var(--sf-green) !important; }
.sf-reserve .sf-btn--line i { font-size: 14px; }
.sf-reserve__hours { margin: 26px 0 0; color: rgba(255, 255, 255, .78); font-size: 13px; letter-spacing: .08em; line-height: 2; }
.sf-reserve__hours span { margin: 0 6px; opacity: .6; }

/* ---------- 16. フッター（global_footer）：店名ロゴ＋グロナビ＋©︎ だけ ---------- */
body .global-footer { padding: 88px 24px 60px !important; background: var(--sf-green-deep) !important; color: #fff !important; text-align: center; border-top: 1px solid rgba(255, 255, 255, .12) !important; }
body .global-footer::before { content: none !important; display: none !important; }
body .global-footer .info-grid { display: none !important; }
body .global-footer .footer-nav-wrap { display: flex !important; flex-direction: column-reverse !important; align-items: center !important; gap: 40px !important; max-width: 1120px; margin: 0 auto; }
body .global-footer .footer-nav-brand h2 {
  width: 220px; height: 124px; margin: 0 auto !important; padding: 0 !important; border: 0 !important; overflow: hidden; text-indent: -9999px; white-space: nowrap;
  background: url('/image/site/logo_white.png') center / contain no-repeat;
}
body .global-footer .footer-nav { display: flex !important; flex-wrap: wrap; justify-content: center; gap: 12px 40px !important; }
body .global-footer .footer-nav-link { color: #fff !important; font-family: var(--sf-en) !important; font-size: 16px !important; font-weight: 600 !important; letter-spacing: .16em !important; text-transform: uppercase; opacity: .9; text-decoration: none; }
body .global-footer .footer-nav-link:hover { opacity: 1; text-decoration: underline; text-underline-offset: 6px; }
body .footer-copy-text, body .footer-copy {
  background: var(--sf-green-deep) !important; border-top: 1px solid rgba(255, 255, 255, .14) !important; color: rgba(255, 255, 255, .6) !important;
  font-family: var(--sf-en) !important; font-size: 13px !important; letter-spacing: .14em !important; text-transform: none !important;
}

/* ---------- 17. 固定ボタン：SP は画面下の2分割バー（TEL・WEB予約）、PC はヘッダーにあるので出さない ---------- */
@media (min-width: 993px) { body .fc-floating-actions { display: none !important; } }
@media (max-width: 992px) {
  body .fc-floating-actions {
    left: 0 !important; right: 0 !important; bottom: 0 !important; flex-direction: row !important; gap: 0 !important; padding: 0 !important;
    background: transparent !important; border: 0 !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
  }
  body .fc-floating-action {
    flex: 1 1 0 !important; min-width: 0 !important; min-height: 58px !important; padding: 6px 8px calc(6px + env(safe-area-inset-bottom)) !important;
    flex-direction: row !important; gap: 8px !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important;
    font-family: var(--sf-serif) !important; font-size: 14px !important; font-weight: 600 !important; letter-spacing: .12em !important; text-transform: none !important;
  }
  body .fc-floating-phone { background: var(--sf-green) !important; color: #fff !important; }
  body .fc-floating-reserve { background: var(--sf-vermilion) !important; color: #fff !important; }
  body .global-footer { padding-bottom: 96px !important; }
  body .footer-copy-text, body .footer-copy { padding-bottom: calc(76px + env(safe-area-inset-bottom)) !important; }
}

/* ---------- 18. 予約モーダル（reservation_modal.php）：黒×金 → ベージュ×深緑×朱色 ----------
   モーダルの <style> は body 末尾（site.css より後）に出るので、変数は body に置いて継承で勝たせ、直書き色は body 前置＋!important */
body { --modal-bg: var(--sf-paper); --modal-gold: var(--sf-green); --modal-border: var(--sf-line); --modal-text: var(--sf-ink); --modal-text-sub: var(--sf-ink-mute); }
body .fc-modal-overlay { background: rgba(22, 54, 42, .7) !important; }
body .fc-modal-content { background: var(--sf-paper) !important; color: var(--sf-ink) !important; font-family: var(--sf-serif) !important; border: 0 !important; box-shadow: 0 30px 80px rgba(0, 0, 0, .35) !important; }
body .fc-modal-close { background: var(--sf-green) !important; color: #fff !important; }
body .fc-modal-header { background: var(--sf-green-deep) !important; color: #fff !important; border-bottom: 0 !important; }
body .fc-modal-header h2 { color: #fff !important; font-family: var(--sf-serif) !important; font-weight: 700 !important; letter-spacing: .14em !important; white-space: nowrap; }
body .fc-modal-header p, body .fc-modal-header span { color: rgba(255, 255, 255, .82) !important; }
body .fc-step-title { color: var(--sf-ink) !important; font-family: var(--sf-serif) !important; font-weight: 700 !important; }
body .fc-current-month { color: var(--sf-ink-mute) !important; }
body .fc-date-card { background: #fff !important; border: 1px solid var(--sf-line) !important; color: var(--sf-ink) !important; box-shadow: none !important; }
body .fc-date-card.active { border-color: var(--sf-vermilion) !important; color: var(--sf-vermilion) !important; box-shadow: 0 0 0 2px rgba(210, 69, 31, .2) !important; }
body .fc-date-nav { background: #fff !important; border: 1px solid var(--sf-line-strong) !important; color: var(--sf-green) !important; }
body .fc-date-nav:hover { background: var(--sf-green) !important; border-color: var(--sf-green) !important; color: #fff !important; }
body .fc-date-nav-wrap::after { background: linear-gradient(90deg, transparent, rgba(251, 248, 242, .95)) !important; }
body .fc-time-btn { background: #fff !important; border: 1px solid var(--sf-line) !important; color: var(--sf-ink) !important; }
body .fc-time-btn.active { background: var(--sf-vermilion) !important; border-color: var(--sf-vermilion) !important; color: #fff !important; }
body .fc-time-btn.disabled { background: rgba(31, 74, 54, .05) !important; color: #9C948A !important; opacity: .8 !important; }
body .fc-form-group label { color: var(--sf-ink) !important; }
body .fc-form-group input, body .fc-form-group select, body .fc-form-group textarea { background: #fff !important; border: 1px solid var(--sf-line-strong) !important; color: var(--sf-ink) !important; }
body .fc-radio-btn { background: #fff !important; border: 1px solid var(--sf-line-strong) !important; color: var(--sf-ink) !important; }
body .fc-radio-label input[type="radio"]:checked + .fc-radio-btn { background: rgba(210, 69, 31, .08) !important; border-color: var(--sf-vermilion) !important; color: var(--sf-vermilion) !important; }
body .fc-submit-btn { background: var(--sf-vermilion) !important; color: #fff !important; font-family: var(--sf-serif) !important; letter-spacing: .14em !important; border-radius: 0 !important; }
body .fc-submit-btn:hover { background: var(--sf-vermilion-hover) !important; }
body .fc-submit-btn:disabled { background: #D8CFC2 !important; color: #857B70 !important; }
body .fc-policy-box { background: #fff !important; border: 1px solid var(--sf-line) !important; color: var(--sf-ink-mute) !important; }
body .fc-agree-wrap, body .fc-budget-box { color: var(--sf-ink) !important; }
body #fcReservationModal a { color: var(--sf-green); }

/* ---------- 19. レスポンシブ ---------- */
@media (max-width: 1100px) {
  body .concept-container, body .concept-container.concept-reverse { grid-template-columns: 1fr !important; }
  body .concept-img-wrapper { max-width: 720px; }
  body .course-list-grid, body .course-list-grid:has(> .course-list-card.is-dinner:not(.is-lunch)) { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media (max-width: 900px) {
  body .menu-cat-container { column-count: 1; }
  body .store-info-layout.has-image { grid-template-columns: 1fr !important; }
}
@media (max-width: 767px) {
  body { letter-spacing: .03em; }
  body .fc-modal-header { display: block !important; text-align: center !important; }
  body .fc-modal-header h2 { font-size: 22px !important; margin: 0 0 6px !important; }
  body .fc-modal-header p { font-size: 12px !important; }
  .sf-sec-head { margin-bottom: 32px; }
  .sf-band { padding-left: 20px; padding-right: 20px; }
  body .hero-wrapper { min-height: 520px !important; }
  body .hero-cap-bottom-left .hero-slide-caption { left: 22px !important; right: 22px !important; bottom: 88px !important; }
  body .hero-slide-catch { font-size: clamp(19px, 5.6vw, 26px) !important; letter-spacing: .1em !important; line-height: 1.85 !important; }
  body .page-hero-wrapper { min-height: 300px !important; padding: calc(var(--sf-header-h) + 44px) 16px 52px !important; }
  body .ph-title { font-size: clamp(34px, 10vw, 46px) !important; letter-spacing: .12em !important; }
  body .ph-desc { font-size: 13px !important; letter-spacing: .24em !important; }
  body .concept-section { padding-left: 20px !important; padding-right: 20px !important; }
  body .concept-img-wrapper::after { right: -10px !important; bottom: -10px !important; left: 10px !important; top: 10px !important; }
  body .concept-container.concept-reverse .concept-img-wrapper::after { left: -10px !important; right: 10px !important; }
  body .concept-title, body .concept-content h2 { font-size: 20px !important; letter-spacing: .08em !important; }
  body .concept-text, body .concept-content p.concept-text { font-size: 14.5px !important; line-height: 2.05 !important; }
  body .fc-block-btn-wrap { text-align: center; }
  .sf-btn, body .fc-block-btn.fc-block-btn-primary, body .link-button-btn, body .btn-menu-more, body .fc-instagram-embed-action a { width: 100% !important; max-width: 360px; }
  .sf-menucards, .sf-signature__list { grid-template-columns: 1fr; }
  .sf-menucard__body, .sf-dish__body { padding: 26px 24px 30px; }
  body .store-info-section { padding-left: 20px !important; padding-right: 20px !important; }
  body .store-info-image { order: -1; }
  body .store-info-table th, body .store-info-table td { display: block !important; width: auto !important; padding: 0 2px !important; border: 0 !important; }
  body .store-info-table th { padding-top: 16px !important; font-size: 13px !important; }
  body .store-info-table td { padding-bottom: 16px !important; border-bottom: 1px solid var(--sf-line) !important; font-size: 14.5px !important; }
  body .store-info-table tr:first-child th { border-top: 1px solid var(--sf-line) !important; }
  body .store-info-table tr:first-child td { border-top: 0 !important; }
  body .gmap-frame-wrap { aspect-ratio: 4 / 3 !important; }
  .sf-jump { gap: 10px; width: 100%; }
  .sf-jump__btn { flex: 1 1 0; min-width: 0; padding: 12px 10px; }
  .sf-jump__en { font-size: 19px; }
  body .menu-grid-section, body .course-list-section { padding-left: 20px !important; padding-right: 20px !important; }
  body .menu-item-card.has-image { grid-template-columns: 60px minmax(0, 1fr) auto !important; }
  body .menu-item-card.has-image .mi-img-box { width: 60px; height: 60px; }
  body .course-list-grid, body .course-list-grid:has(> .course-list-card.is-dinner:not(.is-lunch)) { grid-template-columns: 1fr !important; gap: 24px !important; }
  body .course-list-body, body .course-list-card:nth-child(even) .course-list-body { padding: 24px 22px 26px !important; }
  .sf-deflist > div { grid-template-columns: 1fr; gap: 4px; padding: 14px 2px; }
  .sf-note-box { padding: 24px 22px; }
  .sf-store__table th, .sf-store__table td { display: block; width: auto; padding: 0 2px; border: 0; }
  .sf-store__table th { padding-top: 16px; font-size: 13px; }
  .sf-store__table td { padding-bottom: 16px; border-bottom: 1px solid var(--sf-line); font-size: 14.5px; }
  .sf-reserve .sf-btn, .sf-reserve .sf-btn--line { width: 100% !important; max-width: 360px; }
  body .link-button-btn { white-space: nowrap !important; letter-spacing: .06em !important; font-size: 14px !important; padding: 0 16px !important; min-width: 0 !important; }
  body .image-grid { gap: 8px !important; }
  body .global-footer .footer-nav { gap: 14px 24px !important; }
}