@charset "UTF-8";
/* =====================================================================
   やきとり鶏丸 石山店 — site.css
   ベンチ「茶寮 FUKUCHA」(fukucha-fukujuen.com) の base.css を1:1トレース。
   構造・余白・タイポscale・演出・配色をliteral写経し、中身のみ鶏丸に差替。
   Adobe Fonts(貂明朝/秀英ゴシック) → Google Fonts(Shippori Mincho / Zen Kaku Gothic New)へ代替。
   root=10px / 単一ブレークポイント641px / mobile-first。
   ===================================================================== */

/* ---- reset (bench L1-60 相当) ---- */
* { margin: 0; padding: 0; box-sizing: border-box; }
html { font-size: 10px; -webkit-text-size-adjust: 100%; }
body { min-height: 100%; }
ol, ul { list-style: none; }
img { max-width: 100%; height: auto; vertical-align: bottom; border: 0; }
a { color: inherit; text-decoration: none; transition: opacity .3s ease; }
a:hover { opacity: .7; }
address { font-style: normal; }
table { border-collapse: collapse; }

/* ---- design tokens (FUKUCHA literal palette) ---- */
:root{
  --bg:#F7F4F3;          /* 生成り背景 */
  --ink:#666666;         /* 基本文字 */
  --accent:#A69381;      /* 茶金アクセント */
  --wash:#EEE8E4;        /* 大型透かし英字 / footer地 */
  --line:#cccccc;        /* 罫線 */
  --line-strong:#707070; /* ボタン枠 */
  --logo:#1f100b;        /* ロゴ濃茶 */
  --red:#c0272c;         /* 差し色＝朱赤(鶏丸/おすすめの朱) */
  --red-d:#9e1f24;
  --serif:"Shippori Mincho","游明朝",YuMincho,"Hiragino Mincho ProN","ＭＳ Ｐ明朝",serif;
  --gothic:"Zen Kaku Gothic New","游ゴシック体",YuGothic,"Yu Gothic","メイリオ",sans-serif;
  --jost:"Jost","Zen Kaku Gothic New",sans-serif;
  --radius:4px;         /* 角の当たりを取るだけの控えめな値 */
  --header-h:137px;
}

body{
  background-color:var(--bg);
  color:var(--ink);
  font-family:var(--serif);
  font-weight:400;
  line-height:1.8;
  letter-spacing:.08em;
  -webkit-font-smoothing:antialiased;
  /* 320px 実機で 10.24px まで落ちて読めなくなるため下限を入れる。
     375px 以上では 3.2vw が 12px を超えるので、これまでの見た目は変わらない。 */
  font-size:max(12px, 3.2vw);   /* SP基準(375) */
}
@media (min-width:641px){
  body{ font-size:16px; font-size:1.6rem; min-width:1280px; }
}

/* ---- container (.inner) bench L858-872 ---- */
.inner{ width:100%; margin:auto; position:relative; }
@media (min-width:641px){ .inner{ max-width:1720px; } }
@media (max-width:640px){ .inner{ width:89.333vw; } }

.hide{ position:absolute!important; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); }
.hide_pc{ } .sp-only{ display:none; }
@media (max-width:640px){ .hide_pc{ display:block; } .hide_sp{ display:none; } .sp-only{ display:inline; } }
@media (min-width:641px){ .hide_pc{ display:none!important; } }

