/* =========================================================
   手づくり村 鯉艸郷 — 公開サイト（発注書 S16a）
   デモサイト（risoukyo-demo/css/style.css）を本番に移したもの。
   デモ設計書 §2 のトークン／§5 のレイアウト。本番で変えたところには「S16a」と書いてある
   ========================================================= */

:root{
  --c-base:#F6F2E8;      /* 生成り（ページ地） */
  --c-base-deep:#ECE5D3; /* 帯・区切り */
  --c-paper:#FFFDF8;     /* カード地 */
  --c-ink:#2A2530;       /* 本文 */
  --c-ink-sub:#6B6470;   /* 補足 */
  --c-ai:#3E4478;        /* 見出し・主ボタン */
  --c-ai-deep:#2B2F57;   /* フッター地 */
  --c-fuji:#757CBA;      /* ロゴの藤色 */
  --c-fuji-pale:#E7E8F4;
  --c-ayame:#E5205F;     /* ロゴの菖蒲ピンク */
  --c-ayame-pale:#FCE4EC;
  --c-leaf:#009143;      /* ロゴの葉 */
  --c-leaf-light:#06A73B;
  --c-leaf-pale:#E4F2E6;
  --c-sun:#F2A93B;       /* 黄花コスモス */
  --c-sun-pale:#FDF0D8;
  --c-sun-ink:#D58A1C;   /* S16a：黄花コスモスの色を線・小さな印に使うときの濃いめ */
  --c-kaya:#A8743F;      /* 茅葺・食 */
  --c-kaya-pale:#F3E7D8;
  --c-line:#06C755;      /* LINEボタン専用 */
  --radius-s:10px; --radius-m:18px; --radius-l:28px; --radius-pill:999px;
  --shadow-card:0 6px 20px rgba(62,68,120,.10);
  --shadow-btn:0 4px 0 rgba(43,47,87,.25);

  --rule:rgba(62,68,120,.12);
  --ff-body:"Zen Maru Gothic","Hiragino Maru Gothic ProN","Hiragino Sans","BIZ UDPGothic","Noto Sans JP","Noto Sans CJK JP",sans-serif;
  --ff-hand:"Klee One","UD Digi Kyokasho N-R","Yu Kyokasho","Hiragino Mincho ProN","Noto Serif JP","Noto Serif CJK JP",serif;
  --ff-en:"Fraunces","Lora",Georgia,"Times New Roman",serif;
  --ff-script:"Caveat","Segoe Script","Bradley Hand",cursive;

  /* 文字の大きさ（発注書 S24）：--fs は利用者がえらぶ倍率（小 .9／標準 1／大 1.15。<html data-fs> と Cookie rs_fs）。
     font-size はすべて「標準の値 × var(--fs)」で書く（zoom・transform は使わない：リングやマップの座標がずれるため）。
     --t-body は本文（SP 15px・PC 16px。デモの値） */
  --fs:1;
  --t-body:calc(15px * var(--fs));

  --gutter:20px;
  --header-h:64px;
  --bar-h:62px;
  --sidebar-w:256px;
}
@media (min-width:768px){ :root{ --gutter:40px; --t-body:calc(16px * var(--fs)); } }
html[data-fs="s"]{ --fs:.9; }
html[data-fs="l"]{ --fs:1.15; }
@media (min-width:1080px){ :root{ --gutter:56px; --header-h:0px; --bar-h:0px; } }

