/* =========================================================
   倉敷飲食LP 共通テンプレ — jofuku.jp（徐福寿司）デザイン踏襲版
   配色: 紺#0b446f / 朱赤#a2332f / クリーム#e7e3d2 / 濃紺#002847 / 白
   書体: Shippori Antique（和）＋ Hepta Slab（英・数字）
   署名: 波形clip-pathの写真＋赤い波形フチ／縦書き見出し＋英ラベル／楕円アウトラインボタン／屋号マーキー／紺フッター
   ※ デザインのみ踏襲。徐福寿司固有のSVG文字/ロゴ/魚イラストは流用しない（文字はWebフォント・装飾は自作）。
   ※ 全5店共通（差は写真・メニュー・店名などコンテンツで出す）
   ========================================================= */
:root{
  --navy:#0b446f; --navy-d:#002847; --red:#a2332f; --red-d:#8a2824; --cream:#e7e3d2; --rose:#dd8e8b;
  --line:rgba(11,68,111,.22);
  --jp:"Shippori Antique", sans-serif; --en:"Hepta Slab", serif;
  --maxw:1180px;
}
*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; scroll-padding-top:70px; -webkit-text-size-adjust:100%; }
body{ margin:0; font-family:var(--jp); color:var(--navy); background:#fff; line-height:1.95; letter-spacing:.05em; -webkit-font-smoothing:antialiased; }
img{ display:block; max-width:100%; height:auto; }
a{ color:inherit; text-decoration:none; }
ul{ list-style:none; margin:0; padding:0; }
h1,h2,h3{ margin:0; font-weight:400; }
p{ margin:0; }
:focus-visible{ outline:2px solid var(--red); outline-offset:2px; }
[tabindex="-1"]:focus{ outline:none; }
.wrap{ max-width:var(--maxw); margin:0 auto; padding:0 26px; }
.skip{ position:absolute; left:-9999px; }
.skip:focus{ left:8px; top:8px; position:fixed; z-index:200; background:var(--navy); color:#fff; padding:10px 14px; border-radius:6px; }
.sr-only{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
/* 日本語 文節改行（BudouX <wbr> 併用・jp-linebreakスキル準拠）。keep-allは改行点(wbr)とセットで使う */
.bdx{ word-break:keep-all; overflow-wrap:anywhere; }

/* ===== オープニング（屋号がゆっくり現れる） ===== */
.opening{ position:fixed; inset:0; z-index:300; background:var(--cream); display:flex; align-items:center; justify-content:center;
  pointer-events:none; animation:op-hide 2.8s ease forwards; }
.opening__name{ font-size:clamp(30px,5vw,54px); letter-spacing:.24em; color:var(--navy); opacity:0;
  display:flex; flex-direction:column; align-items:center; gap:14px; animation:op-name 2.4s ease forwards; }
.opening__mark{ width:40px; height:auto; color:var(--red); opacity:.9; }
@keyframes op-name{ 0%{ opacity:0; transform:translateY(12px) scale(.96); letter-spacing:.4em; } 34%{ opacity:1; transform:none; letter-spacing:.24em; } 80%{ opacity:1; } 100%{ opacity:1; } }
@keyframes op-hide{ 0%,76%{ opacity:1; visibility:visible; } 100%{ opacity:0; visibility:hidden; } }
@media (prefers-reduced-motion:reduce){ .opening{ display:none; } }

/* 縦書き */
.vtext{ writing-mode:vertical-rl; text-orientation:upright; }
.en{ font-family:var(--en); }
.en--v{ writing-mode:vertical-rl; text-orientation:mixed; letter-spacing:.14em; font-weight:600; }

/* セクション見出し（縦書きJP＋縦英ラベル） */
.heading{ display:flex; flex-direction:row-reverse; align-items:flex-start; justify-content:center; gap:16px; }
.heading--left{ justify-content:flex-start; }
.heading__jp{ writing-mode:vertical-rl; font-size:clamp(24px,3vw,33px); font-weight:400; letter-spacing:.18em; line-height:1.3; color:var(--navy); }
.heading__en{ writing-mode:vertical-rl; text-orientation:mixed; font-family:var(--en); font-weight:600; font-size:13px; letter-spacing:.18em; color:var(--red); margin-top:6px; }
.heading--white .heading__jp{ color:#fff; }
.heading--white .heading__en{ color:#fff; }

/* 楕円ボタン */
.oval{ display:inline-flex; flex-direction:column; align-items:center; justify-content:center;
  min-width:248px; min-height:60px; padding:8px 32px; border:1px solid var(--navy); border-radius:999px;
  color:var(--navy); background:transparent; transition:.25s; }
.oval__sub{ font-family:var(--en); font-size:11px; letter-spacing:.16em; color:var(--red); margin-bottom:3px; }
.oval__text{ font-size:15.5px; letter-spacing:.12em; }
.oval__text::after{ content:"›"; margin-left:12px; font-family:var(--en); }
.oval:hover{ background:var(--navy); color:#fff; }
.oval svg{ width:18px; height:18px; vertical-align:-3px; margin-right:7px; }
.oval--fill{ background:var(--red); border-color:var(--red); color:#fff; }
.oval--fill .oval__sub{ color:#fff; }
.oval--fill:hover{ background:var(--red-d); border-color:var(--red-d); }
.oval--white{ border-color:#fff; color:#fff; }
.oval--white .oval__sub{ color:#fff; }
.oval--white:hover{ background:#fff; color:var(--red); }
.oval--block{ width:100%; }
.oval--big{ min-width:min(46%,420px); min-height:84px; }
.oval--big .oval__text{ font-size:19px; }
.center{ text-align:center; }
.center .oval{ margin-top:8px; }

/* ===== ヘッダー ===== */
.header{ position:sticky; top:0; z-index:60; background:var(--cream); }
.header__inner{ display:flex; align-items:center; justify-content:space-between; gap:14px; padding:11px 26px; }
.header__brand{ display:flex; align-items:baseline; gap:10px; }
.header__name{ font-size:21px; font-weight:400; letter-spacing:.14em; color:var(--navy); }
.header__area{ font-size:11px; color:var(--red); letter-spacing:.08em; }
.header__right{ display:flex; align-items:center; gap:18px; }
.header__tel{ display:flex; flex-direction:column; line-height:1.15; }
.header__tel-lead{ font-size:10.5px; letter-spacing:.06em; }
.header__tel-num{ font-family:var(--en); font-weight:600; font-size:23px; letter-spacing:.02em; }

/* 右端固定タブ */
.sidetab{ position:fixed; right:0; top:42%; transform:translateY(-50%); z-index:55; background:var(--navy); color:#fff;
  border-radius:10px 0 0 10px; padding:18px 9px; writing-mode:vertical-rl; font-size:13px; letter-spacing:.16em; display:flex; align-items:center; gap:8px; }
.sidetab svg{ width:18px; height:18px; }

/* ===== ヒーロー（左=クリーム余白に縦書き屋号／右=波形赤フチ写真） ===== */
.kv{ position:relative; background:var(--cream); padding:40px 0 50px; overflow:hidden; }
.kv__row{ max-width:1240px; margin:0 auto; padding:0 24px; display:flex; align-items:center; gap:14px; }
.kv__copy{ flex:0 0 28%; display:flex; flex-direction:row-reverse; justify-content:flex-start; gap:18px; align-self:center; }
.kv__name{ writing-mode:vertical-rl; font-size:clamp(30px,3.7vw,48px); font-weight:400; letter-spacing:.14em; color:var(--navy); }
.kv__tag{ writing-mode:vertical-rl; font-size:13.5px; letter-spacing:.16em; line-height:1.95; color:var(--navy); }
.kv__eyebrow{ writing-mode:vertical-rl; font-size:11.5px; letter-spacing:.2em; color:var(--red); font-family:var(--en); font-weight:600; }
.kv__stage{ flex:1; position:relative; aspect-ratio:1440/773; }
.kv__frame{ position:absolute; inset:0; z-index:0; background:var(--red); clip-path:url(#wavemask); -webkit-clip-path:url(#wavemask); }
.kv__photo{ position:absolute; inset:7px; z-index:1; clip-path:url(#wavemask); -webkit-clip-path:url(#wavemask); }
.kv__photo img{ width:100%; height:100%; object-fit:cover; }
.kv__ph{ position:absolute; inset:7px; z-index:1; clip-path:url(#wavemask); background:#cdbfa6; display:flex; align-items:center; justify-content:center; text-align:center; color:#7c6f57; font-size:13px; padding:30px; }
/* P2-6：ヒーロー直下ボタンの浮きを解消＝写真の右下辺に整列（クリーム地に2つ浮かせない） */
.kv__cta{ display:flex; gap:14px; justify-content:flex-end; flex-wrap:wrap; max-width:1240px; margin:22px auto 0; padding:0 24px; }
/* P3-10：縦書き屋号の下に落款（朱の角印）を1つ。位置・サイズは全店統一 */
.kv__namecol{ display:flex; flex-direction:column; align-items:center; gap:18px; }
.hanko{ width:52px; height:52px; flex:0 0 auto; transform:rotate(1.5deg); filter:drop-shadow(0 1px 1.5px rgba(0,0,0,.14)); }
.hanko__sq{ fill:var(--red); }
.hanko__ch{ fill:#fff; font-family:var(--jp); font-weight:400; font-size:58px; letter-spacing:0; }

/* ===== 屋号マーキー（魚＋波の自作装飾） ===== */
.marquee{ overflow:hidden; border-top:1px solid var(--navy); border-bottom:1px solid var(--navy); background:#fff; padding:12px 0; }
.marquee__list{ display:inline-flex; align-items:center; gap:36px; white-space:nowrap; animation:flow 30s linear infinite; }
.marquee__list span{ font-size:20px; letter-spacing:.2em; color:var(--navy); }
.marquee__icon{ height:34px; width:auto; color:var(--red); flex:0 0 auto; }
@keyframes flow{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }

/* ===== セクション枠 ===== */
.section{ padding:74px 0; }
.section--cream{ background:var(--cream); }

/* ===== 見出し（横組みコンパクト）＋自作の波飾り（焦点だけ） ===== */
.mhead{ margin-bottom:30px; }
.mhead__en{ display:block; font-family:var(--en); font-weight:600; color:var(--red); font-size:13px; letter-spacing:.2em; }
.mhead__jp{ font-size:clamp(26px,3.4vw,38px); color:var(--navy); letter-spacing:.08em; margin-top:10px; font-weight:400; line-height:1.4; }
.orn{ display:block; width:118px; height:11px; color:var(--red); }
.mhead__orn{ display:block; margin-top:14px; opacity:.9; }
.mhead__orn .orn{ color:var(--red); }

/* ===== メニュー（看板の一品＝写真を主役に大きく＋お品書き。P2-5 非対称・食欲面積UP） ===== */
.section.menu{ padding:98px 0 104px; }               /* 主役セクションは余白を厚く（P2-7 リズム） */
.menu .mhead__jp{ font-size:clamp(30px,4vw,44px); }  /* 星＝メニュー見出しはひと回り大きく */
.menu__lead{ font-size:13.5px; color:rgba(11,68,111,.85); margin:0 0 40px; max-width:36em; }
.menu__layout{ display:grid; grid-template-columns:1.18fr .82fr; gap:52px; align-items:start; }
.menu-hero{ position:relative; margin:0; }
/* P3-8：主役写真もヒーローと同じ波形clip-path＋朱赤フチ（frame=inset0で赤地／photo=inset7pxで波の縁を残す） */
.menu-hero__stage{ position:relative; aspect-ratio:4/3; }
.menu-hero__frame{ position:absolute; inset:0; background:var(--red); clip-path:url(#wavemask); -webkit-clip-path:url(#wavemask); }
.menu-hero__ph{ position:absolute; inset:7px; background:#f3eee3; clip-path:url(#wavemask); -webkit-clip-path:url(#wavemask); }
.menu-hero__ph img{ width:100%; height:100%; object-fit:cover; transition:transform .5s ease; }
.menu-hero:hover .menu-hero__ph img{ transform:scale(1.04); }
.menu-hero__cap{ display:flex; align-items:baseline; flex-wrap:wrap; gap:12px 14px; margin-top:18px; }
.menu-hero__badge{ font-size:10.5px; letter-spacing:.22em; color:var(--red); border:1px solid var(--red); border-radius:999px; padding:3px 11px; }
.menu-hero__name{ font-size:clamp(20px,2.4vw,26px); color:var(--navy); letter-spacing:.06em; line-height:1.4; }
/* お品書き（価格ピル廃止。品名のみ・実値が入れば価格を出す）。P3-11：行頭に朱の菱形・品名Shippori Antique・罫線を淡く */
.oshina{ border-top:1px solid #e0dacb; }
.oshina__row{ display:flex; align-items:baseline; gap:13px; padding:17px 2px; border-bottom:1px solid #e0dacb; }
.oshina__dot{ width:9px; height:9px; color:var(--red); flex:0 0 auto; align-self:center; }
.oshina__name{ flex:1; font-family:var(--jp); font-size:18px; color:var(--navy); letter-spacing:.06em; line-height:1.5; }
.oshina__price{ font-family:var(--en); font-weight:600; color:var(--red); font-size:14px; white-space:nowrap; }
.menu__more{ font-size:13px; color:rgba(11,68,111,.8); margin-top:26px; line-height:1.9; }
.menu__more a{ color:var(--red); border-bottom:1px solid var(--red); }
.kari{ font-size:12px; color:#6f6450; margin-top:14px; line-height:1.7; }

/* ===== この店について（P1-1：空枠を廃し、実在料理の大小2枚コラージュに） ===== */
.about__grid{ display:flex; flex-direction:row-reverse; justify-content:center; gap:48px; align-items:flex-start; }
.about__photo{ position:relative; flex:0 0 46%; }
.about__collage{ display:flex; align-items:flex-end; gap:14px; }
.about__ph{ border:1px solid var(--navy); border-radius:16px; overflow:hidden; background:#efe7d6; }
.about__ph img{ width:100%; height:100%; object-fit:cover; display:block; }
.about__ph--lg{ flex:1.5; aspect-ratio:4/5; }
.about__ph--sm{ flex:1; aspect-ratio:1/1; margin-bottom:26px; }   /* 段差＝非対称 */
.about__cap{ font-size:11px; color:#6f6450; margin-top:12px; text-align:right; letter-spacing:.03em; line-height:1.6; }
.about__body{ writing-mode:vertical-rl; font-size:15px; line-height:2.25; letter-spacing:.14em; color:var(--navy); max-height:360px; }
.about__col{ display:flex; flex-direction:row-reverse; gap:26px; align-items:flex-start; }

/* ===== 採用バナー（赤面・縦書き）＋P3-9 上下端の波形エッジ ===== */
.recruit{ position:relative; background:var(--red); color:#fff; padding:76px 0 80px; overflow:hidden; }
/* 白い波を紅band上下に重ね、白地に赤い波が浮かぶ見え方に（全幅・preserveAspectRatio=none） */
.recruit__wave{ position:absolute; left:0; width:100%; height:18px; z-index:2; pointer-events:none; }
.recruit__wave--top{ top:-1px; }
.recruit__wave--bottom{ bottom:-1px; }
.recruit__inner{ position:relative; z-index:3; max-width:760px; margin:0 auto; padding:0 26px; text-align:center; }
.recruit__orn{ display:block; width:100px; margin:12px auto 2px; }
.recruit__orn .orn{ width:100px; margin:0 auto; color:#fff; opacity:.85; }
.recruit__jp{ font-size:clamp(22px,3vw,30px); letter-spacing:.14em; margin:10px 0 10px; }
.recruit__jp .y{ color:var(--cream); }
.recruit__lead{ font-size:14px; line-height:2; margin:0 auto 26px; max-width:32em; opacity:.95; }

/* ===== アクセス（罫線レイアウト＋大TEL） ===== */
.access__grid{ display:grid; grid-template-columns:1fr 1fr; gap:46px; align-items:start; }
.access__mapwrap{ }
.access__map{ border:1px solid var(--navy); border-radius:6px; overflow:hidden; }
.access__map iframe{ width:100%; height:320px; border:0; display:block; }
.access__maplink{ display:inline-flex; align-items:center; gap:7px; margin-top:12px; font-size:13px; color:var(--red); }
.access__maplink svg{ width:16px; height:16px; }
.access__list{ margin:0; }
.access__row{ display:grid; grid-template-columns:96px 1fr; gap:16px; padding:15px 4px; border-bottom:1px solid var(--line); font-size:14px; align-items:start; }
.access__row:first-child{ border-top:1px solid var(--line); }
.access__row dt{ color:var(--navy); letter-spacing:.18em; }
.access__row dd{ margin:0; line-height:1.85; }
.access__row a{ color:var(--red); }
.access__tel{ text-align:center; margin-top:40px; }
.access__tel-label{ display:inline-block; border:1px solid var(--navy); border-radius:999px; padding:7px 26px; font-size:12px; }
.access__tel-num{ display:block; font-family:var(--en); font-weight:600; font-size:clamp(32px,4.4vw,44px); color:var(--navy); margin-top:14px; letter-spacing:.02em; }
.access__tel-num svg{ width:26px; height:26px; vertical-align:-4px; margin-right:6px; }

/* ===== 予約（LINE＋電話） ===== */
.reserve{ background:var(--cream); }
.reserve__card{ max-width:560px; margin:0 auto; background:#fff; border:1px solid var(--navy); border-radius:16px; padding:32px 28px; text-align:center; }
.reserve__card h3{ font-size:19px; letter-spacing:.08em; margin-bottom:10px; }
.reserve__card p{ font-size:14px; color:rgba(11,68,111,.85); margin-bottom:20px; }
.reserve__note{ font-size:11.5px; color:#6f6450; margin-top:14px; line-height:1.8; }
.reserve__tel{ text-align:center; margin-top:22px; font-size:14px; }
.reserve__tel svg{ width:18px; height:18px; vertical-align:-3px; }
.reserve__tel a{ font-family:var(--en); font-weight:600; color:var(--red); font-size:20px; }

/* ===== フッター（紺） ===== */
.footer{ background:var(--navy); color:#fff; padding:58px 0 84px; text-align:center; }
.footer__name{ font-size:24px; letter-spacing:.16em; margin-bottom:8px; }
.footer__meta{ font-size:12px; opacity:.85; line-height:1.95; margin-bottom:22px; }
.footer__meta .en{ letter-spacing:.02em; }
.footer__nav{ display:flex; flex-wrap:wrap; justify-content:center; gap:14px 26px; margin-bottom:24px; font-size:13px; }
.footer__nav a{ letter-spacing:.1em; }
.footer__sns{ display:inline-flex; gap:16px; margin-bottom:18px; }
.footer__sns a{ width:42px; height:42px; border:1px solid rgba(255,255,255,.5); border-radius:50%; display:flex; align-items:center; justify-content:center; }
.footer__sns svg{ width:18px; height:18px; }
.footer__credit{ font-family:var(--en); font-size:11.5px; opacity:.8; }
.footer__credit a{ color:#fff; text-decoration:underline; }
.demo-flag{ font-size:11px; opacity:.7; margin-top:14px; line-height:1.7; }

/* ===== モバイル固定アクションバー ===== */
.actionbar{ position:fixed; left:0; right:0; bottom:0; z-index:50; display:grid; grid-template-columns:1fr 1.2fr;
  background:#fff; border-top:1px solid var(--navy); box-shadow:0 -3px 14px rgba(0,0,0,.12); padding-bottom:env(safe-area-inset-bottom); }
.actionbar a{ min-height:60px; display:flex; align-items:center; justify-content:center; gap:7px; font-size:14px; }
.actionbar svg{ width:19px; height:19px; }
.actionbar .ab-tel{ color:var(--navy); border-right:1px solid var(--line); }
.actionbar .ab-resv{ background:var(--red); color:#fff; }

/* ===== 募集ページ ===== */
.rec-hero{ background:var(--cream); padding:46px 0 50px; text-align:center; }
.rec-hero__eyebrow{ font-family:var(--en); font-weight:600; color:var(--red); letter-spacing:.18em; font-size:13px; }
.rec-hero__title{ font-size:clamp(26px,4vw,38px); letter-spacing:.1em; margin:14px 0 12px; }
.rec-hero__title .y{ color:var(--red); }
.rec-hero__lead{ font-size:14px; line-height:1.95; }
.rec-hero__back{ display:inline-block; margin-top:18px; font-size:12.5px; color:var(--red); }
.rec-merit{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin-top:8px; }
.merit{ border:1px solid var(--navy); border-radius:14px; padding:26px 22px; text-align:center; background:#fff; }
.merit__ico{ width:54px; height:54px; border-radius:50%; border:1px solid var(--red); display:flex; align-items:center; justify-content:center; margin:0 auto 14px; }
.merit__ico svg{ width:26px; height:26px; stroke:var(--red); }
.merit h3{ font-size:16.5px; margin-bottom:8px; letter-spacing:.06em; }
.merit p{ font-size:13px; line-height:1.85; color:rgba(11,68,111,.85); }
.rec-stats{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.stat{ border:1px solid var(--navy); border-radius:12px; padding:22px 8px; text-align:center; }
.stat__num{ font-family:var(--en); font-weight:700; font-size:30px; color:var(--red); line-height:1; }
.stat__lbl{ font-size:12px; margin-top:9px; }
.rec-note{ text-align:center; font-size:12px; color:#6f6450; margin-top:14px; line-height:1.7; }
.rec-table{ width:100%; border-collapse:collapse; font-size:14px; border-top:1px solid var(--line); }
.rec-table th,.rec-table td{ text-align:left; padding:15px 14px; border-bottom:1px solid var(--line); vertical-align:top; }
.rec-table th{ width:32%; color:var(--navy); letter-spacing:.1em; font-weight:400; }
.rec-faq details{ border-bottom:1px solid var(--line); }
.rec-faq summary{ font-size:14.5px; padding:16px 4px; cursor:pointer; list-style:none; letter-spacing:.06em; }
.rec-faq summary::-webkit-details-marker{ display:none; }
.rec-faq summary::before{ content:"Q "; color:var(--red); font-family:var(--en); font-weight:600; }
.rec-faq .a{ padding:0 4px 16px; font-size:13.5px; color:rgba(11,68,111,.85); line-height:1.9; }
.rec-apply{ text-align:center; }
.rec-apply__btns{ max-width:360px; margin:18px auto 0; display:grid; gap:13px; }
.rec-apply__btns .oval{ width:100%; }
.rec-sticky{ position:fixed; left:0; right:0; bottom:0; z-index:50; background:var(--red); display:flex; gap:10px; padding:11px 16px calc(11px + env(safe-area-inset-bottom)); justify-content:center; }
.rec-sticky a{ display:inline-flex; align-items:center; gap:7px; min-height:46px; padding:0 22px; border-radius:999px; background:#fff; color:var(--red); font-size:14.5px; }
.rec-sticky svg{ width:18px; height:18px; }

/* About：縦書き本文がタブレット幅で窮屈＝横はみ出しの原因。900px以下で横組み・縦積みに切替 */
@media (max-width:900px){
  .about__grid{ flex-direction:column; align-items:stretch; gap:26px; }
  .about__photo{ flex:none; width:100%; }
  .about__collage{ max-width:520px; }
  .about__body{ max-height:none; writing-mode:horizontal-tb; }
  .about__col{ writing-mode:horizontal-tb; flex-direction:column; gap:10px; }
  .about__cap{ text-align:left; }
}

/* ===== レスポンシブ ===== */
@media (max-width:767px){
  .header__brand{ flex-direction:column; gap:1px; align-items:flex-start; }
  .header__name{ font-size:17px; } .header__area{ font-size:10.5px; }
  .header__tel-lead{ display:none; } .header__tel-num{ font-size:18px; }
  .sidetab{ display:none; }
  /* セクション見出しはモバイルで横組みに（縦書きは小画面で読みにくい・jofuku縦書きはPCのみ） */
  .heading{ flex-direction:row; align-items:baseline; gap:10px; }
  .heading__jp,.heading__en{ writing-mode:horizontal-tb; }
  .heading__jp{ font-size:23px; letter-spacing:.1em; }
  .kv{ padding:24px 0 34px; }
  .kv__row{ flex-direction:column; gap:18px; padding:0 18px; }
  .kv__copy{ flex:none; width:100%; flex-direction:row; justify-content:center; align-items:center; gap:12px; }
  .kv__name{ writing-mode:horizontal-tb; font-size:30px; }
  .kv__tag,.kv__eyebrow{ display:none; }
  .kv__namecol{ flex-direction:column; gap:12px; }
  .hanko{ width:44px; height:44px; }
  /* P3-12：モバイルの波形写真を約1.4割高く（食欲の面積UP。4/3→7/6・横はみ出し/CTA重なりなし） */
  .kv__stage{ width:100%; aspect-ratio:7/6; }
  /* P2-6：モバイルは下部固定バーと役割が被るのでヒーローCTAは電話1つに絞る */
  .kv__cta{ justify-content:center; padding:0 18px; margin-top:20px; }
  .kv__cta .oval:nth-child(2){ display:none; }
  /* メニュー：モバイルは1カラム大判（看板写真を上に大きく→お品書き） */
  .section.menu{ padding:52px 0 60px; }
  .menu__layout{ grid-template-columns:1fr; gap:28px; }
  .menu-hero__stage{ aspect-ratio:4/3; }
  .recruit__wave{ height:13px; }
  .oshina__name{ font-size:16px; }
  .access__grid{ grid-template-columns:1fr; gap:28px; }
  .actionbar{ display:grid; }
}
@media (min-width:768px){
  .actionbar{ display:none; }
  .rec-sticky{ display:none; }
}
@media (prefers-reduced-motion:reduce){ *{ animation:none!important; } html{ scroll-behavior:auto; } }