#wrapper{ overflow:hidden; }
@media (min-width:641px){ #wrapper{ padding-top:var(--header-h); } }
@media (max-width:640px){ #wrapper{ padding-top:10.667vw; } }
.p-home #wrapper{ padding-top:0; }

/* アンカー着地補正 bench L888 */
.anker-link{ display:block; height:0; margin-top:-127px; padding-top:127px; visibility:hidden; }

/* =====================================================================
   HEADER  (bench L4224-4537)
   ===================================================================== */
.header{
  position:fixed; top:0; left:0; width:100%; z-index:1000;
  background:#fff;
}
@media (min-width:641px){
  .header{ padding:20px 5.2083%; }
  .header .inner{ display:flex; }
}
/* p-home: MVを過ぎるまでヘッダーを隠す */
@media (min-width:641px){
  .p-home .header{ transform:translateY(-100%); transition:transform ease-out .3s; }
  .p-home .header.header--show{ transform:translateY(0); }
}
.header-menu{ display:flex; justify-content:space-between; align-items:center; width:100%; }
.header-menu__item{ font-size:1.6rem; letter-spacing:.08em; }
.header-menu__link{ display:inline-block; padding:6px 0; border-bottom:1px solid transparent; }
.header-menu__link.is-current,.header-menu__link:hover{ border-bottom-color:var(--ink); }
.header-language{ position:absolute; top:14px; right:5.2083%; font-size:1.3rem; letter-spacing:.1em; }
.header-language li{ display:inline-block; }
.header-language li + li{ margin-left:8px; padding-left:8px; border-left:1px solid var(--line); }
.header-language .is-current{ color:var(--accent); }
/* オーバーレイ共通：EN版はJP+英字サブが重複するのでサブを隠す／標準フォーカス枠を廃しブランド枠に */
/* 旧ドロワー（英字が小さいサブラベル）時代の規則。新ドロワーでは .nav-ov__en が
   主役の大見出しなので隠してはいけない。EN では重複する和文枠のほうを畳む。 */
.lang-EN .nav-ov__ja{ display:none; }
.header-menu__link:focus{ outline:none; }
.header-menu__link:focus-visible{ outline:2px solid var(--red); outline-offset:6px; border-radius:2px; }

/* SPバー + ハンバーガー */
.header-sp{ display:none; }
@media (max-width:640px){
  .header{ height:100vh; transform:translateX(100%); transition:transform ease-out .5s; padding:18vw 8vw; overflow-y:auto; }
  body.header--open{ overflow:hidden; }
  body.header--open .header{ transform:translateX(0); }
  /* --- エディトリアル番号組み（モバイル） --- */
  .header .inner{ display:block; text-align:left; }
  .nav-ov__brand{ margin:0 0 7vw; } .nav-ov__brand img{ width:24vw; opacity:.9; }
  .nav-ov__label{ font-family:var(--serif); letter-spacing:.42em; font-size:3.2vw; color:var(--accent);
    padding-bottom:.6em; margin:0 0 1em; border-bottom:1px solid var(--line); }
  .nav-ov__grid{ display:block; }
  .header-menu{ display:block; }
  .nav-ov__item{ border:0; }
  .header-menu__link{ display:grid; grid-template-columns:auto 1fr; column-gap:.9em; align-items:baseline;
    padding:3.4vw 0; border-bottom:1px solid var(--line); outline:none; }
  .nav-ov__no{ font-family:var(--serif); font-size:3.2vw; color:var(--accent); }
  .nav-ov__ja{ font-family:var(--serif); font-size:5.6vw; letter-spacing:.1em; color:var(--ink); }
  .header-menu__link.is-current .nav-ov__ja{ color:var(--red); }
  .nav-ov__en{ grid-column:2; font-family:var(--serif); font-size:2.8vw; letter-spacing:.3em;
    text-transform:uppercase; color:var(--accent); margin-top:.25em; }
  .nav-ov__info{ margin-top:8vw; padding-top:6vw; border-top:1px solid var(--line); font-family:var(--serif); }
  .nav-ov__info > * + *{ margin-top:2.4vw; }
  .nav-ov__reserve{ display:inline-block; font-family:var(--serif); font-size:4vw; letter-spacing:.12em;
    color:#fff; background:var(--red); padding:.7em 1.8em; }
  .nav-ov__tel{ display:inline-block; font-size:5.2vw; color:var(--ink); letter-spacing:.06em; }
  .nav-ov__hours{ font-size:3.6vw; color:var(--ink); } .nav-ov__hours span{ color:var(--accent); }
  .nav-ov__access{ font-size:3.4vw; color:var(--accent); }
  .nav-ov__ig{ display:inline-block; font-size:3.6vw; letter-spacing:.12em; color:var(--ink);
    border-bottom:1px solid var(--line); padding-bottom:.1em; }
  .header-language{ position:static; margin-top:5vw; font-size:4vw; }

  .header-sp{ display:flex; position:fixed; top:0; left:0; width:100%; height:10.667vw; z-index:1002;
    background:#fff; align-items:center; justify-content:space-between; padding:0 5.2vw; }
  .header-sp__logo img{ height:5.6vw; }
  .header-sp__btn{ width:8vw; height:6vw; position:relative; }
  .header-sp__btn span{ position:absolute; left:0; width:100%; height:1px; background:var(--ink); transition:.3s; }
  .header-sp__btn span:nth-child(1){ top:0; } .header-sp__btn span:nth-child(2){ top:50%; } .header-sp__btn span:nth-child(3){ bottom:0; }
  body.header--open .header-sp__btn span:nth-child(1){ top:50%; transform:rotate(35deg); }
  body.header--open .header-sp__btn span:nth-child(2){ opacity:0; }
  body.header--open .header-sp__btn span:nth-child(3){ bottom:auto; top:50%; transform:rotate(-35deg); }
}

/* =====================================================================
   MV / ヒーロー (bench L2467-2743)  背景6枚クロスフェード
   ===================================================================== */
.mv{ position:relative; overflow:hidden; display:flex; align-items:center;
  background-position:50% 50%; background-repeat:no-repeat; background-size:cover; }
@media (min-width:641px){ .mv{ height:88vh; min-height:620px; max-height:860px; } }
@media (max-width:640px){ .mv{ height:82vh; min-height:520px; } }

.bg-swich{ position:absolute; inset:0; z-index:0; }
/* JS駆動クロスフェード（main.js が .is-active を付替え＝常に1枚以上表示・隙間ゼロ）
   1枚目は初期表示のため .is-active を最初から付与（HTML側 or JSで先頭に付与） */
.bg-swich-slide{ position:absolute; inset:0; background-size:cover; background-position:50% 50%;
  opacity:0; transition:opacity 1.8s ease; }
.bg-swich-slide.is-active{ opacity:1; }
.bg-swich-slide::after{ content:""; position:absolute; inset:0; background:rgba(20,12,8,.34); }

.mv .inner{ position:relative; z-index:2; color:#fff; }
.mv__logo{ width:130px; margin-bottom:4.4%; transform:translateX(-70px); opacity:0;
  transition:transform .6s ease-out 1s, opacity .6s ease-out 1s; }
.mv__logo img{ filter:brightness(0) invert(1); }
.mv__copy{ font-family:var(--serif); line-height:1.5; letter-spacing:.14em;
  opacity:0; clip-path:inset(0 100% 0 0); transition:opacity .5s ease 1.3s, clip-path 1.1s cubic-bezier(.2,.7,.2,1) 1.3s;
  text-shadow:0 0 20px rgba(0,0,0,.55); }
@media (min-width:641px){ .mv__copy{ font-size:3rem; } .mv__logo{ width:148px; } }
@media (max-width:640px){ .mv__copy{ font-size:5.4vw; } .mv__logo{ width:27vw; } }
.mv__cta{ display:inline-block; margin-top:2.2em; padding:.9em 2.6em; border:1px solid #fff; color:#fff;
  font-size:1.4rem; letter-spacing:.16em; transform:translateX(-70px); opacity:0;
  transition:transform .6s ease-out 1.8s, opacity .6s ease-out 1.8s; }
.mv__cta:hover{ background:#fff; color:var(--logo); opacity:1; }
body.loaded .mv__logo, body.loaded .mv__cta{ transform:translateX(0); opacity:1; }
body.loaded .mv__copy{ opacity:1; clip-path:inset(0 0 0 0); }

/* スクロールダウン矢印 */
.mv__scroll{ position:absolute; left:50%; bottom:24px; z-index:2; color:#fff; font-size:1.1rem;
  letter-spacing:.2em; writing-mode:vertical-rl; transform:translateX(-50%); }
.mv__scroll::after{ content:""; display:block; width:1px; height:52px; margin:10px auto 0; background:#fff; animation:scrollLine 2s infinite; }
@keyframes scrollLine{ 0%{transform:scaleY(0);transform-origin:top;} 50%{transform:scaleY(1);transform-origin:top;} 51%{transform-origin:bottom;} 100%{transform:scaleY(0);transform-origin:bottom;} }

/* 下層の薄いMV帯 */
.mv--page{ display:block; }
@media (min-width:641px){ .mv--page{ height:420px; } }
@media (max-width:640px){ .mv--page{ height:44vw; min-height:auto; } }
.mv--page .mv__pagettl{ position:absolute; inset:0; z-index:2; display:flex; flex-direction:column;
  align-items:center; justify-content:center; color:#fff; text-shadow:0 0 18px rgba(0,0,0,.5); }
.mv--page .mv__pagettl .en{ font-size:1.2rem; letter-spacing:.3em; margin-top:.6em; }
@media (min-width:641px){ .mv--page .mv__pagettl .ja{ font-size:3rem; letter-spacing:.14em; } }
@media (max-width:640px){ .mv--page .mv__pagettl .ja{ font-size:6.4vw; } }

/* =====================================================================
   NEWS帯 (bench L2746)
   ===================================================================== */
.news{ background:#fff; }
@media (min-width:641px){ .news{ padding:26px 5.2083%; } .news .inner{ display:flex; align-items:center; } }
@media (max-width:640px){ .news{ padding:6vw 0; } }
.news__ttl{ font-size:2.2rem; margin-right:50px; white-space:nowrap; font-family:var(--serif); }
@media (max-width:640px){ .news__ttl{ font-size:5vw; margin-bottom:3vw; } }
.news-list{ width:100%; max-width:1030px; }
.news-list__item{ display:flex; align-items:baseline; padding:.3em 0; font-size:1.4rem; }
@media (max-width:640px){ .news-list__item{ font-size:3.4vw; flex-wrap:wrap; } }
.news-list__date{ flex:0 0 auto; width:150px; color:var(--accent); letter-spacing:.06em; }
@media (max-width:640px){ .news-list__date{ width:100%; } }
.news-list__txt{ flex:1; }

/* =====================================================================
   SECTION 共通 (bench L1750-2115)
   ===================================================================== */
.section{ position:relative; }
/* 余白はベンチ準拠に締める。ベンチ .section-container は margin-bottom:6.9767%
   （1280px時 ≒ 89px）。132px×2 は写経元より大幅に広く、間延びの主因だった */
@media (min-width:641px){ .section{ padding:60px 5.2083%; } }
@media (max-width:640px){ .section{ padding:10vw 0; } }
.section--brown{ } /* 予備 */

.section-container{ position:relative; max-width:1280px; }
@media (min-width:641px){
  .section-container{ margin:0 0 0 12.79%; display:flex; justify-content:flex-start; gap:6%; }
}
@media (max-width:640px){ .section-container{ display:block; } }

/* 縦書きタイトル (bench L933-954) */
.vertical-ttl{ text-align:center; flex:0 0 auto; }
.vertical-ttl__item{ writing-mode:vertical-rl; text-orientation:upright; display:inline-block;
  font-family:var(--serif); letter-spacing:.2em; line-height:1.4; }
@media (min-width:641px){ .vertical-ttl__item{ font-size:2.6rem; } }
@media (max-width:640px){ .vertical-ttl__item{ font-size:4.6vw; margin:0 auto 6vw; } }
.lang-EN .vertical-ttl__item{ text-orientation:mixed; letter-spacing:.1em; } /* EN横倒し */

.section-detail{ flex:1; }
@media (max-width:640px){ .section-detail{ margin-top:2vw; } }
.section-detail__subttl{ display:inline-block; font-family:var(--gothic); font-size:1.3rem;
  letter-spacing:.16em; color:var(--accent); padding:6px 0; border-top:1px solid var(--accent);
  border-bottom:1px solid var(--accent); margin-bottom:1.4em; }
.section-detail__head{ font-family:var(--serif); letter-spacing:.09em; line-height:1.75; margin-bottom:1.1em; font-weight:500; }
@media (min-width:641px){ .section-detail__head{ font-size:3rem; } }
@media (max-width:640px){ .section-detail__head{ font-size:6vw; } }
.section-detail__txt{ margin-bottom:30px; letter-spacing:.04em; }
.section-detail__btn{ }

/* 全幅画像 左右交互 (bench L2088-2112) */
.section-img{ text-align:center; margin-bottom:9vw; }
.section-img img{ object-fit:cover; box-shadow:0 24px 60px -30px rgba(31,16,11,.42); }
.section-img figcaption{ font-family:var(--gothic); font-size:1.15rem; letter-spacing:.14em; color:var(--accent); margin-top:14px; }
@media (min-width:641px){
  .section-img{ margin-bottom:0; }
  .section-img img{ width:70%; max-width:680px; }
  .section-img--left{ text-align:left; padding-left:6%; }
  .section-img--right{ text-align:right; padding-right:6%; }
}
@media (max-width:640px){ .section-img img{ width:88%; } }

/* 右下 大型英字透かし (bench L1918-1930) */
.section-container__bottom-txt{ position:absolute; bottom:0; right:0; color:var(--wash);
  z-index:-1; line-height:1; font-family:var(--serif); letter-spacing:.04em; pointer-events:none; }
@media (min-width:641px){ .section-container__bottom-txt{ font-size:68px; } }
@media (max-width:640px){ .section-container__bottom-txt{ font-size:15vw; } }

/* moreボタン (bench L1254-1309) */
.btn-df{ background-color:var(--bg); border:1px solid var(--line-strong); color:var(--ink);
  display:block; text-align:center; line-height:1; text-decoration:none; transition:all .3s ease;
  padding:18px 10px; letter-spacing:.14em; font-family:var(--gothic); font-size:1.4rem; }
@media (min-width:641px){ .btn-df{ min-width:340px; max-width:340px; } }
.btn-df:hover{ background:var(--ink); color:#fff; opacity:1; }
.btn-df--fill{ background:var(--ink); color:#fff; } .btn-df--fill:hover{ background:var(--logo); }

/* =====================================================================
   REVIEWS
   ===================================================================== */
.reviews{ background:#fff; }
.reviews__grid{ display:grid; gap:24px; margin-top:2em; }
@media (min-width:641px){ .reviews__grid{ grid-template-columns:repeat(2,1fr); } }
.review-card{ padding:16px 0 0; border-top:1px solid var(--line); background:none; }
.review-card__stars{ color:var(--accent); letter-spacing:.2em; margin-bottom:.6em; }
.review-card__text{ font-size:1.5rem; }
.review-card__meta{ margin-top:1em; font-size:1.2rem; color:var(--accent); font-family:var(--gothic); }

/* =====================================================================
   FAQ (アコーディオン bench L225-238 / news-detail相当)
   ===================================================================== */
.faq-list{ max-width:900px; margin:2em auto 0; }
.faq-item{ border-bottom:1px solid var(--line); }
.faq-item__q{ display:flex; align-items:center; gap:14px; cursor:pointer; padding:22px 40px 22px 0;
  position:relative; font-family:var(--serif); font-size:1.7rem; }
.faq-item__q::before{ content:"Q"; color:var(--accent); font-family:var(--gothic); }
.faq-item__q::after{ content:""; position:absolute; right:6px; top:50%; width:12px; height:12px;
  border-right:1px solid var(--ink); border-bottom:1px solid var(--ink); transform:translateY(-70%) rotate(45deg); transition:.3s; }
.faq-item.is-open .faq-item__q::after{ transform:translateY(-30%) rotate(-135deg); }
.faq-item__a{ display:none; padding:0 0 24px 26px; color:var(--ink); }
.faq-item.is-open .faq-item__a{ display:block; }

/* =====================================================================
   CTA
   ===================================================================== */
.cta{ position:relative; text-align:center; color:#fff; background-size:cover; background-position:50% 50%; }
.cta::after{ content:""; position:absolute; inset:0; background:rgba(20,12,8,.5); }
@media (min-width:641px){ .cta{ padding:120px 5.2083%; } }
@media (max-width:640px){ .cta{ padding:20vw 0; } }
.cta .inner{ position:relative; z-index:2; }
.cta__head{ font-family:var(--serif); line-height:1.6; margin-bottom:1.2em; text-shadow:0 0 18px rgba(0,0,0,.5); }
@media (min-width:641px){ .cta__head{ font-size:2.8rem; } }
@media (max-width:640px){ .cta__head{ font-size:6vw; } }
.cta__tel{ font-family:var(--serif); font-size:3.4rem; letter-spacing:.06em; }
.cta__actions{ display:flex; gap:18px; justify-content:center; flex-wrap:wrap; margin-top:1.6em; }
.cta .btn-df{ background:transparent; color:#fff; border-color:#fff; }
.cta .btn-df:hover{ background:#fff; color:var(--logo); }

/* =====================================================================
   PRICE (menu) bench L3031-3337
   ===================================================================== */
.price-note{ font-family:var(--gothic); font-size:1.3rem; color:var(--accent); letter-spacing:.08em; margin-bottom:2em; }
.price-block{ margin-bottom:60px; }
.price-ttl{ color:var(--accent); line-height:1.2; text-align:left; font-family:var(--serif);
  font-size:2.4rem; padding-bottom:.5em; border-bottom:1px solid var(--accent); margin-bottom:1em; letter-spacing:.08em; }
.price-row{ display:flex; justify-content:space-between; align-items:baseline; line-height:1.6;
  padding:.55em 0; border-bottom:1px dotted var(--line); gap:12px; }
.price-row__head{ font-size:1.7rem; }
.price-row__middle{ margin-right:auto; margin-left:1em; font-size:1.3rem; color:var(--accent); font-family:var(--gothic); }
.price-row__body{ white-space:nowrap; font-family:var(--gothic); letter-spacing:.04em; }
.price-badge{ display:inline-block; background:var(--accent); color:#fff; font-family:var(--gothic);
  font-size:1.1rem; padding:2px 8px; margin-left:8px; }
.menu-photos{ display:grid; gap:26px; margin:0 auto 56px; max-width:760px; }
@media (min-width:641px){ .menu-photos{ grid-template-columns:repeat(3,1fr); } }
@media (max-width:640px){ .menu-photos{ grid-template-columns:repeat(2,1fr); gap:16px; } }
.menu-photos figure{ overflow:hidden; }
.menu-photos img{ width:100%; aspect-ratio:1/1; object-fit:cover; box-shadow:0 16px 40px -26px rgba(31,16,11,.42); transition:transform 1.1s cubic-bezier(.2,.7,.2,1); }
.menu-photos figure:hover img{ transform:scale(1.06); }
.menu-photos figcaption{ font-size:1.15rem; text-align:center; padding-top:10px; font-family:var(--gothic); letter-spacing:.1em; color:var(--accent); }

/* =====================================================================
   FORM (contact) bench L1078-1487
   ===================================================================== */
.form-df{ max-width:760px; margin:2em auto 0; }
.form-row{ margin-bottom:26px; }
.form-row label{ display:block; font-family:var(--gothic); font-size:1.4rem; margin-bottom:8px; letter-spacing:.06em; }
.form-row .req{ color:#C34E23; font-size:1.2rem; margin-left:6px; }
.form-df input, .form-df textarea, .form-df select{
  width:100%; padding:14px 16px; border:1px solid var(--line); background:#fff; font-family:var(--serif);
  font-size:1.6rem; color:var(--ink); border-radius:0; }
.form-df textarea{ min-height:180px; resize:vertical; }
.form-hp{ position:absolute!important; left:-9999px; width:1px; height:1px; overflow:hidden; }
.form-submit{ text-align:center; margin-top:12px; }
.form-df button{ cursor:pointer; }
[data-stem-form-success],[data-stem-form-error]{ margin-top:16px; padding:14px; text-align:center; }
[data-stem-form-success]{ background:#eef3ee; color:#2f5d3a; }
[data-stem-form-error]{ background:#f7eceb; color:#a5372a; }

/* =====================================================================
   PAGETOP / FOOTER (bench L456-4604)
   ===================================================================== */
.pagetop{ position:fixed; right:20px; bottom:20px; z-index:1000; width:48px; height:48px;
  background:var(--ink); color:#fff; display:none; align-items:center; justify-content:center; }
.pagetop.is-show{ display:flex; }
.pagetop::before{ content:""; width:10px; height:10px; border-top:1px solid #fff; border-left:1px solid #fff; transform:translateY(2px) rotate(45deg); }

.footer{ background-color:var(--wash); color:var(--ink); position:relative; }
@media (min-width:641px){ .footer{ padding:100px 5.2083% 40px; } }
@media (max-width:640px){ .footer{ padding:16vw 0 10vw; } }
.footer__logo{ margin-bottom:30px; } .footer__logo img{ width:86px; }
.footer-info{ font-size:1.4rem; line-height:2; }
.footer-menu{ display:flex; flex-wrap:wrap; gap:14px 28px; margin:26px 0; font-family:var(--gothic); font-size:1.3rem; letter-spacing:.08em; }
.footer-links{ display:flex; flex-wrap:wrap; gap:10px 20px; font-size:1.2rem; font-family:var(--gothic); }
.footer-sns a{ display:inline-flex; align-items:center; gap:6px; }
.copyright{ margin-top:36px; font-size:1.1rem; font-family:Verdana,"Droid Sans",sans-serif; color:var(--ink); letter-spacing:.04em; }

/* =====================================================================
   LOADER (bench L779 / common.js)
   ===================================================================== */
#loader_bg{ background:#fff; position:fixed; inset:0; width:100%; height:100%; z-index:1010;
  display:flex; align-items:center; justify-content:center; transition:opacity .6s ease; }
#loader_bg.is-hide{ opacity:0; pointer-events:none; }
#loader_bg img{ width:56px; animation:loaderPulse 1.6s ease-in-out infinite; }
@keyframes loaderPulse{ 0%,100%{opacity:.35;} 50%{opacity:1;} }

/* =====================================================================
   SCROLL ANIM (bench L911-920)  IntersectionObserverでinactive除去
   ===================================================================== */
.js-fade-up{ transition:transform .7s ease, opacity .7s ease; opacity:1; transform:none; }
.js-fade-up.inactive{ opacity:0; transform:translateY(70px); }

/* FAQカテゴリナビ（フィルタ相当・アンカー） */
.faq-catnav{ display:flex; flex-wrap:wrap; gap:10px 12px; justify-content:center; max-width:900px; margin:1.6em auto 0; }
.faq-catnav__link{ display:inline-block; padding:8px 16px; border:1px solid var(--accent); color:var(--accent);
  font-family:var(--gothic); font-size:1.3rem; letter-spacing:.06em; transition:all .3s ease; }
.faq-catnav__link:hover{ background:var(--accent); color:#fff; opacity:1; }
.faq-list{ scroll-margin-top:120px; }
.price-ttl[id]{ scroll-margin-top:120px; }

/* 関連キーワードチップ（地域SEO） */
.kw-chips{ display:flex; flex-wrap:wrap; gap:8px 10px; justify-content:center; margin:1.6em 0 0; }
.kw-chips span{ display:inline-block; padding:6px 14px; background:var(--wash); color:var(--ink);
  font-family:var(--gothic); font-size:1.2rem; letter-spacing:.04em; border-radius:999px; }
/* シーン別グリッド */
.scene-grid{ display:grid; gap:20px; margin-top:2em; }
@media (min-width:641px){ .scene-grid{ grid-template-columns:repeat(3,1fr); } }
.scene-grid > .scene-card{ padding:4px 0 0; border-top:1px solid var(--line); background:none; }
.scene-grid > .scene-card h3{ font-family:var(--serif); font-size:1.8rem; color:var(--logo); margin-bottom:.5em; letter-spacing:.04em; }
.scene-grid > .scene-card p{ font-size:1.4rem; }
/* コースカード(TOP teaser) */
.course-teaser{ display:grid; gap:16px; margin-top:2em; }
@media (min-width:641px){ .course-teaser{ grid-template-columns:repeat(3,1fr); } }
.course-teaser__item{ padding:14px 0 0; border-top:1px solid var(--line); background:none; text-align:left; }
.course-teaser__item .price{ font-family:var(--serif); font-size:2.2rem; color:var(--accent); display:block; margin-bottom:.3em; }
.course-teaser__item .n{ font-family:var(--gothic); font-size:1.3rem; }

/* utility */
.center{ text-align:center; } .mt-lg{ margin-top:2.4em; } .lead{ font-size:1.7rem; }
/* =====================================================================
   セクション見出し＝ベンチ FUKUCHA 準拠（2026-08-04 再写経）
   ベンチ実測: 和文は .vertical-ttl__item = 26px / vertical-rl / ls .2em / lh 1.2
              英字は .section-container__bottom-txt = 68px / #EEE8E4 / 右下 absolute
   旧実装（中央寄せ・EN小ラベル・朱赤の下線）はベンチに存在せず、
   DESIGN_RULES §3-2「何でも中央寄せ・完全シンメトリー」にも触れていたため置換した。
   ===================================================================== */
.section-head-center{ text-align:left; margin-bottom:2.2em; }
/* 和文＝縦書き（ベンチの縦組みセクション見出し） */
.section-head-center .ja{
  writing-mode:vertical-rl; font-family:var(--serif); font-weight:600;
  /* ベンチは 26px/ls.2em だが、ベンチの見出しが2〜6字なのに対し本サイトは
     「120分飲み放題付きコース」等 11〜17字と長く、縦組みの背が本文より高くなって
     節そのものを押し広げていた（実測 434px vs 本文377px）。字数差ぶんだけ詰める。 */
  font-size:2.25rem; letter-spacing:.14em; line-height:1.2; color:var(--logo);
  display:block; margin:0; }
/* 見出しに reveal の will-change/transform が付くと「包含ブロック」になり、
   下の透かしが縦組み見出しの幅(約31px)に閉じ込められる。透かしの基準を .inner に戻す。
   （reveal のフェードイン自体は opacity で残るので演出は失われない） */
.section > .inner > .section-head-center[data-reveal]{ will-change:auto; transform:none; }
/* 英字＝右下の大型透かし（ベンチの bottom-txt 68px / #EEE8E4 / 右下 absolute） */
.section-head-center .en{
  position:absolute; right:0; bottom:-.04em; z-index:0;
  font-family:var(--serif); font-size:clamp(3rem,4.2vw,6.8rem); line-height:1; letter-spacing:.04em;
  color:#EEE8E4; margin:0; white-space:nowrap; pointer-events:none;
  /* ベンチは1語の短いラベルだが本サイトは長い英字ラベルを持つ。
     68px 固定だと最長「YAKITORI & IZAKAYA IN ISHIYAMA」が枠を越えて横スクロールを生むため、
     可変サイズ＋はみ出しの切り取りで抑える（横はみ出し＝design-qa の FAIL 条件） */
  max-width:100%; overflow:hidden; }
@media (max-width:640px){
  .section-head-center .ja{ font-size:4.6vw; letter-spacing:.4em; }
  .section-head-center .en{ font-size:8vw; right:-1vw; }
}

/* =====================================================================
   v1.2 上品化＋アニメーション（IntersectionObserverで .is-in 付与）
   ===================================================================== */
/* （旧 v1.2 の中央寄せ見出し＋朱赤下線はベンチに無いため撤去。上の §再写経 に置換済み）

   縦組み見出しを本文の左に置く＝ベンチ .section-container{display:flex} の再現。
   .inner の直下要素は数が可変なので、grid で「見出し=1列目・全行span / 他=2列目」に振る。 */
@media (min-width:641px){
  .section > .inner:has(> .section-head-center){
    display:grid; grid-template-columns:auto minmax(0,1fr); column-gap:6%; row-gap:0; align-items:start; align-content:start; grid-auto-rows:min-content; }
  .section > .inner:has(> .section-head-center) > .section-head-center{
    grid-column:1; grid-row:1 / span 99; margin-bottom:0; padding-top:.2em; }
  .section > .inner:has(> .section-head-center) > *:not(.section-head-center){ grid-column:2; }
}
@media (max-width:640px){
  /* SPも縦組みは維持しつつ、本文はその右に回す（ベンチのSPも縦組みを保つ） */
  .section > .inner:has(> .section-head-center){
    display:grid; grid-template-columns:auto minmax(0,1fr); column-gap:5vw; row-gap:0; align-items:start; align-content:start; grid-auto-rows:min-content; }
  .section > .inner:has(> .section-head-center) > .section-head-center{
    grid-column:1; grid-row:1 / span 99; margin-bottom:0; }
  .section > .inner:has(> .section-head-center) > *:not(.section-head-center){ grid-column:2; }
}
.lead{ line-height:2.05; }
.section-detail__txt{ line-height:2.05; }

/* リビール基盤 */
[data-reveal]{ opacity:0; transition:opacity 1s cubic-bezier(.2,.7,.2,1), transform 1s cubic-bezier(.2,.7,.2,1); will-change:opacity,transform; transition-delay:calc(var(--i,0)*90ms); }
[data-reveal="up"]{ transform:translateY(48px); }
[data-reveal="fade"]{ transform:none; }
[data-reveal="left"]{ transform:translateX(-56px); }
[data-reveal="right"]{ transform:translateX(56px); }
[data-reveal="scale"]{ transform:scale(1.06); }
[data-reveal].is-in{ opacity:1; transform:none; }

/* 画像クリップリビール（あしらい） */
[data-reveal="clip"]{ opacity:1; clip-path:inset(0 0 100% 0); transition:clip-path 1.25s cubic-bezier(.2,.7,.2,1); }
[data-reveal="clip"].is-in{ clip-path:inset(0 0 0 0); }
.section-img img[data-reveal="clip"], .section-img [data-reveal="clip"] img{ transform:scale(1.08); transition:transform 1.6s cubic-bezier(.2,.7,.2,1); }
.section-img [data-reveal="clip"].is-in img, .section-img img[data-reveal="clip"].is-in{ transform:scale(1); }

/* 微パララックス（JSでtranslate） */
[data-parallax]{ will-change:transform; }

/* 縦書きタイトルのリビール */
.vertical-ttl__item{ opacity:0; transform:translateY(-24px); transition:opacity 1.1s ease, transform 1.1s cubic-bezier(.2,.7,.2,1); }
.section-container.is-in .vertical-ttl__item, .vertical-ttl.is-in .vertical-ttl__item{ opacity:1; transform:none; }

/* ホバー：カード浮き上がり */
.scene-card, .course-teaser__item, .review-card{ transition:transform .5s cubic-bezier(.2,.7,.2,1), box-shadow .5s ease; }
.scene-card:hover, .review-card:hover{ transform:none; box-shadow:none; }
.course-teaser__item:hover{ transform:none; box-shadow:none; opacity:1; }
.kw-chips span{ transition:background .4s ease, color .4s ease; }
.kw-chips span:hover{ background:var(--accent); color:#fff; }

/* ボタンの上品なホバー（下線スライド） */
.btn-df{ position:relative; overflow:hidden; }
.btn-df span.lbl{ position:relative; z-index:1; }

/* 大型透かしをより繊細に */
.section-container__bottom-txt{ opacity:.85; letter-spacing:.08em; }

/* スクロールダウン誘導を細く */
.mv__scroll::after{ height:64px; }

/* reduced-motion 配慮：演出を無効化 */
@media (prefers-reduced-motion: reduce){
  [data-reveal], .vertical-ttl__item, .section-head-center .ja::after,
  .js-fade-up, .bg-swich-slide, #loader_bg img, .menu-photos img, .mv__logo, .mv__copy, .mv__cta{
    transition:none !important; animation:none !important; }
  [data-reveal]{ opacity:1 !important; transform:none !important; clip-path:none !important; }
  .vertical-ttl__item{ opacity:1 !important; transform:none !important; }
}

/* パララックス用ヘッドルーム（端の見切れ防止） */
.mv .bg-swich{ top:-8%; height:116%; }
@media (prefers-reduced-motion: reduce){ .mv .bg-swich{ top:0; height:100%; transform:none !important; } }

/* Instagram グリッド */
/* 縦組み見出しで本文カラムが左に寄ったぶん、760px固定だと右に余りが出る。カラム幅いっぱいに広げる */
.ig-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:10px; max-width:none; margin:1.6em 0 0; }
@media (max-width:640px){ .ig-grid{ gap:6px; } }
.ig-grid a{ display:block; overflow:hidden; aspect-ratio:1/1; }
.ig-grid img{ width:100%; height:100%; object-fit:cover; transition:transform 1s cubic-bezier(.2,.7,.2,1); }
.ig-grid a:hover img{ transform:scale(1.07); opacity:1; }
.reasons-grid{ display:grid; gap:38px 6%; background:none; border:0; margin-top:2.2em; }
@media (min-width:641px){ .reasons-grid{ grid-template-columns:repeat(2,1fr); } }
.reason{ background:none; padding:0; display:flex; gap:18px; align-items:flex-start; }
.reason__no{ font-family:var(--serif); font-size:2.4rem; color:var(--accent); line-height:1; flex:0 0 auto; }
.reason h3{ font-family:var(--serif); font-size:1.9rem; color:var(--logo); margin-bottom:.4em; letter-spacing:.04em; }
.reason p{ font-size:1.4rem; }

/* =====================================================================
   v1.2b さらに派手に（Ken Burns / スタッツ / マーキー / 名物 / 大将）
   ===================================================================== */
/* Ken Burns：表示中の1枚だけゆっくり微ズーム（is-active に連動＝隙間なし） */
.bg-swich-slide{ transform-origin:50% 50%; transform:scale(1.02);
  transition:opacity 1.8s ease, transform 1.8s ease; }
.bg-swich-slide.is-active{ transform:scale(1.1); transition:opacity 1.8s ease, transform 8s ease-out; }
@media (prefers-reduced-motion: reduce){
  .bg-swich-slide, .bg-swich-slide.is-active{ transform:none; transition:opacity .6s ease; }
}

/* スタッツ（数字カウントアップ帯） */
.stats{ background:var(--brown,#2d250d); color:var(--bg); }
/* 背景写真は HTML 側の inline background-image で指定する。
   CSS変数 var(--stats-bg) に url() を入れると、相対パスが「宣言元(HTML)」ではなく
   「var() を消費する側(assets/site.css)」基準で解決され assets/images/… を探して404になる
   （2026-08-04 実測）。Stem の取込書換もインライン background-image を対象にしている。 */
.stats-band{ position:relative; background:#1f100b center/cover no-repeat; color:#fff; }
.stats-band::before{ content:""; position:absolute; inset:0; background:rgba(20,12,8,.62); pointer-events:none; }
.stats-band > .inner{ position:relative; z-index:1; }
.stats-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:0; max-width:1000px; margin:0 auto; }
@media (max-width:640px){ .stats-grid{ grid-template-columns:repeat(2,1fr); gap:30px 0; } }
.stat{ text-align:center; padding:0 12px; position:relative; }
.stat + .stat::before{ content:""; position:absolute; left:0; top:50%; height:56px; width:1px; background:rgba(255,255,255,.28); transform:translateY(-50%); }
@media (max-width:640px){ .stat:nth-child(odd)+.stat::before{ display:none; } }
.stat__num{ font-family:var(--serif); font-size:clamp(3.2rem,6vw,5rem); line-height:1; letter-spacing:.02em; }
.stat__unit{ font-family:var(--serif); font-size:1.8rem; margin-left:.15em; }
.stat__label{ font-family:var(--gothic); font-size:1.25rem; letter-spacing:.14em; margin-top:.9em; opacity:.9; }

/* マーキー（流れるキーワード） */
.marquee{ overflow:hidden; white-space:nowrap; padding:26px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.marquee__track{ display:inline-block; animation:marqueeMove 34s linear infinite; }
.marquee__track span{ font-family:var(--serif); font-size:clamp(2rem,3.4vw,3.2rem); color:var(--accent); letter-spacing:.14em; padding:0 .8em; opacity:.85; }
.marquee__track span::after{ content:"—"; margin-left:.9em; opacity:.5; }
@keyframes marqueeMove{ from{transform:translateX(0);} to{transform:translateX(-50%);} }
.marquee:hover .marquee__track{ animation-play-state:paused; }

/* 名物ショーケース（大きめ・交互） */
.showcase{ display:grid; gap:64px; margin-top:3em; }
.showcase__item{ display:grid; gap:28px; align-items:center; }
@media (min-width:641px){
  .showcase__item{ grid-template-columns:1.1fr 1fr; gap:56px; }
  .showcase__item:nth-child(even){ direction:rtl; }
  .showcase__item:nth-child(even) > *{ direction:ltr; }
}
.showcase__img{ overflow:hidden; box-shadow:0 30px 70px -34px rgba(31,16,11,.5); }
.showcase__img img{ width:100%; aspect-ratio:4/3; object-fit:cover; transition:transform 1.4s cubic-bezier(.2,.7,.2,1); }
.showcase__item:hover .showcase__img img{ transform:scale(1.05); }
.showcase__body .en{ font-family:var(--serif); color:var(--accent); letter-spacing:.3em; font-size:1.15rem; }
.showcase__body h3{ font-family:var(--serif); font-size:clamp(2rem,3.4vw,2.8rem); color:var(--logo); margin:.4em 0 .6em; letter-spacing:.05em; }
.showcase__body p{ font-size:1.5rem; line-height:2.1; }

/* 大将・スタッフ（EEAT） */
.staff-lead{ display:grid; gap:30px; align-items:center; margin-top:2.4em; }
@media (min-width:641px){ .staff-lead{ grid-template-columns:0.7fr 1fr; gap:50px; } }
.staff-lead__img{ overflow:hidden; box-shadow:0 24px 60px -32px rgba(31,16,11,.5); }
.staff-lead__img img{ width:100%; aspect-ratio:3/4; object-fit:cover; }
.staff-lead__body h3{ font-family:var(--serif); font-size:2.2rem; color:var(--logo); margin-bottom:.5em; }
.staff-lead__body .role{ font-family:var(--gothic); font-size:1.25rem; color:var(--accent); letter-spacing:.14em; }
.staff-lead__body p{ font-size:1.5rem; line-height:2.1; margin-top:1em; }
.staff-row{ display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-top:40px; }
@media (max-width:640px){ .staff-row{ grid-template-columns:repeat(2,1fr); } }
.staff-row img{ width:100%; aspect-ratio:1/1; object-fit:cover; box-shadow:0 14px 34px -24px rgba(31,16,11,.4); }

/* =====================================================================
   v1.2c ゴリゴリ：差し色(朱赤)・ピン留め・強パララックス・空枠フォールバック
   ===================================================================== */
/* 差し色を効かせる */
.price-badge{ background:var(--accent); }
.section-head-center .en{ color:#EEE8E4; }   /* 右下の大型透かし＝ベンチ bottom-txt 色 */
.showcase__body .en, .staff-lead__body .role{ color:var(--accent); }
.stat__unit{ color:var(--accent); }
.reason__no{ color:var(--accent); }
.marquee__track span{ color:var(--logo); }
.marquee__track span::after{ content:"／"; color:var(--red); margin-left:.7em; opacity:1; }

.section-head-center.is-in .ja::after{ width:56px; }
.kw-chips span:hover{ background:var(--red); }
.faq-catnav__link{ border-color:var(--accent); color:var(--accent); }
.faq-catnav__link:hover{ background:var(--red); }
.btn-df--fill{ background:var(--logo); }
.btn-df--fill:hover{ background:var(--red); }
.cta .btn-df:hover, .mv__cta:hover{ background:var(--red); border-color:var(--red); color:#fff; }
.faq-item__q::before{ color:var(--accent); }
.price-ttl{ border-bottom-color:var(--accent); }
.news-list__date{ color:var(--accent); }
.vertical-ttl__item{ position:relative; }
.section01 .vertical-ttl__item::before, .section .vertical-ttl__item::before{ }

/* ピン留め：縦書きタイトルを追従 */
@media (min-width:641px){
  .section-container .vertical-ttl{ position:sticky; top:150px; align-self:flex-start; }
}
/* 追従する予約ボタン（ヒーローを過ぎたら出現） */
.floatcta{ position:fixed; right:22px; bottom:22px; z-index:1001; display:flex; gap:10px;
  opacity:0; transform:translateY(16px); pointer-events:none; transition:opacity .5s ease, transform .5s cubic-bezier(.2,.7,.2,1); }
.floatcta.is-show{ opacity:1; transform:none; pointer-events:auto; }
.floatcta a{ display:inline-flex; align-items:center; gap:8px; padding:14px 22px; font-family:var(--gothic);
  font-size:1.35rem; letter-spacing:.1em; box-shadow:0 14px 34px -14px rgba(31,16,11,.55); }
.floatcta .tel{ background:var(--red); color:#fff; }
.floatcta .tel:hover{ background:var(--red-d); opacity:1; }
.floatcta .rsv{ background:var(--logo); color:#fff; }
.floatcta .rsv:hover{ background:#000; opacity:1; }
/* SP: 2行折返しで帯が高くなり本文を隠していたため、1行に収める＋フッターに逃げを作る
   （DESIGN_RULES §3-7 レスポンシブで文字被り禁止。2026-08-04） */
@media (max-width:640px){ .floatcta{ left:14px; right:14px; bottom:14px; gap:8px; }
  .floatcta a{ flex:1; justify-content:center; padding:13px 6px; gap:5px;
    font-size:1.1rem; letter-spacing:.02em; white-space:nowrap; }
  /* 固定バーの下に本文が潜り込まないよう、ページ末尾に帯ぶんの余白を確保する */
  .footer{ padding-bottom:86px; } }

/* 強パララックス対象 */
.section-container__bottom-txt{ will-change:transform; }

/* Instagram フォールバック（空枠＝歯抜け防止。Stem接続時に差替） */
.ig-grid:empty{ min-height:0; }

/* reduced-motion で sticky/float 無効化しない（動きでないため保持） */

/* 空の動的枠は畳む（歯抜け防止・Stem接続時は中身が入り表示） */
[data-stem-review-list]:empty, [data-stem-ig-list]:empty, [data-stem-topics]:empty,
[data-stem-events]:empty, .reviews__grid:empty, .ig-grid:empty{ display:none !important; margin:0 !important; min-height:0 !important; }

/* =====================================================================
   v1.2d さらに：進捗バー・逆流マーキー・大型タイポ・横スクロール料理・道順
   ===================================================================== */
/* スクロール進捗バー（上部・赤） */
.scrollprog{ position:fixed; top:0; left:0; height:3px; width:0; background:var(--red); z-index:1100; transition:width .1s linear; }

/* 逆流マーキー（2行目） */
.marquee--rev .marquee__track{ animation-direction:reverse; animation-duration:40s; }
.marquee--tight{ border-top:none; padding-top:0; }

/* 大型タイポの見せ場（フルブリード・パララックス背景） */
.statement{ position:relative; overflow:hidden; color:#fff; text-align:center; }
.statement__bg{ position:absolute; inset:-10% 0; background-size:cover; background-position:center; z-index:0; }
.statement::after{ content:""; position:absolute; inset:0; background:rgba(20,12,8,.6); z-index:1; }
.statement .inner{ position:relative; z-index:2; }
.statement__en{ font-family:var(--serif); letter-spacing:.4em; color:var(--red); font-size:1.3rem; }
.statement__ttl{ font-family:var(--serif); line-height:1.5; letter-spacing:.1em; margin:.6em 0;
  font-size:clamp(2.6rem,6vw,5.4rem); text-shadow:0 2px 30px rgba(0,0,0,.5); }
.statement__sub{ font-size:1.5rem; letter-spacing:.1em; opacity:.95; }
@media (min-width:641px){ .statement{ padding:150px 5.2083%; } }
@media (max-width:640px){ .statement{ padding:24vw 0; } }

/* 料理ギャラリー＝完全ピン留め横送り（main.js が縦スクロール量→translateX） */
.pinh{ position:relative; background:var(--bg); }
.pinh__stage{ position:sticky; top:0; height:100vh; overflow:hidden;
  display:flex; flex-direction:column; justify-content:center; }
.pinh__head{ text-align:center; margin-bottom:clamp(20px,4vh,46px); }
.pinh__head .en{ display:block; font-family:var(--serif); letter-spacing:.3em; color:var(--accent); font-size:1.1rem; }
.pinh__head h2{ font-family:var(--serif); font-size:clamp(2.2rem,3.4vw,3rem); color:var(--logo); margin-top:.3em; letter-spacing:.06em; }
.pinh__head h2::after{ content:""; display:block; width:56px; height:1px; background:var(--line); margin:.6em auto 0; }
.pinh__viewport{ overflow:hidden; }
.pinh__track{ display:flex; gap:28px; padding:0 5.2083%; will-change:transform; }
.pinh__track figure{ flex:0 0 auto; width:clamp(300px,26vw,400px); }
.pinh__track img{ width:100%; aspect-ratio:4/5; object-fit:cover; }
.pinh__track figcaption{ font-family:var(--gothic); font-size:1.3rem; letter-spacing:.08em; color:var(--accent); margin-top:14px; }
.pinh__progress{ margin:clamp(20px,3.5vh,40px) 5.2083% 0; height:2px; background:var(--line); }
.pinh__progress span{ display:block; height:100%; background:var(--red); transform:scaleX(0); transform-origin:left; }
/* モバイル：ピン無しの素の横スワイプに */
@media (max-width:900px){
  .pinh{ height:auto !important; }
  .pinh__stage{ position:static; height:auto; overflow:visible; padding:14vw 0; }
  .pinh__viewport{ overflow-x:auto; -webkit-overflow-scrolling:touch; scrollbar-width:thin; }
  .pinh__track{ transform:none !important; }
  .pinh__track figure{ width:64vw; }
  .pinh__progress{ display:none; }
}
@media (prefers-reduced-motion: reduce){
  .pinh{ height:auto !important; }
  .pinh__stage{ position:static; height:auto; overflow:visible; }
  .pinh__viewport{ overflow-x:auto; }
  .pinh__track{ transform:none !important; }
  .pinh__progress{ display:none; }
}

/* アクセス道順ステップ */
/* 道順は3等分で全幅（max-width:820px で左寄せに縮んでいた。2026-08-05） */
.steps{ display:grid; gap:20px; margin-top:2em; max-width:none; }
@media (min-width:641px){ .steps{ grid-template-columns:repeat(3,minmax(0,1fr)); gap:0 4%; } }
.step{ background:none; border:0; border-top:1px solid var(--line); padding:20px 0 0; position:relative; }
.step__no{ font-family:var(--serif); font-size:1.4rem; color:#fff; background:var(--accent); width:34px; height:34px;
  display:flex; align-items:center; justify-content:center; border-radius:50%; margin-bottom:14px; }
.step h3{ font-family:var(--serif); font-size:1.7rem; color:var(--logo); margin-bottom:.4em; }
.step p{ font-size:1.45rem; }

/* =====================================================================
   v1.2e ヒーロー朱アクセント・描かれる区切り・イベント・2枚目大型タイポ
   ===================================================================== */
/* ヒーロー：朱の縦アクセント線（コピー左に） */
.mv .inner{ position:relative; }
.mv__copy{ padding-left:22px; }
.mv__copy::before{ content:""; position:absolute; left:0; top:.1em; width:3px; height:0; background:var(--red);
  transition:height .9s cubic-bezier(.2,.7,.2,1) 1.9s; }
body.loaded .mv__copy::before{ height:calc(100% - .2em); }
@media (max-width:640px){ .mv__copy{ padding-left:14px; } }

/* 描かれる朱の区切り（見せ方のリズム） */
.divider{ text-align:center; padding:26px 0; }
.divider__line{ display:inline-block; width:0; height:1px; background:var(--line); vertical-align:middle; transition:width 1s cubic-bezier(.2,.7,.2,1); }
.divider.is-in .divider__line{ width:110px; }
.divider__mark{ display:inline-block; width:30px; height:30px; margin:0 18px; vertical-align:middle; opacity:.85;
  background:url(../images/logo_torimaru.svg) center/contain no-repeat; transform:rotate(0); transition:transform 1.2s ease; }
.divider.is-in .divider__mark{ transform:rotate(360deg); }

/* イベント（季節・宴会）カード */
.event-grid{ display:grid; gap:22px; margin-top:2.2em; }
@media (min-width:641px){ .event-grid{ grid-template-columns:repeat(3,1fr); } }
.event-grid > .event-card{ background:none; border-top:1px solid var(--line); padding:14px 0 0; }
.event-card .cat{ font-family:var(--gothic); font-size:1.15rem; letter-spacing:.14em; color:var(--accent); }
.event-card h3{ font-family:var(--serif); font-size:1.9rem; color:var(--logo); margin:.4em 0 .5em; }
.event-card p{ font-size:1.4rem; }

/* 2枚目 大型タイポ（明色・朱） */
.statement--light{ color:var(--ink); background:var(--bg); }
.statement--light::after{ display:none; }
.statement--light .statement__ttl{ color:var(--logo); text-shadow:none; }
.statement--light .statement__sub{ opacity:1; color:var(--ink); }

/* =====================================================================
   v1.3 FV刷新（patisserie-emera 流：フルブリード写真＋横組みワードマーク＋下部帯）
   ===================================================================== */
.mv--hero{ position:relative; }
.mv--hero .bg-swich-slide::after{ background:linear-gradient(to bottom, rgba(20,12,8,.12) 0%, rgba(20,12,8,.12) 42%, rgba(20,12,8,.58) 100%); }
.mv--hero .inner{ position:static; }
.mv__wordmark{ position:absolute; left:5.2083%; bottom:16vh; z-index:3; color:#fff; }
@media (max-width:640px){ .mv__wordmark{ left:7vw; bottom:20vh; } }
.mv__en{ font-family:var(--serif); letter-spacing:.32em; font-size:1.2rem; opacity:0;
  transform:translateY(14px); transition:opacity .7s ease 1.1s, transform .9s cubic-bezier(.2,.7,.2,1) 1.1s; }
.mv__brand{ font-family:var(--serif); font-weight:600; line-height:1; letter-spacing:.04em;
  font-size:clamp(4.4rem,9vw,8.4rem); margin:.14em 0 .28em; overflow:hidden; }
.mv__brand-inner{ display:inline-block; transform:translateY(110%); transition:transform 1.1s cubic-bezier(.2,.7,.2,1) 1.25s; }
.mv__brand-sup{ font-size:.28em; letter-spacing:.2em; display:block; margin-bottom:.2em; font-weight:500; }
.mv__brand-sub{ font-size:.3em; letter-spacing:.16em; margin-left:.5em; font-weight:500; }
.mv__tag{ font-family:var(--serif); font-size:clamp(1.6rem,2.2vw,2.2rem); letter-spacing:.14em;
  text-shadow:0 0 18px rgba(0,0,0,.5); opacity:0; transform:translateY(14px);
  transition:opacity .7s ease 1.5s, transform .9s cubic-bezier(.2,.7,.2,1) 1.5s; }
.mv__wordmark .mv__cta{ display:inline-block; margin-top:1.6em; padding:.85em 2.4em; border:1px solid rgba(255,255,255,.85);
  color:#fff; font-family:var(--gothic); font-size:1.35rem; letter-spacing:.16em; opacity:0; transform:translateY(14px);
  transition:opacity .7s ease 1.8s, transform .9s cubic-bezier(.2,.7,.2,1) 1.8s, background .3s, color .3s; }
.mv__wordmark .mv__cta:hover{ background:#fff; color:var(--logo); opacity:1; }
body.loaded .mv__en, body.loaded .mv__tag, body.loaded .mv__wordmark .mv__cta{ opacity:1; transform:translateY(0); }
body.loaded .mv__brand-inner{ transform:translateY(0); }

/* 下部ニュース帯（emera 流） */
.mv__strip{ position:absolute; left:0; right:0; bottom:0; z-index:3; display:flex; align-items:stretch;
  background:rgba(247,244,243,.94); border-top:1px solid var(--line); backdrop-filter:blur(4px);
  opacity:0; transform:translateY(100%); transition:opacity .6s ease 2s, transform .8s cubic-bezier(.2,.7,.2,1) 2s; }
body.loaded .mv__strip{ opacity:1; transform:translateY(0); }
.mv__strip a{ display:flex; align-items:center; gap:16px; padding:20px 5.2083%; }
.mv__strip-promo{ background:var(--logo); color:#fff; }
.mv__strip-promo:hover{ background:var(--red); opacity:1; }
.mv__strip-promo .k{ font-family:var(--serif); font-size:1.9rem; letter-spacing:.04em; }
.mv__strip-promo .s{ font-family:var(--gothic); font-size:1.25rem; letter-spacing:.08em; opacity:.9; }
.mv__strip-latest{ flex:1; justify-content:space-between; color:var(--ink); }
.mv__strip-latest:hover{ opacity:1; }
.mv__strip-latest .lbl{ font-family:var(--serif); color:var(--accent); letter-spacing:.2em; font-size:1.15rem; }
.mv__strip-latest .txt{ font-size:1.4rem; flex:1; margin:0 20px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.mv__strip-latest .date{ font-family:var(--gothic); font-size:1.2rem; color:var(--accent); }
.mv__strip-latest .arw{ color:var(--red); font-size:1.6rem; }
@media (max-width:768px){ .mv__strip{ display:none; } }

/* SCROLL 指示を右下へ */
.mv--hero .mv__scroll{ right:24px; left:auto; transform:none; bottom:15vh; }
@media (max-width:768px){ .mv--hero .mv__scroll{ bottom:22vh; } }

/* =====================================================================
   v1.3 エメラ流セクション（横組みラベル＋オフセット画像＋余白・非対称）
   ===================================================================== */
.esec{ position:relative; }
@media (min-width:641px){ .esec{ padding:150px 5.2083%; } }
@media (max-width:640px){ .esec{ padding:22vw 7vw; } }
.esec__inner{ max-width:1280px; margin:0 auto; display:grid; gap:40px; align-items:center; }
@media (min-width:641px){
  .esec__inner{ grid-template-columns:0.9fr 1.1fr; gap:8%; }
  .esec--rev .esec__inner{ grid-template-columns:1.1fr 0.9fr; }
  .esec--rev .esec__body{ order:2; } .esec--rev .esec__img{ order:1; }
}
.esec__label{ font-family:var(--serif); font-size:1.3rem; letter-spacing:.34em; color:var(--red); }
.esec__label .ja{ display:block; font-size:1.15rem; letter-spacing:.2em; color:var(--accent); margin-top:.5em; }
.esec__ttl{ font-family:var(--serif); font-weight:500; line-height:1.7; letter-spacing:.08em; color:var(--logo);
  font-size:clamp(2.2rem,3.4vw,3rem); margin:.7em 0; }
.esec__txt{ font-size:1.5rem; line-height:2.15; }
.esec__btn{ margin-top:2em; }
.esec__img{ overflow:hidden; box-shadow:0 34px 80px -40px rgba(31,16,11,.5); }
.esec__img img{ width:100%; object-fit:cover; aspect-ratio:5/4; }
@media (min-width:641px){ .esec--rev .esec__img{ margin-left:-4%; } .esec:not(.esec--rev) .esec__img{ margin-right:-4%; } }
.esec__num{ position:absolute; font-family:var(--serif); color:var(--wash); font-size:14rem; line-height:1;
  z-index:0; top:6%; opacity:.8; }
@media (max-width:640px){ .esec__num{ display:none; } }

/* 店舗詳細スペック表 */
.access-grid{ display:grid; gap:44px; max-width:1280px; margin:2.6em auto 0; align-items:start; }
@media (min-width:641px){ .access-grid{ grid-template-columns:1fr 1fr; gap:6%; } }
.spec{ }
.spec dl{ display:grid; grid-template-columns:7em minmax(0,1fr); border-top:1px solid var(--line); }
.spec dt, .spec dd{ padding:14px 4px; border-bottom:1px solid var(--line); font-size:1.4rem; }
.spec dt{ font-family:var(--gothic); color:var(--accent); letter-spacing:.08em; }
.spec dd{ }
.access-map iframe{ width:100%; height:100%; min-height:360px; border:0; box-shadow:0 24px 60px -34px rgba(31,16,11,.4); }
.access-media{ display:grid; gap:16px; }
.access-media img{ width:100%; aspect-ratio:16/10; object-fit:cover; box-shadow:0 24px 60px -34px rgba(31,16,11,.4); }

/* =====================================================================
   v1.4 emera 完全準拠：FV(右下ジャーナル/右上ナビ) + 直下2セクション(リード+帯 / 非対称)
   ===================================================================== */
/* FV全体を emera 構図に */
.mv--hero{ height:clamp(700px,100vh,1105px); }
.mv--hero .bg-swich-slide::after{ background:linear-gradient(to bottom, rgba(20,12,8,.10) 0%, rgba(20,12,8,.10) 40%, var(--bg) 96%); }
.mv--hero .mv__wordmark{ left:calc(5.2083% + 12px); bottom:60px; }
@media (max-width:640px){ .mv--hero .mv__wordmark{ left:8vw; bottom:26vh; } }

/* 右上 FVナビ（emera：ロゴ無し・縦積み） */
.mv__nav{ position:absolute; top:44px; right:78px; z-index:6; text-align:right; color:#fff; }
@media (max-width:768px){ .mv__nav{ display:none; } }
.mv__nav ul{ }
.mv__nav li{ font-family:var(--serif); font-size:1.4rem; letter-spacing:.14em; line-height:1; }
.mv__nav li + li{ margin-top:17px; }
.mv__nav a{ position:relative; }
.mv__nav a::after{ content:""; position:absolute; left:0; right:0; bottom:-4px; height:1px; background:currentColor; transform:scaleX(0); transform-origin:right; transition:transform .5s ease; }
.mv__nav a:hover{ opacity:1; } .mv__nav a:hover::after{ transform:scaleX(1); transform-origin:left; }
.mv__nav .sns{ margin-top:34px; }
.mv__nav .sns li{ font-size:1.2rem; letter-spacing:.1em; }
.mv__nav .sns a{ padding-bottom:2px; border-bottom:1px solid rgba(255,255,255,.7); }
.mv__lang{ margin-top:26px; font-size:1.2rem; letter-spacing:.12em; }
.mv__lang a{ opacity:.75; }

/* 右下 ジャーナルカード（emera） */
.mv__journal{ position:absolute; right:calc(5.2083% + 12px); bottom:60px; z-index:4; }
@media (max-width:768px){ .mv__journal{ display:none; } }
.mv__journal a{ display:grid; grid-template-columns:56px auto 14px; align-items:center; gap:16px; color:#fff; }
.mv__journal .th{ width:56px; height:56px; object-fit:cover; }
.mv__journal .info{ max-width:260px; text-align:left; }
.mv__journal .ttl{ font-size:1.3rem; line-height:1.5; text-decoration:underline; text-underline-offset:3px; }
.mv__journal .tm{ display:block; font-size:1.2rem; margin-top:.5em; opacity:.85; }
.mv__journal .arw{ align-self:start; margin-top:4px; color:var(--red); font-size:1.5rem; }

/* 直下1: 狭い中央リード（emera .about） */
.mabout{ text-align:center; position:relative; z-index:2; }
/* 扇の直下に近接配置。FV増分ぶん、当節は縦を詰めてバランスを取る */
@media (min-width:641px){ .mabout{ padding:clamp(20px,3vh,40px) 5.2083% clamp(28px,4vh,48px); margin-top:0; } }
@media (max-width:640px){ .mabout{ padding:5vw 8vw 6vw; margin-top:0; } }
.mabout__inner{ max-width:400px; margin:0 auto; }
.mabout__txt{ font-family:var(--serif); font-size:1.6rem; line-height:2.05; letter-spacing:.08em; text-align:justify; color:var(--ink); }
.mabout__txt + .mabout__txt{ margin-top:1em; }

/* 直下1b: フルブリード帯（emera .insideshop） */
.mband{ overflow:hidden; padding:0 46px; margin-top:20px; }
@media (max-width:640px){ .mband{ padding:0; } }
.mband__img{ height:min(53vw,760px); overflow:hidden; }
.mband__img img{ width:100%; height:100%; object-fit:cover; object-position:50% 60%; }

/* 直下2: 非対称グリッド（emera .history/.chef） */
.masym{ position:relative; }
@media (min-width:641px){ .masym{ padding:100px 5.2083%; } }
@media (max-width:640px){ .masym{ padding:13vw 7vw; } }
.masym__inner{ max-width:1220px; margin:0 auto; display:grid; gap:0 40px; align-items:start;
  grid-template-columns:8em 1fr; grid-template-areas:"label img" "label txt"; }
@media (max-width:768px){ .masym__inner{ grid-template-columns:1fr; grid-template-areas:"label" "img" "txt"; gap:20px; } }
.masym__label{ grid-area:label; font-family:var(--serif); font-size:1.8rem; font-weight:600; letter-spacing:.1em; color:var(--red); }
@media (min-width:769px){ .masym__label{ margin-top:40%; writing-mode:horizontal-tb; } }
.masym__label .ja{ display:block; font-size:1.15rem; color:var(--accent); margin-top:.6em; letter-spacing:.16em; }
.masym__img{ grid-area:img; overflow:hidden; box-shadow:0 30px 70px -38px rgba(31,16,11,.5); }
.masym__img img{ width:100%; object-fit:cover; aspect-ratio:3/2; }
.masym__txt{ grid-area:txt; margin-top:34px; }
.masym__ttl{ font-family:var(--serif); font-size:clamp(2rem,3vw,2.6rem); color:var(--logo); line-height:1.7; letter-spacing:.06em; margin-bottom:.8em; }
.masym__body{ font-size:1.5rem; line-height:2; letter-spacing:.06em; text-align:justify; max-width:30em; }
.masym__side{ position:absolute; right:0; top:16%; width:170px; z-index:0; }
.masym__side img{ width:100%; }
@media (max-width:768px){ .masym__side{ display:none; } }
/* 縦書き氏名（emera .chef の唯一の縦書き） */
.masym__name{ position:absolute; writing-mode:vertical-rl; font-family:var(--serif); font-size:1.5rem;
  letter-spacing:.16em; color:var(--logo); }

/* =====================================================================
   v1.4b emera の世界観に寄せる：ワードマーク小さく細く・繊細・軽く
   ===================================================================== */
/* ワードマークを大幅に小型化＆軽量化（emera "Emera" 相当の抑えたサイズ） */
.mv--hero .mv__brand{ font-weight:500; letter-spacing:.02em; font-size:clamp(3rem,4.4vw,4.4rem); margin:.2em 0 .34em; }
.mv--hero .mv__brand-sup{ font-size:.26em; letter-spacing:.24em; font-weight:400; opacity:.95; }
.mv--hero .mv__brand-sub{ font-size:.3em; letter-spacing:.18em; font-weight:400; }
.mv--hero .mv__en{ font-size:1.05rem; letter-spacing:.34em; opacity:.9; }
.mv--hero .mv__tag{ font-size:clamp(1.35rem,1.7vw,1.7rem); letter-spacing:.16em; font-weight:400; text-shadow:0 1px 12px rgba(0,0,0,.45); margin-top:.2em; }
/* CTA を控えめな下線テキストリンクに（emera はボタン無し・繊細） */
.mv--hero .mv__wordmark .mv__cta{ border:none; padding:0; margin-top:1.5em; font-family:var(--serif);
  font-size:1.3rem; letter-spacing:.14em; position:relative; display:inline-block; }
.mv--hero .mv__wordmark .mv__cta::after{ content:""; position:absolute; left:0; right:0; bottom:-5px; height:1px; background:rgba(255,255,255,.7); transform:scaleX(1); transform-origin:left; transition:transform .5s ease; }
.mv--hero .mv__wordmark .mv__cta:hover{ background:none; color:#fff; opacity:.75; }
.mv--hero .mv__wordmark .mv__cta:hover::after{ transform-origin:right; transform:scaleX(0); }
/* オーバーレイを少し軽く（emera の明るく軽い空気感） */
.mv--hero .bg-swich-slide::after{ background:linear-gradient(to bottom, rgba(20,12,8,.06) 0%, rgba(20,12,8,.14) 45%, var(--bg) 97%); }
/* ナビも軽く */
.mv__nav li{ font-size:1.3rem; font-weight:400; letter-spacing:.12em; }
.mv__nav li + li{ margin-top:15px; }
.mv__nav .sns li, .mv__lang{ font-size:1.1rem; }
/* ヘッダー(スクロール後)ロゴもさらに小さく */
.footer__logo img{ width:74px; }

/* FVワードマーク＝鶏丸ロゴ（白・繊細サイズ・平打ち解消） */
.mv--hero .mv__logo{ margin:.5em 0 .55em; }
.mv--hero .mv__logo img{ height:120px; width:auto; filter:brightness(0) invert(1); opacity:.97;
  transform:translateY(16px); transition:opacity .8s ease 1.15s, transform 1s cubic-bezier(.2,.7,.2,1) 1.15s; }
@media (max-width:640px){ .mv--hero .mv__logo img{ height:20vw; } }
body.loaded .mv--hero .mv__logo img{ opacity:.97; }
.mv--hero .mv__wordmark{ opacity:0; transition:opacity .6s ease .9s; } body.loaded .mv--hero .mv__wordmark{ opacity:1; }

/* =====================================================================
   v1.5 SEO長文コンテンツ（読み物）
   ===================================================================== */
.longform{ }
.longform__inner{ max-width:820px; margin:0 auto; }
.longform__lead{ font-family:var(--serif); font-size:1.6rem; line-height:2.2; text-align:center; color:var(--ink); margin-bottom:2.4em; }
.lf-block{ margin-top:3.4em; }
.lf-block__en{ font-family:var(--serif); color:var(--red); letter-spacing:.28em; font-size:1.15rem; }
.lf-block h3{ font-family:var(--serif); font-size:clamp(2rem,3vw,2.6rem); color:var(--logo); line-height:1.7; letter-spacing:.05em; margin:.4em 0 .7em; }
.lf-block h4{ font-family:var(--serif); font-size:1.7rem; color:var(--logo); margin:1.4em 0 .5em; letter-spacing:.04em; }
.lf-block p{ font-size:1.5rem; line-height:2.15; letter-spacing:.03em; text-align:justify; }
.lf-block p + p{ margin-top:1.2em; }
.lf-block__img{ margin:1.6em 0; overflow:hidden; }
.lf-block__img img{ width:100%; aspect-ratio:16/9; object-fit:cover; box-shadow:0 24px 60px -34px rgba(31,16,11,.4); }
.lf-divider{ width:56px; height:2px; background:var(--red); margin:2.6em auto 0; }

/* ピン留め：非対称セクションのラベルをスクロール追従で完全固定
   右カラム(masym__points)を縦に伸ばし、ラベルがセクション全体で貼り付き続ける＝完全ピン */
@media (min-width:769px){
  .masym__label{ position:sticky; top:140px; align-self:start; margin-top:0; z-index:2; }
  /* 固定中であることを示す縦罫（ラベル下に伸びる） */
  .masym__label::after{ content:""; display:block; width:1px; height:64px; margin:1.2em auto 0;
    background:linear-gradient(var(--red), transparent); }
}

/* コンセプト3本柱（右カラムを伸ばしてピンの移動距離を稼ぐ） */
.masym__points{ margin-top:2em; }
.masym__point{ display:grid; grid-template-columns:auto 1fr; gap:0 1.6em; align-items:start;
  padding:1.4em 0; border-top:1px solid rgba(166,147,129,.28); }
.masym__point:first-child{ border-top:none; padding-top:.4em; }
.masym__point-no{ font-family:var(--serif); font-size:1.5rem; font-weight:600; color:var(--red);
  letter-spacing:.08em; line-height:1; padding-top:.35em; }
.masym__point-ttl{ font-family:var(--serif); font-size:clamp(1.7rem,2.2vw,2.1rem); color:var(--logo);
  line-height:1.6; letter-spacing:.05em; margin-bottom:.6em; }
.masym__point-body p{ font-size:1.45rem; line-height:2; letter-spacing:.05em; text-align:justify; }
@media (max-width:768px){
  .masym__points{ margin-top:2em; }
  .masym__point{ padding:1.6em 0; gap:0 1em; }
  .masym__point-body p{ line-height:1.9; }
}

/* =====================================================================
   v1.6 FV＝扇形（Ougiya 那須扇屋 1:1トレース）
   明るい生成り地に、扇形マスクの主役写真＋背後にずらした薄い双子扇。
   既存 bg-swich クロスフェード(6枚)は扇の内側で継続。A-10 hero 維持。
   ===================================================================== */
.fanfv{ position:relative; background:var(--bg); overflow:hidden; min-height:100vh; padding:0 5.2083%; }
@media (max-width:640px){ .fanfv{ padding:0 7vw; } }

/* 左上：アイコン列（電話・アクセス） */
.fanfv__icons{ position:absolute; top:30px; left:5.2083%; z-index:7; display:flex; flex-direction:column; gap:20px; }
.fanfv__icon{ color:var(--logo); display:block; line-height:0; transition:color .3s, opacity .3s; }
.fanfv__icon:hover{ color:var(--red); opacity:1; }

/* 右上：ロゴ */
.fanfv__logo{ position:absolute; top:26px; right:5.2083%; z-index:7; margin:0; }
.fanfv__logo img{ height:78px; width:auto; opacity:0; transform:translateY(-10px);
  transition:opacity .9s ease .5s, transform 1s cubic-bezier(.2,.7,.2,1) .5s; }
body.loaded .fanfv__logo img{ opacity:1; transform:translateY(0); }
@media (max-width:640px){ .fanfv__logo img{ height:14vw; } }

/* 中央右：縦書きナビ（2群＋区切り・右→左に列） */
.fanfv__nav{ position:absolute; top:15vh; right:5.2083%; z-index:6; writing-mode:vertical-rl;
  font-family:var(--serif); color:var(--logo); display:flex; align-items:flex-start; }
.fanfv__nav ul{ list-style:none; display:block; }
.fanfv__nav li{ font-size:1.5rem; letter-spacing:.16em; margin-left:1.7em; white-space:nowrap; }
.fanfv__nav a{ color:var(--logo); transition:color .3s, opacity .3s; }
.fanfv__nav a:hover{ color:var(--red); opacity:1; }
.fanfv__nav-div{ display:block; margin-left:1.7em; border-right:1px solid var(--line); height:7em; align-self:center; }
.fanfv__nav-en{ color:var(--accent); letter-spacing:.22em; }

/* 中央左：キャッチ＋CTA＋ニュース（A-10 headline/cta） */
.fanfv__lead{ position:absolute; top:14vh; left:5.2083%; z-index:6; max-width:22em;
  opacity:0; transform:translateY(12px); transition:opacity .9s ease .6s, transform .9s ease .6s; }
body.loaded .fanfv__lead{ opacity:1; transform:translateY(0); }
.fanfv__lead .fanfv__en{ font-family:var(--serif); letter-spacing:.32em; font-size:1rem; color:var(--accent); }
.fanfv__tag{ font-family:var(--serif); font-size:clamp(2rem,2.8vw,2.9rem); line-height:1.5; letter-spacing:.1em;
  color:var(--logo); margin:.5em 0 .7em; }
.fanfv__cta{ display:inline-block; padding:.8em 2.4em; border:1px solid var(--red); color:var(--red);
  font-family:var(--serif); font-size:1.3rem; letter-spacing:.14em; transition:background .35s, color .35s, opacity .3s; }
.fanfv__cta:hover{ background:var(--red); color:#fff; opacity:1; }
.fanfv__news{ margin-top:1.8em; font-family:var(--serif); }
.fanfv__news a{ display:inline-flex; align-items:baseline; gap:12px; color:var(--logo); }
.fanfv__news a::before{ content:""; align-self:center; width:6px; height:6px; border-radius:50%; background:var(--red); flex:none; }
.fanfv__news .tm{ color:var(--accent); font-size:1rem; letter-spacing:.08em; }
.fanfv__news .ttl{ font-size:1.15rem; letter-spacing:.04em; }
.fanfv__news a:hover .ttl{ color:var(--red); opacity:1; }

/* 左下：© ／ 右下：SNS（扇の上に来るので mix-blend-difference で常時視認） */
.fanfv__copy{ position:absolute; bottom:26px; left:5.2083%; z-index:7; writing-mode:vertical-rl;
  margin:0; font-family:var(--serif); font-size:1rem; letter-spacing:.14em; color:#fff; mix-blend-mode:difference; }
.fanfv__sns{ position:absolute; bottom:26px; right:5.2083%; z-index:7; writing-mode:vertical-rl;
  list-style:none; font-family:var(--serif); font-size:1.15rem; letter-spacing:.16em; }
.fanfv__sns a{ color:#fff; mix-blend-mode:difference; transition:opacity .3s; }

/* モバイル：四隅は畳んで中央上に集約（ロゴ/ハンバーガーは共通ヘッダ .header-sp が担う） */
@media (max-width:900px){
  .fanfv__nav, .fanfv__icons, .fanfv__logo{ display:none; }
  .fanfv__lead{ position:static; max-width:none; text-align:center; padding-top:64px; }
  .fanfv__lead .fanfv__news a{ justify-content:center; }
  .fanfv__cta{ margin:0 auto; }
}
@media (max-width:640px){
  .fanfv__copy{ font-size:.85rem; bottom:16px; }
  .fanfv__sns{ font-size:1rem; bottom:16px; }
}

/* 扇ステージ＝扇の実寸ぶんの高さを確保し、扇の全体像（上弧＋下スカラップ）を見せて
   FV直下のセクションへ繋げる（ougiya式：バッサリ切らない） */
/* 扇の実寸＋下部バッファ（双子扇の出っ張りまで収め、下端の見切れを解消） */
.fanfv__stage{ position:relative; width:100%; height:calc(min(84.9vw,1273px) + clamp(64px,8vh,120px)); margin-top:42vh; }
@media (max-width:900px){ .fanfv__stage{ margin-top:6vh; } }
@media (max-width:640px){ .fanfv__stage{ height:calc(113.7vw + 8vw); margin-top:5vh; } }
.fanfv__fan, .fanfv__fan-bg{ position:absolute; top:0; left:50%; transform:translateX(-50%);
  width:112vw; max-width:1680px; aspect-ratio:1728/1310;
  -webkit-mask:url(../images/hero/fan-mask.png) top center/contain no-repeat;
  mask:url(../images/hero/fan-mask.png) top center/contain no-repeat; }
/* 背後の双子扇＝麻の葉柄の和紙をわずかにずらして覗かせる（ougiya fv-bg 相当・凝ったあしらい） */
.fanfv__fan-bg{ z-index:0; opacity:.92;
  background:#efe9e2 url(../images/hero/fan-asanoha.png) center/cover no-repeat;
  transform:translateX(-50%) translate(1.1%,2.6%) scale(1.03); }
.fanfv__fan{ z-index:1; overflow:hidden; opacity:0;
  transform:translateX(-50%) scale(1.03);
  transition:opacity 1.1s ease .3s, transform 1.5s cubic-bezier(.2,.7,.2,1) .3s; }
body.loaded .fanfv__fan{ opacity:1; transform:translateX(-50%) scale(1); }
/* 扇の内側は不透明地を敷く。敷かないとクロスフェードの谷（前後の写真が両方とも
   opacity<1 になる瞬間）で背後の双子扇＝麻の葉柄が写真越しに透けて濁る
   （SPは width:150vw で柄が大きく出るため特に目立つ。2026-08-04 実測） */
.fanfv__fan .bg-swich{ position:absolute; inset:0; z-index:0; background:var(--logo,#1f100b); }
.fanfv__fan img.bg-swich-slide{ width:100%; height:100%; object-fit:cover; }
.fanfv__fan .bg-swich-slide::after{ background:rgba(20,12,8,.16); }
@media (max-width:640px){
  .fanfv__fan, .fanfv__fan-bg{ width:150vw; }
  .fanfv__news{ margin-top:1.5em; }
  .fanfv__news .tm{ display:none; }
  .fanfv__news .ttl{ font-size:1.15rem; }
}

/* スクロール（第1ビューポート内・扇の写真上・白） */
.fanfv__scroll{ position:absolute; left:50%; top:calc(100vh - 68px); transform:translateX(-50%); z-index:3;
  color:#fff; font-size:1.05rem; letter-spacing:.2em; text-shadow:0 1px 12px rgba(0,0,0,.45); }
.fanfv__scroll::after{ content:""; display:block; width:1px; height:52px; margin:12px auto 0;
  background:#fff; animation:scrollLine 2s infinite; }
@media (prefers-reduced-motion: reduce){
  .fanfv__en, .fanfv__logo img, .fanfv__tag, .fanfv__cta, .fanfv__fan{ opacity:1 !important; transform:none !important; }
}

/* ============================================================
   名物ショーケース＝クロスフェード・ピン留め（scrollytelling）
   main.js が .pinshow を制御（スクロール量で写真/縦書き解説をクロスフェード）
   ============================================================ */
.pinshow{ position:relative; background:#160f0a; }
.pinshow__stage{ position:sticky; top:0; height:100vh; overflow:hidden; background:#160f0a; }
.pinshow__imgs{ position:absolute; inset:0; }
.pinshow__img{ position:absolute; inset:0; opacity:0; will-change:opacity,transform; }
.pinshow__img img{ width:100%; height:100%; object-fit:cover; }
.pinshow__img::after{ content:""; position:absolute; inset:0;
  background:linear-gradient(90deg, rgba(15,9,6,.74) 0%, rgba(15,9,6,.30) 40%, rgba(15,9,6,.06) 72%); }
/* 見出し（固定・上中央） */
.pinshow__head{ position:absolute; top:5vh; left:50%; transform:translateX(-50%); z-index:5; text-align:center; color:#fff; }
.pinshow__head .en{ font-family:var(--serif); letter-spacing:.34em; font-size:1.05rem; color:var(--red-l,#e6a3a5); display:block; }
.pinshow__head h2{ font-family:var(--serif); font-size:clamp(1.8rem,2.4vw,2.4rem); letter-spacing:.1em; margin-top:.3em; font-weight:600; }
/* 縦書き解説（左・クロスフェード） */
.pinshow__caps{ position:absolute; top:0; left:0; height:100%; z-index:4; }
.pinshow__cap{ position:absolute; top:20vh; left:6vw; writing-mode:vertical-rl; color:#fff;
  opacity:0; transition:opacity .6s ease; height:66vh; }
/* 右端固定＋幅130pxで2行に折り返し、縦書き本文に重なっていた（PC/SP双方で実測）。
   左端起点＋nowrap で1行に収め、折り返しを構造的に無くす。DESIGN_RULES §3-7 */
.pinshow__cap .en{ writing-mode:horizontal-tb; font-family:var(--serif); letter-spacing:.24em;
  color:var(--red-l,#e6a3a5); font-size:1rem; position:absolute; top:-2.6em;
  left:0; right:auto; white-space:nowrap; }
.pinshow__cap h3{ font-family:var(--serif); font-size:clamp(2.1rem,2.8vw,2.7rem); letter-spacing:.14em;
  font-weight:600; }
.pinshow__cap p{ font-family:var(--serif); font-size:1.4rem; line-height:2.1; letter-spacing:.1em;
  margin-right:1.4em; color:rgba(255,255,255,.92); max-height:52vh; }
.pinshow__count{ position:absolute; bottom:7vh; right:6vw; z-index:4; color:#fff; font-family:var(--serif); letter-spacing:.1em; }
.pinshow__count b{ font-size:3rem; font-weight:600; }
.pinshow__count i{ font-style:normal; opacity:.7; font-size:1.4rem; margin-left:.3em; }
.pinshow__hint{ position:absolute; bottom:5vh; left:50%; transform:translateX(-50%); z-index:4;
  color:rgba(255,255,255,.85); font-size:1rem; letter-spacing:.24em; }
.pinshow__hint::after{ content:""; display:block; width:1px; height:40px; margin:8px auto 0;
  background:rgba(255,255,255,.7); animation:scrollLine 2s infinite; }
@media (max-width:640px){
  .pinshow__cap{ left:7vw; top:16vh; }
  .pinshow__cap h3{ font-size:1.9rem; }
  .pinshow__cap p{ font-size:1.25rem; }
}
@media (prefers-reduced-motion: reduce){
  .pinshow__img{ transition:opacity .4s ease; }
}

/* ============================================================
   ヘッダー刷新：スクロール追従の上部バーを廃止し、
   「右上ハンバーガー（常時・mix-blend）→ フルスクリーン・オーバーレイナビ」へ
   （ougiya式の最小チャンクロム。モバイル≤640は既存動作を維持）
   ============================================================ */
@media (min-width:641px){
  /* .header をオーバーレイ化（旧・上部バー挙動を打消し） */
  .header{ position:fixed; inset:0; width:100%; height:100vh; min-height:100vh; padding:0; z-index:1001;
    background:var(--bg); transform:translateX(100%); transition:transform .55s cubic-bezier(.7,0,.2,1);
    display:flex; align-items:center; justify-content:center; overflow-y:auto; }
  .p-home .header, .p-home .header.header--show{ transform:translateX(100%); } /* translateY追従を無効化 */
  body.header--open .header{ transform:translateX(0); }
  /* --- エディトリアル番号組みオーバーレイ --- */
  .header .inner{ position:relative; z-index:1; display:block; text-align:left; width:100%; max-width:min(1040px,86vw); }
  .nav-ov__brand{ position:fixed; z-index:2; top:26px; left:clamp(20px,5.2vw,75px); margin:0; }
  .nav-ov__brand img{ width:76px; opacity:.9; }
  .nav-ov__label{ font-family:var(--serif); letter-spacing:.42em; font-size:1.05rem; color:var(--accent);
    padding-bottom:.7em; margin:0 0 1.5em; border-bottom:1px solid var(--line); }
  .nav-ov__grid{ display:grid; grid-template-columns:1fr auto; gap:clamp(40px,7vw,110px); align-items:stretch; }
  .header-menu{ display:block; }
  .nav-ov__item{ border:0; }
  .header-menu__link{ display:grid; grid-template-columns:auto 1fr; column-gap:1.1em;
    align-items:baseline; padding:.5em 0; border:0; outline:none; }
  .nav-ov__no{ font-family:var(--serif); font-size:1rem; letter-spacing:.1em; color:var(--accent); }
  .nav-ov__ja{ font-family:var(--serif); font-size:clamp(2rem,2.7vw,2.8rem); letter-spacing:.14em;
    line-height:1.08; color:var(--ink); transition:color .3s ease, transform .45s cubic-bezier(.7,0,.2,1); }
  .nav-ov__en{ grid-column:2; font-family:var(--serif); font-size:.82rem; letter-spacing:.36em;
    text-transform:uppercase; color:var(--accent); margin-top:.4em; }
  .header-menu__link:hover .nav-ov__ja,
  .header-menu__link:focus-visible .nav-ov__ja,
  .header-menu__link.is-current .nav-ov__ja{ color:var(--red); }
  .header-menu__link:hover .nav-ov__ja,
  .header-menu__link:focus-visible .nav-ov__ja{ transform:translateX(.35em); }
  /* 情報カラム */
  .nav-ov__info{ display:flex; flex-direction:column; justify-content:center;
    border-left:1px solid var(--line); padding-left:clamp(30px,3vw,56px);
    font-family:var(--serif); color:var(--ink); }
  .nav-ov__info > * + *{ margin-top:1.05em; }
  .nav-ov__reserve{ display:inline-block; align-self:flex-start; font-family:var(--serif);
    font-size:1.15rem; letter-spacing:.14em; color:#fff; background:var(--red);
    padding:.7em 1.6em; transition:background .3s; }
  .nav-ov__reserve:hover{ background:var(--red-d); color:#fff; }
  .nav-ov__tel{ display:inline-block; font-size:1.5rem; letter-spacing:.08em; color:var(--ink); transition:color .3s; }
  .nav-ov__tel:hover{ color:var(--red); }
  .nav-ov__hours{ font-size:1.1rem; letter-spacing:.06em; color:var(--ink); margin-top:.4em; }
  .nav-ov__hours span{ color:var(--accent); font-size:.9em; }
  .nav-ov__access{ font-size:1.05rem; letter-spacing:.06em; color:var(--accent); }
  .nav-ov__ig{ display:inline-block; font-size:1.1rem; letter-spacing:.14em; color:var(--ink);
    border-bottom:1px solid var(--line); padding-bottom:.15em; transition:color .3s,border-color .3s; }
  .nav-ov__ig:hover{ color:var(--red); border-color:var(--red); }
  .nav-ov__info .header-language{ position:static; margin-top:1.7em; font-size:1.35rem; }
  /* 隅に淡い麻の葉地紋 */
  .header::after{ content:""; position:absolute; z-index:0; right:-4%; bottom:-6%;
    width:min(46vh,420px); height:min(46vh,420px);
    background:url(../images/hero/fan-asanoha.png) no-repeat center/contain; opacity:.05; pointer-events:none; }

  /* 最小チャンクロム＝右上ハンバーガーのみ（常時・背景に応じて反転） */
  .header-sp{ display:flex !important; position:fixed; top:0; left:0; width:100%; height:auto; z-index:1003;
    justify-content:flex-end; align-items:center; padding:30px clamp(20px,5.2083%,75px); background:none;
    pointer-events:none; opacity:1; visibility:visible; transition:opacity .4s ease; }
  .header-sp > *{ pointer-events:auto; }
  .header-sp__logo{ display:none; }
  .header-sp__btn{ width:32px; height:16px; position:relative; cursor:pointer; }
  .header-sp__btn span{ position:absolute; left:0; width:100%; height:1.6px; background:#fff;
    mix-blend-mode:difference; transition:transform .35s, opacity .2s, background .2s; }
  .header-sp__btn span:nth-child(1){ top:0; }
  .header-sp__btn span:nth-child(2){ top:50%; transform:translateY(-50%); }
  .header-sp__btn span:nth-child(3){ bottom:0; }
  /* FV表示中はFV自身のナビがあるので隠す（home のみ・FV通過で出す） */
  body.p-home .header-sp{ opacity:0; visibility:hidden; }
  body.p-home.is-past-hero .header-sp, body.header--open .header-sp{ opacity:1; visibility:visible; }
  /* オープン時＝×印（濃色・blend解除） */
  body.header--open .header-sp__btn span{ background:var(--ink); mix-blend-mode:normal; }
  body.header--open .header-sp__btn span:nth-child(1){ top:50%; transform:translateY(-50%) rotate(38deg); }
  body.header--open .header-sp__btn span:nth-child(2){ opacity:0; }
  body.header--open .header-sp__btn span:nth-child(3){ bottom:auto; top:50%; transform:translateY(-50%) rotate(-38deg); }
}

/* ============================================================
   esec 右画像＝複数写真を重ねたデザインフレーム（撮ってつけた感の解消）
   ============================================================ */
.esec__frame{ position:relative; }
.esec__frame-main{ display:block; width:100%; position:relative; z-index:2;
  box-shadow:0 34px 74px -36px rgba(31,16,11,.55); }
/* 背後にずらしたアクセント枠線（茶金） */
.esec__frame-line{ position:absolute; top:-22px; right:-22px; width:64%; height:72%; z-index:1;
  border:1px solid var(--accent); }
/* 主写真の左下に重なる小さめのサブ写真（白フチ・パララックスで動く） */
.esec__frame-sub{ position:absolute; z-index:3; width:42%; max-width:240px; left:-6%; bottom:-9%;
  border:6px solid #fff; box-shadow:0 26px 54px -30px rgba(31,16,11,.6); }
/* 縦書きタグ（差し色・主写真の左肩に少し重なる） */
.esec__frame-tag{ position:absolute; z-index:4; top:8%; left:-4%; writing-mode:vertical-rl;
  background:var(--red); color:#fff; font-family:var(--serif); letter-spacing:.22em;
  font-size:1.3rem; padding:16px 8px; box-shadow:0 12px 30px -16px rgba(192,39,44,.6); }
@media (max-width:768px){
  .esec__frame{ margin-bottom:16vw; }
  .esec__frame-line{ top:-12px; right:-12px; }
  .esec__frame-sub{ width:40%; max-width:180px; left:-3%; bottom:-8%; border-width:4px; }
  .esec__frame-tag{ font-size:1.1rem; padding:12px 6px; left:-2%; }
}

/* a11y: reduce-motion 時は SCROLL ヒントの点滅も停止（通常表示は不変） */
@media (prefers-reduced-motion: reduce){
  .fanfv__scroll::after, .pinshow__hint::after, .pinh__progress span{ animation:none !important; }
}

/* =====================================================================
   F0 失敗安全網（2026-08-04）
   ---------------------------------------------------------------------
   事故: main.js の読み込みが失敗すると body に .loaded が付かず、
        ローダー固着／FV写真・キャッチ・CTA不可視／本文写真欠け／統計"0"表示 で
        サイトが全面的に死ぬ。JSは有効なので <noscript> の保険は効かない
        （＝Stem配信での実失敗モード。2026-08-04 に main.js を404にして実測・再現）。
   根拠: DESIGN_RULES §10「JS失敗でも最終形は見える」「ローダーは必ず消える
        （JSの load 非表示＋CSSの失敗安全網）」／UI_ACCIDENT_CLASSES A3。
   方式: body:not(.loaded) に限定して、3秒後に最終状態へ確定させる。
        main.js が動けば .loaded が付いて本セレクタは外れる＝通常時の演出は不変。
        CSSアニメは inline style より優先されるため hero.bg の inline opacity にも効く。
   ===================================================================== */
@keyframes fsFade      { to { opacity:1; } }
@keyframes fsFadeUp    { to { opacity:1; transform:translateY(0); } }
@keyframes fsFadeX     { to { opacity:1; transform:translateX(0); } }
@keyframes fsFanIn     { to { opacity:1; transform:translateX(-50%) scale(1); } }
@keyframes fsClipOpen  { to { opacity:1; clip-path:inset(0 0 0 0); } }
@keyframes fsLoaderOut { to { opacity:0; visibility:hidden; } }

/* ローダー：JSが死んでも必ず退場する */
body:not(.loaded) #loader_bg{ animation:fsLoaderOut .8s ease 3s forwards; pointer-events:none; }

/* FV（扇）：ロゴ・キャッチ/CTA・扇本体・背景写真1枚目 */
body:not(.loaded) .fanfv__logo img{ animation:fsFadeUp .8s ease 3s forwards; }
body:not(.loaded) .fanfv__lead   { animation:fsFadeUp .8s ease 3s forwards; }
body:not(.loaded) .fanfv__fan    { animation:fsFanIn  .8s ease 3s forwards; }
body:not(.loaded) .bg-swich .bg-swich-slide:first-child{ animation:fsFade .8s ease 3s forwards; }

/* 下層ページFV */
body:not(.loaded) .mv__logo,
body:not(.loaded) .mv__cta           { animation:fsFadeX  .8s ease 3s forwards; }
body:not(.loaded) .mv__copy          { animation:fsClipOpen .8s ease 3s forwards; }
body:not(.loaded) .mv__en,
body:not(.loaded) .mv__tag,
body:not(.loaded) .mv__strip,
body:not(.loaded) .mv__wordmark .mv__cta{ animation:fsFadeUp .8s ease 3s forwards; }
body:not(.loaded) .mv--hero .mv__wordmark{ animation:fsFade .8s ease 3s forwards; }

/* 本文：名物ショーケース（1枚目の写真と解説を確定表示） */
body:not(.loaded) .pinshow__imgs .pinshow__img:first-child{ animation:fsFade .8s ease 3s forwards; }
body:not(.loaded) .pinshow__caps .pinshow__cap:first-child{ animation:fsFade .8s ease 3s forwards; }

/* 縦書きセクション見出し（IntersectionObserver 依存） */
body:not(.loaded) .vertical-ttl__item{ animation:fsFadeUp .8s ease 3s forwards; }

/* reduce-motion 時は待たずに即・最終状態（アニメを使わない） */
@media (prefers-reduced-motion: reduce){
  body:not(.loaded) #loader_bg{ opacity:0; visibility:hidden; animation:none; }
  body:not(.loaded) .fanfv__logo img,
  body:not(.loaded) .fanfv__lead,
  body:not(.loaded) .mv__logo, body:not(.loaded) .mv__cta,
  body:not(.loaded) .mv__en, body:not(.loaded) .mv__tag, body:not(.loaded) .mv__strip,
  body:not(.loaded) .mv--hero .mv__wordmark,
  body:not(.loaded) .vertical-ttl__item{ opacity:1; transform:none; animation:none; }
  body:not(.loaded) .mv__copy{ opacity:1; clip-path:inset(0 0 0 0); animation:none; }
  body:not(.loaded) .fanfv__fan{ opacity:1; transform:translateX(-50%) scale(1); animation:none; }
  body:not(.loaded) .bg-swich .bg-swich-slide:first-child,
  body:not(.loaded) .pinshow__imgs .pinshow__img:first-child,
  body:not(.loaded) .pinshow__caps .pinshow__cap:first-child{ opacity:1; animation:none; }
}

/* ベンチは本文を左寄せで組む（中央寄せの多用は DESIGN_RULES §3-2 でも禁止）。
   .center は下層ページのボタン中央寄せ等でも使うため、セクション本文だけ左に戻す。 */
@media (min-width:641px){
  .section > .inner > .center,
  .section > .inner > .lead.center,
  .section > .inner > p.center{ text-align:left; }
  /* ボタンは左寄せに（inline-block の margin:0 auto をHTML側で当てているため打ち消す） */
  .section > .inner > .center > .btn-df{ margin-left:0 !important; margin-right:0 !important; }
}
/* コース・シーン等のグリッドは行間を締めてベンチの粗密に寄せる */
.scene-grid{ gap:34px 6%; }
.event-grid{ gap:34px 6%; }
.course-teaser{ gap:28px 6%; }

/* 極小幅(≤360px)では縦組み見出しを横組みに戻して1カラムに積む。
   縦組みのまま2カラムにすると本文カラムが約51px削られ、店舗情報の dl が
   押し出されて横スクロールが出る（320pxで実測 scrollWidth 351）。 */
@media (max-width:360px){
  .section > .inner:has(> .section-head-center){ display:block; }
  .section-head-center{ margin-bottom:1.5em; }
  .section-head-center .ja{ writing-mode:horizontal-tb; font-size:5.6vw; letter-spacing:.1em; }
  .section-head-center .en{ font-size:11vw; }
}

/* 区切りの菱形マーク＝ベンチに無い装飾のため非表示（罫線だけ残す）。
   要素そのものは残すので、HTML・EN生成・Stem取込には影響しない。 */
.divider__mark{ display:none !important; }

/* =====================================================================
   EN（/en/）の縦組み — ベンチ実装に合わせる（2026-08-04 実測）
   fukucha-fukujuen.com/en/ は縦組み見出しを横組みに落とさず、
   writing-mode:vertical-rl のまま text-orientation:mixed（英字を90°回転）で出す。
   大見出し .section-detail__head は横組み28pxのまま。
   ※ 当初プランの「ENは横組みにフォールバック」はベンチと異なるため撤回した。
   ===================================================================== */
.lang-EN .section-head-center .ja{ text-orientation:mixed; letter-spacing:.1em; }
@media (max-width:360px){
  .lang-EN .section-head-center .ja{ letter-spacing:.06em; }
}

/* GBPクチコミ評価（Stemが placeId から実値を流し込む。making側は装飾だけ書く） */
.reviews__rating{ font-family:var(--gothic); font-size:1.35rem; letter-spacing:.08em;
  color:var(--accent); margin:0 0 1.6em; }
.reviews__rating b{ font-family:var(--serif); font-size:1.9rem; font-weight:600; letter-spacing:.04em; }

/* お問い合わせページの補足（フォーム下の案内） */
.contact-note{ margin-top:3.4em; max-width:72ch; }
.contact-note h2{ font-family:var(--serif); font-size:2rem; letter-spacing:.08em; color:var(--logo);
  padding-bottom:.5em; border-bottom:1px solid var(--line); margin-bottom:.9em; }
.contact-note h3{ font-family:var(--serif); font-size:1.6rem; letter-spacing:.06em; color:var(--logo);
  margin:1.6em 0 .4em; }
.contact-note p{ font-size:1.5rem; line-height:1.95; }
@media (max-width:640px){ .contact-note{ margin-top:2.4em; } .contact-note h2{ font-size:5vw; } }

/* 余白の最終調整（2026-08-05 実測ベース）
   隣り合うセクションは上下の padding が足し算になるため、60+60=120px が節間の実効値。
   ベンチの .section-container{margin-bottom:6.9767%}（1280px時≒89px）に寄せた。 */
.esec{ padding-top:100px; padding-bottom:100px; }
@media (max-width:640px){ .esec{ padding-top:14vw; padding-bottom:14vw; } }
.cta{ padding-top:84px; padding-bottom:84px; }
@media (max-width:640px){ .cta{ padding-top:16vw; padding-bottom:16vw; } }
.divider{ padding:10px 0; }

/* =====================================================================
   鶏丸のこだわり／石山エリア — 写真を入れて「文章だけ」を解消（2026-08-05）
   ベンチの .section-img-container（flex・space-between・要素ごとに送り）と
   .section-img--right/--left（左右で高さをずらす）の考え方を持ち込む。
   ===================================================================== */

/* --- 鶏丸のこだわり：写真＋見出し＋本文を3つ、上下に段差をつけて並べる --- */
.commit-grid{ display:grid; gap:40px 5%; margin-top:1.4em; }
@media (min-width:641px){
  .commit-grid{ grid-template-columns:repeat(3,1fr); }
  /* 2番目だけ落として一直線を崩す＝ベンチの nth-child 送りの考え方 */
  .commit-grid > .commit:nth-child(2){ margin-top:52px; }
}
.commit__img{ overflow:hidden; margin-bottom:1.1em; }
.commit__img img{ width:100%; aspect-ratio:4/3; object-fit:cover; display:block;
  transition:transform 1.2s cubic-bezier(.2,.7,.2,1); }
.commit:hover .commit__img img{ transform:scale(1.05); }
.commit h3{ font-family:var(--serif); font-size:1.8rem; color:var(--logo);
  letter-spacing:.06em; margin-bottom:.5em; }
.commit p{ font-size:1.5rem; line-height:1.95; }
@media (max-width:640px){
  .commit__img img{ aspect-ratio:16/10; }
  .commit h3{ font-size:4.6vw; }
}

/* --- 石山エリア：長文を左、写真を右に。行長を制限して「壁」をやめる --- */
.hikone-grid{ display:grid; gap:44px 6%; align-items:start; }
@media (min-width:641px){
  .hikone-grid{ grid-template-columns:minmax(0,1fr) 34%; }
}
.hikone-body > p{ max-width:64ch; font-size:1.55rem; }          /* 1行が長すぎて読みにくかった */
.hikone-body > .lead{ margin-bottom:1.1em; }
.hikone-media{ display:grid; gap:18px; }
.hikone-media img{ width:100%; aspect-ratio:4/3; object-fit:cover; display:block; }
@media (min-width:641px){
  /* 2枚を左右にずらして重心を作る（ベンチの写真オフセット相当） */
  .hikone-media img:nth-child(1){ margin-right:-5.8%; }
  .hikone-media img:nth-child(2){ margin-left:14%; }
}
.hikone-actions{ display:flex; flex-wrap:wrap; gap:12px; margin-top:2em; }
.hikone-actions .btn-df{ min-width:auto; max-width:none; padding:16px 34px; }

/* --- キーワード：均一なピルをやめ、editorial な一覧に（§3-2 pill の均一多用を回避） --- */
.kw-chips{ display:block; margin:1.8em 0 0; text-align:left; }
.kw-chips span{ display:inline; padding:0; background:none; border-radius:0;
  font-family:var(--gothic); font-size:1.15rem; letter-spacing:.08em;
  color:var(--accent); white-space:nowrap; }
.kw-chips span::after{ content:"／"; margin:0 .45em; color:var(--line); }
.kw-chips span:last-child::after{ content:""; margin:0; }

/* 右下の大型透かしは装飾なので、本文・写真より必ず背面に置く
   （absolute+z-index:0 は通常フローの画像より前面に描かれ、写真に文字が乗っていた） */
.section > .inner > *:not(.section-head-center){ position:relative; z-index:1; }

/* =====================================================================
   同型反復の解消（2026-08-05）
   events / reasons / scenes / course-teaser の4節が
   「縦組み見出し＋罫線の均一グリッド＋右下透かし」で完全に同じ組みになり、
   DESIGN_RULES §3-2「全 section が同じ余白・同じ構造の繰り返し」に該当していた。
   ベンチが写真の左右交互で表情を変えているのに倣い、4節それぞれ別構図にする。
   ===================================================================== */

/* --- ① events：全幅の写真帯に白文字（他の3節と地色から違う） --- */
.section--band{ background-size:cover; background-position:50% 60%; background-repeat:no-repeat;
  position:relative; color:#fff; }
.section--band::before{ content:""; position:absolute; inset:0; background:rgba(20,12,8,.66); }
.section--band > .inner{ position:relative; z-index:1; }
.section--band .section-head-center .ja{ color:#fff; }
.section--band .section-head-center .en{ color:rgba(255,255,255,.14); }
.section--band .event-card{ border-top-color:rgba(255,255,255,.34); }
.section--band .event-card .cat{ color:rgba(255,255,255,.66); }
.section--band .event-card h3{ color:#fff; }
.section--band .event-card p{ color:rgba(255,255,255,.86); }

/* --- ② reasons：グリッドをやめて全幅の横一列リストに（表組みの表情） --- */
@media (min-width:641px){
  /* ※ .reason は #craft（3列の .scene-grid）でも使われているため、
     この横一列レイアウトは必ず .reasons-grid 配下に限定する。
     限定しないと #craft の本文が幅90px程度に潰れて数文字ずつ折り返す（2026-08-05 実測） */
  .reasons-grid{ grid-template-columns:1fr; gap:0; }
  .reasons-grid .reason{ display:grid; grid-template-columns:auto 15em minmax(0,1fr); gap:0 3%;
    align-items:baseline; border-top:1px solid var(--line); padding:26px 0; }
  .reasons-grid .reason:last-child{ border-bottom:1px solid var(--line); }
  .reasons-grid .reason > div{ display:contents; }   /* h3 と p を親グリッドの列に載せる */
  .reasons-grid .reason__no{ font-family:var(--serif); font-size:2.6rem; line-height:1;
    color:var(--accent); letter-spacing:.04em; }
  .reasons-grid .reason h3{ font-size:1.75rem; margin:0; }
  .reasons-grid .reason p{ font-size:1.35rem; margin:0; }
}

/* --- ③ scenes：左に写真を据えた非対称。カードは2列に --- */
@media (min-width:641px){
  .scene-grid--aside{ grid-template-columns:32% repeat(2,minmax(0,1fr)); gap:34px 5%; }
  .scene-grid--aside > .scenes-media{ grid-row:1 / span 3; align-self:stretch; }
  .scene-grid--aside > .scenes-media img{ width:100%; height:100%; object-fit:cover; display:block; }
}
@media (max-width:640px){
  .scenes-media img{ width:100%; aspect-ratio:16/10; object-fit:cover; display:block; margin-bottom:.6em; }
}

/* --- ④ course-teaser：罫線を外し、価格を主役にした料金の並び --- */
.course-teaser{ display:grid; gap:0; margin-top:1.6em;
  border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
@media (min-width:641px){ .course-teaser{ grid-template-columns:repeat(3,1fr); } }
.course-teaser__item{ border-top:0 !important; padding:26px 0 !important; text-align:left; }
@media (min-width:641px){
  .course-teaser__item + .course-teaser__item{ border-left:1px solid var(--line); padding-left:5% !important; }
}
@media (max-width:640px){
  .course-teaser__item + .course-teaser__item{ border-top:1px solid var(--line) !important; }
}
.course-teaser__item .price{ font-family:var(--serif); font-size:3.2rem; line-height:1;
  color:var(--logo); display:block; margin-bottom:.35em; letter-spacing:.02em; }
.course-teaser__item .n{ font-size:1.25rem; color:var(--accent); }
@media (max-width:640px){ .course-teaser__item .price{ font-size:7.4vw; } }

/* =====================================================================
   ページフッター — 中央寄せの簡素な型（2026-08-05 見直し）
   姉妹店ウオ丸の簡素版フッター（ロゴ→横並びナビ→©）に合わせる。
   3カラム grid（©／ロゴ／縦積みナビ）は情報が多く重かったため撤回した。
   ※ 色は鶏丸のまま（寄せない）。
   privacy/terms は下層8ページではフッターが唯一の導線なので、
   最小の1行として残す（孤立させない）。NAP は data-stem-nap を保持。
   ===================================================================== */
body > footer{ border-top:1px solid var(--line); padding:64px 0 108px; background:var(--bg); color:var(--ink); text-align:center; }
body > footer .inner{ width:100%; max-width:1720px; margin:auto; padding:0 5.2083%; }
footer .logo{ display:inline-block; margin:0 0 26px; }
footer .logo img{ width:auto; height:74px; display:block; }
footer .fnav{ display:flex; flex-wrap:wrap; justify-content:center; gap:10px 26px;
  font-family:var(--gothic); font-size:1.25rem; letter-spacing:.08em; }
footer .fnav a{ color:var(--ink); }
footer .fnav a:hover{ color:var(--accent); opacity:1; }
footer .fnap{ margin-top:22px; font-size:1.15rem; color:var(--accent); letter-spacing:.06em; }
footer .copy{ margin-top:14px; font-family:Verdana,"Droid Sans",sans-serif;
  font-size:1.05rem; color:var(--accent); letter-spacing:.14em; }
footer .fsub{ margin-top:16px; font-size:1.1rem; color:var(--accent); letter-spacing:.04em; }
footer .fsub a, footer .fsub span{ margin:0 9px; color:var(--accent); }
footer .fsub a:hover{ color:var(--ink); opacity:1; }
@media (max-width:640px){
  body > footer{ padding:14vw 0 96px; }
  footer .logo img{ height:16vw; }
  footer .fnav{ gap:9px 18px; }
  footer .fsub a, footer .fsub span{ display:inline-block; margin:2px 7px; }
}

/* FAQ：右に大きく余白が空いていたのでカラム幅いっぱいに使う */
.faq-list{ max-width:none; }

/* =====================================================================
   .section--stack — 姉妹店ウオ丸の節レイアウトに寄せる（2026-08-05）
   ウオ丸の型:「短い罫線 → 大きな英字見出し → 和文サブ」を横組みで上に置き、
   本文はその下に全幅。店舗情報は罫線なしの定義リスト＋右に写真、地図は下に全幅。
   ※ トンマナ（生成り地・明朝・#a69381・朱赤CTA）は鶏丸のまま。骨格だけ合わせる。
   ===================================================================== */
/* 縦組み見出しの2カラムをやめ、1カラムに積む（SP含む全幅で適用。
   SPだけ2カラムのままだと店舗情報の dl が縮められず横スクロールが出る） */
.section--stack > .inner:has(> .section-head-center){ display:block; }
.section--stack .section-head-center{ margin-bottom:2.4em; }
.section--stack .section-head-center::before{
  content:""; display:block; width:34px; height:1px; background:var(--accent); margin-bottom:1.5em; }
/* 英字を「右下の透かし」から「主役の見出し」へ戻す */
.section--stack .section-head-center .en{
  position:static; display:block; font-size:clamp(2.4rem,3.4vw,3.4rem); line-height:1;
  letter-spacing:.02em; color:var(--logo); max-width:none; overflow:visible;
  margin:0 0 .34em; opacity:1; }
/* 和文はサブラベル（横組み） */
.section--stack .section-head-center .ja{
  writing-mode:horizontal-tb; font-size:1.55rem; letter-spacing:.22em;
  color:var(--accent); font-weight:500; }
@media (max-width:640px){
  .section--stack .section-head-center .en{ font-size:8.4vw; }
  .section--stack .section-head-center .ja{ font-size:3.6vw; letter-spacing:.18em; }
}

/* 店舗情報：罫線を外し、ラベル小・値主役の行に（ウオ丸の Name/Address… 相当） */
.section--stack .spec dl{ grid-template-columns:7em minmax(0,1fr); border-top:0; row-gap:.2em; }
.section--stack .spec dt, .section--stack .spec dd{ border-bottom:0; padding:9px 0; }
.section--stack .spec dt{ font-size:1.2rem; letter-spacing:.1em; }
.section--stack .spec dd{ font-size:1.45rem; }
/* 地図は右カラムから出して全幅に */
.access-map{ margin-top:44px; }
.access-map iframe{ width:100%; height:380px; border:0; display:block; }
@media (max-width:640px){ .access-map{ margin-top:8vw; } .access-map iframe{ height:56vw; } }
.section--stack .access-media img{ width:100%; height:auto; display:block; }

/* FAQ：見出しが上に来たぶん、本文をカラム幅いっぱいに */
.section--stack .faq-list{ max-width:none; }

/* コース紹介（石山エリア節に畳み込んだ簡易版。course-teaser 節の代替） */
.course-inline{ margin-top:2em; padding-top:1.4em; border-top:1px solid var(--line); }
.course-inline__lead{ font-size:1.5rem; margin-bottom:1em; max-width:64ch; }
.course-inline__list{ list-style:none; display:grid; gap:14px 5%; margin:0; padding:0; }
@media (min-width:641px){ .course-inline__list{ grid-template-columns:repeat(3,minmax(0,1fr)); } }
.course-inline__list li{ display:flex; flex-direction:column; gap:.25em; }
.course-inline__list b{ font-family:var(--serif); font-size:2.1rem; font-weight:600;
  color:var(--logo); line-height:1; letter-spacing:.02em; }
.course-inline__list span{ font-size:1.2rem; color:var(--accent); }
@media (max-width:640px){ .course-inline__list b{ font-size:5.6vw; } }

/* =====================================================================
   Instagram — 画像が1辺423pxと大きすぎたので2分割に（2026-08-05）
   左に小さめのサムネ3×2、右にリードとリンク（姉妹店ウオ丸の Follow 節と同じ構え）。
   ===================================================================== */
.ig-split{ display:grid; gap:32px 6%; align-items:start; margin-top:1.4em; }
@media (min-width:641px){ .ig-split{ grid-template-columns:minmax(0,58%) minmax(0,1fr); } }
.ig-split .ig-grid{ margin:0; gap:8px; }
.ig-split .ig-grid a{ aspect-ratio:1/1; }
.ig-copy p{ font-size:1.5rem; line-height:2; max-width:38ch; }
.ig-action{ margin-top:1.8em; }
.ig-action .btn-df{ min-width:auto; max-width:none; padding:16px 34px; display:inline-block; }
@media (max-width:640px){ .ig-split .ig-grid{ gap:6px; } .ig-copy p{ max-width:none; } }

/* #craft の壱・弐・参（.scene-grid 内の .reason）— 番号は行頭に小さく、本文は素直に流す */
.scene-grid > .reason{ display:block; border-top:1px solid var(--line); padding-top:18px; }
.scene-grid > .reason .reason__no{ font-family:var(--serif); font-size:1.6rem; color:var(--accent);
  letter-spacing:.1em; display:block; margin-bottom:.5em; }
.scene-grid > .reason h3{ font-family:var(--serif); font-size:1.8rem; color:var(--logo);
  letter-spacing:.06em; margin-bottom:.5em; }
.scene-grid > .reason p{ font-size:1.5rem; line-height:1.95; }

/* #craft は和文見出しが「壱、炭。」と番号を含むため、番号ラベルが二重になる。
   英文見出し（Charcoal — …）は番号を持たないので EN では残す。 */
body:not(.lang-EN) .scene-grid > .reason .reason__no{ display:none; }

/* =====================================================================
   帯セクションの余白（2026-08-05）
   地色のままの節は 60px で締めているが、背景（地色違い・写真）を持つ節は
   同じ余白だと帯が薄い横長になり違和感が出る。
   実測: #craft 縦横比4.9 / #events 3.8（他の節は1.7〜2.4）。
   → 背景を持つ節だけ余白を厚くし、中身の行間も広げて帯に厚みを持たせる。
   ===================================================================== */
.section--wash{ background:var(--wash); }
.section--wash, .section--band{ padding-top:128px; padding-bottom:128px; }
@media (max-width:640px){
  .section--wash, .section--band{ padding-top:18vw; padding-bottom:18vw; }
}
/* 帯の中身にも air を足す（余白だけ広げると中央が空くため） */
.section--wash .scene-grid, .section--band .event-grid{ gap:46px 6%; margin-top:2em; }
.section--wash .scene-grid > .reason{ padding-top:24px; }
.section--wash .scene-grid > .reason h3{ font-size:2rem; margin-bottom:.7em; }
.section--wash .scene-grid > .reason p{ line-height:2.15; }
.section--band .event-card{ padding-top:24px; }
.section--band .event-card h3{ font-size:2rem; margin:.5em 0 .6em; }
.section--band .event-card p{ line-height:2.15; }

/* ※ クラスの使い回し注意（2026-08-05 の #craft 事故の再発防止）
   .scene-grid は #craft(.reason を子に持つ) と course.html の #scenes(.scene-card) の
   両方で使われている。片方だけを変えるときは必ず親コンテナでスコープすること。 */

/* お品書きのカテゴリ間に差し込む写真の帯（2枚組） */
.menu-shots{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin:0 0 2.6em; }
.menu-shots figure{ margin:0; overflow:hidden; }
.menu-shots img{ width:100%; aspect-ratio:4/3; object-fit:cover; display:block;
  transition:transform 1.2s cubic-bezier(.2,.7,.2,1); }
.menu-shots figure:hover img{ transform:scale(1.04); }
@media (max-width:640px){ .menu-shots{ gap:8px; margin-bottom:2em; } }

/* お問い合わせ＝電話一本化（フォーム廃止。2026-08-05） */
.tel-block{ margin-top:2.4em; padding:38px 0 0; border-top:1px solid var(--line); }
.tel-block__label{ font-family:var(--gothic); font-size:1.2rem; letter-spacing:.16em; color:var(--accent); }
.tel-block__num{ margin:.25em 0 .35em; }
.tel-block__num a{ font-family:var(--serif); font-size:clamp(3rem,5vw,4.4rem); line-height:1.1;
  letter-spacing:.02em; color:var(--logo); }
.tel-block__num a:hover{ color:var(--red); opacity:1; }
.tel-block__hours{ font-size:1.3rem; color:var(--ink); }
.tel-block__note{ margin-top:.4em; font-size:1.25rem; color:var(--accent); }
.tel-block__actions{ display:flex; flex-wrap:wrap; gap:12px; margin-top:2em; }
.tel-block__actions .btn-df{ min-width:auto; max-width:none; padding:16px 34px; }
@media (max-width:640px){ .tel-block{ padding-top:28px; } }

/* 補足ブロックの関連リンク。丸括弧＋常時下線＋アクセント色の3連は装飾過多だったので、
   細い区切りだけの素のテキストリンクにする（本文<p>はdata-enで上書きされるため兄弟要素に置く） */
.contact-note__links{ display:flex; flex-wrap:wrap; margin:1.1em 0 0;
  font-family:var(--gothic); font-size:1.2rem; letter-spacing:.06em; }
.contact-note__links a{ color:var(--ink); padding:0 16px; position:relative; }
.contact-note__links a:first-child{ padding-left:0; }
.contact-note__links a + a::before{ content:""; position:absolute; left:0; top:.3em; bottom:.3em;
  width:1px; background:var(--line); }
.contact-note__links a:hover{ color:var(--accent); opacity:1; }
@media (max-width:640px){
  .contact-note__links a{ padding:0 12px; }
}

/* =====================================================================
   ドロワー（ハンバーガーメニュー）— 2026-08-05 ミニマル版に作り直し
   旧: 全画面に MENU ラベル・01〜06の番号・罫線・朱赤の予約ボタン・電話・
       営業時間・アクセス・SNS・言語 の9種類を詰め込み、左上に寄って間延び。
   新: 姉妹店ウオ丸に倣い「右からスライドインするパネル＋英字(大)＋和文(小)」だけ。
       トンマナ（生成り地・明朝・#a69381）は鶏丸のまま。
   ※ CTA/電話/営業時間/アクセスは固定CTAバーと店舗情報に常時あるため重複。
     DESIGN_RULES §3-8「固定CTAを置くならヘッダーCTAは無し」にも合致する。
   ===================================================================== */
.header{ background:var(--bg); }
@media (min-width:641px){ .header{ padding:0; } .header .inner{ display:block; } }

.header, .header .nav-ov{ box-sizing:border-box; }
.header{
  position:fixed; inset:0 0 0 auto; width:min(430px,88vw); height:100%; z-index:1000;
  transform:translateX(100%); transition:transform .55s cubic-bezier(.22,.8,.24,1);
  overflow-y:auto; overscroll-behavior:contain;
  box-shadow:-20px 0 60px -30px rgba(31,16,11,.35);
}
body.header--open .header{ transform:translateX(0); }
.p-home .header, .p-home .header.header--show{ transform:translateX(100%); }
body.header--open .p-home .header, .p-home body.header--open .header{ transform:translateX(0); }
body.p-home.header--open .header{ transform:translateX(0); }

/* 背面の覆い。.header は overflow:auto なので中の fixed が効かない。body 側に置く */
body::after{ content:""; position:fixed; inset:0; z-index:999;
  background:rgba(31,16,11,.3); opacity:0; visibility:hidden; pointer-events:none;
  transition:opacity .5s ease, visibility .5s; }
body.header--open::after{ opacity:1; visibility:visible; }

/* .inner の max-width:89.33vw / margin:auto がパネル内でも効き、内容がはみ出していた */
.nav-ov{ display:flex; flex-direction:column; min-height:100%;
  width:100%; max-width:none; margin:0; padding:104px 9% 40px; }
.nav-ov__list{ display:block; width:auto; }
.nav-ov__item{ font-size:inherit; letter-spacing:normal; }
.nav-ov__item + .nav-ov__item{ margin-top:1.55em; }
.nav-ov .header-menu__link{ display:block; padding:0; border:0; }
.nav-ov__en{ display:inline-block; font-family:var(--serif); font-size:2.1rem; font-weight:500;
  line-height:1.1; letter-spacing:.04em; color:var(--logo); }
.nav-ov__ja{ display:block; margin-top:.45em; font-family:var(--gothic);
  font-size:1.15rem; letter-spacing:.1em; color:var(--accent); }
.nav-ov .header-menu__link:hover .nav-ov__en{ color:var(--red); }
.nav-ov .header-menu__link:hover .nav-ov__ja{ color:var(--logo); }
.nav-ov .header-menu__link.is-current .nav-ov__en{ color:var(--accent); }

/* 最下部：細い罫線＋Instagram／言語（ウオ丸の下段と同じ構え） */
.nav-ov__foot{ margin-top:auto; padding-top:26px; border-top:1px solid var(--line);
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  font-family:var(--gothic); font-size:1.15rem; letter-spacing:.1em; }
.nav-ov__foot .nav-ov__ig{ color:var(--accent); border:0; padding:0; }
.nav-ov__foot .nav-ov__ig:hover{ color:var(--logo); opacity:1; }
.nav-ov__foot .header-language{ position:static; display:flex; gap:12px; margin:0; font-size:1.15rem; }
.nav-ov__foot .header-language li{ color:var(--accent); }
.nav-ov__foot .header-language .is-current{ color:var(--logo); }
.nav-ov__foot .header-language a{ color:var(--accent); }
.nav-ov__foot .header-language a:hover{ color:var(--logo); opacity:1; }

/* ロゴにブラウザ既定のフォーカス枠（青）が出ていたのを是正 */
.nav-ov a:focus{ outline:none; }
/* 枠で囲うとウオ丸のミニマルさが崩れるので、英字の下に細い線だけ出す */
.nav-ov a:focus-visible .nav-ov__en{ box-shadow:0 2px 0 var(--accent); }

@media (max-width:640px){
  .nav-ov{ padding:96px 8% 32px; }
  .nav-ov__en{ font-size:6.4vw; }
  .nav-ov__ja{ font-size:3.1vw; }
  .nav-ov__item + .nav-ov__item{ margin-top:1.4em; }
}

/* =====================================================================
   ウオ丸の挙動・トーンを移植（2026-08-05）
   ①欧文を Jost に ②文字を全体的に一段小さく ③カスタムカーソル
   ④ハンバーガーは1px×2本＋mix-blend-mode:difference ⑤ロゴも difference で反転
   ===================================================================== */

/* ── ① 欧文＝Jost（ここがモダンさの主因。明朝はウオ丸と同じ Shippori のまま） ── */
.section-head-center .en, .nav-ov__en, .pinshow__head .en, .pinh__head .en,
.showcase__body .en, .masym__label, .esec__label, .lf-block__en,
footer .copy, .fanfv__en, .fanfv__copy, .stat__num, .reason__no, .step__no,
.course-inline__list b, .kw-chips span, .review-card__meta{
  font-family:var(--jost); font-weight:300; }
.nav-ov__en{ font-weight:400; }

/* ── ② タイポを一段小さく（PC。ウオ丸は jp-head 18–26px / sec-label 28–36px） ── */
@media (min-width:641px){
  body{ font-size:1.55rem; }
  .section-head-center .ja{ font-size:2rem; letter-spacing:.12em; }
  .section--stack .section-head-center .en{ font-size:clamp(2rem,2.6vw,2.6rem); letter-spacing:.06em; }
  .section--stack .section-head-center .ja{ font-size:1.3rem; letter-spacing:.2em; }
  .section-head-center .en{ font-size:clamp(2.4rem,3.2vw,5rem); }
  .fanfv__tag{ font-size:clamp(1.9rem,2.3vw,2.4rem); }
  .masym__ttl, .esec__ttl{ font-size:clamp(1.8rem,2.2vw,2.3rem); }
  .pinshow__head h2, .pinh__head h2{ font-size:clamp(1.6rem,2vw,2rem); }
  .pinshow__cap h3{ font-size:clamp(1.7rem,2.1vw,2.1rem); }
  .commit h3, .scene-grid > .scene-card h3, .event-grid > .event-card h3,
  .scene-grid > .reason h3, .section--wash .scene-grid > .reason h3,
  .section--band .event-card h3{ font-size:1.65rem; }
  .price-ttl{ font-size:1.8rem; }
  .step h3{ font-size:1.5rem; }
  .contact-note h2{ font-size:1.8rem; } .contact-note h3{ font-size:1.45rem; }
  .cta__head{ font-size:clamp(1.8rem,2.2vw,2.3rem); }
  .faq-item__q{ font-size:1.5rem; }
  .spec dd{ font-size:1.45rem; }
  .lead{ font-size:1.62rem; }
}

/* ── ③ カスタムカーソル（ウオ丸の実装をそのまま） ── */
.cursor, .cursor-follow{ position:fixed; top:0; left:0; border-radius:50%;
  pointer-events:none; z-index:9999; mix-blend-mode:difference; }
.cursor{ width:6px; height:6px; background:#fafafa; transform:translate(-50%,-50%); }
.cursor-follow{ width:34px; height:34px; border:1px solid #6c6e6f;
  transform:translate(-50%,-50%); transition:transform .18s ease, width .2s, height .2s; }
@media (hover:none),(max-width:900px){ .cursor, .cursor-follow{ display:none; } }

/* ── ④⑤ 固定クロム：ロゴとハンバーガーを difference で反転 ── */
@media (min-width:641px){
  .header-sp{ display:flex !important; position:fixed; top:0; left:0; width:100%;
    height:auto; z-index:1003; padding:30px 34px; justify-content:space-between;
    align-items:flex-start; background:none; pointer-events:none; }
  .header-sp > *{ pointer-events:auto; }
  /* ウオ丸は白ロゴ×濃色地なので difference が効くが、鶏丸は生成り地。
     そのまま持ち込むとロゴが地に溶けるため、形だけ写して色は濃茶のまま使う */
  .header-sp__logo{ display:block; margin:0; }
  .header-sp__logo img{ height:46px; width:auto; display:block; }
  /* FV右上のロゴは固定ロゴと重複＋ハンバーガーと干渉するので畳む */
  .fanfv__logo{ display:none; }
}
.header-sp__btn{ width:46px; height:46px; position:relative; cursor:pointer; }
.header-sp__btn span{ position:absolute; left:9px; width:28px; height:1px;
  background:var(--logo); transition:.4s cubic-bezier(1,0,0,1); }
.header-sp__btn span:nth-child(1){ top:20px; }
.header-sp__btn span:nth-child(2){ display:none; }   /* ウオ丸は2本線 */
.header-sp__btn span:nth-child(3){ top:26px; bottom:auto; }
body.header--open .header-sp__btn span:nth-child(1){ top:23px; transform:rotate(45deg); }
body.header--open .header-sp__btn span:nth-child(3){ top:23px; transform:rotate(-45deg); }
@media (max-width:640px){
  .header-sp{ padding:14px 16px; height:auto; }
  .header-sp__logo img{ height:40px; }
  .header-sp__btn{ width:46px; height:46px; }
}

/* ウオ丸は固定のロゴ／ハンバーガーが常時出ている。鶏丸は「ヒーローを過ぎるまで隠す」
   実装だったが、FV右上のロゴを畳んだ以上 FV に導線が無くなるため常時表示に合わせる。 */
body.p-home .header-sp{ opacity:1 !important; visibility:visible !important; }

/* FV左上の電話/アクセスのアイコン列は、固定ロゴと近接するうえ
   固定CTAバー（電話）とドロワー（店舗情報）で導線が重複するため畳む。
   ウオ丸の固定クロムもロゴとハンバーガーの2つだけ。 */
.fanfv__icons{ display:none; }

/* =====================================================================
   コースページ — 写真つきの左右交互レイアウト（2026-08-05）
   価格を主役にし、各コースに「実際に含まれる料理」の写真を1枚ずつ添える。
   ベンチの .section-img--right/--left（左右で写真の側を入れ替える）に倣う。
   ===================================================================== */
.price-block--course{ display:grid; gap:26px 6%; align-items:start;
  padding-top:44px; border-top:1px solid var(--line); }
@media (min-width:641px){
  .price-block--course{ grid-template-columns:38% minmax(0,1fr);
    row-gap:0; grid-auto-rows:min-content; align-content:start; }
  .price-block--course > .course-photo{ grid-column:1; grid-row:1 / span 99; }
  .price-block--course > :not(.course-photo){ grid-column:2; }
  /* 偶数番のコースは写真を右に置いて単調さを崩す。
     列幅も入れ替えないと写真だけ幅広になる（実測で確認） */
  .price-block--course:nth-of-type(even){ grid-template-columns:minmax(0,1fr) 38%; }
  .price-block--course:nth-of-type(even) > .course-photo{ grid-column:2; }
  .price-block--course:nth-of-type(even) > :not(.course-photo){ grid-column:1; }
}
.course-photo img{ width:100%; aspect-ratio:4/3; object-fit:cover; display:block;
  transition:transform 1.2s cubic-bezier(.2,.7,.2,1); }
.price-block--course:hover .course-photo img{ transform:scale(1.04); }
/* 価格を主役に */
.price-block--course .price-ttl{ font-family:var(--serif); font-size:2.2rem; letter-spacing:.02em;
  border:0; padding:0; margin:0 0 .5em; color:var(--logo); display:flex; flex-wrap:wrap;
  align-items:baseline; gap:.5em; }
.price-block--course .price-badge{ font-family:var(--jost); font-weight:400; font-size:1.1rem;
  letter-spacing:.1em; background:none; color:var(--accent); padding:0; }
.price-block--course .section-detail__txt{ font-size:1.5rem; line-height:2; margin-bottom:1.2em; }
.price-block--course .price-row{ display:block; padding-top:1em; border-top:1px solid var(--line); }
.price-block--course .price-row__head{ display:block; font-family:var(--jost); font-size:1.1rem;
  letter-spacing:.12em; color:var(--accent); margin-bottom:.5em; }
.price-block--course .price-row__middle{ display:block; font-size:1.4rem; line-height:1.95; }
@media (max-width:640px){
  .price-block--course{ padding-top:9vw; }
  .price-block--course .price-ttl{ font-size:6vw; }
}

/* 価格は見出し「4,500円コース」に入っているため、price-row 末尾の素の数字は重複。
   （旧レイアウトでは右端に寄せて表示していた名残） */
.price-block--course .price-row__body{ display:none; }

/* モバイルの可読性・操作性（/seo Phase2.5③ 実測ベース・2026-08-05）
   320px でドロワーの和文サブが 9.92px まで落ちて読めなかった。
   Instagram/JP/EN のタップ領域も 44px 未満だったため広げる。 */
@media (max-width:640px){
  .nav-ov__ja{ font-size:clamp(11px,3.1vw,13px); }
  .nav-ov__en{ font-size:clamp(20px,6.4vw,30px); }
  .nav-ov__foot{ padding-top:22px; }
  .nav-ov__foot .nav-ov__ig,
  .nav-ov__foot .header-language li,
  .nav-ov__foot .header-language a{ display:inline-flex; align-items:center;
    min-height:44px; font-size:12px; }
  .nav-ov__foot .header-language a,
  .nav-ov__foot .header-language li{ padding:0 8px; }
  footer .fnav a{ display:inline-flex; align-items:center; min-height:40px; }
  footer .fsub a{ display:inline-flex; align-items:center; min-height:40px; }
}

/* 名物ショーケース：SPで英字ラベルが2行に折り返し、縦書き本文に12px重なっていた
   （実測 en=27,111 130x36 / p=27,135 → 重なり）。DESIGN_RULES §3-7 文字被り禁止。
   ラベルぶんの逃げを作り、本文の開始位置を下げる。 */
@media (max-width:640px){
  .pinshow__cap{ top:19vh; }
}

/* 横送りギャラリー直下の「おしながき」導線。
   ギャラリーは一部の料理しか出せないので、全品ページへ渡す。 */
/* ピン留めステージの末尾には214pxの死に領域があった（ステージ100vh に対し
   中身は786pxで終わる）。そこへ収めることで、ギャラリー閲覧中も常に導線が見える。 */
.gallery-more{ text-align:center; padding:26px 5.2083% 0; }
.gallery-more__txt{ font-size:1.4rem; line-height:1.9; max-width:56ch; margin:0 auto 1.1em; }
.gallery-more .btn-df{ display:inline-block; min-width:auto; max-width:none; padding:16px 40px; }
@media (max-width:640px){
  .gallery-more{ padding:12vw 5.2083% 0; }
  .gallery-more__txt{ margin-bottom:1.4em; }
}

/* =====================================================================
   料理ギャラリーのカード — 姉妹店ウオ丸の Signature 節に合わせる（2026-08-05）
   写真 → 番号(大) → 英字ラベル(小・アクセント) → 和名 → 説明文 の4段組み。
   ※ 色は鶏丸のまま（アクセントは #a69381）。合わせたのは構成のみ。
   ===================================================================== */
.pinh__track figure{ width:clamp(260px,26vw,340px); }
.pinh__track img{ width:100%; aspect-ratio:4/3; object-fit:cover; display:block; }
.pinh__track figcaption{ display:block; padding-top:14px; text-align:left; }
.pinh__no{ display:block; font-family:var(--jost); font-weight:300; font-size:2.4rem;
  line-height:1; color:var(--accent); letter-spacing:.02em; }
.pinh__en{ display:block; margin-top:.5em; font-family:var(--jost); font-weight:400;
  font-size:1.05rem; letter-spacing:.14em; color:var(--accent); }
.pinh__ja{ display:block; margin-top:.35em; font-family:var(--serif); font-size:1.6rem;
  letter-spacing:.04em; color:var(--logo); }
.pinh__txt{ display:block; margin-top:.5em; font-size:1.25rem; line-height:1.9; color:var(--ink); }
@media (max-width:640px){
  .pinh__track figure{ width:min(74vw,300px); }
  .pinh__no{ font-size:6vw; }
  .pinh__ja{ font-size:4.4vw; }
  .pinh__txt{ font-size:3.2vw; }
}
@media (max-width:640px){
  /* SPはピンを解除しているのでステージ内でも通常フロー。上下に息を入れる */
  .gallery-more{ padding:8vw 5.2083% 2vw; }
}

/* =====================================================================
   画像の角丸（2026-08-05）
   指示:「FV以外の画像に少し角丸。やりすぎるとポップになるので控えめに」
   ※ ベンチ FUKUCHA は border-radius が4要素とほぼ直角。DESIGN_RULES §3-2 も
     「上質サイトは角丸控えめ/直角が多い」としているため、意図的な逸脱として
     4px に留める（角の当たりを取る程度で、カード然とはさせない）。
   ※ 対象外: FV（扇マスク・背景スライド）と、画面端まで断ち落としている画像
     （帯の背景・CTA背景・ピン留めショーケース）。丸めると断ち落としが崩れるため。
   ===================================================================== */
.commit__img, .commit__img img,
.hikone-media img,
.scenes-media img,
.menu-shots figure, .menu-shots img,
.course-photo img,
.ig-grid a, .ig-grid img,
.pinh__track img,
.access-media img, .access-map iframe,
.esec__frame-main, .esec__frame-sub,
.masym__img img, .masym__side img,
.step img,
.mv--page img{
  border-radius:var(--radius);
}
/* 対象外を明示（親側で丸めが継承されないように） */
.fanfv__fan, .fanfv__fan img, .bg-swich-slide,
.pinshow__img, .pinshow__img img,
.section--band, .stats-band, .cta{ border-radius:0; }

/* 価格行：EN で横スクロールが出ていた（2026-08-05 実測 en/menu.html @320px で
   scrollWidth 818）。.price-row は flex/nowrap で、子が min-width:auto のため
   長い英文が縮まず行を押し広げていた。日本語はどこでも折り返せるので JA では出ない。
   flex アイテムを縮められるようにし、区切り記号だらけの英文も折り返せるようにする。 */
.price-row{ flex-wrap:wrap; }
.price-row__head, .price-row__middle{ min-width:0; overflow-wrap:anywhere; }
.price-row__body{ flex:0 0 auto; }
@media (max-width:640px){
  /* 狭い幅では品名と内訳を縦に積み、価格だけ右に残す */
  .price-row{ align-items:baseline; }
  .price-row__middle{ flex:1 1 100%; margin-left:0; }
}

/* =====================================================================
   タップ領域と極小文字の是正（2026-08-05 実測ベース）
   スマホで 44px 未満／11px 未満だった箇所を底上げする。
   ※ 装飾ラベル（SCROLL・©）は主張を強めたくないので 11px 止まりにする。
   ===================================================================== */
.nav-ov .header-menu__link{ display:block; padding:7px 0; }   /* 22px → 44px 超 */
.contact-note__links a{ display:inline-flex; align-items:center; min-height:44px; }
.price-note a, .section-detail__txt a{ display:inline-flex; align-items:center; min-height:44px; }
@media (max-width:640px){
  footer .copy{ font-size:11px; }        /* 320pxで 8.5px まで落ちていた */
  .fanfv__scroll{ font-size:11px; }
  .nav-ov__foot .nav-ov__ig{ font-size:11px; }
}
.price-note-link{ display:inline-flex; align-items:center; min-height:44px;
  text-decoration:underline; text-underline-offset:3px; }
/* 店舗情報の電話番号（実測 101x21）も指で押す導線なので 44px 確保 */
.spec dd a[href^="tel"]{ display:inline-flex; align-items:center; min-height:44px; }

/* ── 記事本文の組版（色・書体・太さは指定しない＝各サイトの意匠のまま） ──
   before: 段落の間隔が無い／h2 と h3 と本文が同じ大きさ／箇条書きの中黒が消えている、という状態だった。
   見出しの実寸はこのサイト自身の見出しスケールから取っている（トンマナを揃えるため）。
   p / li は :not([class]) で絞る。絞らないと日付などのテンプレ側 p（.note 等）まで本文サイズになる。 */
.prose{max-width:40em;margin-inline:auto}
.prose{font-size:16px;line-height:2}
/* 生成本文に裸URLが1本でも入ると横スクロールが出る（実測: 320px で 320→402px） */
.prose{overflow-wrap:anywhere}
.prose p:not([class]),.prose li:not([class]){font-size:1em;line-height:inherit}
.prose p:not([class]){margin:0 0 1.6em}
.prose ul,.prose ol{margin:0 0 1.6em;padding-left:1.4em;list-style:disc}
.prose ol{list-style:decimal}
.prose ul ul{list-style:circle}
.prose ol ol{list-style:lower-alpha}
.prose li+li{margin-top:.5em}
.prose h1{font-size:1.75em;line-height:1.35;margin:0 0 .7em}
.prose h2{font-size:1.375em;line-height:1.5;margin:2.4em 0 .7em}
.prose h3{font-size:1.125em;line-height:1.7;margin:2em 0 .6em}
.prose h4{font-size:1.05em;margin:1.8em 0 .5em}
.prose img{max-width:100%;height:auto;margin:1.8em 0}
/* SPで横に溢れないための保険 */
.prose table{display:block;overflow-x:auto;max-width:100%}
.prose pre{overflow-x:auto;max-width:100%}
.prose > p:last-child,.prose > ul:last-child,.prose > ol:last-child{margin-bottom:0}
@media (max-width:699px){.prose{font-size:15.5px;line-height:1.95}}