/* ---------- base ---------- */
*,*::before,*::after{ box-sizing:border-box; }
html{
  scroll-behavior:smooth;
  scroll-padding-top:calc(var(--header-h) + 8px);
  -webkit-text-size-adjust:100%; text-size-adjust:100%;
  overflow-x:clip;
}
body{
  margin:0;
  font-family:var(--ff-body);
  font-size:var(--t-body); line-height:1.9; letter-spacing:.04em;
  color:var(--c-ink);
  background-color:var(--c-base);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .16 0 0 0 0 .13 0 0 0 0 .18 0 0 0 1 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.05'/%3E%3C/svg%3E");
  overflow-x:clip;
  padding-bottom:calc(var(--bar-h) + env(safe-area-inset-bottom, 0px));
  -webkit-font-smoothing:antialiased;
}
img{ max-width:100%; height:auto; display:block; }
a{ color:inherit; }
button{ font:inherit; color:inherit; }
p{ overflow-wrap:anywhere; }
h1,h2,h3{ line-height:1.5; }
:focus-visible{ outline:3px solid var(--c-ayame); outline-offset:3px; border-radius:6px; }
.vh{ position:absolute!important; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); clip-path:inset(50%); white-space:nowrap; margin:-1px; }
.sprite{ position:absolute; width:0; height:0; overflow:hidden; }
.skip-link{ position:absolute; left:12px; top:-60px; z-index:500; padding:10px 18px; border-radius:999px; background:var(--c-ai); color:#fff; font-weight:700; text-decoration:none; transition:top .2s; }
.skip-link:focus{ top:12px; }
main:focus{ outline:none; }
.i{ width:1.2em; height:1.2em; flex:none; display:inline-block; vertical-align:middle; }
img.is-missing{ visibility:hidden; }
.note{ font-size:calc(12.5px * var(--fs)); color:var(--c-ink-sub); line-height:1.8; margin:12px 0 0; }

/* ---------- 提案ポイントの切り替え（S16a：デモの注記バーをやめ、左下の小さな浮きボタンに） ---------- */
.issue-toggle{
  display:inline-flex; align-items:center; gap:8px;
  border:0; background:var(--c-ai-deep); color:#fff;
  padding:6px 14px 6px 8px; border-radius:999px;
  font-size:calc(12px * var(--fs)); font-weight:700; white-space:nowrap; cursor:pointer;
  box-shadow:0 6px 18px rgba(43,47,87,.28);
  transition:background .2s, transform .2s;
}
.issue-toggle:hover{ background:#23264a; transform:translateY(-1px); }
.issue-toggle--float{
  position:fixed; z-index:95;
  left:12px; bottom:calc(var(--bar-h) + 12px + env(safe-area-inset-bottom, 0px));
}
@media (min-width:1080px){ .issue-toggle--float{ left:calc(var(--sidebar-w) + 20px); bottom:20px; } }
.issue-toggle__track{ position:relative; width:34px; height:20px; border-radius:999px; background:rgba(255,255,255,.3); transition:background .25s; }
.issue-toggle__knob{ position:absolute; top:3px; left:3px; width:14px; height:14px; border-radius:50%; background:#fff; transition:transform .25s; }
.issue-toggle[aria-checked="true"] .issue-toggle__track{ background:var(--c-ayame); }
.issue-toggle[aria-checked="true"] .issue-toggle__knob{ transform:translateX(14px); }

/* ---------- スマホ用ヘッダー ---------- */
.sp-header{
  position:sticky; top:0; z-index:100;
  height:var(--header-h);
  display:flex; align-items:center; gap:10px;
  padding:0 12px 0 var(--gutter);
  background:rgba(246,242,232,.94);
  -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px);
  border-bottom:1px solid rgba(62,68,120,.08);
}
.sp-header__logo{ margin-right:auto; }
.sp-header__logo img{ height:38px; width:auto; }
.burger{
  width:44px; height:44px; flex:none;
  display:grid; place-content:center; gap:5px;
  border:0; border-radius:14px; background:var(--c-ai); cursor:pointer;
}
.burger span{ display:block; width:20px; height:2px; border-radius:2px; background:#fff; transition:transform .3s, opacity .3s; }
html.drawer-open .burger span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
html.drawer-open .burger span:nth-child(2){ opacity:0; }
html.drawer-open .burger span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

/* ---------- ボタン ---------- */
.btn{
  display:inline-flex; align-items:center; gap:14px;
  padding:9px 9px 9px 26px; border:0; border-radius:999px;
  background:var(--c-ai); color:#fff;
  font-weight:700; font-size:calc(15px * var(--fs)); line-height:1.4; letter-spacing:.06em;
  text-decoration:none; cursor:pointer;
  box-shadow:var(--shadow-btn);
  transition:transform .2s, box-shadow .2s, background .2s;
}
.btn:hover{ background:#353b6b; }
.btn:active{ transform:translateY(3px); box-shadow:0 1px 0 rgba(43,47,87,.25); }
.btn__arrow{ width:34px; height:34px; border-radius:50%; background:#fff; color:var(--c-ai); display:grid; place-items:center; flex:none; overflow:hidden; }
.btn__arrow .i{ width:18px; height:18px; transition:transform .3s cubic-bezier(.2,.8,.2,1); }
.btn:hover .btn__arrow .i{ transform:translateX(4px); }
.btn--lg{ padding:12px 12px 12px 32px; font-size:calc(17px * var(--fs)); }
.btn--lg .btn__arrow{ width:40px; height:40px; }
.btn--white{ background:#fff; color:var(--c-ink); box-shadow:0 4px 0 rgba(0,0,0,.12); }
.btn--white:hover{ background:#fff; }
.btn--white .btn__arrow{ background:var(--c-ai); color:#fff; }
.btn--ghost{ background:transparent; color:var(--c-ai); box-shadow:inset 0 0 0 2px var(--c-ai); }
.btn--ghost:hover{ background:var(--c-fuji-pale); }
.btn--ghost .btn__arrow{ background:var(--c-ai); color:#fff; }
.btn--tel{ background:#fff; color:var(--c-ai); box-shadow:inset 0 0 0 2px var(--c-ai), var(--shadow-btn); padding:12px 28px; font-family:var(--ff-en); font-size:calc(19px * var(--fs)); gap:8px; }
.btn--tel:hover{ background:var(--c-fuji-pale); }

.btn-line{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:12px 24px; border-radius:999px;
  background:var(--c-line); color:#fff;
  font-weight:700; font-size:calc(15px * var(--fs)); line-height:1.3; letter-spacing:.06em;
  text-decoration:none; white-space:nowrap;
  box-shadow:0 4px 0 rgba(0,110,45,.28);
  transition:transform .2s, box-shadow .2s, filter .2s;
}
.btn-line .i{ width:1.45em; height:1.45em; }
.btn-line:hover{ filter:brightness(1.05); transform:translateY(-1px); }
.btn-line:active{ transform:translateY(3px); box-shadow:0 1px 0 rgba(0,110,45,.28); }
.btn-line--sm{ padding:7px 14px; font-size:calc(13px * var(--fs)); box-shadow:0 3px 0 rgba(0,110,45,.28); }
.btn-line--block{ display:flex; width:100%; padding:14px 16px; font-size:calc(15.5px * var(--fs)); }
.btn-line--lg{ padding:16px 32px; font-size:calc(17px * var(--fs)); }
.btn-line--mini{ padding:8px 14px; font-size:calc(13px * var(--fs)); box-shadow:0 3px 0 rgba(0,110,45,.28); }

/* ---------- 共通パーツ ---------- */
.frame{ position:relative; border:8px solid #fff; border-radius:var(--radius-l); box-shadow:var(--shadow-card); overflow:hidden; background:#fff; }
.frame > .ph{ position:absolute; inset:0; aspect-ratio:auto; height:100%; }
.frame--round{ border-radius:50%; }

.tag{ display:inline-flex; align-items:center; gap:4px; padding:2px 10px; border-radius:999px; font-size:calc(11.5px * var(--fs)); font-weight:700; line-height:1.6; letter-spacing:.04em; white-space:nowrap; }
.tag--tbd{ border:1px dashed var(--c-ink-sub); color:var(--c-ink-sub); background:rgba(255,255,255,.7); font-weight:500; font-size:calc(11px * var(--fs)); padding:0 8px; }
.tag--end{ background:var(--c-ink); color:#fff; }
.tag--none{ background:#E8E4DC; color:var(--c-ink-sub); }
.tag--done{ background:var(--c-base-deep); color:var(--c-ink-sub); }
.tag--up{ background:var(--c-ayame); color:#fff; }
.tag--req{ background:var(--c-kaya); color:#fff; }
.tag--sample{ background:rgba(255,255,255,.9); color:var(--c-ink-sub); border:1px solid var(--rule); font-weight:500; font-size:calc(10.5px * var(--fs)); }
.tbd-mark{ display:none; margin-left:6px; padding:0 7px; border:1px dashed var(--c-ayame); border-radius:999px; color:var(--c-ayame); font-size:calc(10.5px * var(--fs)); font-weight:700; line-height:1.6; vertical-align:middle; white-space:nowrap; background:#fff; }
html.show-issues .tbd-mark{ display:inline-block; }

.bubble{
  position:relative; margin:0;
  background:#fff; border:2px solid var(--c-ink); border-radius:18px;
  padding:10px 18px;
  font-family:var(--ff-hand); font-weight:600; font-size:calc(15px * var(--fs)); line-height:1.65; letter-spacing:.06em;
}
.bubble::before,.bubble::after{ content:""; position:absolute; left:-12px; top:calc(50% - 8px); border-style:solid; border-width:8px 12px 8px 0; border-color:transparent var(--c-ink) transparent transparent; }
.bubble::after{ left:-8px; border-width:6px 9px 6px 0; top:calc(50% - 6px); border-color:transparent #fff transparent transparent; }

.hand-note{ font-family:var(--ff-hand); font-weight:600; color:var(--c-ink); font-size:calc(15px * var(--fs)); margin:0; letter-spacing:.1em; }

/* ---------- 写真プレースホルダー ---------- */
.ph{
  position:relative; display:block; width:100%; aspect-ratio:4/3; overflow:hidden;
  background:linear-gradient(150deg, var(--ph1, var(--c-fuji-pale)), var(--ph2, var(--c-leaf-pale)));
}
.ph::before{ content:""; position:absolute; inset:0; background:repeating-linear-gradient(135deg, rgba(42,37,48,.06) 0 1px, transparent 1px 11px); }
.ph__ill{ position:absolute; left:50%; top:46%; width:55%; height:auto; aspect-ratio:1/1; object-fit:contain; transform:translate(-50%,-50%); filter:drop-shadow(0 6px 10px rgba(42,37,48,.08)); }
.ph__chip{
  position:absolute; left:12px; bottom:12px; z-index:1;
  display:inline-flex; align-items:center; gap:6px; max-width:calc(100% - 24px);
  padding:3px 11px 3px 8px; border-radius:999px;
  background:rgba(255,253,248,.92); color:var(--c-ink-sub);
  font-size:calc(11px * var(--fs)); line-height:1.5; letter-spacing:.02em;
  box-shadow:0 2px 6px rgba(42,37,48,.08);
}
.ph__chip .i{ width:14px; height:14px; color:var(--c-fuji); }
.ph__chip b{ font-family:var(--ff-en); font-weight:700; color:var(--c-ai); letter-spacing:.02em; }
.ph__name{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ph--mini .ph__name{ display:none; }
.ph--mini .ph__chip{ left:50%; transform:translateX(-50%); bottom:8px; font-size:calc(10px * var(--fs)); padding:1px 8px 1px 6px; gap:4px; }
.ph--mini .ph__chip .i{ width:12px; height:12px; }
.ph--micro .ph__chip{ display:none; }
/* S16a：写真があるときは写真を枠いっぱいに（ストライプ・イラストは出さない） */
.ph__img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.ph--photo::before{ display:none; }
.ph--micro .ph__ill{ width:70%; top:50%; }

.ph--flower{ --ph1:color-mix(in srgb, var(--c-fuji) 58%, #fff); --ph2:var(--c-leaf-pale); }
.ph--food{ --ph1:var(--c-kaya-pale); --ph2:var(--c-sun-pale); }
.ph--scene{ --ph1:var(--c-leaf-pale); --ph2:var(--c-kaya-pale); }
.ph--exp{ --ph1:var(--c-sun-pale); --ph2:var(--c-ayame-pale); }
.ph--sun{ --ph1:var(--c-sun-pale); --ph2:var(--c-leaf-pale); }
.ph--water{ --ph1:var(--c-fuji-pale); --ph2:var(--c-leaf-pale); }
.ph--berry{ --ph1:var(--c-fuji-pale); --ph2:var(--c-ayame-pale); }
.ph--goods{ --ph1:var(--c-leaf-pale); --ph2:var(--c-sun-pale); }
.ph--event{ --ph1:var(--c-sun-pale); --ph2:var(--c-ayame-pale); }
.ph--green{ --ph1:var(--c-leaf-pale); --ph2:var(--c-base-deep); }
.ph--night{ --ph1:var(--c-ai-deep); --ph2:var(--c-fuji); }
.ph--night::before{ background:repeating-linear-gradient(135deg, rgba(255,255,255,.06) 0 1px, transparent 1px 11px); }

/* ---------- レイアウト ---------- */
.layout{ position:relative; }
.main-col{ min-width:0; }
@media (min-width:1080px){
  .layout{ display:grid; grid-template-columns:var(--sidebar-w) minmax(0,1fr); align-items:start; }
  .sp-header{ display:none; }
}

/* ---------- サイドバー ---------- */
.sidebar{ background:var(--c-paper); }
.sidebar__inner{ position:relative; display:flex; flex-direction:column; gap:16px; padding:24px 20px 22px; min-height:100%; }
.sidebar__close{ display:none; }
.side-logo{ display:flex; flex-direction:column; align-items:center; gap:4px; text-decoration:none; padding-bottom:2px; }
.side-logo__mark{ height:72px; width:auto; }
.side-logo__kanji{ width:180px; height:auto; margin-top:6px; }
.side-logo__sub{ font-size:calc(12px * var(--fs)); color:var(--c-ink-sub); letter-spacing:.4em; padding-left:.4em; line-height:1.4; }

.today{
  background:var(--c-base); border:1px solid rgba(62,68,120,.08);
  border-radius:var(--radius-m); padding:12px 16px 12px;
  font-size:calc(13px * var(--fs)); line-height:1.6;
}
.today p{ margin:0; }
.today__date{ display:flex; align-items:center; gap:8px; }
.today__label{ background:var(--c-ai); color:#fff; font-size:calc(11px * var(--fs)); font-weight:700; padding:0 9px; border-radius:999px; }
.today__date b{ font-weight:700; }
.today__state{ display:flex; align-items:center; gap:8px; margin:6px 0 0!important; font-size:calc(19px * var(--fs)); font-weight:700; color:var(--c-ayame); }
.today__hours{ font-size:calc(12.5px * var(--fs)); }
.today__bloom{ margin-top:8px!important; padding-top:8px; border-top:1px dashed var(--rule); color:var(--c-ink-sub); font-size:calc(12.5px * var(--fs)); }
.today__bloom b{ color:#B56E0B; }
.blink-dot{ position:relative; width:10px; height:10px; flex:none; border-radius:50%; background:var(--c-ayame); animation:blink 1.8s ease-out infinite; }
body.is-closed-today .blink-dot{ background:var(--c-ink-sub); animation:none; }
body.is-closed-today .today__state{ color:var(--c-ink-sub); }
@keyframes blink{
  0%{ box-shadow:0 0 0 0 rgba(229,32,95,.55); opacity:1; }
  50%{ opacity:.45; }
  70%{ box-shadow:0 0 0 9px rgba(229,32,95,0); }
  100%{ box-shadow:0 0 0 0 rgba(229,32,95,0); opacity:1; }
}

.tiles{ display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.tile{
  display:flex; flex-direction:column; align-items:center; gap:3px;
  padding:11px 4px 8px; border-radius:14px;
  background:#fff; border:1px solid rgba(62,68,120,.09);
  box-shadow:0 2px 0 rgba(62,68,120,.06);
  text-decoration:none; color:var(--c-ai); font-size:calc(13px * var(--fs)); font-weight:700; line-height:1.4;
  transition:transform .2s, background .2s, border-color .2s;
}
.tile .i{ width:28px; height:28px; color:var(--c-fuji); transition:color .2s; }
.tile:hover{ transform:translateY(-2px); background:var(--c-fuji-pale); border-color:transparent; }
.tile:hover .i{ color:var(--c-ayame); }
.tile.is-current{ background:var(--c-fuji-pale); }

.side-tel{ text-align:center; line-height:1.4; }
.side-tel__num{ display:inline-flex; align-items:center; gap:6px; font-family:var(--ff-en); font-size:calc(24px * var(--fs)); font-weight:700; color:var(--c-ai); text-decoration:none; letter-spacing:.02em; }
.side-tel__num .i{ width:22px; height:22px; color:var(--c-fuji); }
.side-tel__note{ margin:4px 0 0; font-size:calc(11.5px * var(--fs)); color:var(--c-ink-sub); }
.side-sns{ display:flex; align-items:center; justify-content:center; gap:10px; margin-top:auto; padding-top:4px; }
.sns-link{ width:36px; height:36px; border-radius:50%; display:grid; place-items:center; background:var(--c-fuji-pale); color:var(--c-ai); transition:background .2s, color .2s; }
.sns-link .i{ width:20px; height:20px; }
.sns-link:hover{ background:var(--c-ai); color:#fff; }
.side-en{ display:inline-flex; align-items:center; gap:4px; margin-left:4px; font-size:calc(12.5px * var(--fs)); color:var(--c-ink-sub); text-decoration:none; border-bottom:1px solid currentColor; line-height:1.4; }
.side-en .i{ width:15px; height:15px; }

@media (min-width:1080px){
  .sidebar{ position:sticky; top:0; height:100vh; overflow-y:auto; scrollbar-width:thin; border-right:1px solid rgba(62,68,120,.08); z-index:20; }
  .drawer-scrim{ display:none; }
}
@media (min-width:1080px) and (max-height:820px){
  .sidebar__inner{ gap:12px; padding-top:18px; }
  .side-logo__mark{ height:56px; }
  .side-logo__kanji{ width:150px; }
  .tile{ padding:8px 4px 6px; }
  .tile .i{ width:24px; height:24px; }
}
@media (max-width:1079px){
  .sidebar{
    position:fixed; top:0; right:0; bottom:0; z-index:200;
    width:min(340px, 88vw); overflow-y:auto; overscroll-behavior:contain;
    box-shadow:0 0 40px rgba(43,47,87,.2); /* 発注書 S24：片側だけの影をやめる */
    transform:translateX(105%); visibility:hidden;
    transition:transform .45s cubic-bezier(.2,.8,.2,1), visibility 0s linear .45s;
  }
  html.drawer-open .sidebar{ transform:none; visibility:visible; transition:transform .45s cubic-bezier(.2,.8,.2,1), visibility 0s; }
  .sidebar__inner{ padding-top:20px; }
  .sidebar__close{ display:grid; place-items:center; position:absolute; top:12px; right:12px; width:40px; height:40px; border:0; border-radius:50%; background:var(--c-base); color:var(--c-ai); cursor:pointer; }
  .drawer-scrim{ position:fixed; inset:0; z-index:190; background:rgba(43,47,87,.45); opacity:0; pointer-events:none; transition:opacity .35s; }
  html.drawer-open .drawer-scrim{ opacity:1; pointer-events:auto; }
  html.drawer-open{ overflow:hidden; }
}

/* ---------- セクション共通 ---------- */
.sec{ position:relative; padding:clamp(72px, 9vw, 120px) var(--gutter); }
.wrap{ position:relative; max-width:1120px; margin-inline:auto; }
.sec-head{ position:relative; text-align:center; max-width:780px; margin:0 auto clamp(36px, 5vw, 56px); }
.sec-en{
  margin:0 0 4px;
  font-family:var(--ff-en); font-weight:500; font-size:clamp(40px, 5.2vw, 72px);
  line-height:1.05; letter-spacing:-.005em; color:var(--c-fuji);
  font-variation-settings:"opsz" 144;
}
.sec-en i{ font-style:italic; }
.sec-title{ margin:0; font-size:calc(clamp(21px, 2.3vw, 30px) * var(--fs)); font-weight:700; color:var(--c-ai); letter-spacing:.08em; line-height:1.55; }
.squiggle{ display:block; width:96px; height:12px; margin:14px auto 0; color:var(--c-ayame); }
.sec-lead{ margin:22px auto 0; font-size:calc(15.5px * var(--fs)); line-height:2; }
.sec-head--left{ text-align:left; margin-left:0; }
.sec-head--left .squiggle{ margin-left:0; }
.mini-title{ display:flex; align-items:center; gap:8px; margin:28px 0 12px; font-size:calc(17px * var(--fs)); color:var(--c-ai); letter-spacing:.06em; }
.mini-title .i{ color:var(--c-fuji); width:22px; height:22px; }

.deco{ position:absolute; pointer-events:none; height:auto; z-index:1; }
/* イラスト（ChatGPT の絵を WebP にしたもの。発注書 S19）：うさぎは縦長・風景は横長。幅と高さを決めた枠でも絵を切らずに収める */
img[src*="/img/illust/"]{ object-fit:contain; }

.wave{ display:block; width:100%; height:clamp(28px, 4.4vw, 64px); }
.wave--top{ margin-bottom:-1px; }
.wave--bottom{ transform:scale(-1,-1); margin-top:-1px; }

/* スクロールでふわっと */
.js .reveal{ opacity:0; }
.js .reveal.is-in{ opacity:1; animation:revealUp .9s cubic-bezier(.2,.8,.2,1) var(--d, 0s) backwards; }
@keyframes revealUp{ from{ opacity:0; transform:translateY(24px); } to{ opacity:1; transform:none; } }

/* ---------- ヒーロー（発注書 S29：ファーストビューは動画） ----------
   PC（768px〜）：本文の幅いっぱいの動画（1280×594）と、その上に公式の見出し 3 行（縦書きの白いピル）。
     高さは画面に収まる範囲（min(画面の高さ − 上の余白, 幅 ÷ 2.16)）。文字は約 6 秒で .is-copy-out（home.js）が付いて約 1 秒で消える。
     表示中だけ左側にうっすら暗い層（.hero__shade）。右下に一時停止／再生のボタン（44px）
   SP（〜767px）：角丸の動画（16:10）の下に社長の文言 3 行（横書き・階段状）と丸い写真 3 つ。動画の上に文字は乗せない */
.hero{
  --hero-top:16px;
  position:relative; overflow-x:clip;
  padding:var(--hero-top) 0 76px;
  container-type:inline-size;
}
@media (min-width:1080px){ .hero{ --hero-top:72px; } } /* 右上の「文字・言語」の下から */
.hero__stage{
  position:relative; overflow:hidden;
  height:calc(100cqw / 2.16);
  height:min(calc(100vh - var(--header-h) - var(--hero-top)), calc(100cqw / 2.16));
  height:min(calc(100svh - var(--header-h) - var(--hero-top)), calc(100cqw / 2.16));
  background:var(--c-base-deep);
  container-type:size;
}
.hero__video{ position:absolute; inset:0; display:block; width:100%; height:100%; object-fit:cover; background:var(--c-base-deep); }
.hero__shade{
  position:absolute; inset:0; z-index:1; pointer-events:none;
  background:linear-gradient(90deg, rgba(30,26,40,.4) 0%, rgba(30,26,40,.2) 30%, rgba(30,26,40,0) 58%);
  transition:opacity 1s ease;
}
.hero__catch{
  position:absolute; z-index:2; top:50%; left:clamp(28px, 7cqw, 120px); translate:0 -50%;
  writing-mode:vertical-rl;
  display:flex; flex-direction:column; align-items:flex-start; gap:clamp(10px, 1.4cqw, 18px);
  width:max-content; height:max-content; margin:0; pointer-events:none;
  /* 公式の見出し（最長 10 字）が動画の高さに収まる大きさ（文字「大」でも 9 割に収まる） */
  font-family:var(--ff-hand); font-weight:600; font-size:calc(clamp(19px, 5.8cqh, 46px) * var(--fs));
  line-height:1; letter-spacing:.14em; color:var(--c-ink);
  transition:opacity 1s ease;
}
.hero__line{ display:block; padding:.72em .44em .6em; border-radius:999px; background:#fff; box-shadow:0 10px 28px rgba(20,18,30,.22); white-space:nowrap; }
.hero__line:nth-child(2){ margin-top:1.4em; }
.hero__line:nth-child(3){ margin-top:2.8em; }
.hero__line em{ font-style:normal; }
.hero__line:nth-child(1) em{ color:var(--c-ayame); }
.hero__line:nth-child(2) em{ color:var(--c-leaf); }
.hero__line:nth-child(3) em{ color:var(--c-kaya); }
/* 英語ページの見出しは横書き（縦にすると英字が横倒しになるため） */
html:lang(en) .hero__catch{ writing-mode:horizontal-tb; gap:12px; font-size:calc(clamp(19px, 2.4cqw, 34px) * var(--fs)); letter-spacing:.02em; line-height:1.2; }
html:lang(en) .hero__line{ padding:.5em .9em; }
html:lang(en) .hero__line:nth-child(2){ margin-top:0; margin-left:1.2em; }
html:lang(en) .hero__line:nth-child(3){ margin-top:0; margin-left:2.4em; }
/* 約 6 秒で消す（見た目だけ。読み上げ・検索のために HTML には残す）。ループしても出し直さない */
.hero.is-copy-out .hero__catch,.hero.is-copy-out .hero__shade{ opacity:0; }

/* 一時停止／再生（自動で 5 秒を超えて動くものを止められるように。JS が hidden を外す） */
.hero__toggle{
  position:absolute; z-index:3; right:16px; bottom:16px;
  display:grid; place-items:center; width:44px; height:44px; padding:0;
  border:1px solid rgba(255,255,255,.6); border-radius:50%;
  background:rgba(30,26,40,.42); color:#fff; cursor:pointer;
  -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px);
  transition:background .2s;
}
.hero__toggle[hidden],.hero.is-video-failed .hero__toggle{ display:none; }
.hero__toggle:hover{ background:rgba(30,26,40,.64); }
.hero__toggle .i{ width:18px; height:18px; }
.hero__toggle-play,.hero__toggle.is-paused .hero__toggle-pause{ display:none; }
.hero__toggle.is-paused .hero__toggle-play{ display:inline-block; }
@media (min-width:1080px){ .hero__toggle{ right:64px; bottom:20px; } } /* 右端の「団体・バスのお客さま」の縦タブに重ねない */

/* SP の文字と丸い写真（PC では出さない） */
.hero__sp{ display:none; }

/* ヒーロー登場（ローディングが終わってから。<html class="hero-go">） */
.js .hero__shade{ opacity:0; }
.js .hero .hero__line{ opacity:0; clip-path:inset(-30px -30px 100% -30px); transition:clip-path 1s cubic-bezier(.65,0,.25,1), opacity .2s; }
html.hero-go .hero__shade{ opacity:1; }
html.hero-go .hero .hero__line{ opacity:1; clip-path:inset(-30px -30px -30px -30px); }
html.hero-go .hero .hero__line:nth-child(1){ transition-delay:.35s; }
html.hero-go .hero .hero__line:nth-child(2){ transition-delay:.6s; }
html.hero-go .hero .hero__line:nth-child(3){ transition-delay:.85s; }
.js .hero .hero__sp-line{ opacity:0; transform:translateY(14px); transition:opacity .8s ease, transform 1s cubic-bezier(.2,.8,.2,1); }
.js .hero .hero__circle{ opacity:0; transform:scale(.6); transition:opacity .8s ease, transform 1s cubic-bezier(.2,.8,.2,1); }
html.hero-go .hero .hero__sp-line,html.hero-go .hero .hero__circle{ opacity:1; transform:none; }
html.hero-go .hero .hero__sp-line:nth-child(2){ transition-delay:.15s; }
html.hero-go .hero .hero__sp-line:nth-child(3){ transition-delay:.3s; }
html.hero-go .hero .hero__circle--1{ transition-delay:.35s; }
html.hero-go .hero .hero__circle--2{ transition-delay:.5s; }
html.hero-go .hero .hero__circle--3{ transition-delay:.65s; }
/* SP の 3 行のテキストアニメーション（発注書 S30）：home.js が 1 文字ずつ（英語は 1 語ずつ）に分けたら（.is-split）、
   行はそのまま見せて、文字が下から少しぼかしを解きながら順に浮かび上がる。丸い写真は文字が出そろうころに */
.js .hero .hero__sp-catch.is-split .hero__sp-line{ opacity:1; transform:none; transition:none; }
.hero__sp-catch.is-split .hero__ch{ display:inline-block; }
/* 分けた文字は作った直後に hero-go が付くことがある（ローディングが無いとき）ので、transition ではなく animation で動かす */
.js .hero .hero__sp-catch.is-split .hero__ch{ opacity:0; }
html.hero-go .hero .hero__sp-catch.is-split .hero__ch{
  opacity:1;
  animation:heroCh .9s cubic-bezier(.2,.8,.2,1) both;
  animation-delay:calc(var(--i, 0) * var(--ch-step, 55ms) + .15s);
}
@keyframes heroCh{
  from{ opacity:0; transform:translateY(.55em) rotate(4deg); filter:blur(6px); }
  60%{ filter:blur(0); }
  to{ opacity:1; transform:none; filter:none; }
}
html.hero-go .hero .hero__sp[style*="--circle-delay"] .hero__circle--1{ transition-delay:var(--circle-delay); }
html.hero-go .hero .hero__sp[style*="--circle-delay"] .hero__circle--2{ transition-delay:calc(var(--circle-delay) + .15s); }
html.hero-go .hero .hero__sp[style*="--circle-delay"] .hero__circle--3{ transition-delay:calc(var(--circle-delay) + .3s); }

/* 飾りのふわふわ（花ごよみ・イベントのイラストなど） */
@keyframes floatY{ 0%,100%{ transform:translateY(0) rotate(-3deg); } 50%{ transform:translateY(-14px) rotate(4deg); } }

/* ---------- お知らせ帯 ---------- */
.notice{ position:relative; z-index:3; margin:-52px var(--gutter) 0; }
.notice__inner{
  max-width:1120px; margin:0 auto;
  display:flex; align-items:center; gap:16px;
  padding:9px 10px 9px 9px; border-radius:999px;
  background:#fff; box-shadow:var(--shadow-card);
}
.notice__label{ margin:0; padding:5px 16px; border-radius:999px; background:var(--c-ayame); color:#fff; font-size:calc(13px * var(--fs)); font-weight:700; white-space:nowrap; }
.notice__list{ list-style:none; margin:0; padding:0; flex:1; min-width:0; display:flex; gap:24px; }
.notice__list li{ flex:1 1 0; min-width:0; display:flex; align-items:baseline; gap:10px; font-size:calc(14px * var(--fs)); line-height:1.6; }
.notice__list li + li{ padding-left:24px; border-left:1px solid var(--rule); }
.notice__list time{ font-family:var(--ff-en); font-size:calc(13.5px * var(--fs)); color:var(--c-fuji); white-space:nowrap; font-weight:700; }
.notice__list a{ min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; text-decoration:none; }
.notice__list a:hover{ color:var(--c-ayame); text-decoration:underline; }
.notice__more{ width:36px; height:36px; flex:none; border-radius:50%; display:grid; place-items:center; background:var(--c-fuji-pale); color:var(--c-ai); transition:background .2s, color .2s; }
.notice__more:hover{ background:var(--c-ai); color:#fff; }

/* ---------- 営業状況カード ---------- */
.status{ position:relative; z-index:2; padding:22px var(--gutter) 0; }
.status__grid{ max-width:1120px; margin:0 auto; display:grid; grid-template-columns:1.32fr 1fr 1fr 1fr; gap:16px; }
.st-card{
  position:relative; min-height:170px;
  display:flex; flex-direction:column; gap:2px;
  padding:20px 22px 20px; border-radius:var(--radius-m);
  background:#fff; color:var(--c-ink); text-decoration:none;
  box-shadow:var(--shadow-card);
  transition:transform .25s, box-shadow .25s;
}
.st-card p{ margin:0; }
.st-card__ttl{ font-size:calc(15.5px * var(--fs)); font-weight:700; letter-spacing:.06em; line-height:1.5; }
.st-card--open{ background:var(--c-ai); color:#fff; overflow:hidden; }
.st-card--open::after{ content:""; position:absolute; right:-40px; bottom:-60px; width:180px; height:180px; border-radius:50%; background:rgba(255,255,255,.06); }
.st-card--open .st-card__ttl{ color:rgba(255,255,255,.82); font-size:calc(13.5px * var(--fs)); }
.st-card__big{ display:flex; align-items:center; gap:12px; margin:6px 0 8px!important; font-family:var(--ff-en); font-size:calc(clamp(40px, 4.2vw, 56px) * var(--fs)); font-weight:700; line-height:1; letter-spacing:.04em; white-space:nowrap; }
.st-card--open .blink-dot{ width:12px; height:12px; }
.st-card__hours{ font-family:var(--ff-en); font-size:calc(19px * var(--fs)); font-weight:700; letter-spacing:.04em; line-height:1.4; }
.st-card__fee{ font-size:calc(12.5px * var(--fs)); opacity:.9; line-height:1.6; }
.st-card__icon{ width:50px; height:50px; margin-bottom:8px; border-radius:50%; display:grid; place-items:center; background:var(--tint); color:var(--tone); }
.st-card__icon .i{ width:27px; height:27px; }
.st-card__sub{ font-size:calc(12.5px * var(--fs)); color:var(--c-ink-sub); line-height:1.65; padding-right:34px; }
.st-card__tag{ position:absolute; top:14px; right:14px; padding:1px 9px; border-radius:999px; background:var(--c-line); color:#fff; font-size:calc(10.5px * var(--fs)); font-weight:700; letter-spacing:.08em; line-height:1.7; }
.st-card__go{ position:absolute; right:14px; bottom:14px; width:32px; height:32px; border-radius:50%; display:grid; place-items:center; background:var(--c-base); color:var(--c-ai); transition:background .25s, color .25s; }
.st-card__go .i{ width:17px; height:17px; }
.st-card--link:hover{ transform:translateY(-4px); box-shadow:0 14px 30px rgba(62,68,120,.16); }
.st-card--link:hover .st-card__go{ background:var(--c-ai); color:#fff; }
.st-card--sun{ --tint:var(--c-sun-pale); --tone:#C27A14; }
.st-card--fuji{ --tint:var(--c-fuji-pale); --tone:var(--c-fuji); }
.st-card--leaf{ --tint:var(--c-leaf-pale); --tone:var(--c-leaf); }

/* ---------- 鯉艸郷について ---------- */
.about{ padding-bottom:clamp(40px, 5vw, 64px); }
.about__grid{ display:grid; grid-template-columns:auto minmax(0,1.05fr) minmax(0,1fr); gap:clamp(24px, 4vw, 60px); align-items:center; }
.v-en{ margin:0; writing-mode:vertical-rl; font-family:var(--ff-en); font-style:italic; font-weight:500; font-size:clamp(64px, 8vw, 120px); line-height:.9; color:var(--c-fuji); align-self:start; letter-spacing:.01em; opacity:.9; }
.about__text p{ margin:1.3em 0 0; }
.about__text .squiggle{ margin-left:0; }
/* S26a：「鯉艸郷の想い」の署名（公式トップと同じく右寄せ） */
.about__text .about__sign{ margin-top:1.6em; text-align:right; font-weight:700; line-height:1.9; }
.about__sign span{ display:block; }
.about__photos{ position:relative; padding:0 0 44px 44px; }
.about__main{ aspect-ratio:4/5; border-radius:999px 999px var(--radius-l) var(--radius-l); }
.about__sub{ position:absolute; left:0; bottom:0; width:42%; aspect-ratio:1; }
.about__note{ position:absolute; right:-6px; top:12%; writing-mode:vertical-rl; background:#fff; padding:14px 8px; border-radius:999px; box-shadow:var(--shadow-card); z-index:2; }
.about__leaf{ width:78px; right:-18px; bottom:6px; transform:rotate(18deg); }

.stats{ list-style:none; margin:clamp(48px, 6vw, 80px) 0 0; padding:0; display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:14px; } /* S26a：「約7ha」を外して 4 つ */
.stat{ position:relative; padding:24px 10px 18px; border-radius:var(--radius-m); background:var(--c-paper); text-align:center; box-shadow:var(--shadow-card); }
.stat::before{ content:""; position:absolute; top:0; left:50%; width:36px; height:4px; margin-left:-18px; border-radius:0 0 4px 4px; background:var(--c-ayame); opacity:.7; }
.stat__num{ margin:0; display:flex; align-items:baseline; justify-content:center; gap:2px; font-family:var(--ff-en); color:var(--c-ai); line-height:1; }
.stat__val{ font-size:calc(clamp(34px, 3.4vw, 48px) * var(--fs)); font-weight:500; letter-spacing:-.01em; font-variation-settings:"opsz" 144; }
.stat__pre{ font-family:var(--ff-body); font-size:calc(14px * var(--fs)); font-weight:700; color:var(--c-fuji); margin-right:2px; }
.stat__unit{ font-family:var(--ff-body); font-size:calc(15px * var(--fs)); font-weight:700; color:var(--c-fuji); margin-left:3px; }
.stat__label{ margin:10px 0 0; font-size:calc(12.5px * var(--fs)); line-height:1.55; color:var(--c-ink-sub); }

/* 風景の帯（ChatGPT の絵。発注書 S19）：横幅いっぱいに絵の縦横比のまま（山の頂を切らない）。スマホで低くなりすぎるときだけ左右を切る */
.landscape{ position:relative; margin-bottom:-1px; }
.landscape img{ display:block; width:100%; height:auto; min-height:80px; object-fit:cover; object-position:50% 100%; }

/* ---------- 園内マップ ---------- */
.map{ background:var(--map-bg, var(--c-base-deep)); }
.chips{ display:flex; flex-wrap:wrap; justify-content:center; gap:8px; margin:0 auto clamp(70px, 8vw, 96px); }
.chip{
  display:inline-flex; align-items:center; gap:8px;
  padding:8px 16px 8px 12px; border:0; border-radius:999px;
  background:#fff; color:var(--c-ink); font-size:calc(14px * var(--fs)); font-weight:700; line-height:1.4; cursor:pointer;
  box-shadow:0 2px 0 rgba(62,68,120,.1);
  transition:background .2s, color .2s, transform .2s;
}
.chip:hover{ transform:translateY(-1px); }
.chip__dot{ width:12px; height:12px; border-radius:50%; background:var(--cc, var(--c-ai)); box-shadow:0 0 0 2px #fff, 0 0 0 3px var(--cc, var(--c-ai)); }
.chip.is-active{ background:var(--c-ai); color:#fff; }
.chip.is-active .chip__dot{ box-shadow:0 0 0 2px var(--c-ai), 0 0 0 3px #fff; }

.map-stage{ position:relative; max-width:1000px; margin:0 auto; }
.map-guide{ position:absolute; z-index:6; left:-34px; top:-104px; display:flex; align-items:flex-start; gap:6px; pointer-events:none; }
.map-guide__usagi{ width:110px; height:110px; }
.map-guide__bubble{ margin-top:14px; white-space:nowrap; }
.map-frame{ position:relative; border:8px solid #fff; border-radius:var(--radius-l); background:#fff; box-shadow:0 20px 44px rgba(62,68,120,.16); }
.map-canvas{ position:relative; }
.map-canvas__img{ width:100%; height:auto; border-radius:20px; }
.map-zoom{
  position:absolute; right:14px; bottom:14px; z-index:4;
  display:inline-flex; align-items:center; gap:6px;
  padding:9px 18px 9px 14px; border:0; border-radius:999px;
  background:var(--c-ai); color:#fff; font-size:calc(14px * var(--fs)); font-weight:700; cursor:pointer;
  box-shadow:var(--shadow-btn); transition:transform .2s;
}
.map-zoom:hover{ transform:translateY(-2px); }
.map-zoom .i{ width:18px; height:18px; }

/* ピン（S16a (5)：白フチ・影・脈打つ輪の「立体」のピンをやめ、手描きマップの色鉛筆タッチに合わせた平面のあしらいに。
   少し揺らいだ手描きの輪（2 本の線を少しずらして重ねる）＋中に小さなアイコン。影・グラデーション・脈動なし */
.pin{
  position:absolute; z-index:2;
  width:34px; height:34px; margin:-17px 0 0 -17px; padding:0;
  border:0; background:none; cursor:pointer; color:var(--pc);
  transition:transform .25s cubic-bezier(.2,.8,.2,1), opacity .3s;
  -webkit-tap-highlight-color:transparent;
}
.pin__ring{ position:absolute; inset:0; width:100%; height:100%; overflow:visible; pointer-events:none; }
.pin__ring-a{ fill:rgba(255,253,248,.9); stroke:var(--pc); stroke-width:2.3; stroke-linejoin:round; transition:fill .2s; }
.pin__ring-b{ fill:none; stroke:var(--pc); stroke-width:1.1; opacity:.5; transform:rotate(16deg) scale(1.06); transform-origin:20px 20px; }
.pin__icon{ position:absolute; left:50%; top:50%; width:16px; height:16px; margin:-8px 0 0 -8px; color:var(--pc); pointer-events:none; transition:color .2s; }
.pin:hover,.pin:focus-visible{ transform:scale(1.12) rotate(-5deg); z-index:4; }
.pin:focus-visible{ outline:none; }
.pin:focus-visible .pin__ring-a{ stroke-width:3.2; }
.pin.is-active{ transform:scale(1.18); z-index:5; }
.pin.is-active .pin__ring-a{ fill:var(--pc); }
.pin.is-active .pin__icon{ color:#fff; }
.pin.is-dim{ opacity:.25; }
/* 「見頃」は Klee One の手書きの小さな札（紙の地・細い線・少し傾ける） */
.pin__flag{
  position:absolute; left:62%; bottom:calc(100% - 4px);
  padding:0 7px 1px; border:1.5px solid var(--c-ayame); border-radius:7px 9px 6px 10px;
  background:var(--c-paper); color:var(--c-ayame);
  font-family:var(--ff-hand); font-weight:600; font-size:calc(12px * var(--fs)); line-height:1.55; letter-spacing:.1em;
  white-space:nowrap; transform:rotate(-8deg); transform-origin:0 100%; pointer-events:none;
}
.pin--flower{ --pc:var(--c-ayame); }
.pin--play{ --pc:var(--c-sun-ink); }
.pin--food{ --pc:var(--c-kaya); }
.pin--shop{ --pc:var(--c-leaf); }
.pin--info{ --pc:var(--c-fuji); }

/* 吹き出し（S16a：太いピンクの帯と三角の切り欠きをやめ、紙の付箋にマスキングテープを貼ったような控えめな形に） */
.map-pop,.map-card{ --pc:var(--c-ai); }
.map-pop{
  position:absolute; z-index:8; width:280px;
  padding:22px 18px 16px; border-radius:3px 3px 16px 3px;
  background:var(--c-paper); border:1px solid rgba(58,46,42,.13);
  box-shadow:0 10px 26px rgba(43,47,87,.16);
  transform:translate(-50%, calc(-100% - 28px));
}
.map-pop[hidden]{ display:none; }
.map-pop::before,.map-card::before{
  content:""; position:absolute; left:16px; top:-9px; width:70px; height:18px;
  background:color-mix(in srgb, var(--pc) 42%, transparent);
  transform:rotate(-5deg);
  clip-path:polygon(0 18%, 5% 0, 10% 16%, 15% 2%, 85% 4%, 90% 16%, 95% 0, 100% 20%, 100% 82%, 95% 100%, 90% 86%, 85% 98%, 15% 96%, 10% 84%, 5% 100%, 0 80%);
}
/* ピンと結ぶ短い点線（手描きの線の代わり） */
.map-pop::after{ content:""; position:absolute; left:var(--tail, 50%); top:100%; height:22px; margin-left:-1px; border-left:2px dashed color-mix(in srgb, var(--pc) 70%, transparent); }
.map-pop.is-below{ transform:translate(-50%, 28px); }
.map-pop.is-below::after{ top:auto; bottom:100%; }
.map-card{ position:relative; margin-top:14px; padding:22px 18px 16px; border-radius:3px 3px 16px 3px; background:var(--c-paper); border:1px solid rgba(58,46,42,.13); box-shadow:var(--shadow-card); }
.pop__cat{ display:flex; align-items:center; gap:6px; margin:0; font-size:calc(12px * var(--fs)); font-weight:700; color:var(--c-ink-sub); }
.pop__cat::before{ content:""; width:10px; height:10px; border-radius:50%; background:var(--pc); }
.pop__name{ margin:4px 40px 6px 0; font-size:calc(18px * var(--fs)); color:var(--c-ai); letter-spacing:.04em; line-height:1.45; }
.pop__text{ margin:0; font-size:calc(14px * var(--fs)); line-height:1.75; }
.pop__tags{ display:flex; flex-wrap:wrap; gap:6px; margin-top:10px; }
.pop__btns{ display:flex; flex-wrap:wrap; gap:8px; margin-top:12px; }
.pop__btns .btn{ padding:6px 6px 6px 16px; font-size:calc(13px * var(--fs)); gap:10px; }
.pop__btns .btn__arrow{ width:26px; height:26px; }
.pop__btns .btn__arrow .i{ width:15px; height:15px; }
.pop__close{ position:absolute; top:10px; right:10px; width:30px; height:30px; display:grid; place-items:center; border:0; border-radius:50%; background:var(--c-base); color:var(--c-ink-sub); cursor:pointer; }
.pop__close .i{ width:16px; height:16px; }
.map-detail{ display:none; }

/* 拡大モーダル */
.map-modal{ position:fixed; inset:0; z-index:300; display:flex; flex-direction:column; background:rgba(33,36,68,.94); }
.map-modal[hidden]{ display:none; }
.map-modal__bar{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:10px 16px; color:#fff; }
.map-modal__title{ display:flex; align-items:center; gap:8px; margin:0; font-weight:700; }
.map-modal__close{ display:inline-flex; align-items:center; gap:6px; padding:8px 18px 8px 14px; border:0; border-radius:999px; background:#fff; color:var(--c-ai); font-weight:700; cursor:pointer; }
.map-modal__scroll{ flex:1; overflow:auto; display:grid; place-items:center; padding:0 16px 16px; overscroll-behavior:contain; }
.map-canvas--modal{ width:min(100%, calc((100vh - 84px) * 1.505)); }
.map-canvas--modal .map-canvas__img{ border-radius:12px; }
@media (max-width:767px){
  .map-modal__scroll{ place-items:start; }
  .map-canvas--modal{ width:1280px; max-width:none; }
}

/* ---------- 花ごよみ ---------- */
.season__deco{ width:72px; right:8%; top:90px; animation:floatY 5s ease-in-out infinite; }
.cal{ position:relative; padding:26px 26px 18px; border-radius:var(--radius-l); background:#fff; box-shadow:var(--shadow-card); }
.cal__scroll{ overflow-x:auto; overscroll-behavior-x:contain; scrollbar-width:thin; border-radius:12px; }
.cal__grid{ --namew:214px; position:relative; min-width:780px; padding-top:14px; }
.cal__head,.cal__row{ display:grid; grid-template-columns:var(--namew) minmax(0,1fr); }
.cal__corner{ position:sticky; left:0; z-index:3; background:#fff; font-size:calc(12px * var(--fs)); color:var(--c-ink-sub); display:flex; align-items:flex-end; padding-bottom:10px; }
.cal__months{ display:grid; grid-template-columns:repeat(7, minmax(0,1fr)); }
.cal__m{ padding:4px 0 10px; text-align:center; font-weight:700; font-size:calc(14px * var(--fs)); color:var(--c-ai); line-height:1.3; }
.cal__m small{ display:block; font-family:var(--ff-en); font-weight:500; font-size:calc(10px * var(--fs)); color:var(--c-ink-sub); letter-spacing:.06em; }
.cal__row{ border-top:1px solid rgba(62,68,120,.08); }
.cal__row:nth-child(even) .cal__track{ background-color:rgba(246,242,232,.5); }
.cal__name{ position:sticky; left:0; z-index:3; display:flex; align-items:center; gap:10px; padding:8px 12px 8px 0; background:#fff; }
.cal__ill{ width:40px; height:40px; flex:none; }
.cal__flower{ margin:0; font-size:calc(14.5px * var(--fs)); font-weight:700; line-height:1.35; }
.cal__count{ margin:0; font-size:calc(11.5px * var(--fs)); line-height:1.4; color:var(--c-ink-sub); }
.cal__track{ position:relative; min-height:58px; background-image:linear-gradient(to right, rgba(62,68,120,.1) 1px, transparent 1px); background-size:calc(100% / 7) 100%; }
.cal__bar{ position:absolute; top:50%; height:16px; margin-top:-8px; border-radius:999px; background:var(--bc); box-shadow:inset 0 -3px 0 rgba(0,0,0,.08); }
.cal__bar.is-now{ height:22px; margin-top:-11px; box-shadow:0 0 0 3px #fff, 0 0 0 5px var(--bc); }
.cal__bar-tag{ position:absolute; left:calc(100% + 10px); top:50%; transform:translateY(-50%); padding:0 9px; border-radius:999px; background:var(--c-ayame); color:#fff; font-size:calc(11px * var(--fs)); font-weight:700; line-height:1.8; white-space:nowrap; }
.cal__overlay{ position:absolute; top:0; bottom:0; left:var(--namew); right:0; pointer-events:none; z-index:2; }
.cal__closed{ position:absolute; top:58px; bottom:4px; border-radius:10px; background:repeating-linear-gradient(135deg, rgba(107,100,112,.2) 0 5px, rgba(255,255,255,.35) 5px 11px); display:flex; justify-content:center; padding-top:10px; }
.cal__closed span{ writing-mode:vertical-rl; font-size:calc(12px * var(--fs)); font-weight:700; color:var(--c-ink-sub); background:#fff; padding:8px 3px; border-radius:999px; letter-spacing:.2em; height:fit-content; }
.cal__today{ position:absolute; top:34px; bottom:0; width:0; border-left:2px dashed var(--c-ayame); }
.cal__today::after{ content:""; position:absolute; left:-6px; top:-4px; width:10px; height:10px; border-radius:50%; background:var(--c-ayame); }
.cal__today-label{ position:absolute; top:-30px; left:0; transform:translateX(-50%) rotate(-6deg); padding:1px 10px; border-radius:999px; background:var(--c-ayame); color:#fff; font-family:var(--ff-hand); font-weight:600; font-size:calc(13px * var(--fs)); white-space:nowrap; line-height:1.7; }
.cal__hint{ display:none; }
/* S26a：公式の開花予測の段階（バーの中の濃さ）と凡例。色だけに頼らないよう、凡例の見本は模様も変える */
.cal__segs{ position:absolute; inset:0; border-radius:inherit; overflow:hidden; }
.cal__seg{ position:absolute; top:0; bottom:0; background:var(--bc, var(--c-ayame)); }
.cal__seg--bud{ background:repeating-linear-gradient(90deg, color-mix(in srgb, var(--bc, var(--c-ayame)) 30%, #fff) 0 4px, #fff 4px 7px); }
.cal__seg--start{ background:color-mix(in srgb, var(--bc, var(--c-ayame)) 48%, #fff); }
.cal__seg--third{ background:color-mix(in srgb, var(--bc, var(--c-ayame)) 70%, #fff); }
.cal__seg--best{ background:var(--bc, var(--c-ayame)); }
.cal__seg--down{ background:repeating-linear-gradient(45deg, color-mix(in srgb, var(--bc, var(--c-ayame)) 72%, #fff) 0 5px, #fff 5px 6px); }
.cal__seg--last{ background:repeating-linear-gradient(135deg, color-mix(in srgb, var(--bc, var(--c-ayame)) 45%, #fff) 0 4px, #fff 4px 6px); }
.cal__seg--harvest{ background:repeating-linear-gradient(135deg, var(--bc, var(--c-ayame)) 0 5px, color-mix(in srgb, var(--bc, var(--c-ayame)) 60%, #000) 5px 7px); }
.cal__seg--flower{ background:color-mix(in srgb, var(--bc, var(--c-ayame)) 82%, #fff); }
.cal__seg + .cal__seg{ box-shadow:inset 1px 0 0 rgba(255,255,255,.9); }
.cal__legend{ --bc:#757CBA; list-style:none; display:flex; flex-wrap:wrap; gap:6px 16px; margin:14px 0 0; padding:0; font-size:calc(12.5px * var(--fs)); color:var(--c-ink-sub); }
.cal__legend li{ display:inline-flex; align-items:center; gap:6px; }
.cal__swatch{ position:static; display:inline-block; width:26px; height:12px; border-radius:999px; box-shadow:inset 0 0 0 1px rgba(62,68,120,.18); }

.season__bottom{ display:grid; grid-template-columns:minmax(0,1.65fr) minmax(0,1fr); gap:24px; margin-top:24px; }
.fee{ padding:24px 26px 22px; border-radius:var(--radius-l); background:#fff; box-shadow:var(--shadow-card); }
.fee__title{ display:flex; align-items:center; gap:8px; margin:0 0 8px; font-size:calc(18px * var(--fs)); color:var(--c-ai); }
.fee__title .i{ color:var(--c-fuji); }
.table-wrap{ overflow-x:auto; }
.fee__table{ width:100%; border-collapse:collapse; font-size:calc(14px * var(--fs)); }
.fee__table th,.fee__table td{ padding:10px 8px; border-bottom:1px solid var(--rule); text-align:center; white-space:nowrap; }
.fee__table thead th{ font-size:calc(12px * var(--fs)); font-weight:500; color:var(--c-ink-sub); padding-top:4px; }
.fee__table tbody th{ text-align:left; font-weight:700; line-height:1.45; }
.fee__table tbody th small{ display:block; font-weight:400; font-size:calc(12px * var(--fs)); color:var(--c-ink-sub); }
.fee__table thead small{ display:block; font-size:calc(10.5px * var(--fs)); line-height:1.4; }
/* S26a：入園料の注記（公式の原文。1 行に 1 つ） */
.fee__notes{ list-style:none; padding:0; }
.fee__notes li + li{ margin-top:2px; }
.fee__table td b{ font-family:var(--ff-en); font-size:calc(18px * var(--fs)); font-weight:700; color:var(--c-ai); }
.fee__table tr.is-now{ background:var(--c-ayame-pale); }
.fee__table tr.is-now th{ border-radius:10px 0 0 10px; }
.fee__table .now-tag{ margin-left:6px; }
.line-card{ position:relative; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:14px; padding:28px 24px; border-radius:var(--radius-l); background:var(--c-leaf-pale); text-align:center; }
.line-card__ill{ width:84px; height:84px; }
.line-card__text{ margin:0; font-weight:700; color:var(--c-ai); line-height:1.7; }
.line-card__text .i{ color:var(--c-leaf); margin-right:4px; }
.now-tag{ display:inline-block; padding:0 9px; border-radius:999px; background:var(--c-ayame); color:#fff; font-size:calc(11px * var(--fs)); font-weight:700; line-height:1.8; vertical-align:middle; }

/* ---------- 楽しみかた ---------- */
.enjoy__wrap{ container-type:inline-size; container-name:enjoy; }
.panels{ display:flex; flex-direction:column; gap:16px; }
.panel{ position:relative; overflow:hidden; border-radius:var(--radius-l); background:var(--pc); color:#fff; --pc:var(--c-ai); }
.panel--see{ --pc:var(--c-ayame); }
.panel--make{ --pc:var(--c-sun); color:var(--c-ink); }
.panel--eat{ --pc:var(--c-kaya); }
.panel--grow{ --pc:var(--c-leaf); }
.panel::before{ content:""; position:absolute; right:-80px; top:-80px; width:260px; height:260px; border-radius:50%; background:rgba(255,255,255,.1); pointer-events:none; }
.panel__tab{ display:none; }
.panel__body{ position:relative; display:grid; gap:18px; padding:28px 22px 24px; }
.panel__en{ margin:0; font-family:var(--ff-en); font-style:italic; font-weight:500; font-size:64px; line-height:.95; opacity:.5; font-variation-settings:"opsz" 144; }
.panel__title{ margin:4px 0 6px; font-size:calc(23px * var(--fs)); letter-spacing:.12em; }
.panel__desc{ margin:0 0 20px; font-size:calc(15px * var(--fs)); font-weight:500; line-height:1.9; }
.panel__photos{ display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:10px; }
.panel__photos .frame{ aspect-ratio:1; border-width:5px; border-radius:18px; box-shadow:0 8px 18px rgba(0,0,0,.12); }

@container enjoy (min-width:880px){
  .panels{ flex-direction:row; gap:12px; height:500px; }
  .panel{ flex:0 0 96px; transition:flex-grow .75s cubic-bezier(.6,0,.2,1), flex-basis .75s cubic-bezier(.6,0,.2,1); }
  .panel.is-open{ flex:1 1 0; }
  .panel__tab{
    position:absolute; inset:0; z-index:2;
    display:flex; flex-direction:column; align-items:center; justify-content:space-between;
    padding:26px 0 24px; border:0; background:transparent; color:inherit; cursor:pointer;
    transition:opacity .35s, background .3s;
  }
  .panel__tab:hover{ background:rgba(255,255,255,.08); }
  .panel.is-open .panel__tab{ opacity:0; pointer-events:none; }
  .panel__no{ font-family:var(--ff-en); font-size:calc(14px * var(--fs)); font-weight:700; opacity:.85; }
  .panel__tab-en{ writing-mode:vertical-rl; font-family:var(--ff-en); font-style:italic; font-size:48px; line-height:1; font-variation-settings:"opsz" 144; }
  .panel__tab-ja{ writing-mode:vertical-rl; font-family:var(--ff-hand); font-weight:600; font-size:calc(19px * var(--fs)); letter-spacing:.24em; padding:10px 6px; border-radius:999px; background:rgba(255,255,255,.18); }
  .panel__body{
    position:absolute; top:0; left:0; bottom:0;
    width:calc(100cqw - 3 * 96px - 3 * 12px);
    grid-template-columns:minmax(0,1fr) minmax(0,1.08fr); align-items:center; gap:32px;
    padding:40px 44px;
    opacity:0; visibility:hidden; transition:opacity .3s, visibility 0s .3s;
  }
  .panel.is-open .panel__body{ opacity:1; visibility:visible; transition:opacity .6s .4s, visibility 0s; }
  .panel__en{ font-size:112px; }
  .panel__title{ font-size:calc(27px * var(--fs)); }
  .panel__photos{ grid-template-columns:1fr 1fr; grid-template-rows:1fr 1fr; height:100%; max-height:400px; }
  .panel__photos .frame{ aspect-ratio:auto; }
  .panel__photos .frame:first-child{ grid-row:span 2; }
}

/* ---------- 体験 ---------- */
.exp__deco{ width:84px; left:4%; top:80px; transform:rotate(-20deg); }
.exp-grid{ display:grid; grid-template-columns:repeat(auto-fill, minmax(290px, 1fr)); gap:28px 24px; }
.exp-card{ position:relative; display:flex; flex-direction:column; padding:10px 10px 20px; border-radius:var(--radius-l); background:var(--c-paper); box-shadow:var(--shadow-card); }
.exp-card__photo{ position:relative; overflow:hidden; aspect-ratio:4/3; border-radius:20px; }
.exp-card__photo .ph{ position:absolute; inset:0; aspect-ratio:auto; height:100%; }
.exp-card__flag{ position:absolute; top:22px; right:22px; z-index:2; }
.exp-card.is-ended .exp-card__photo .ph{ filter:grayscale(.55); opacity:.85; }
.exp-card__body{ display:flex; flex-direction:column; flex:1; padding:16px 10px 0; }
.exp-card__name{ margin:0; font-size:calc(18px * var(--fs)); color:var(--c-ai); letter-spacing:.06em; line-height:1.45; }
.price{ margin:6px 0 12px; font-size:calc(12.5px * var(--fs)); color:var(--c-ink-sub); line-height:1.5; }
.price b{ font-family:var(--ff-en); font-size:calc(24px * var(--fs)); font-weight:700; color:var(--c-ayame); letter-spacing:0; }
.price .yen{ font-size:calc(14px * var(--fs)); font-weight:700; color:var(--c-ayame); margin:0 2px 0 1px; }
.price__child{ display:inline-block; margin-left:8px; padding:0 8px; border-radius:999px; background:var(--c-ayame-pale); color:var(--c-ayame); font-weight:700; font-size:calc(11.5px * var(--fs)); }
.meta{ list-style:none; display:flex; flex-wrap:wrap; gap:4px 16px; margin:0 0 12px; padding:10px 0; border-block:1px dashed var(--rule); font-size:calc(13px * var(--fs)); line-height:1.6; }
.meta li{ display:flex; align-items:center; gap:5px; }
.meta .i{ width:18px; height:18px; color:var(--c-fuji); }
.exp-card__desc{ flex:1; margin:0 0 16px; font-size:calc(14px * var(--fs)); line-height:1.85; }
.exp-card__foot{ display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; }
.exp-card__lead{ font-size:calc(12px * var(--fs)); color:var(--c-ink-sub); }
/* 区分ごとのまとまり（A 予約できる／B 日程が決まっている／C 当日そのまま。発注書 S19） */
.exp-group + .exp-group{ margin-top:clamp(44px, 6vw, 72px); }
.exp-group__head{ display:grid; grid-template-columns:auto minmax(0,1fr); align-items:center; gap:4px 14px; margin:0 0 22px; padding:0 0 14px; border-bottom:2px dashed var(--c-fuji-pale); }
.exp-group__label{ margin:0; padding:3px 12px; border-radius:999px; background:#007A38; color:#fff; font-family:var(--ff-en); font-size:calc(12.5px * var(--fs)); font-weight:700; letter-spacing:.12em; line-height:1.6; }
.exp-group--b .exp-group__label{ background:#C8174F; }
.exp-group--c .exp-group__label{ background:#8A5A1C; }
.exp-group__title{ margin:0; font-size:calc(clamp(18px, 2vw, 22px) * var(--fs)); color:var(--c-ai); letter-spacing:.08em; line-height:1.5; }
.exp-group__note{ grid-column:1 / -1; margin:0; font-size:calc(16px * var(--fs)); line-height:1.8; color:var(--c-ink-sub); }
.exp-grid--compact .exp-card__photo{ aspect-ratio:16/9; }
.guide-talk{ display:flex; align-items:center; justify-content:center; gap:16px; margin-top:44px; }
.guide-talk__usagi{ width:96px; height:96px; flex:none; }
.guide-talk .bubble{ font-size:calc(16px * var(--fs)); }

/* ---------- LINEでできること ---------- */
.line-sec{ position:relative; margin-top:24px; }
.line-sec .wave{ color:var(--c-leaf-pale); }
.line-sec__body{ background:var(--c-leaf-pale); }
.line-sec__grid{ display:grid; grid-template-columns:auto minmax(0,1fr); gap:clamp(32px, 6vw, 88px); align-items:center; max-width:980px; margin:0 auto; }
.phone-wrap{ position:relative; justify-self:center; }
.phone-wrap__deco{ width:120px; left:-58px; bottom:30px; z-index:3; }
.phone{ position:relative; width:280px; height:574px; padding:11px; border-radius:46px; background:#24232c; box-shadow:0 30px 60px rgba(0,80,40,.22), inset 0 0 0 2px #3b3a46; }
.phone__notch{ position:absolute; z-index:3; top:11px; left:50%; width:108px; height:26px; transform:translateX(-50%); border-radius:0 0 18px 18px; background:#24232c; }
.phone__screen{ height:100%; display:flex; flex-direction:column; overflow:hidden; border-radius:36px; background:var(--c-base); font-size:calc(12px * var(--fs)); line-height:1.5; letter-spacing:.02em; }
.liff-head{ display:flex; align-items:center; justify-content:space-between; padding:34px 16px 10px; background:#fff; border-bottom:1px solid #ece8df; font-weight:700; }
.liff-head__x,.liff-head__more{ width:20px; color:var(--c-ink-sub); font-size:calc(15px * var(--fs)); text-align:center; }
.liff-head__title{ font-size:calc(13px * var(--fs)); }
.liff-body{ flex:1; display:flex; flex-direction:column; gap:10px; padding:14px 14px 12px; overflow:hidden; }
.liff-body__hello{ margin:0; font-size:calc(13px * var(--fs)); font-weight:700; color:var(--c-ai); }
.liff-card{ display:flex; gap:10px; padding:8px; border-radius:14px; background:#fff; box-shadow:0 3px 10px rgba(62,68,120,.08); }
.liff-card + .liff-card{ margin-top:10px; }
.liff-card .ph{ width:78px; flex:none; aspect-ratio:1; border-radius:10px; }
.liff-card__name{ margin:2px 0 0; font-size:calc(12.5px * var(--fs)); font-weight:700; line-height:1.4; }
.liff-card__price{ margin:2px 0 0; font-family:var(--ff-en); font-weight:700; color:var(--c-ayame); font-size:calc(15px * var(--fs)); }
.liff-card__meta{ margin:2px 0 0; font-size:calc(10.5px * var(--fs)); color:var(--c-ink-sub); }
.liff-slots{ display:flex; gap:6px; margin-top:4px; }
.liff-slots span{ flex:1; text-align:center; padding:6px 0; border-radius:8px; background:#fff; border:1px solid var(--rule); font-size:calc(10.5px * var(--fs)); font-weight:700; color:var(--c-ai); }
.liff-slots span.is-on{ background:var(--c-ai); color:#fff; border-color:var(--c-ai); }
.liff-btn{ display:block; margin-top:auto; padding:11px; border-radius:999px; background:var(--c-line); color:#fff; font-weight:700; font-size:calc(13px * var(--fs)); text-align:center; }
.liff-tabs{ display:grid; grid-template-columns:repeat(4, 1fr); padding:7px 4px 16px; background:#fff; border-top:1px solid #ece8df; font-size:calc(9.5px * var(--fs)); color:var(--c-ink-sub); text-align:center; }
.liff-tabs span{ display:flex; flex-direction:column; align-items:center; gap:1px; }
.liff-tabs .i{ width:18px; height:18px; }
.liff-tabs .is-on{ color:var(--c-ai); font-weight:700; }
.steps{ position:relative; list-style:none; display:flex; flex-direction:column; gap:12px; margin:0 0 30px; padding:0; }
.steps::before{ content:""; position:absolute; left:35px; top:30px; bottom:30px; border-left:2px dashed rgba(0,145,67,.35); }
.step{ position:relative; display:flex; align-items:center; gap:16px; padding:11px 18px 11px 11px; border-radius:var(--radius-m); background:#fff; box-shadow:0 4px 14px rgba(0,145,67,.08); }
.step p{ margin:0; }
.step__no{ width:48px; height:48px; flex:none; display:grid; place-items:center; border-radius:50%; background:var(--c-leaf); color:#fff; font-family:var(--ff-en); font-size:calc(22px * var(--fs)); font-weight:700; }
.step:last-child .step__no{ background:var(--c-ayame); }
.step__ttl{ font-weight:700; color:var(--c-ai); line-height:1.5; }
.step__txt{ font-size:calc(13.5px * var(--fs)); color:var(--c-ink-sub); line-height:1.6; }

/* ---------- 苗の通販 ---------- */
.shop-grid{ display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); grid-auto-flow:dense; gap:22px 18px; }
.prod{ position:relative; display:flex; flex-direction:column; padding:10px 10px 18px; border-radius:var(--radius-m); background:var(--c-paper); box-shadow:var(--shadow-card); }
.prod__photo{ position:relative; overflow:hidden; aspect-ratio:1; border-radius:14px; }
.prod__photo .ph{ position:absolute; inset:0; aspect-ratio:auto; height:100%; }
.prod__badges{ position:absolute; top:10px; left:10px; right:10px; z-index:2; display:flex; flex-wrap:wrap; gap:4px; }
.badge--ship{ background:var(--c-leaf); color:#fff; }
.badge--last{ background:var(--c-ayame); color:#fff; }
.prod__body{ display:flex; flex-direction:column; flex:1; padding:12px 6px 0; }
.prod__name{ margin:0 0 4px; font-size:calc(15px * var(--fs)); line-height:1.55; letter-spacing:.03em; }
.prod__price{ margin:0; font-size:calc(12px * var(--fs)); color:var(--c-ink-sub); }
.prod__price b{ font-family:var(--ff-en); font-size:calc(20px * var(--fs)); font-weight:700; color:var(--c-ai); }
.prod__price .yen{ font-size:calc(13px * var(--fs)); font-weight:700; color:var(--c-ai); margin-right:2px; }
.prod__ship{ flex:1; display:flex; align-items:flex-start; gap:5px; margin:6px 0 14px; font-size:calc(12px * var(--fs)); line-height:1.6; color:var(--c-ink-sub); }
.prod__ship .i{ width:16px; height:16px; color:var(--c-leaf); margin-top:1px; }
.prod__desc{ margin:4px 0 0; font-size:calc(13.5px * var(--fs)); line-height:1.8; }
.prod .btn-line{ padding:9px 12px; font-size:calc(13.5px * var(--fs)); }
.prod--wide{ grid-column:span 2; flex-direction:row; gap:18px; background:linear-gradient(135deg, #fff, var(--c-fuji-pale)); }
.prod--wide .prod__photo{ width:46%; flex:none; aspect-ratio:auto; min-height:260px; }
.prod--wide .prod__body{ padding:10px 8px 0 0; }
.prod--wide .prod__name{ font-size:calc(18px * var(--fs)); color:var(--c-ai); }
.prod__collab{ display:inline-flex; align-self:flex-start; margin-bottom:8px; padding:1px 10px; border-radius:999px; background:var(--c-ai); color:#fff; font-size:calc(11.5px * var(--fs)); font-weight:700; }
.shop__note{ text-align:center; margin-top:24px; }

/* ---------- 鯉艸亭 ---------- */
.rest{ position:relative; margin-top:24px; }
.rest .wave{ color:var(--c-kaya-pale); }
.rest__body{ background:var(--c-kaya-pale); }
.rest__cloud{ width:130px; right:6%; top:40px; opacity:.9; }
.rest__grid{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(32px, 6vw, 80px); align-items:center; }
.rest__photos{ position:relative; padding:0 56px 64px 0; }
.rest__main{ aspect-ratio:4/5; }
.rest__sub{ position:absolute; right:0; bottom:0; width:50%; aspect-ratio:4/3; }
.rest__note{ position:absolute; left:-14px; top:26px; z-index:2; padding:6px 16px; border-radius:999px; background:#fff; box-shadow:var(--shadow-card); transform:rotate(-6deg); }
.rest__text > p{ margin:0; }
.open-table{ width:100%; border-collapse:separate; border-spacing:0 6px; font-size:calc(14px * var(--fs)); }
.open-table th{ width:6.5em; padding:10px 14px; border-radius:12px 0 0 12px; background:#fff; color:var(--c-kaya); font-weight:700; text-align:left; white-space:nowrap; }
.open-table td{ padding:10px 14px; border-radius:0 12px 12px 0; background:#fff; line-height:1.6; }
.open-table tr.is-now th,.open-table tr.is-now td{ background:var(--c-ai); color:#fff; }
.open-table tr.is-now .now-tag{ margin-left:8px; }
.menu{ margin-top:clamp(40px, 6vw, 64px); }
.menu__head{ display:flex; align-items:center; justify-content:space-between; gap:12px; }
.menu__head .mini-title{ margin:0; }
.slider-nav{ display:flex; gap:8px; }
.round-btn{ width:44px; height:44px; display:grid; place-items:center; border:2px solid var(--c-ai); border-radius:50%; background:#fff; color:var(--c-ai); cursor:pointer; transition:background .2s, color .2s, opacity .2s; }
.round-btn:hover:not(:disabled){ background:var(--c-ai); color:#fff; }
.round-btn:disabled{ opacity:.3; cursor:default; }
.h-scroll{ display:flex; gap:16px; margin:0; padding:14px 4px 22px; list-style:none; overflow-x:auto; scroll-snap-type:x mandatory; scroll-behavior:smooth; scrollbar-width:thin; overscroll-behavior-x:contain; }
.menu-card{ flex:0 0 228px; scroll-snap-align:start; padding:8px 8px 14px; border-radius:var(--radius-m); background:#fff; box-shadow:var(--shadow-card); position:relative; }
.menu-card .ph{ border-radius:12px; }
.menu-card__name{ margin:10px 6px 0; font-size:calc(15px * var(--fs)); font-weight:700; line-height:1.5; }
.menu-card__price{ margin:0 6px; font-size:calc(12px * var(--fs)); color:var(--c-ink-sub); }
.menu-card__price b{ font-family:var(--ff-en); font-size:calc(19px * var(--fs)); color:var(--c-kaya); }
.menu-card__tag{ position:absolute; top:16px; left:16px; z-index:2; }
.menu-card__note{ margin:4px 6px 0; font-size:calc(11.5px * var(--fs)); color:var(--c-ink-sub); line-height:1.5; }
.menu__notes{ list-style:none; padding:0; margin-top:16px; }
.rest__text .rest__lead{ margin-bottom:.4em; font-weight:700; color:var(--c-ai); }
/* S26a：/restaurant のお品書き（全 17 品。写真・値段・注記・公式の説明） */
.menu-list{ list-style:none; margin:16px 0 0; padding:0; display:grid; grid-template-columns:repeat(auto-fill, minmax(min(100%, 340px), 1fr)); gap:14px; }
.menu-item{ display:grid; grid-template-columns:136px minmax(0,1fr); gap:14px; align-items:start; padding:10px; border-radius:var(--radius-m); background:#fff; box-shadow:var(--shadow-card); }
.menu-item__photo{ position:relative; }
.menu-item__photo .ph{ border-radius:12px; }
.menu-item__photo .menu-card__tag{ top:6px; left:6px; }
.menu-item__name{ margin:2px 0 0; font-size:calc(15.5px * var(--fs)); font-weight:700; line-height:1.5; }
.menu-item .menu-card__price,.menu-item .menu-card__note{ margin-left:0; margin-right:0; }
.menu-item__desc{ margin:6px 0 0; font-size:calc(13px * var(--fs)); line-height:1.75; }
.rest__cta{ display:flex; flex-direction:column; align-items:center; gap:6px; margin-top:10px; }
.rest__cta .note{ margin-top:8px; }

/* ---------- イベント ---------- */
.event__deco{ width:84px; right:9%; top:70px; animation:floatY 6s ease-in-out infinite; }
.ev-up{ display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,1fr); overflow:hidden; border-radius:var(--radius-l); background:#fff; box-shadow:var(--shadow-card); }
.ev-up__photo{ position:relative; min-height:340px; }
.ev-up__photo .ph{ position:absolute; inset:0; aspect-ratio:auto; height:100%; }
.ev-up__body{ display:flex; flex-direction:column; align-items:flex-start; padding:36px 40px; }
.ev-date{ display:flex; align-items:baseline; flex-wrap:wrap; gap:4px 12px; margin:12px 0 0; color:var(--c-ayame); }
.ev-date__num{ font-family:var(--ff-en); font-size:calc(clamp(56px, 6vw, 80px) * var(--fs)); font-weight:500; line-height:1; letter-spacing:-.02em; font-variation-settings:"opsz" 144; }
.ev-date__label{ font-size:calc(15px * var(--fs)); font-weight:700; }
.ev-up__name{ margin:14px 0 4px; font-size:calc(clamp(20px, 2.1vw, 25px) * var(--fs)); color:var(--c-ai); letter-spacing:.06em; }
.ev-up__price{ margin:0; font-weight:700; color:var(--c-kaya); }
.ev-up__desc{ margin:10px 0 22px; font-size:calc(15px * var(--fs)); }
.event__sub{ margin-top:48px; }
.event-done{ display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:20px; }
.ev-card{ position:relative; display:flex; flex-direction:column; padding:10px 10px 18px; border-radius:var(--radius-m); background:var(--c-paper); box-shadow:var(--shadow-card); }
.ev-card .ph{ aspect-ratio:16/10; border-radius:12px; }
.ev-card__tag{ position:absolute; top:20px; left:20px; z-index:2; }
.ev-card__body{ padding:12px 6px 0; }
.ev-card__date{ margin:0; font-family:var(--ff-en); font-weight:700; color:var(--c-fuji); font-size:calc(14px * var(--fs)); }
.ev-card__name{ margin:2px 0 4px; font-size:calc(16.5px * var(--fs)); color:var(--c-ai); line-height:1.5; }
.ev-card__price{ margin:0; font-size:calc(12.5px * var(--fs)); font-weight:700; color:var(--c-kaya); }
.ev-card__desc{ margin:6px 0 0; font-size:calc(13px * var(--fs)); line-height:1.8; }
.ev-card__next{ display:flex; align-items:center; gap:6px; margin:10px 0 0; padding:8px 10px; border-radius:10px; background:var(--c-leaf-pale); font-size:calc(12.5px * var(--fs)); font-weight:700; color:var(--c-leaf); line-height:1.5; }
.ev-card__next .i{ width:18px; height:18px; }

/* ---------- お知らせ ---------- */
.news{ background:linear-gradient(to bottom, transparent, rgba(236,229,211,.55) 30%, rgba(236,229,211,.55) 70%, transparent); }
.news__inner{ display:grid; grid-template-columns:auto minmax(0,1fr); gap:clamp(20px, 4vw, 56px); align-items:start; }
.news__giant{ margin:0; writing-mode:vertical-rl; font-family:var(--ff-en); font-weight:700; font-size:clamp(96px, 11vw, 168px); line-height:.86; letter-spacing:.02em; color:var(--c-fuji); opacity:.25; font-variation-settings:"opsz" 144; }
.news__main{ min-width:0; }
.news__head{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:6px; }
.news-card{ flex:0 0 272px; scroll-snap-align:start; display:flex; flex-direction:column; padding:10px 10px 18px; border-radius:var(--radius-m); background:#fff; box-shadow:var(--shadow-card); }
.news-card .ph{ aspect-ratio:16/10; border-radius:12px; }
.news-card__meta{ display:flex; align-items:center; gap:10px; margin:12px 6px 6px; }
.news-card time{ font-family:var(--ff-en); font-size:calc(14px * var(--fs)); font-weight:700; color:var(--c-ink-sub); }
.cat{ padding:0 10px; border-radius:999px; background:var(--cc, var(--c-fuji)); color:#fff; font-size:calc(11px * var(--fs)); font-weight:700; line-height:1.8; }
.cat--event{ --cc:var(--c-sun); color:var(--c-ink); }
.cat--shop{ --cc:var(--c-leaf); }
.cat--bloom{ --cc:var(--c-ayame); }
.cat--info{ --cc:var(--c-fuji); }
.news-card__title{ margin:0 6px; font-size:calc(14.5px * var(--fs)); font-weight:700; line-height:1.75; }
.news__main > .btn{ margin-top:8px; }

/* ---------- 団体・バス ---------- */
.group{ padding-top:clamp(40px, 5vw, 64px); padding-bottom:clamp(40px, 5vw, 64px); }
.group__card{ position:relative; padding:clamp(26px, 4vw, 48px); border-radius:var(--radius-l); background:#fff; box-shadow:var(--shadow-card); }
.group__head{ display:flex; align-items:center; gap:18px; margin-bottom:26px; }
.group__icon{ width:68px; height:68px; flex:none; display:grid; place-items:center; border-radius:50%; background:var(--c-fuji-pale); color:var(--c-ai); }
.group__icon .i{ width:36px; height:36px; }
.group__en{ margin:0; font-family:var(--ff-en); font-style:italic; font-size:calc(18px * var(--fs)); color:var(--c-fuji); line-height:1.2; }
.group__list{ list-style:none; display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:16px; margin:0 0 28px; padding:0; }
.group__item{ padding:20px 20px 18px; border-radius:var(--radius-m); background:var(--c-base); }
.group__item h3{ display:flex; align-items:center; gap:8px; margin:0 0 6px; font-size:calc(16px * var(--fs)); color:var(--c-ai); }
.group__item h3 .i{ color:var(--c-fuji); width:22px; height:22px; }
.group__item p{ margin:0; font-size:calc(14.5px * var(--fs)); line-height:1.8; }
.group__item b{ font-family:var(--ff-en); font-size:calc(19px * var(--fs)); color:var(--c-ai); }
.group__btns{ display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:16px; }

/* ---------- アクセス・FAQ ---------- */
.access__grid{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(28px, 4vw, 52px); align-items:start; }
.access__left > .mini-title:first-child,.access__right > .mini-title:first-child{ margin-top:0; }
.info-list{ margin:0; padding:6px 20px; border-radius:var(--radius-m); background:#fff; box-shadow:var(--shadow-card); }
.info-list > div{ display:grid; grid-template-columns:5.2em minmax(0,1fr); gap:12px; padding:11px 0; border-bottom:1px dashed var(--rule); font-size:calc(14px * var(--fs)); line-height:1.75; }
.info-list > div:last-child{ border-bottom:0; }
.info-list dt{ font-weight:700; color:var(--c-ai); }
.info-list dd{ margin:0; }
.info-list a{ color:var(--c-ai); font-weight:700; }
.map-ph{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; margin:18px 0 0; aspect-ratio:16/8; border:2px dashed rgba(62,68,120,.3); border-radius:var(--radius-m); background:rgba(255,255,255,.55); color:var(--c-ink-sub); font-size:calc(14px * var(--fs)); }
.map-ph .i{ width:40px; height:40px; color:var(--c-ayame); }
.map-ph p{ margin:0; }
.access-table{ width:100%; border-collapse:collapse; overflow:hidden; border-radius:var(--radius-m); background:#fff; box-shadow:var(--shadow-card); font-size:calc(14px * var(--fs)); }
.access-table th,.access-table td{ padding:10px 16px; border-bottom:1px solid var(--rule); text-align:left; }
.access-table thead th{ background:var(--c-ai); color:#fff; font-size:calc(13px * var(--fs)); font-weight:700; }
.access-table td:last-child{ font-weight:700; color:var(--c-ai); white-space:nowrap; }
/* S26a：公式の「電車」「自動車」の見出しの行 */
.access-table .access-table__group th{ padding:6px 16px; background:rgba(62,68,120,.07); color:var(--c-ai); font-size:calc(12.5px * var(--fs)); font-weight:700; }
.access-table tbody:last-child tr:last-child td{ border-bottom:0; }
.basic{ list-style:none; display:flex; flex-direction:column; gap:10px; margin:0; padding:0; }
.basic li{ display:flex; align-items:flex-start; gap:14px; padding:14px 16px; border-radius:var(--radius-m); background:#fff; box-shadow:var(--shadow-card); }
.basic__icon{ width:44px; height:44px; flex:none; display:grid; place-items:center; border-radius:50%; background:var(--c-leaf-pale); color:var(--c-leaf); }
.basic__icon .i{ width:24px; height:24px; }
.basic__label{ display:flex; align-items:center; flex-wrap:wrap; gap:8px; margin:0; font-weight:700; color:var(--c-ai); line-height:1.6; }
.basic__text{ margin:2px 0 0; font-size:calc(14px * var(--fs)); line-height:1.75; }
.faq__title{ margin-top:36px!important; }
.faq details{ margin-bottom:10px; border-radius:var(--radius-m); background:#fff; box-shadow:var(--shadow-card); }
.faq summary{ position:relative; display:flex; align-items:center; gap:12px; padding:13px 48px 13px 14px; list-style:none; cursor:pointer; font-size:calc(15px * var(--fs)); font-weight:700; line-height:1.6; }
.faq summary::-webkit-details-marker{ display:none; }
.faq summary::after{ content:""; position:absolute; right:20px; top:50%; width:10px; height:10px; border-right:2px solid var(--c-ai); border-bottom:2px solid var(--c-ai); transform:translateY(-70%) rotate(45deg); transition:transform .3s; }
.faq details[open] summary::after{ transform:translateY(-25%) rotate(-135deg); }
.qa{ width:32px; height:32px; flex:none; display:grid; place-items:center; border-radius:50%; font-family:var(--ff-en); font-size:calc(16px * var(--fs)); font-weight:700; line-height:1; }
.qa--q{ background:var(--c-ai); color:#fff; }
.qa--a{ background:var(--c-ayame-pale); color:var(--c-ayame); }
.faq__a{ display:flex; gap:12px; padding:0 18px 16px 14px; font-size:calc(14.5px * var(--fs)); line-height:1.85; }
.faq__a p{ margin:3px 0 0; }
.faq__a a{ color:var(--c-ai); font-weight:700; }

/* ---------- CTA ---------- */
.cta{ padding-top:clamp(40px, 5vw, 64px); }
.cta__box{
  position:relative;
  display:grid; grid-template-columns:150px minmax(0,1fr) auto; gap:clamp(20px, 3vw, 40px); align-items:center;
  padding:clamp(28px, 4vw, 48px); border-radius:var(--radius-l);
  background:
    radial-gradient(circle at 92% 110%, rgba(117,124,186,.45) 0 120px, transparent 121px),
    radial-gradient(circle at 18% -30%, rgba(117,124,186,.35) 0 140px, transparent 141px),
    var(--c-ai);
  color:#fff; box-shadow:0 20px 44px rgba(43,47,87,.25);
}
.cta__usagi{ width:150px; height:150px; }
.cta__en{ margin:0; font-family:var(--ff-en); font-style:italic; font-size:20px; color:#C9CCEB; line-height:1.2; }
.cta__title{ margin:4px 0 2px; font-size:calc(clamp(20px, 2.2vw, 27px) * var(--fs)); letter-spacing:.08em; }
.cta__lead{ margin:0 0 18px; font-size:calc(15px * var(--fs)); opacity:.92; }
.cta__row{ display:flex; flex-wrap:wrap; align-items:center; gap:18px; }
.qr-ph{ width:108px; height:108px; flex:none; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px; border:2px dashed rgba(255,255,255,.6); border-radius:14px; background:rgba(255,255,255,.06); font-size:calc(12px * var(--fs)); }
.qr-ph .i{ width:34px; height:34px; opacity:.85; }
.cta__tel{ padding:20px 24px; border-radius:var(--radius-m); background:rgba(255,255,255,.1); text-align:center; line-height:1.5; }
.cta__tel-label{ display:flex; align-items:center; justify-content:center; gap:6px; margin:0; font-size:calc(13px * var(--fs)); opacity:.9; }
.cta__tel-num{ display:block; margin:4px 0; font-family:var(--ff-en); font-size:calc(clamp(26px, 2.6vw, 32px) * var(--fs)); font-weight:700; color:#fff; text-decoration:none; letter-spacing:.02em; }
.cta__tel-note{ margin:0; font-size:calc(12px * var(--fs)); opacity:.85; }

/* ---------- フッター ---------- */
.footer{ position:relative; margin-top:clamp(40px, 5vw, 72px); color:#fff; }
.footer__land{ position:relative; margin-bottom:-1px; }
.footer__land img{ display:block; width:100%; height:auto; min-height:70px; object-fit:cover; object-position:50% 100%; filter:url(#f-aideep); }
/* 絵の地面の線は波打っていて下端がところどころ透けるので、下の数 px をフッターの色でふさぐ（発注書 S19） */
.footer__land::after{ content:""; position:absolute; left:0; right:0; bottom:0; height:6px; background:var(--c-ai-deep); }
.footer__body{ padding:36px var(--gutter) 28px; background:var(--c-ai-deep); }
.footer__grid{ display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,1fr); gap:40px; }
.footer__logo{ width:320px; max-width:100%; height:auto; }
.footer address{ margin-top:20px; font-style:normal; font-size:calc(14px * var(--fs)); line-height:1.9; opacity:.92; }
.footer address p{ margin:0; }
.footer address a{ color:#fff; }
.footer__sns{ display:flex; gap:10px; margin-top:16px; }
.sns-link--dark{ background:rgba(255,255,255,.12); color:#fff; }
.sns-link--dark:hover{ background:#fff; color:var(--c-ai-deep); }
.footer__nav ul{ columns:2; column-gap:32px; list-style:none; margin:0; padding:0; }
.footer__nav li{ break-inside:avoid; margin-bottom:10px; }
.footer__nav a{ display:inline-flex; align-items:center; gap:10px; font-size:calc(14px * var(--fs)); text-decoration:none; opacity:.92; }
.footer__nav a::before{ content:""; width:6px; height:6px; border-radius:50%; background:var(--c-fuji); }
.footer__nav a:hover{ opacity:1; text-decoration:underline; }
.footer__bottom{ display:flex; flex-wrap:wrap; align-items:center; gap:8px 28px; margin-top:36px; padding-top:20px; border-top:1px solid rgba(255,255,255,.16); font-size:calc(12.5px * var(--fs)); }
.footer__bottom p{ margin:0; opacity:.85; }
.footer__proposal{ display:inline-flex; align-items:center; gap:6px; margin-left:auto; padding:8px 18px; border-radius:999px; background:#fff; color:var(--c-ai-deep); font-weight:700; text-decoration:none; transition:transform .2s; }
.footer__proposal:hover{ transform:translateY(-2px); }

/* ---------- 固定UI ---------- */
.side-tab,.float-line{ display:none; }
@media (min-width:1080px){
  .side-tab{
    position:fixed; right:0; top:50%; z-index:60; transform:translateY(-50%);
    display:flex; align-items:center; gap:10px;
    writing-mode:vertical-rl;
    padding:20px 11px; border-radius:16px 0 0 16px;
    background:var(--c-ai); color:#fff; text-decoration:none;
    font-size:calc(14px * var(--fs)); font-weight:700; letter-spacing:.18em;
    box-shadow:0 6px 18px rgba(43,47,87,.18); /* 発注書 S24：片側だけの影をやめる */
    transition:padding .2s, background .2s;
  }
  .side-tab:hover{ padding-right:16px; background:var(--c-ai-deep); }
  .side-tab .i{ width:20px; height:20px; }
  .float-line{
    position:fixed; right:28px; bottom:28px; z-index:60;
    display:inline-flex; align-items:center; gap:8px;
    padding:14px 26px 14px 20px; border-radius:999px;
    background:var(--c-line); color:#fff; text-decoration:none; font-weight:700; letter-spacing:.06em;
    box-shadow:0 12px 28px rgba(6,160,70,.35);
    opacity:0; transform:translateY(24px) scale(.94); pointer-events:none;
    transition:opacity .4s, transform .4s cubic-bezier(.2,.8,.2,1);
  }
  .float-line .i{ width:24px; height:24px; }
  .float-line.is-show{ opacity:1; transform:none; pointer-events:auto; }
  .float-line.is-show:hover{ transform:translateY(-2px); }
}
.sp-bar{
  position:fixed; left:0; right:0; bottom:0; z-index:100;
  display:grid; grid-template-columns:2fr 1fr 1fr;
  height:calc(var(--bar-h) + env(safe-area-inset-bottom, 0px));
  padding-bottom:env(safe-area-inset-bottom, 0px);
  background:#fff; box-shadow:0 -4px 18px rgba(43,47,87,.12);
}
.sp-bar a{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:1px; color:var(--c-ai); font-size:calc(11px * var(--fs)); font-weight:700; text-decoration:none; line-height:1.3; }
.sp-bar a + a{ border-left:1px solid var(--rule); }
.sp-bar .i{ width:22px; height:22px; }
.sp-bar .sp-bar__line{ flex-direction:row; gap:6px; background:var(--c-line); color:#fff; font-size:calc(14.5px * var(--fs)); letter-spacing:.04em; }
.sp-bar .sp-bar__line .i{ width:26px; height:26px; }
@media (min-width:1080px){ .sp-bar{ display:none; } }

/* ---------- 提案ポイント ---------- */
[data-issue]{ position:relative; }
.issue-pins{ display:none; position:absolute; top:-20px; left:-12px; z-index:40; gap:6px; }
html.show-issues .issue-pins{ display:flex; }
html.show-issues [data-issue]{ outline:2px dashed rgba(229,32,95,.5); outline-offset:10px; border-radius:var(--radius-m); }
.issue-pin{ position:relative; }
.issue-pin__btn{
  width:48px; height:48px; padding:0;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  border:3px solid #fff; border-radius:50%;
  background:var(--c-ayame); color:#fff; cursor:pointer;
  font-size:calc(9.5px * var(--fs)); font-weight:700; line-height:1.05; letter-spacing:0;
  box-shadow:0 5px 14px rgba(229,32,95,.45);
  animation:pinIn .45s cubic-bezier(.3,1.6,.5,1) backwards;
}
.issue-pin__btn b{ font-family:var(--ff-en); font-size:calc(18px * var(--fs)); line-height:1; }
.issue-pin__btn:hover{ transform:scale(1.08); }
@keyframes pinIn{ from{ transform:scale(0); } }
.issue-pop{
  display:none; position:absolute; top:calc(100% + 8px); left:0; z-index:41;
  width:min(310px, 80vw); padding:14px 16px;
  border-radius:14px; border-top:4px solid var(--c-ayame);
  background:#fff; color:var(--c-ink); text-align:left;
  box-shadow:0 16px 36px rgba(43,47,87,.28);
  font-size:calc(13px * var(--fs)); line-height:1.75; letter-spacing:.02em;
}
.issue-pin:hover .issue-pop,.issue-pin.is-open .issue-pop{ display:block; }
.issue-pop__ttl{ display:block; margin:0 0 4px; font-size:calc(14.5px * var(--fs)); color:var(--c-ayame); }
.issue-pop p{ margin:0; }
.issue-pop .issue-pop__sol{ margin-top:8px; padding-top:8px; border-top:1px dashed var(--rule); color:var(--c-ai); font-weight:700; }
.issue-flash{ animation:issueFlash 1.8s ease; }
@keyframes issueFlash{ 0%,100%{ outline-color:rgba(229,32,95,.5); } 30%,60%{ outline-color:rgba(229,32,95,1); outline-width:4px; } }

.issue-panel{
  position:fixed; z-index:90;
  left:12px; bottom:calc(var(--bar-h) + 58px + env(safe-area-inset-bottom, 0px));
  width:min(320px, calc(100vw - 24px));
  overflow:hidden; border:2px solid var(--c-ayame); border-radius:16px;
  background:#fff; box-shadow:0 16px 40px rgba(43,47,87,.25);
}
.issue-panel[hidden]{ display:none; }
@media (min-width:1080px){ .issue-panel{ left:calc(var(--sidebar-w) + 20px); bottom:66px; } }
.issue-panel__head{ width:100%; display:flex; align-items:center; gap:8px; padding:10px 14px; border:0; background:var(--c-ayame); color:#fff; font-size:calc(13.5px * var(--fs)); font-weight:700; text-align:left; cursor:pointer; }
.issue-panel__head > .i{ margin-left:auto; transition:transform .3s; }
.issue-panel.is-collapsed .issue-panel__head > .i{ transform:rotate(180deg); }
.issue-panel__badge{ width:20px; height:20px; display:grid; place-items:center; border-radius:50%; background:#fff; color:var(--c-ayame); font-size:calc(12px * var(--fs)); font-weight:700; }
.issue-panel__list{ list-style:none; margin:0; padding:6px; }
.issue-panel.is-collapsed .issue-panel__list{ display:none; }
.issue-panel__list button{ width:100%; display:flex; align-items:center; gap:10px; padding:7px 8px; border:0; border-radius:10px; background:none; color:var(--c-ink); font-size:calc(13.5px * var(--fs)); font-weight:500; line-height:1.45; text-align:left; cursor:pointer; }
.issue-panel__list button:hover{ background:var(--c-ayame-pale); }
.issue-panel__list .n{ width:24px; height:24px; flex:none; display:grid; place-items:center; border-radius:50%; background:var(--c-ayame); color:#fff; font-family:var(--ff-en); font-size:calc(13px * var(--fs)); font-weight:700; }

/* ---------- トースト ---------- */
.toast{
  position:fixed; left:50%; z-index:400;
  bottom:calc(var(--bar-h) + 20px + env(safe-area-inset-bottom, 0px));
  max-width:calc(100vw - 32px); padding:12px 22px; border-radius:999px;
  background:var(--c-ai-deep); color:#fff; font-size:calc(14px * var(--fs)); line-height:1.5; text-align:center;
  box-shadow:0 10px 30px rgba(43,47,87,.3);
  opacity:0; transform:translate(-50%, 16px); pointer-events:none;
  transition:opacity .3s, transform .3s;
}
.toast.is-show{ opacity:1; transform:translate(-50%, 0); }
@media (min-width:1080px){ .toast{ left:calc(50% + var(--sidebar-w) / 2); bottom:32px; } }


/* =========================================================
   S16a：本番で足したもの（サイドバーのリンク・フッターの法務リンク・口コミ・Facebook など）
   ========================================================= */
.side-links ul{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:1fr 1fr; gap:2px 10px; }
.side-links a{ display:block; padding:3px 2px; font-size:calc(12.5px * var(--fs)); color:var(--c-ink-sub); text-decoration:none; line-height:1.5; }
.side-links a::before{ content:"・"; color:var(--c-fuji); }
.side-links a:hover,.side-links a[aria-current="page"]{ color:var(--c-ai); text-decoration:underline; }

.footer__legal{ display:flex; flex-wrap:wrap; gap:4px 18px; list-style:none; margin:0; padding:0; }
.footer__legal a{ color:#fff; opacity:.85; text-decoration:none; }
.footer__legal a:hover{ opacity:1; text-decoration:underline; }
.footer__nav a[aria-current="page"]{ opacity:1; text-decoration:underline; }

/* ヒーローの直後にお知らせ帯が無いとき */
.hero + .status{ margin-top:-64px; }

.st-card__hours--sm{ font-family:var(--ff-body); font-size:calc(14px * var(--fs)); }
.exp-card__name a,.prod__name a,.ev-card__name a{ color:inherit; text-decoration:none; }
.exp-card__name a:hover,.prod__name a:hover,.ev-card__name a:hover{ text-decoration:underline; }
.prod__cat{ margin:0 0 2px; font-size:calc(11.5px * var(--fs)); font-weight:700; color:var(--c-leaf); letter-spacing:.06em; }
.prod.is-soldout .prod__photo .ph{ filter:grayscale(.5); opacity:.8; }
.shop__more{ display:flex; justify-content:center; margin-top:18px; }
.line-steps__btn{ align-self:flex-start; }
.event__empty,.news__empty{ margin:0 0 20px; padding:24px; border-radius:var(--radius-m); background:var(--c-paper); text-align:center; color:var(--c-ink-sub); box-shadow:var(--shadow-card); }
.ev-up__body .btn{ margin-top:auto; }
.news-card__link{ display:flex; flex-direction:column; color:inherit; text-decoration:none; }
.news-card__link:hover .news-card__title{ color:var(--c-ai); text-decoration:underline; }
.btn--tel__label{ font-family:var(--ff-body); font-size:calc(14px * var(--fs)); font-weight:700; letter-spacing:.06em; margin-right:4px; }
.rest__cta .btn--tel{ flex-wrap:wrap; justify-content:center; }
.cta__qr{ width:108px; height:108px; flex:none; border-radius:14px; background:#fff; padding:6px; }
.map-ph{ text-decoration:none; }
.map-ph:hover{ border-color:var(--c-ai); color:var(--c-ai); }
.map-box{ margin:18px 0 0; overflow:hidden; border:6px solid #fff; border-radius:var(--radius-m); background:#fff; box-shadow:var(--shadow-card); }
.map-box__frame{ display:block; width:100%; aspect-ratio:16/10; border:0; }
.faq__more{ margin:14px 0 0; text-align:right; }
.faq__more a{ display:inline-flex; align-items:center; gap:6px; color:var(--c-ai); font-weight:700; font-size:calc(14px * var(--fs)); }
.faq__more .i{ width:18px; height:18px; }

/* お客様の声（管理画面で入力した口コミ。発注書 S19） */
.reviews{ background:linear-gradient(to bottom, transparent, rgba(231,232,244,.55) 26%, rgba(231,232,244,.55) 74%, transparent); }
.stars{
  --rate:100%;
  display:inline-block; width:92px; height:17px; flex:none;
  background:linear-gradient(90deg, #F2A93B var(--rate), #DDD6C8 var(--rate));
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 19'%3E%3Cpath d='M10 .8l2.7 5.8 6.3.7-4.7 4.3 1.3 6.2L10 14.6l-5.6 3.2 1.3-6.2L1 7.3l6.3-.7Z'/%3E%3C/svg%3E") 0 0/18.4px 17px repeat-x;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 19'%3E%3Cpath d='M10 .8l2.7 5.8 6.3.7-4.7 4.3 1.3 6.2L10 14.6l-5.6 3.2 1.3-6.2L1 7.3l6.3-.7Z'/%3E%3C/svg%3E") 0 0/18.4px 17px repeat-x;
}
.rv-card .stars{ width:115px; height:21px; -webkit-mask-size:23px 21px; mask-size:23px 21px; }
/* S23：口コミは横スクロール（JS・3D が使えるときは下の「3D リング」に組み替える） */
.rv-list{ display:flex; gap:18px; margin:0; padding:8px 4px 22px; overflow-x:auto; scroll-snap-type:x mandatory; overscroll-behavior-x:contain; scrollbar-width:none; }
.rv-list::-webkit-scrollbar{ display:none; }
.rv-list > .rv-card{ flex:0 0 min(340px, 84%); scroll-snap-align:center; }
.rv-list > .rv-card:first-child{ margin-left:auto; }
.rv-list > .rv-card:last-child{ margin-right:auto; }
.rv-card{ position:relative; display:flex; flex-direction:column; gap:10px; padding:22px 22px 18px; border-radius:var(--radius-l); background:var(--c-paper); box-shadow:var(--shadow-card); }
.rv-card::before{ content:"\201C"; position:absolute; right:18px; top:2px; font-family:var(--ff-en); font-size:64px; line-height:1; color:var(--c-fuji-pale); pointer-events:none; }
.rv-card__text{ position:relative; font-size:calc(16px * var(--fs)); line-height:1.9; overflow-wrap:anywhere; }
.rv-card__text p{ margin:0; }
.rv-card__text.is-clamped{ max-height:calc(1.9em * 6); overflow:hidden; }
.rv-card__text.is-clamped::after{ content:""; position:absolute; left:0; right:0; bottom:0; height:2.4em; background:linear-gradient(to bottom, rgba(255,253,248,0), var(--c-paper)); }
.rv-card__more{ align-self:flex-start; min-height:44px; padding:0 4px; border:0; background:none; color:var(--c-ai); font-size:calc(15px * var(--fs)); font-weight:700; text-decoration:underline; cursor:pointer; }
.rv-card__author{ display:flex; align-items:center; gap:12px; margin-top:auto; padding-top:12px; border-top:1px dashed var(--rule); }
.rv-card__avatar{ width:48px; height:48px; flex:none; border-radius:50%; object-fit:cover; background:var(--c-fuji-pale); }
.rv-card__avatar--none{ display:grid; place-items:center; color:var(--c-ai); font-size:calc(19px * var(--fs)); font-weight:700; }
.rv-card__name{ margin:0; min-width:0; font-size:calc(16px * var(--fs)); font-weight:700; color:var(--c-ai); line-height:1.5; overflow-wrap:anywhere; }
/* S35：お名前の下に小さく出どころ（Google マップのクチコミ）と投稿日の目安 */
.rv-card__who{ display:flex; flex-direction:column; gap:2px; min-width:0; }
.rv-card__src{ display:flex; flex-direction:column; margin:0; font-size:calc(13px * var(--fs)); line-height:1.5; color:var(--c-ink-sub); }
.rv-card__src-label{ overflow-wrap:anywhere; }
.rv-foot{ display:flex; flex-direction:column; align-items:center; gap:12px; margin-top:28px; text-align:center; }
.rv-foot__note{ margin:0; font-size:calc(14px * var(--fs)); color:var(--c-ink-sub); }
.rv-foot .btn{ max-width:100%; text-wrap:balance; }

/* Facebook（ページプラグイン。画面に入ってから iframe を読み込む） */
.fb{ margin-top:36px; }
.fb__title{ display:flex; align-items:center; gap:8px; margin:0 0 12px; font-size:calc(18px * var(--fs)); color:var(--c-ai); letter-spacing:.06em; }
.fb__title .i{ width:24px; height:24px; color:#1877F2; }
.fb__frame{ position:relative; width:100%; max-width:500px; min-height:120px; overflow:hidden; border:6px solid #fff; border-radius:var(--radius-m); background:#fff; box-shadow:var(--shadow-card); }
.fb__frame iframe{ display:block; width:100%; border:0; }
.fb__link{ display:flex; align-items:center; justify-content:center; gap:6px; min-height:120px; color:var(--c-ai); font-weight:700; }
.fb__link .i{ width:18px; height:18px; }
.fb__frame.is-loaded .fb__link{ display:none; }
.fb__logo{ color:#1877F2; }
.fb__more{ display:none; margin:10px 0 0; font-size:calc(13.5px * var(--fs)); }
.fb__frame.is-loaded + .fb__more{ display:block; }
.fb__more a{ display:inline-flex; align-items:center; gap:4px; color:var(--c-ai); font-weight:700; }
.fb__more .i{ width:16px; height:16px; }
/* 花ごよみ：右端のバーは「見頃」の札を内側に */
.cal__bar.is-tag-in .cal__bar-tag{ left:auto; right:6px; }
/* 商品が少ないときは中央に寄せる */
.shop-grid--few{ grid-template-columns:repeat(auto-fit, minmax(0, 262px)); justify-content:center; }

/* =========================================================
   レスポンシブ
   ========================================================= */
@media (max-width:1279px){
  .shop-grid{ grid-template-columns:repeat(3, minmax(0,1fr)); }
  .prod--wide{ grid-column:1 / -1; }
}
@media (max-width:1079px) and (min-width:768px){
  .status__grid{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  .stats{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  .season__bottom{ grid-template-columns:1fr; }
}

@media (max-width:767px){
  .demo-bar{ font-size:10.5px; padding-top:7px; padding-bottom:7px; gap:6px; }
  .demo-bar__text{ flex-basis:100%; }
  .issue-toggle{ font-size:calc(11.5px * var(--fs)); }
  .sec{ padding-top:64px; padding-bottom:64px; }
  .sec-lead{ font-size:calc(14.5px * var(--fs)); text-align:left; }
  .sec-head{ margin-bottom:32px; }

  /* ヒーロー（発注書 S29）：角丸の動画 → 横書き 3 行（左揃え。発注書 S32：以前の行ごとに右へずらす階段状をやめた）→ 右に大きい丸・左下に小さい丸 2 つ */
  .hero{ padding:14px var(--gutter) 60px; }
  .hero__stage{ height:auto; aspect-ratio:16/10; border-radius:20px; box-shadow:var(--shadow-card); container-type:normal; }
  .hero__catch,.hero__shade{ display:none; }
  .hero__toggle{ right:10px; bottom:10px; }
  .hero__sp{ display:block; position:relative; margin-top:14px; }
  .hero__sp-catch{
    position:relative; z-index:2; margin:0; padding-top:8px;
    font-family:var(--ff-hand); font-weight:600; font-size:calc(clamp(23px, 4.2vw, 30px) * var(--fs));
    line-height:1.55; letter-spacing:.02em; color:var(--c-ink);
  }
  .hero__sp-line{
    display:block; width:fit-content; max-width:100%;
    /* 大きい丸の写真にかかっても読めるよう、地の色でふちどる（白フチ文字。古い WebView でも崩れない影で描く） */
    --o:.1em; --od:.07em;
    text-shadow:
      var(--o) 0 0 var(--c-base), calc(var(--o) * -1) 0 0 var(--c-base), 0 var(--o) 0 var(--c-base), 0 calc(var(--o) * -1) 0 var(--c-base),
      var(--od) var(--od) 0 var(--c-base), calc(var(--od) * -1) var(--od) 0 var(--c-base), var(--od) calc(var(--od) * -1) 0 var(--c-base), calc(var(--od) * -1) calc(var(--od) * -1) 0 var(--c-base),
      0 0 .3em var(--c-base), 0 0 .5em rgba(246,242,232,.9);
  }
  .hero__sp-line em{ font-style:normal; color:var(--c-ayame); }
  html:lang(en) .hero__sp-catch{ font-size:calc(clamp(20px, 3.7vw, 26px) * var(--fs)); letter-spacing:.01em; line-height:1.5; }
  .hero__circle{ position:relative; z-index:1; flex:none; aspect-ratio:1; border-radius:50%; border:5px solid #fff; overflow:hidden; background:#fff; box-shadow:var(--shadow-card); }
  .hero__circle .ph{ position:absolute; inset:0; aspect-ratio:auto; height:100%; }
  /* 大きい丸は文字の右に並べる（標準の文字サイズの 375〜390 幅で文字と重ならない：左端を文字の右端＋6px に置き、右は余白に 14px はみ出す） */
  .hero__circle--1{ position:absolute; top:0; right:-14px; width:clamp(88px, calc(100% - 234px), 168px); }
  .hero__circles{ display:flex; align-items:flex-start; gap:6px; margin-top:10px; }
  .hero__circle--2{ width:min(28%, 130px); }
  .hero__circle--3{ width:min(21%, 98px); margin-top:32px; }

  .notice{ margin-top:-40px; }
  .notice__inner{ flex-wrap:wrap; gap:8px 10px; padding:12px 14px; border-radius:20px; }
  .notice__label{ padding:2px 12px; font-size:calc(12px * var(--fs)); }
  .notice__more{ width:30px; height:30px; margin-left:auto; order:2; }
  .notice__list{ order:3; flex-basis:100%; flex-direction:column; gap:6px; }
  .notice__list li{ font-size:calc(13px * var(--fs)); gap:8px; }
  .notice__list li + li{ padding-left:0; border-left:0; padding-top:6px; border-top:1px dashed var(--rule); }
  .notice__list time{ font-size:calc(12px * var(--fs)); }

  .status{ padding-top:16px; }
  .status__grid{ grid-template-columns:repeat(2, minmax(0,1fr)); gap:10px; }
  .st-card{ min-height:150px; padding:16px 14px; }
  .st-card__big{ font-size:calc(clamp(24px, 7.4vw, 36px) * var(--fs)); gap:6px; letter-spacing:.02em; }
  .st-card__hours{ font-size:calc(16px * var(--fs)); }
  .st-card__fee{ font-size:calc(11.5px * var(--fs)); }
  .st-card__ttl{ font-size:calc(14.5px * var(--fs)); }
  .st-card--open .st-card__ttl{ font-size:calc(12.5px * var(--fs)); }
  .st-card__icon{ width:42px; height:42px; }
  .st-card__icon .i{ width:23px; height:23px; }
  .st-card__sub{ font-size:calc(11.5px * var(--fs)); padding-right:24px; }
  .st-card__go{ width:26px; height:26px; right:10px; bottom:10px; }
  .st-card__tag{ top:12px; right:10px; }

  /* about */
  .about__grid{ grid-template-columns:minmax(0,1fr); gap:28px; }
  .v-en{ writing-mode:horizontal-tb; font-size:56px; margin-bottom:-18px; }
  .about__photos{ padding:0 0 36px 28px; }
  .about__note{ right:-4px; }
  .stats{ grid-template-columns:repeat(2, minmax(0,1fr)); gap:10px; }
  .stat{ padding:20px 8px 14px; }

  /* map */
  .chips{ flex-wrap:nowrap; justify-content:flex-start; overflow-x:auto; margin:0 calc(var(--gutter) * -1) 84px; padding:4px var(--gutter) 8px; scrollbar-width:none; }
  .chips::-webkit-scrollbar{ display:none; }
  .chip{ flex:none; font-size:calc(13px * var(--fs)); padding:7px 14px 7px 10px; }
  .map-guide{ left:-6px; top:-78px; }
  .map-guide__usagi{ width:78px; height:78px; }
  .map-guide__bubble{ font-size:calc(13px * var(--fs)); padding:7px 12px; margin-top:8px; }
  .map-frame{ border-width:5px; border-radius:20px; }
  .map-canvas__img{ border-radius:15px; }
  .pin{ width:23px; height:23px; margin:-11.5px 0 0 -11.5px; }
  .pin__ring-a{ stroke-width:2.6; }
  .pin__icon{ width:11px; height:11px; margin:-5.5px 0 0 -5.5px; }
  .pin__flag{ font-size:calc(10.5px * var(--fs)); padding:0 5px; }
  .map-pop{ display:none!important; }
  .map-detail{ display:block; margin-top:16px; }
  .map-detail:empty{ display:none; }
  .map-zoom{ right:8px; bottom:8px; padding:6px 12px 6px 10px; font-size:calc(12px * var(--fs)); }

  /* season */
  .season__deco{ top:36px; right:4%; width:54px; }
  .cal{ padding:16px 0 12px 14px; border-radius:22px; }
  .cal__grid{ --namew:128px; min-width:720px; }
  .cal__ill{ width:30px; height:30px; }
  .cal__name{ gap:6px; padding-right:8px; }
  .cal__flower{ font-size:calc(12.5px * var(--fs)); }
  .cal__count{ font-size:calc(10.5px * var(--fs)); }
  .cal__hint{ display:flex; align-items:center; gap:4px; margin:8px 0 0; font-size:calc(11.5px * var(--fs)); color:var(--c-ink-sub); }
  .cal__hint .i{ width:14px; height:14px; }
  .season__bottom{ grid-template-columns:minmax(0,1fr); }
  .fee{ padding:20px 16px; }
  .fee__table th,.fee__table td{ padding:9px 5px; }
  .fee__table td b{ font-size:calc(17px * var(--fs)); }
  .fee__table thead th{ font-size:calc(11px * var(--fs)); }

  /* enjoy */
  .panel__en{ font-size:54px; }

  /* exp */
  .exp-grid{ grid-template-columns:minmax(0,1fr); gap:20px; }
  .exp__deco{ top:40px; width:60px; }
  .exp-group__head{ grid-template-columns:minmax(0,1fr); gap:6px; }
  .exp-group__label{ justify-self:start; }
  .exp-grid--compact{ gap:14px; }
  .exp-grid--compact .exp-card{ display:grid; grid-template-columns:96px minmax(0,1fr); align-items:start; gap:0 14px; padding:12px; }
  .exp-grid--compact .exp-card__photo{ aspect-ratio:1/1; border-radius:14px; }
  .exp-grid--compact .ph__ill{ top:50%; width:80%; }
  .exp-grid--compact .exp-card__body{ padding:2px 0 0; }
  .exp-grid--compact .exp-card__desc{ margin-bottom:12px; }
  .guide-talk{ gap:10px; justify-content:flex-start; }
  .guide-talk__usagi{ width:72px; height:72px; }
  .guide-talk .bubble{ font-size:calc(14px * var(--fs)); }

  /* line */
  .line-sec__grid{ grid-template-columns:minmax(0,1fr); gap:36px; }
  .phone{ width:250px; height:512px; }
  .phone-wrap__deco{ width:90px; left:-40px; }
  .liff-card .ph{ width:66px; }
  .line-steps{ display:flex; flex-direction:column; align-items:stretch; }
  .line-steps .btn--lg{ font-size:calc(15px * var(--fs)); padding-left:22px; justify-content:space-between; }

  /* shop */
  .shop-grid{ grid-template-columns:repeat(2, minmax(0,1fr)); gap:12px; }
  .prod{ padding:7px 7px 14px; }
  .prod__name{ font-size:calc(13.5px * var(--fs)); }
  .prod__price b{ font-size:calc(19px * var(--fs)); }
  .prod .btn-line{ padding:8px 8px; font-size:calc(12px * var(--fs)); gap:4px; }
  .prod .btn-line .i{ width:1.3em; height:1.3em; }
  .prod--wide{ flex-direction:column; gap:0; }
  .prod--wide .prod__photo{ width:100%; min-height:0; aspect-ratio:16/10; }
  .prod--wide .prod__body{ padding:12px 6px 0; }
  .prod__badges .tag{ font-size:calc(10px * var(--fs)); padding:1px 7px; }

  /* restaurant */
  .rest__grid{ grid-template-columns:minmax(0,1fr); }
  .rest__photos{ padding:0 36px 48px 0; }
  .open-table{ font-size:calc(13px * var(--fs)); }
  .open-table th{ width:5.4em; padding:9px 10px; }
  .open-table td{ padding:9px 10px; }
  .menu-card{ flex-basis:200px; }
  .menu-item{ grid-template-columns:104px minmax(0,1fr); gap:12px; }
  .rest__cloud{ width:90px; top:10px; }

  /* event */
  .ev-up{ grid-template-columns:minmax(0,1fr); }
  .ev-up__photo{ min-height:220px; }
  .ev-up__body{ padding:24px 20px 26px; }
  .event-done{ grid-template-columns:minmax(0,1fr); }
  .event__deco{ top:44px; right:5%; width:60px; }

  /* news */
  .news__inner{ grid-template-columns:minmax(0,1fr); gap:0; }
  .news__giant{ writing-mode:horizontal-tb; font-size:84px; line-height:.8; margin-bottom:-6px; }
  .news-card{ flex-basis:240px; }

  /* group */
  .group__head{ gap:12px; }
  .group__icon{ width:54px; height:54px; }
  .group__list{ grid-template-columns:minmax(0,1fr); }
  .group__btns{ flex-direction:column; align-items:stretch; }
  .group__btns > *{ justify-content:center; }

  /* access */
  .access__grid{ grid-template-columns:minmax(0,1fr); }
  .info-list{ padding:4px 16px; }
  .info-list > div{ grid-template-columns:4.6em minmax(0,1fr); font-size:calc(13.5px * var(--fs)); }
  .access-table th,.access-table td{ padding:9px 12px; font-size:calc(13px * var(--fs)); }

  /* cta */
  .cta__box{ grid-template-columns:minmax(0,1fr); text-align:center; justify-items:center; padding-top:24px; }
  .cta__usagi{ width:110px; height:110px; }
  .cta__row{ flex-direction:column; }
  .cta__tel{ width:100%; }

  /* footer */
  .footer__grid{ grid-template-columns:minmax(0,1fr); gap:28px; }
  .footer__logo{ width:260px; }
  .footer__proposal{ margin-left:0; }
  .footer__bottom{ flex-direction:column; align-items:flex-start; }

  .issue-pins{ left:-6px; }
}

@media (max-width:374px){
  .sp-header__line{ display:none; }
  .status__grid{ grid-template-columns:minmax(0,1fr); }
}

/* =========================================================
   発注書 S23：トップ（SP）の見せ方
   入口のバナー（チケット・通販）／楽しみかた・手づくり体験の横スクロール／お客様の声の 3D リング
   ========================================================= */
.entries{ display:none; }
.exp-group__count{ display:none; }

/* 横スクロールの位置のドット（public/park/js/home.js が作る） */
.snap-dots{ display:flex; justify-content:center; gap:8px; margin-top:12px; }
.snap-dots[hidden]{ display:none; }
.snap-dots__dot{ width:8px; height:8px; border-radius:999px; background:rgba(62,68,120,.2); transition:width .3s, background-color .3s; }
.snap-dots__dot.is-active{ width:24px; background:var(--c-ai); }

/* ---------- お客様の声：前後のボタン・位置（普通の横スクロールでも前後のボタンは使う） ---------- */
.rv-ring{ position:relative; }
.rv-ring:focus-visible{ outline-offset:8px; }
.rv-ring__nav{ display:flex; align-items:center; justify-content:center; gap:12px; margin-top:6px; }
.rv-ring__nav[hidden]{ display:none; }
.rv-ring__pos{ min-width:4.6em; margin:0; font-family:var(--ff-en); font-size:calc(17px * var(--fs)); font-weight:700; color:var(--c-ai); text-align:center; letter-spacing:.08em; }
.rv-ring__pos[hidden],.rv-ring__auto[hidden],.rv-ring__hint[hidden]{ display:none; }
.rv-ring__auto{ margin-left:6px; border-color:rgba(62,68,120,.35); }
.rv-ring__auto .i{ width:18px; height:18px; }
.rv-ring__auto .rv-ring__play{ display:none; }
.rv-ring__auto.is-paused .rv-ring__play{ display:block; }
.rv-ring__auto.is-paused .rv-ring__pause{ display:none; }
.rv-ring__hint{ margin:10px 0 0; text-align:center; font-size:calc(14px * var(--fs)); color:var(--c-ink-sub); letter-spacing:.04em; }

/* ---------- お客様の声：3D リング（public/park/js/ring.js が .is-3d を付け、大きさを --rv-* で渡す） ----------
   ステージに遠近（perspective）、並び（.rv-list）を preserve-3d で円筒に。各カードは JS が rotateY(番号×角度) translateZ(半径)。
   裏側も見せる（backface-visibility: visible）ので、奥のカードは鏡文字で隙間から見える。奥ほど霞ませる（::after の不透明度 --fog） */
.rv-ring.is-3d .rv-ring__stage{
  position:relative; height:calc(var(--rv-h, 360px) + 64px); margin-inline:calc(var(--gutter) * -1); overflow:hidden;
  -webkit-perspective:var(--rv-p, 900px); perspective:var(--rv-p, 900px);
  -webkit-perspective-origin:50% var(--rv-po, 50%); perspective-origin:50% var(--rv-po, 50%);
  touch-action:pan-y; -webkit-user-select:none; user-select:none; -webkit-touch-callout:none; cursor:grab;
}
.rv-ring.is-3d.is-dragging .rv-ring__stage{ cursor:grabbing; }
.rv-ring.is-3d .rv-list{
  position:absolute; top:32px; left:50%; width:0; height:var(--rv-h, 360px); display:block; margin:0; padding:0; overflow:visible;
  -webkit-transform-style:preserve-3d; transform-style:preserve-3d; will-change:transform;
}
.rv-ring.is-3d .rv-list > .rv-card{
  position:absolute; top:0; left:calc(var(--rv-w, 280px) / -2); width:var(--rv-w, 280px); height:var(--rv-h, 360px); margin:0;
  -webkit-backface-visibility:visible; backface-visibility:visible;
  box-shadow:0 10px 24px rgba(62,68,120,.12);
}
.rv-ring.is-3d .rv-list > .rv-card.is-open{ height:auto; min-height:var(--rv-h, 360px); }
.rv-ring.is-3d .rv-card.is-off{ visibility:hidden; }
.rv-ring.is-3d .rv-card:not(.is-front){ pointer-events:none; }
.rv-ring.is-3d .rv-card::after{ content:""; position:absolute; inset:0; border-radius:inherit; background:#E3E2EE; opacity:var(--fog, 0); pointer-events:none; }
.rv-ring.is-3d .rv-card__avatar{ -webkit-user-drag:none; }

/* ---------- SP（〜767px） ---------- */
@media (max-width:767px){
  /* 本日の開園状況：横幅いっぱいの 1 枚（「CLOSED」の右に時間と入園料）。4 枚のカードのうちリンクの 3 枚は下の入口に置き換え */
  .status__grid{ grid-template-columns:minmax(0,1fr); }
  .status .st-card--link{ display:none; }
  .status .st-card--open{
    min-height:0; display:grid; grid-template-columns:auto minmax(0,1fr); grid-template-areas:"ttl ttl" "big info";
    align-items:center; gap:4px 16px; padding:14px 18px 16px 20px;
  }
  .status .st-card--open .st-card__ttl{ grid-area:ttl; }
  .status .st-card--open .st-card__big{ grid-area:big; gap:8px; margin:0!important; font-size:calc(clamp(25px, 7.4vw, 30px) * var(--fs)); }
  .status .st-card__info{ grid-area:info; min-width:0; padding-left:14px; border-left:1px solid rgba(255,255,255,.3); }
  .status .st-card__hours{ font-size:calc(17px * var(--fs)); }
  .status .st-card__hours--sm{ font-size:calc(14.5px * var(--fs)); line-height:1.5; }
  .status .st-card__fee{ margin-top:2px!important; font-size:calc(12.5px * var(--fs)); line-height:1.55; }

  /* 入口：① チケット・体験（チケットの形）② 苗・お土産の通販 ③ 予約・チケットの確認（行リンク） */
  .entries{ display:grid; grid-template-columns:minmax(0,1fr); gap:12px; margin:12px 0 0; }
  .entry{ position:relative; display:block; color:#fff; text-decoration:none; -webkit-tap-highlight-color:transparent; transition:transform .2s; }
  .entry:active{ transform:scale(.985); }
  .entry__en{ display:block; font-family:var(--ff-en); font-style:italic; font-weight:500; font-size:calc(15px * var(--fs)); line-height:1.2; letter-spacing:.02em; opacity:.8; }
  .entry__ttl{ display:block; margin-top:2px; font-size:calc(19px * var(--fs)); font-weight:700; letter-spacing:.08em; line-height:1.4; }
  .entry__cta{ display:inline-flex; align-items:center; gap:10px; min-height:44px; padding:4px 5px 4px 18px; border-radius:999px; background:#fff; font-size:calc(15.5px * var(--fs)); font-weight:700; letter-spacing:.04em; white-space:nowrap; box-shadow:0 3px 0 rgba(0,0,0,.14); }
  .entry__arrow{ width:34px; height:34px; flex:none; border-radius:50%; display:grid; place-items:center; color:#fff; }
  .entry__arrow .i{ width:18px; height:18px; }

  /* ① チケット：藍の地に藤の丸。左右の半円の切り欠きは mask、ミシン目は点線。影は切り欠きに沿うよう drop-shadow（mask の外側の要素に） */
  .entry--ticket{ --stub:62px; --notch:12px; filter:drop-shadow(0 8px 12px rgba(43,47,87,.22)); }
  .entry__ticket{
    position:relative; overflow:hidden; border-radius:18px;
    background:
      radial-gradient(circle at 100% 0, rgba(117,124,186,.55) 0 96px, transparent 97px),
      radial-gradient(circle at 0 100%, rgba(255,255,255,.06) 0 80px, transparent 81px),
      linear-gradient(135deg, var(--c-ai) 0%, #4A5192 100%);
    -webkit-mask:
      radial-gradient(circle var(--notch) at 0 calc(100% - var(--stub)), transparent 96%, #000) 0 0 / 51% 100% no-repeat,
      radial-gradient(circle var(--notch) at 100% calc(100% - var(--stub)), transparent 96%, #000) 100% 0 / 51% 100% no-repeat;
            mask:
      radial-gradient(circle var(--notch) at 0 calc(100% - var(--stub)), transparent 96%, #000) 0 0 / 51% 100% no-repeat,
      radial-gradient(circle var(--notch) at 100% calc(100% - var(--stub)), transparent 96%, #000) 100% 0 / 51% 100% no-repeat;
  }
  .entry__main{ display:grid; grid-template-columns:minmax(0,1fr) 100px; align-items:center; gap:12px; padding:18px 18px 16px 22px; }
  .entry__chips{ display:flex; flex-wrap:wrap; gap:6px; margin-top:10px; }
  .entry__chip{ padding:2px 11px; border:1px solid rgba(255,255,255,.4); border-radius:999px; background:rgba(255,255,255,.12); font-size:calc(13px * var(--fs)); font-weight:700; line-height:1.6; letter-spacing:.04em; }
  .entry__photo{ width:100px; aspect-ratio:1; overflow:hidden; border:4px solid rgba(255,255,255,.92); border-radius:50%; box-shadow:0 6px 14px rgba(0,0,0,.2); }
  .entry__photo .ph{ height:100%; aspect-ratio:auto; }
  .entry__stub{ display:flex; align-items:center; justify-content:space-between; gap:10px; height:var(--stub); margin:0 20px; border-top:2px dashed rgba(255,255,255,.45); }
  .entry__line{ display:inline-flex; align-items:center; gap:5px; padding:2px 10px 2px 7px; border-radius:999px; background:var(--c-line); font-size:calc(12px * var(--fs)); font-weight:700; letter-spacing:.06em; line-height:1.6; }
  .entry__line .i{ width:16px; height:16px; }
  .entry--ticket .entry__cta{ color:var(--c-ai); }
  .entry--ticket .entry__arrow{ background:var(--c-ai); }

  /* ② 通販：葉の緑。商品の写真（無ければイラスト）を 3 枚 */
  .entry--shop{
    display:grid; gap:12px; padding:18px 18px 16px 22px; overflow:hidden; border-radius:18px;
    background:
      radial-gradient(circle at 100% 100%, rgba(255,255,255,.1) 0 120px, transparent 121px),
      linear-gradient(135deg, #007A38 0%, #0B8F47 100%);
    box-shadow:0 8px 18px rgba(0,90,40,.22);
  }
  .entry__sub{ display:block; margin-top:2px; font-size:calc(14px * var(--fs)); line-height:1.5; opacity:.95; }
  .entry__goods{ display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:10px; padding:2px 2px 0; }
  .entry__good{ aspect-ratio:1; overflow:hidden; border:4px solid #fff; border-radius:16px; background:#fff; box-shadow:0 5px 12px rgba(0,0,0,.16); transform:rotate(var(--tilt, 0deg)); }
  .entry__good:nth-child(1){ --tilt:-3deg; }
  .entry__good:nth-child(2){ --tilt:2deg; }
  .entry__good:nth-child(3){ --tilt:-1.5deg; }
  .entry__good .ph{ height:100%; aspect-ratio:auto; }
  .entry__good .ph__ill{ top:50%; width:80%; }
  .entry--shop .entry__cta{ justify-self:end; color:#007A38; }
  .entry--shop .entry__arrow{ background:#007A38; }

  /* ③ 予約・チケットの確認：小さな行リンク */
  .entry-row{ display:flex; align-items:center; gap:12px; min-height:56px; padding:8px 14px 8px 8px; border:1px solid var(--rule); border-radius:14px; background:rgba(255,255,255,.7); color:var(--c-ai); text-decoration:none; }
  .entry-row__icon{ width:40px; height:40px; flex:none; display:grid; place-items:center; border-radius:50%; background:var(--c-fuji-pale); color:var(--c-ai); }
  .entry-row__icon .i{ width:22px; height:22px; }
  .entry-row__text{ flex:1; min-width:0; display:flex; flex-direction:column; line-height:1.45; }
  .entry-row__text b{ font-size:calc(16px * var(--fs)); letter-spacing:.04em; }
  .entry-row__text small{ font-size:calc(12.5px * var(--fs)); font-weight:500; color:var(--c-ink-sub); }
  .entry-row__go{ width:20px; height:20px; flex:none; }

  /* 楽しみかた：4 枚のパネルを横スクロール（1 枚 85%。次のパネルが少し見える） */
  .panels{
    flex-direction:row; gap:12px; overflow-x:auto; scroll-snap-type:x mandatory; overscroll-behavior-x:contain; scrollbar-width:none;
    margin-inline:calc(var(--gutter) * -1); padding:4px 0 8px var(--gutter); scroll-padding-inline:var(--gutter);
  }
  .panels::-webkit-scrollbar{ display:none; }
  .panels::after{ content:""; flex:0 0 1px; margin-left:calc(var(--gutter) - 13px); }
  .panel{ flex:0 0 85%; scroll-snap-align:start; }
  .panel__body{ height:100%; align-content:start; padding:24px 20px 22px; }
  .panel__photos{ gap:8px; }

  /* 手づくり体験：区分ごとに横スクロールのカード列（1 枚 80%）。見出しの右に件数 */
  .exp-group__head{ position:relative; }
  .exp-group__count{ position:absolute; top:0; right:0; display:inline-flex; align-items:center; gap:4px; margin:0; font-size:calc(14px * var(--fs)); font-weight:700; color:var(--c-ai); letter-spacing:.04em; }
  .exp-group__count .i{ width:18px; height:18px; }
  .exp-grid--scroll{
    display:flex; gap:14px; overflow-x:auto; scroll-snap-type:x mandatory; overscroll-behavior-x:contain; scrollbar-width:none;
    margin-inline:calc(var(--gutter) * -1); padding:4px 0 14px var(--gutter); scroll-padding-inline:var(--gutter);
  }
  .exp-grid--scroll::-webkit-scrollbar{ display:none; }
  .exp-grid--scroll::after{ content:""; flex:0 0 1px; margin-left:calc(var(--gutter) - 15px); }
  .exp-grid--scroll > .exp-card{ flex:0 0 80%; scroll-snap-align:start; }
  .exp-grid--scroll .exp-card__photo{ aspect-ratio:3/2; }
  .exp-grid--scroll.exp-grid--single > .exp-card{ flex-basis:calc(100% - var(--gutter)); }
  /* 横に流れるカードは 1 枚ずつふわっとさせない（画面の外のカードが消えたままになるため） */
  .js .exp-grid--scroll > .exp-card.reveal{ opacity:1; animation:none; }
  /* B・C（料金・人数の無い短いカード）も縦のカードに */
  .exp-grid--scroll.exp-grid--compact .exp-card{ display:flex; flex-direction:column; align-items:stretch; padding:10px 10px 18px; }
  .exp-grid--scroll.exp-grid--compact .exp-card__photo{ aspect-ratio:16/9; border-radius:16px; }
  .exp-grid--scroll.exp-grid--compact .ph__ill{ top:50%; width:auto; height:80%; }
  .exp-grid--scroll.exp-grid--compact .exp-card__body{ padding:14px 8px 0; }

  /* お客様の声：普通の横スクロールは画面の端まで */
  .rv-list{ margin-inline:calc(var(--gutter) * -1); padding:8px 0 20px var(--gutter); scroll-padding-inline:var(--gutter); }
  .rv-list::after{ content:""; flex:0 0 1px; margin-left:calc(var(--gutter) - 19px); }
  .rv-list > .rv-card{ flex-basis:84%; scroll-snap-align:start; }
  .rv-ring.is-3d .rv-list::after{ display:none; }
}
/* 小さい画面（〜374px）：開園状況は縦に積み、チケットのバナーの文字と写真を少し小さく */
@media (max-width:374px){
  .status .st-card--open{ grid-template-columns:minmax(0,1fr); grid-template-areas:"ttl" "big" "info"; }
  .status .st-card__info{ margin-top:6px; padding:6px 0 0; border-left:0; border-top:1px solid rgba(255,255,255,.3); }
  .entry__ttl{ font-size:calc(17px * var(--fs)); letter-spacing:.04em; }
  .entry__main{ grid-template-columns:minmax(0,1fr) 80px; padding:16px 14px 14px 18px; }
  .entry__photo{ width:80px; }
  .entry__stub{ margin:0 14px; }
  .entry__cta{ gap:6px; padding-left:14px; font-size:calc(14.5px * var(--fs)); }
  .entry--shop{ padding:16px 14px 14px 18px; }
}

/* =========================================================
   発注書 S24：右上の「文字の大きさ」と「言語」のまとまり（partials/park/prefs.blade.php・site.js）
   SP はヘッダーの中（ロゴ・LINE（アイコン＋ひとこと）・文字・言語・メニューを 390px 幅で 1 行）、PC は本文の右上に固定。
   紙の面＋細い線 1px の丸いピル。押せるところは 44px 以上（文字の大きさを変えても変わらない）
   ========================================================= */
.prefs{ position:relative; display:flex; align-items:center; gap:4px; flex:none; }
.prefs__fs{ flex:none; } /* メニューは .prefs（まとまり全体）の右端に揃える（英語の長いラベルでも画面の外に出ないように） */
.prefs__fsbtn{
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  width:44px; height:44px; padding:0; border:1px solid rgba(62,68,120,.22); border-radius:14px;
  background:var(--c-paper); color:var(--c-ai); cursor:pointer;
  transition:background .15s, border-color .15s;
}
.prefs__fsbtn:hover,.prefs__fsbtn[aria-expanded="true"]{ background:var(--c-fuji-pale); border-color:var(--c-ai); }
.prefs__glyph{ font-size:calc(17px * var(--fs)); font-weight:700; line-height:1; }
.prefs__cap{ margin-top:2px; font-size:calc(9.5px * var(--fs)); font-weight:700; line-height:1.1; letter-spacing:.08em; }
html:lang(en) .prefs__glyph{ font-family:var(--ff-en); }
.prefs__lang{
  display:flex; align-items:stretch; height:44px; flex:none;
  border-radius:999px; background:var(--c-paper); box-shadow:inset 0 0 0 1px rgba(62,68,120,.22);
}
.prefs__lang-opt{
  display:flex; align-items:center; justify-content:center; min-width:44px; padding:0 8px;
  border-radius:999px; color:var(--c-ai); text-decoration:none;
  font-family:var(--ff-en); font-size:calc(13px * var(--fs)); font-weight:700; letter-spacing:.04em; line-height:1; white-space:nowrap;
}
.prefs__lang-opt:hover{ background:var(--c-fuji-pale); }
.prefs__lang-opt.is-on{ background:var(--c-ai); color:#fff; }
.prefs__lang-opt[lang="ja"]{ font-family:var(--ff-body); }

/* 文字の大きさのメニュー（ボタンの下に小さく） */
.prefs__menu{
  position:absolute; top:calc(100% + 8px); right:0; z-index:140;
  width:max-content; padding:10px 12px 12px; border:1px solid rgba(62,68,120,.18); border-radius:18px;
  background:var(--c-paper); box-shadow:var(--shadow-card);
}
.prefs__menu[hidden]{ display:none; }
.prefs__title{ margin:0 0 8px; font-size:calc(13px * var(--fs)); font-weight:700; line-height:1.4; color:var(--c-ai); letter-spacing:.06em; }
.prefs__opts{ display:flex; gap:6px; }
.prefs__opt{
  display:flex; flex-direction:column; align-items:center; justify-content:flex-end; gap:4px;
  min-width:60px; min-height:66px; padding:6px 8px 7px; border:1px solid rgba(62,68,120,.22); border-radius:14px;
  background:#fff; color:var(--c-ink); cursor:pointer;
}
.prefs__opt:hover{ border-color:var(--c-ai); }
.prefs__opt[aria-pressed="true"]{ border-color:var(--c-ai); background:var(--c-ai); color:#fff; }
.prefs__a{ font-weight:700; line-height:1; }
/* 見本の「あ」はえらぶ前の大きさの比べなので、倍率を掛けない */
.prefs__opt--s .prefs__a{ font-size:15px; }
.prefs__opt--m .prefs__a{ font-size:19px; }
.prefs__opt--l .prefs__a{ font-size:24px; }
.prefs__optlabel{ font-size:calc(12px * var(--fs)); font-weight:700; line-height:1.2; white-space:nowrap; }
html:not(.js) .prefs__fs{ display:none; }

/* SP のヘッダー：ロゴは縮められる（文字「大」でも 1 行に収める）。LINE は アイコン＋「予約」 */
.sp-header{ gap:6px; padding:0 8px 0 12px; }
.sp-header__logo{ flex:0 1 109px; min-width:72px; margin-right:auto; }
.sp-header__logo img{ width:100%; max-width:109px; height:auto; }
.sp-header .sp-header__line{ flex:none; gap:3px; min-height:44px; padding:0 10px 0 8px; font-size:calc(12px * var(--fs)); letter-spacing:.02em; }
.sp-header .sp-header__line .i{ width:18px; height:18px; }
@media (max-width:374px){
  .sp-header .sp-header__line{ display:inline-flex; width:44px; padding:0; }
  .sp-header .sp-header__line span{ display:none; }
}

/* PC：本文の右上に固定 */
.prefs-pc{ display:none; }
@media (min-width:1080px){
  .prefs-pc{ display:block; position:fixed; top:14px; right:18px; z-index:120; }
  .prefs--pc .prefs__fsbtn,.prefs--pc .prefs__lang{ box-shadow:0 2px 10px rgba(62,68,120,.10); }
  .prefs--pc .prefs__lang{ box-shadow:inset 0 0 0 1px rgba(62,68,120,.22), 0 2px 10px rgba(62,68,120,.10); }
  .prefs--pc .prefs__lang-opt{ padding:0 14px; }
}

/* ---------- トップを軽く（発注書 S30） ----------
   ファーストビュー（ヒーロー・お知らせ帯・本日の開園状況）より下のセクションは、画面に近づくまで組まない・描かない。
   Web フォント（日本語は文字の範囲ごとに届く）が届くたびにページ全体を組み直していた（1 回 60〜200ms が 4〜6 秒続く）のが、
   見えている所だけで済む。まだ描いていないセクションの高さは仮に 900px（auto：一度描いたら、その高さを覚える）。
   セクションの外にはみ出す飾りは無いこと（横に数 px はみ出す葉・電話の飾りは画面の外で、もともと見えない）を確かめてある。
   html.cv：スクロールの位置を保つしくみ（overflow-anchor）があるブラウザだけ（partials/park/head-script）。ページ内リンクは site.js が
   見出しの位置を測り直しながら動かす */
.cv .is-home main > section:not(.hero):not(.status),
.cv .is-home main > .landscape{ content-visibility:auto; contain-intrinsic-size:auto 900px; }

/* ---------- 動きを減らす ---------- */
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{ animation-duration:.01ms!important; animation-iteration-count:1!important; transition-duration:.01ms!important; transition-delay:0s!important; scroll-behavior:auto!important; }
  .js .reveal{ opacity:1; }
  /* ヒーロー（S29）：文字はすぐ出して消さない（home.js も消さない）。動画は自動で再生しない（ポスター） */
  .js .hero__shade,.js .hero .hero__line,.js .hero .hero__sp-line,.js .hero .hero__circle{ opacity:1; transform:none; clip-path:none; }
  .h-scroll{ scroll-behavior:auto; }
}