/* build: v16-20260909 */
/* ==========================================================
   しゅみの森 東新宿店 / トップページ専用スタイル
   トップページ（/index.html）でのみ読み込む。
   style.css / style_sp.css / style_pc.css は読み込まない。
   ========================================================== */
/* ======================================================================
   しゅみの森 東新宿店 / トップページ専用スタイル
   ・トップページ（/index.html）でのみ読み込む
   ・style.css / style_sp.css / style_pc.css は読み込まない（完全に独立）
   ・色は既存サイトの値を優先。新規追加は --sora と --midori のみ
   ====================================================================== */
:root{
  /* ===== カラーパレット（指定色） ===================================
     見出しオレンジ #FF6000 ／ 見出しグリーン #1AA702 ／ 背景 #FFFBF2
     枠線 #FF9E00 ／ タグ・ボタン4色 ／ 予約ボタン #FF4900 ／ 文字 #63420C
     ================================================================ */
  --ink:#63420C;       /* 文字 */
  --kinari:#FFFBF2;    /* 背景 */

  --aka:#FF6000;       /* 見出しオレンジ */
  --aka-d:#D14E00;
  --rsv:#FF4900;       /* 予約ボタン */
  --rsv-d:#D63C00;

  --midori:#1AA702;    /* 見出しグリーン */
  --midori-d:#137A02;

  --ki:#FFDA45;        /* タグ・ボタン 黄 */
  --ki-d:#E0B914;
  --waka:#A7D34F;      /* タグ・ボタン 黄緑 */
  --sora:#68CBE6;      /* タグ・ボタン 水色 */
  --momo:#F5C9C8;      /* タグ・ボタン ピンク */
  --murasaki:#F5C9C8;  /* 指定に該当色がないためピンクを流用 */

  /* --- 枠線と影 -----------------------------------------------------
     枠線は指定の #FF9E00。ただし背景 #FFFBF2 とのコントラストが 2.00 と
     低く、フチだけではカードの輪郭が立たない。そこで影は濃色で受けている。
     全部オレンジにしたい場合は --shadow を var(--line) に変えるだけ。
     ------------------------------------------------------------------ */
  --line:#FF9E00;      /* 枠線 */
  --shadow:#63420C;    /* ベタ影 */

  --col:430px;         /* スマホ特化カラム幅 */
  --f-pop:"Mochiy Pop One",sans-serif;
  --f-en:"Baloo 2",cursive;
  --f-body:"Zen Maru Gothic",sans-serif;

  --bd:3px solid var(--line);
  --sh:5px 5px 0 var(--shadow);
  --sh-s:3px 3px 0 var(--shadow);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:72px}
body{font-family:var(--f-body);font-weight:500;color:var(--ink);background:var(--kinari);line-height:1.8;-webkit-text-size-adjust:100%}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none;display: block;}
button{font:inherit;color:inherit;background:none;border:none;cursor:pointer}
:focus-visible{outline:4px solid var(--sora);outline-offset:3px;border-radius:8px}

/* ---------- ふきだし文字（シグネチャー） ---------- */
.bubble{
  font-family:var(--f-pop);
  color:var(--aka);
  -webkit-text-stroke:9px #fff;
  paint-order:stroke fill;
  letter-spacing:.02em;
  filter:
    drop-shadow(3px 0 0 var(--ink)) drop-shadow(-3px 0 0 var(--ink))
    drop-shadow(0 3px 0 var(--ink)) drop-shadow(0 -3px 0 var(--ink))
    drop-shadow(4px 6px 0 rgba(98,65,11,.28));
}
.bubble.g{color:var(--midori)}
.bubble.b{color:var(--sora)}
.bubble.p{color:var(--momo)}

/* ---------- PC背景（方眼＋おもちゃ散らし） ---------- */
.stage{position:fixed;inset:0;z-index:0;pointer-events:none;display:none;
  background:#FFF8E8;
}
/* ---------- PC左：ロゴ＋施設写真パネル ---------- */
.sidephoto{display:none}
.sp-logo{text-align:center;margin-bottom:22px}
.sp-logo .en{display:inline-block;font-family:var(--f-en);font-weight:800;font-size:16px;letter-spacing:.13em;
  color:#fff;background:var(--sora);border:var(--bd);border-radius:999px;padding:2px 15px}
.sp-logo .jp{display:block;font-size:56px;line-height:1.15;margin-top:6px}
.sp-logo small{display:inline-block;margin-top:12px;font-weight:900;font-size:12.5px;letter-spacing:.06em;
  background:var(--ki);border:var(--bd);border-radius:999px;padding:3px 14px}
.sp-ph{position:relative;border:var(--bd);border-radius:20px;overflow:hidden;
  background:var(--ki);line-height:0;aspect-ratio:4/3}
.sp-ph+.sp-ph{margin-top:14px}
.sp-ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  opacity:0;transition:opacity .9s ease}
.sp-ph img.on{opacity:1}

/* ---------- 本体カラム ---------- */
.frame{position:relative;z-index:1;width:100%;max-width:var(--col);margin:0 auto;min-height:100vh;overflow:hidden;
  background:
    repeating-linear-gradient(0deg,rgba(98,65,11,.05) 0 1px,transparent 1px 38px),
    repeating-linear-gradient(90deg,rgba(98,65,11,.05) 0 1px,transparent 1px 38px),
    var(--kinari);
}

/* ---------- ヘッダー ---------- */
.hd{position:sticky;top:0;z-index:40;display:flex;align-items:center;gap:9px;padding:9px 12px;
  background:rgba(255,251,239,.94);backdrop-filter:blur(8px);border-bottom:3px solid var(--line)}
.hd-logo{font-family:var(--f-pop);font-size:23px;color:var(--aka);-webkit-text-stroke:5px #fff;paint-order:stroke fill;
  filter:drop-shadow(2px 0 0 var(--ink)) drop-shadow(-2px 0 0 var(--ink)) drop-shadow(0 2px 0 var(--ink)) drop-shadow(0 -2px 0 var(--ink));
  white-space:nowrap}
.hd-sp{flex:1}
.hd-cta{font-family:var(--f-pop);font-size:13px;color:#fff;background:var(--rsv);border:var(--bd);
  padding:7px 14px;border-radius:999px;box-shadow:var(--sh-s)}
.hd-menu{width:44px;height:40px;border-radius:12px;background:var(--midori);border:var(--bd);position:relative;box-shadow:var(--sh-s)}
.hd-menu span{position:absolute;left:11px;right:11px;height:3px;background:#fff;border-radius:3px;transition:.25s}
.hd-menu span:nth-child(1){top:11px}.hd-menu span:nth-child(2){top:18px}.hd-menu span:nth-child(3){top:25px}
.hd-menu[aria-expanded="true"] span:nth-child(1){top:18px;transform:rotate(45deg)}
.hd-menu[aria-expanded="true"] span:nth-child(2){opacity:0}
.hd-menu[aria-expanded="true"] span:nth-child(3){top:18px;transform:rotate(-45deg)}

.drawer{position:fixed;inset:0;z-index:60;display:none;overflow:auto;padding:66px 20px 40px;
  background:repeating-linear-gradient(45deg,var(--aka) 0 26px,#FF7A24 26px 52px)}
.drawer.open{display:block}
.drawer .close{position:absolute;top:12px;right:14px;width:44px;height:44px;border-radius:50%;background:#fff;border:var(--bd);
  box-shadow:var(--sh-s)}
.drawer .close span{position:absolute;left:11px;right:11px;top:19px;height:3px;border-radius:3px;background:var(--ink)}
.drawer .close span:nth-child(1){transform:rotate(45deg)}
.drawer .close span:nth-child(2){transform:rotate(-45deg)}
.drawer ul{list-style:none;display:grid;gap:11px;max-width:var(--col);margin:0 auto}
.drawer a{display:flex;align-items:center;gap:12px;background:var(--kinari);border:var(--bd);border-radius:16px;padding:13px 16px;box-shadow:var(--sh)}
.drawer li:nth-child(2n) a{background:var(--ki)}
.drawer li:nth-child(3n) a{background:var(--sora)}
.drawer a b{font-family:var(--f-en);font-weight:800;font-size:17px;min-width:80px;letter-spacing:.04em}
.drawer a span{font-weight:900;font-size:15px}

/* ---------- 切り絵のふち ---------- */
.cut{position:relative}
.cut::before{content:"";position:absolute;top:-14px;left:0;right:0;height:14px;
  background:radial-gradient(circle at 12px 14px,var(--cut) 12px,transparent 12.5px);
  background-size:24px 14px;background-repeat:repeat-x}
.zig::before{background:conic-gradient(from -45deg at 50% 0,var(--cut) 0 90deg,transparent 90deg);
  background-size:26px 14px;background-repeat:repeat-x;background-position:bottom}

/* ---------- セクション共通 ---------- */
.sec{padding:46px 10px 50px;position:relative; text-align: justify;}
.sec-hd{text-align:center;margin-bottom:26px}
.sec-hd .eb{display:inline-block;font-family:var(--f-en);font-weight:800;font-size:14px;letter-spacing:.16em;
  background:#fff;border:var(--bd);border-radius:999px;padding:2px 18px}
.sec-hd h2{font-size:31px;line-height:1.35;margin-top:14px}
.sec-hd p{font-size:14px;margin-top:12px;font-weight:700}
.lead{font-size:15px;font-weight:500}

/* ---------- アイコン（SVGスプライト） ----------
   絵文字は使わない。サイズは親の font-size で決まる（width:1em）。
   線幅・角丸は全体の太フチのトーンに合わせている。
   ------------------------------------------------ */
.ic{display:inline-block;width:1em;height:1em;vertical-align:-.14em;flex:none;
  fill:none;stroke:currentColor;stroke-width:2.1;stroke-linecap:round;stroke-linejoin:round}
.ic-inline{font-size:2.15em;margin-right:.4em;vertical-align:-.2em}

/* ---------- ボタン ---------- */
.btn{display:flex;align-items:center;justify-content:center;gap:9px;width:100%;
  font-family:var(--f-pop);font-size:19px;color:#fff;background:var(--rsv);border:var(--bd);
  padding:16px;border-radius:999px;box-shadow:var(--sh);transition:.12s}
.btn:active{transform:translate(4px,4px);box-shadow:1px 1px 0 var(--shadow)}
.btn.g{background:var(--midori)}
.btn.b{background:var(--sora)}
.btn small{font-family:var(--f-body);font-weight:900;font-size:12px}
.btn-note{font-size:12px;font-weight:700;text-align:center;margin-top:12px;line-height:1.7}

/* ---------- 流れる帯 ---------- */
.marquee{background:var(--ki);border-top:3px solid var(--line);border-bottom:3px solid var(--line);
  overflow:hidden;padding:9px 0;white-space:nowrap}
.marquee-in{display:inline-flex;gap:26px;animation:slide 22s linear infinite}
.marquee span{font-family:var(--f-pop);font-size:17px;color:var(--aka);
  -webkit-text-stroke:4px #fff;paint-order:stroke fill}
@keyframes slide{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ---------- ただいまの混雑状況（FV内カード） ---------- */
.status{display:flex;align-items:center;gap:11px;background:#fff;border:var(--bd);border-radius:18px;
  padding:11px 14px;margin-bottom:14px;position:relative;z-index:2}
.status .dot{width:15px;height:15px;border-radius:50%;background:var(--midori);border:2px solid var(--line);
  flex:none;animation:blink 1.8s infinite}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.25}}
.status .tx b{display:block;font-family:var(--f-pop);font-size:15.5px;line-height:1.4}
.status .tx span{display:block;font-size:11px;font-weight:900;color:#8A7351;line-height:1.5}
.status .now{margin-left:auto;font-family:var(--f-pop);font-size:11px;background:var(--ki);
  border:2px solid var(--line);border-radius:999px;padding:2px 10px;white-space:nowrap}

/* ---------- MV（フル幅） ---------- */
.mv{background:var(--ki);border-bottom:3px solid var(--line);line-height:0}
.mv img{width:100%;height:auto}

/* ---------- 画像は全てフル幅・角丸なし ----------
   カラムの左右padding(18px)を打ち消して端まで出す。
   左右の枠線は付けず、上下のみ線で締める。
   ------------------------------------------------ */
.imgfull{margin-left:-18px;margin-right:-18px;border-top:3px solid var(--line);
  border-bottom:3px solid var(--line);background:var(--ki);line-height:0;overflow:hidden}
.imgfull img{width:100%;height:100%;object-fit:cover}
.imgfull .ph-fallback{min-height:200px}

/* ---------- FV ---------- */
.fv{padding:26px 18px 36px;position:relative}
.fv-copy{font-size:36px;line-height:1.4;position:relative;z-index:2}
.fv-copy .l2{color:var(--midori);font-size:29px}
.fv-lead{font-size:14px;font-weight:700;margin-top:14px;position:relative;z-index:2}
.fv-photo{margin-top:22px;aspect-ratio:16/10}
.fv-badge{position:absolute;right:14px;top:-34px;z-index:3;width:92px;height:92px;border-radius:50%;
  background:var(--ki);border:var(--bd);display:grid;place-content:center;text-align:center;
  animation:pop 3.4s ease-in-out infinite}
.fv-badge b{display:block;font-family:var(--f-pop);font-size:25px;color:var(--rsv);line-height:1}
.fv-badge span{display:block;font-weight:900;font-size:11px;margin-top:2px}
@keyframes pop{0%,100%{transform:scale(1)}50%{transform:scale(1.06)}}
.fv-tags{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0 20px;position:relative;z-index:2}
.fv-tags li{list-style:none;font-family:var(--f-body);font-weight:900;font-size:12.5px;background:#fff;
  border:var(--bd);border-radius:999px;padding:4px 12px}
.fv-tags li:nth-child(2n){background:var(--momo)}
.fv-tags li:nth-child(3n){background:var(--sora)}
.fv-tags li:nth-child(4n){background:var(--waka)}

/* ---------- 3つの安心ポイント ----------
   このページで最も伝えたいセクション。
   1枚ずつ縦に積み、番号・見出し・リード・事実・関連リンクの5要素で構成する。
   ---------------------------------------- */
.marks{background:var(--ki);--cut:var(--ki);padding:44px 18px 50px}
.pt-list{display:grid;gap:14px}
.pt{background:#fff;border:var(--bd);border-radius:22px;padding:18px 17px 17px}
.pt-hd{display:flex;align-items:flex-start;gap:12px;padding-bottom:13px;
  border-bottom:2px dashed rgba(255,158,0,.8)}
.pt-no{font-family:var(--f-en);font-weight:800;font-size:34px;line-height:.95;color:var(--rsv);flex:none}
.pt-ttl{display:flex;align-items:center;gap:9px;flex:1;padding-top:2px}
.pt-ic{font-size:27px;color:var(--midori)}
.pt h3{font-family:var(--f-pop);font-size:18px;line-height:1.45}
.pt-lead{font-size:13.5px;font-weight:700;line-height:1.9;margin-top:13px}
.pt-facts{margin-top:12px;display:grid;gap:7px}
.pt-facts li{list-style:none;position:relative;padding-left:24px;font-size:12.5px;font-weight:500;line-height:1.8}
.pt-facts li::before{content:"";position:absolute;left:2px;top:.5em;width:11px;height:6px;
  border-left:2.6px solid var(--midori);border-bottom:2.6px solid var(--midori);transform:rotate(-45deg)}
.pt-link{display:inline-flex;align-items:center;gap:6px;margin-top:15px;
  font-family:var(--f-body);font-weight:900;font-size:12.5px;color:var(--rsv);
  border-bottom:2px solid var(--rsv);padding-bottom:1px}
.pt-link::after{content:"";width:7px;height:7px;border-right:2.4px solid var(--rsv);
  border-bottom:2.4px solid var(--rsv);transform:rotate(-45deg)}

/* ---------- about ---------- */
.about{--cut:var(--kinari)}
.about-photo{margin-bottom:22px;aspect-ratio:16/9;}
.about-note{margin-top:30px;background:var(--waka);border:var(--bd);border-radius:20px;
  padding:40px 20px 10px;font-weight:700;font-size:13.5px;line-height:1.95;position: relative;}
.about-note .ic-inline{vertical-align:-.22em}
.about-note img{position: absolute; top: -30px; left: 20px; width: 130px; height: 70px; object-fit: contain;}

/* ---------- できること ---------- */
.play{background:var(--waka);--cut:var(--waka)}
.play .sec-hd .eb{background:#fff}
.play-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px}
.play-card{background:var(--kinari);color:var(--ink);border:var(--bd);border-radius:20px;overflow:hidden; }
.play-card .ph{aspect-ratio:4/3;background:var(--ki);border-bottom:2px solid var(--line);position: relative;}
.play-card .ph .ph_ico { position: absolute; right: 0px; bottom: -45px; display: flex; align-items: center; justify-content: center; width: 60px; height: 60px; }
.play-card .ph img{width:100%;height:100%;object-fit:cover}
.play-card .tx{padding:11px 11px 14px}
.play-card h3{font-family:var(--f-body);font-weight:900;font-size:14.5px;line-height:1.5}
.play-card p{font-size:11.5px;font-weight:500;margin-top:6px;line-height:1.75}
.play-card .tag{display:inline-block;font-family:var(--f-en);font-weight:800;font-size:11px;letter-spacing:.06em;
  background:var(--sora);border:2px solid var(--line);border-radius:999px;padding:0 9px;margin-bottom:6px}
.play-card:nth-child(2n) .tag{background:var(--momo)}
.play-card:nth-child(3n) .tag{background:var(--ki)}
.play-card.wide{grid-column:1/-1;display:flex}
.play-card.wide .ph{width:42%;aspect-ratio:auto;border-bottom:none;border-right:2px solid var(--line)}
.play-card.wide .ph .ph_ico{bottom: -1px;}
.play-card.wide .tx{flex:1}

.room{margin-top:30px}
.room h3{font-family:var(--f-pop);font-size:21px;text-align:center;margin-bottom:16px;color:var(--midori)}
.room-list{display:grid;gap:11px}
.room-item{display:flex;gap:12px;background:var(--kinari);color:var(--ink);border:var(--bd);border-radius:18px;padding:11px}
.room-item .ph{width:92px;height:74px;border-radius:12px;overflow:hidden;flex:none;background:var(--ki);border:2px solid var(--line)}
.room-item .ph img{width:100%;height:100%;object-fit:cover}
.room-item b{font-family:var(--f-body);font-weight:900;font-size:15.5px}
.room-item p{font-size:12px;font-weight:700;line-height:1.7;color:#8A7351}

/* ---------- フロアマップ ---------- */
.map{background:var(--sora);--cut:var(--sora)}
.map-frame{background:var(--kinari);border:var(--bd);border-radius:22px;padding:12px}
.floor-tabs{display:flex;gap:7px;margin-bottom:12px}
.floor-tabs button{flex:1;font-family:var(--f-pop);font-size:13px;padding:9px 0;border-radius:12px;
  background:#fff;border:var(--bd);box-shadow:var(--sh-s)}
.floor-tabs button[aria-selected="true"]{background:var(--aka);color:#fff}
.panel img{border: 2px solid var(--ink); border-radius: 20px;}

/* ---------- 料金 ---------- */
.price{--cut:var(--kinari)}
.tabs{display:flex;gap:7px;margin-bottom:0}
.tabs button{flex:1;font-family:var(--f-pop);font-size:13.5px;padding:11px 0;border-radius:14px 14px 0 0;
  background:#fff;border:var(--bd);border-bottom:none;position:relative;top:3px}
.tabs button[aria-selected="true"]{background:var(--aka);color:#fff;top:0;padding-bottom:14px}
.panel[hidden]{display:none}
table{width:100%;border-collapse:separate;border-spacing:0;background:#fff;border:var(--bd);border-radius:0 0 16px 16px;overflow:hidden;box-shadow:var(--sh)}
th,td{padding:10px 4px;text-align:center;font-size:12.5px;font-weight:700;border-bottom:2px solid var(--line)}
tbody tr:last-child th,tbody tr:last-child td{border-bottom:none}
thead th{background:var(--aka);color:#fff;font-family:var(--f-pop);font-size:12px}
tbody th{background:var(--ki);font-family:var(--f-pop);font-size:12.5px;text-align:left;padding-left:11px;white-space:nowrap;border-right:2px solid var(--line)}
td b{font-family:var(--f-pop);font-size:14px;color:var(--aka)}
.free{font-family:var(--f-pop);color:var(--aka);font-size:15px}
.price-note{font-size:12px;font-weight:700;margin-top:14px;line-height:1.8}
.price-note li{margin-left:1.2em}
.karaoke-box{margin-top:30px;background:var(--momo);border:var(--bd);border-radius:18px;padding:40px 20px 10px;position: relative;}
.karaoke-box b{font-family:var(--f-pop);font-size:15px}
.karaoke-box p{font-size:12.5px;font-weight:700;margin-top:4px}
.karaoke-box img{position: absolute; top: -30px; left: 20px; width: 70px; height: 70px; object-fit: contain;}


/* ---------- 料金：0歳バナー ---------- */
.free-banner{display:flex;align-items:center;gap:12px;background:var(--ki);border:var(--bd);border-radius:20px;
  padding:12px 15px;margin-bottom:16px}
.free-banner .zero{font-family:var(--f-pop);font-size:34px;color:var(--aka);line-height:1;
  -webkit-text-stroke:5px #fff;paint-order:stroke fill}
.free-banner b{display:block;font-family:var(--f-pop);font-size:16px;line-height:1.4}
.free-banner span{display:block;font-size:11.5px;font-weight:700;line-height:1.5}

/* ---------- 料金：セグメント ---------- */
.seg{display:flex;border:var(--bd);border-radius:14px;overflow:hidden}
.seg button{flex:1;font-family:var(--f-pop);font-size:13px;padding:10px 2px;background:#fff;line-height:1.35}
.seg button+button{border-left:3px solid var(--line)}
.seg button[aria-pressed="true"]{background:var(--aka);color:#fff}
.seg button small{display:block;font-family:var(--f-body);font-weight:900;font-size:10px}

.daysel{margin-bottom:8px}
.daysel-cap{font-size:11.5px;font-weight:700;color:#8A7351;text-align:center;margin-bottom:14px}

/* ---------- 料金：シミュレーター ---------- */
.sim{background:#fff;border:var(--bd);border-radius:22px;overflow:hidden}
.sim-step{padding:14px 15px;border-bottom:3px solid var(--line)}
.sim-step>.lb{display:flex;align-items:center;gap:8px;font-family:var(--f-pop);font-size:14px;margin-bottom:10px}
.sim-step>.lb .n{width:23px;height:23px;border-radius:50%;background:var(--ink);color:#fff;
  display:grid;place-content:center;font-size:12px;flex:none}
.cnt{display:grid;gap:8px}
.cnt-row{display:flex;align-items:center;gap:9px;background:var(--kinari);border:2px solid var(--line);border-radius:14px;padding:7px 9px 7px 12px}
.cnt-row .ic{font-size:20px}
.cnt-row .nm{font-family:var(--f-pop);font-size:14px}
.cnt-row .nm small{display:block;font-family:var(--f-body);font-weight:900;font-size:10px;color:#8A7351}
.cnt-ctrl{margin-left:auto;display:flex;align-items:center;gap:7px}
.cnt-ctrl button{width:32px;height:32px;border-radius:50%;border:2px solid var(--line);background:#fff;
  font-family:var(--f-pop);font-size:16px;line-height:1;box-shadow:2px 2px 0 var(--shadow)}
.cnt-ctrl button:active{transform:translate(2px,2px);box-shadow:none}
.cnt-ctrl button.plus{background:var(--midori);color:#fff}
.cnt-ctrl .num{font-family:var(--f-pop);font-size:19px;min-width:22px;text-align:center}
.cnt-row.off{opacity:.45}
.cnt-row .free{margin-left:auto;font-family:var(--f-pop);font-size:14px;color:var(--aka)}
.sim-result{background:var(--ki);padding:16px 15px 18px}
.sim-total{display:flex;align-items:baseline;justify-content:center;gap:6px}
.sim-total .lb{font-family:var(--f-pop);font-size:15px}
.sim-total .v{font-family:var(--f-pop);font-size:44px;line-height:1;color:var(--aka);
  -webkit-text-stroke:6px #fff;paint-order:stroke fill;letter-spacing:-.02em}
.sim-total .t{font-size:12px;font-weight:900}
.sim-break{margin-top:12px;background:#fff;border:2px solid var(--line);border-radius:14px;padding:9px 12px}
.sim-break li{list-style:none;display:flex;font-size:12px;font-weight:900;padding:3px 0}
.sim-break li b{margin-left:auto;font-family:var(--f-pop);font-size:13px}
.sim-break li.zero-l{color:var(--aka)}
.sim-note{font-size:11px;font-weight:700;margin-top:9px;line-height:1.7;text-align:center}
.sim-cta{margin-top:14px}

/* ---------- 料金：年齢別カード ---------- */
.detail-hd{text-align:center;margin:40px 0 14px}
.detail-hd h3{font-size:26px;line-height:1.3}
.detail-cap{font-size:12.5px;font-weight:900;margin-top:6px}
.agecards{border:var(--bd);border-radius:18px;overflow:hidden;background:#fff}
.agecard{background:#fff}
.agecard+.agecard{border-top:2px solid var(--line)}
.agecard>.hd{display:flex;align-items:center;gap:9px;padding:9px 14px;background:var(--kinari)}
.agecard>.hd b{font-family:var(--f-body);font-weight:900;font-size:15.5px}
.agecard>.hd .ext{margin-left:auto;font-size:11px;font-weight:700;color:#8A7351;white-space:nowrap}
.agecard .rows{display:grid;grid-template-columns:repeat(3,1fr)}
.agecard .rows.four{grid-template-columns:repeat(4,1fr)}
.agecard .rows>div{padding:11px 3px 12px;text-align:center;border-right:1px solid rgba(255,158,0,.55)}
.agecard .rows>div:last-child{border-right:none}
.agecard .rows .t{font-size:11px;font-weight:700;color:#8A7351}
.agecard .rows .v{font-family:var(--f-body);font-weight:900;font-size:19px;margin-top:2px;letter-spacing:-.02em}
.agecard .rows.four .v{font-size:16px}
.agecard .rows .v .yen{font-family:var(--f-body);font-weight:900;font-size:12px}
.agecard .rows .pick{background:#FFF3E4}
.agecard .rows .pick .v{color:var(--rsv)}

.agecard .rows .pick .t{color:var(--rsv);font-weight:900}
.agecard.zero{background:var(--ki)}
.agecard.zero .z{display:flex;align-items:center;gap:12px;padding:14px 15px}
.agecard.zero .z .n{font-family:var(--f-pop);font-size:36px;color:var(--aka);line-height:1;-webkit-text-stroke:5px #fff;paint-order:stroke fill}
.agecard.zero .z b{font-family:var(--f-pop);font-size:17px}
.agecard.zero .z span{display:block;font-size:11.5px;font-weight:700}
.agecard.eve>.hd{background:#EAF6FB}
.eve-cap{font-size:11.5px;font-weight:700;color:#8A7351;text-align:center;padding:8px 12px;border-top:1px dashed rgba(255,158,0,.7)}

/* ---------- ごはん ---------- */
.food{background:var(--momo);--cut:var(--momo)}
.food-scroll{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;margin:0 -18px;padding:6px 18px 16px}
.food-scroll::-webkit-scrollbar{height:7px}
.food-scroll::-webkit-scrollbar-thumb{background:var(--ink);border-radius:9px}
.food-card{flex:0 0 152px;scroll-snap-align:start;background:var(--kinari);border:var(--bd);border-radius:18px;overflow:hidden}
.food-card .ph{aspect-ratio:1;background:var(--ki);border-bottom:3px solid var(--line)}
.food-card .ph img{width:100%;height:100%;object-fit:cover}
.food-card .tx{padding:10px 10px 13px}
.food-card h3{font-family:var(--f-pop);font-size:12.5px;line-height:1.5}
.food-card .yen{font-family:var(--f-pop);font-size:18px;color:var(--aka);margin-top:6px}
.food-card .yen small{font-family:var(--f-body);font-size:10px;color:var(--ink);font-weight:900}
.food-info{background:var(--kinari);border:var(--bd);border-radius:20px;padding:15px 17px;font-size:12.5px;line-height:1.85}
.food-info dt{font-family:var(--f-pop);color:var(--aka);font-size:13.5px;margin-top:10px}
.food-info dt:first-child{margin-top:0}
.food-info dd{font-weight:500}

/* ---------- こんな日に ---------- */
.scene{background:var(--waka);--cut:var(--waka)}
.scene-list{display:grid;gap:12px}
.scene-list li { list-style:none;display:flex;gap:13px;align-items:center;background:var(--kinari);border:var(--bd); border-radius:20px; position: relative; padding: 40px 20px 10px; margin-top: 30px; box-shadow: 0 8px 16px rgba(0, 0, 0, 0); opacity: 0; transform: translateY(50px); transition: opacity 0.6s ease-out, transform 0.6s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.15s ease; }
.scene-list b{display:block;font-family:var(--f-pop);font-size:15.5px}
.scene-list p{font-size:12px;font-weight:500;margin-top:5px;line-height:1.75}
.scene-list .scene-img { position: absolute; top: -30px; left: 20px; width: 70px; height: 70px; object-fit: contain; opacity: 0; transform: translateY(20px) scale(0); transition: opacity 0.4s ease-out, transform 0.6s cubic-bezier(0.34, 1.56, 0.64, 1), filter 0.15s ease; }
.scene-list li.is-visible { opacity: 1; transform: translateY(0); }
.scene-list li.is-visible .scene-img { opacity: 1; transform: translateY(0) scale(1); }
.scene-list li:nth-child(1) { transition-delay: 0s, 0s, 0s; }
.scene-list li:nth-child(2) { transition-delay: 0.15s, 0.15s, 0s; }
.scene-list li:nth-child(3) { transition-delay: 0.3s, 0.3s, 0s; }
.scene-list li:nth-child(4) { transition-delay: 0.45s, 0.45s, 0s; }
.scene-list li:nth-child(1) .scene-img { transition-delay: 0.2s, 0.2s, 0s; }
.scene-list li:nth-child(2) .scene-img { transition-delay: 0.35s, 0.35s, 0s; }
.scene-list li:nth-child(3) .scene-img { transition-delay: 0.5s, 0.5s, 0s; }
.scene-list li:nth-child(4) .scene-img { transition-delay: 0.65s, 0.65s, 0s; }
.scene-list li.is-visible:hover { transform: translateY(-5px); transition-duration: 0.15s; transition-delay: 0s; }
.scene-list li.is-visible:hover .scene-img { transform: translateY(-8px) rotate(-5deg); transition-duration: 0.15s; transition-delay: 0s; }

/* ---------- おしらせ ---------- */
.news{background:var(--ki);--cut:var(--ki)}
.news-list{background:var(--kinari);border:var(--bd);border-radius:20px;padding:4px 16px;margin-bottom: 20px;}
.news-list li{list-style:none;border-bottom:2px dashed var(--line);padding:14px 0}
.news-list li:last-child{border-bottom:none}
.news-list time{font-family:var(--f-en);font-weight:800;font-size:13px;background:var(--sora);
  border:2px solid var(--line);border-radius:999px;padding:0 10px}
.news-list b{display:block;font-weight:900;font-size:13.5px;margin-top:7px;line-height:1.65}

/* ---------- FAQ ---------- */
.faq{--cut:var(--kinari)}
details{background:#fff;border:var(--bd);border-radius:18px;margin-bottom:11px;box-shadow:var(--sh);overflow:hidden}
summary{list-style:none;display:flex;gap:11px;align-items:flex-start;padding:15px 46px 15px 15px;position:relative;
  font-family:var(--f-pop);font-size:14px;line-height:1.6;cursor:pointer}
summary::-webkit-details-marker{display:none}
summary::before{content:"Q";font-family:var(--f-pop);color:#fff;background:var(--aka);border:2px solid var(--line);
  width:26px;height:26px;border-radius:50%;display:grid;place-content:center;font-size:14px;flex:none}
summary::after{content:"";position:absolute;right:16px;top:50%;width:12px;height:12px;
  border-right:4px solid var(--aka);border-bottom:4px solid var(--aka);transform:translateY(-70%) rotate(45deg);transition:.2s}
details[open] summary::after{transform:translateY(-20%) rotate(225deg)}
.faq-a{display:flex;gap:11px;padding:0 15px 16px;font-size:12.5px;font-weight:500;line-height:1.9}
.faq-a::before{content:"A";font-family:var(--f-pop);color:#fff;background:var(--midori);border:2px solid var(--line);
  width:26px;height:26px;border-radius:50%;display:grid;place-content:center;font-size:14px;flex:none}

/* ---------- 貸切 ---------- */
.private{background:var(--aka-d);--cut:var(--aka-d);color:#fff}
.private .sec-hd .eb{background:#fff;color:var(--ink)}
.private-card{background:var(--kinari);color:var(--ink);border:var(--bd);border-radius:22px;overflow:hidden}
.private-card .ph{background:var(--ki);border-bottom:3px solid var(--line);line-height:0; position: relative;}
.private-card .ph img{width:100%;height:auto;object-fit:contain;}
.private-card .tx{padding:17px 16px 19px}
.private-card h3{font-family:var(--f-pop);font-size:23px;line-height:1.4}
.private-card p{font-size:12.5px;font-weight:500;margin:9px 0 16px;line-height:1.85}
.plan-mini{display:grid;grid-template-columns:1fr 1fr;gap:11px;margin-top:16px}
.plan-mini a{background:var(--kinari);color:var(--ink);border:var(--bd);border-radius:16px;padding:11px;text-align:center;box-shadow:var(--sh-s)}
.plan-mini a:nth-child(2n){background:var(--ki)}
.plan-mini b{display:block;font-family:var(--f-pop);font-size:13.5px}
.plan-mini span{font-size:10.5px;font-weight:700}

/* ---------- アクセス ---------- */
.access{--cut:var(--kinari)}
.info-table{background:#fff;border:var(--bd);border-radius:18px;overflow:hidden}
.info-table th,.info-table td{text-align:left;font-size:12.5px;padding:12px;vertical-align:top;line-height:1.75}
.info-table th{background:var(--sora);width:92px;font-family:var(--f-pop);font-size:12.5px;border-right:2px solid var(--line)}
.gmap{border:var(--bd);border-radius:20px;overflow:hidden;margin-top:16px;height:215px;background:var(--ki)}
.gmap iframe{width:100%;height:100%;border:0;display:block}
.route{display:grid;gap:10px;margin-top:16px}
.route a{display:flex;align-items:center;gap:11px;background:#fff;border:var(--bd);border-radius:16px;padding:12px 15px;
  box-shadow:var(--sh-s);font-family:var(--f-pop);font-size:13.5px}
.route a .ic{font-size:22px}
.route a::after{content:"▶";margin-left:auto;color:var(--aka);font-size:12px}

/* ---------- グループ ---------- */
.group{background:var(--sora);--cut:var(--sora)}
.group-scroll{display:flex;gap:11px;overflow-x:auto;margin:0 -18px;padding:6px 18px 14px;scroll-snap-type:x mandatory}
.group-scroll a{flex:0 0 146px;scroll-snap-align:start;background:var(--kinari);border:var(--bd);border-radius:16px;padding:13px;box-shadow:var(--sh)}
.group-scroll a:nth-child(2n){background:var(--ki)}
.group-scroll b{display:block;font-family:var(--f-pop);font-size:13px;line-height:1.5}
.group-scroll span{display:block;font-size:10.5px;font-weight:500;margin-top:6px;line-height:1.65}

/* ---------- 採用 / フッター ---------- */
.recruit{background:var(--ki);text-align:center}
.recruit h2{font-size:29px;line-height:1.35}
.recruit p{font-size:14px;font-weight:900;margin:12px 0 18px}
.ft{background:var(--midori-d);--cut:var(--midori-d);color:#fff;padding:40px 18px 124px;text-align:center;border-top:3px solid var(--line)}
.ft-logo{font-size:40px}
.ig { display: inline-flex; align-items: center; gap: 9px; background: linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%); color: #fff; border: var(--bd); font-family: var(--f-pop); font-size: 14px; padding: 11px 22px; border-radius: 999px; margin-top: 18px; box-shadow: var(--sh-s); }
.ft address{font-style:normal;font-size:12.5px;font-weight:700;margin-top:18px;line-height:2}
.ft-nav{display:flex;justify-content:center;flex-wrap:wrap;gap:9px;margin-top:20px}
.ft-nav a{font-size:11.5px;font-weight:900;background:rgba(255,255,255,.16);border:2px solid rgba(255,255,255,.5);border-radius:999px;padding:3px 12px}
.ft small{display:block;margin-top:22px;font-size:10.5px;opacity:.7}

/* ---------- 下部固定バー ---------- */
.bar{position:fixed;left:0;right:0;bottom:0;z-index:50;display:flex;gap:8px;max-width:var(--col);margin:0 auto;
  padding:10px 11px calc(10px + env(safe-area-inset-bottom));background:rgba(255,251,239,.96);
  backdrop-filter:blur(8px);border-top:3px solid var(--line)}
.bar a{flex:none;width:60px;text-align:center;font-family:var(--f-pop);font-size:10.5px;
  background:#fff;border:var(--bd);border-radius:14px;padding:5px 0;box-shadow:var(--sh-s)}
.bar a .ic{display:block;font-size:19px;line-height:1.2}
.bar .main{flex:1;width:auto;background:var(--rsv);color:#fff;font-size:16px;display:flex;align-items:center;justify-content:center;gap:8px}

/* ---------- PCサイドナビ：ベース定義（メディアクエリより必ず前に置く） ---------- */
.sidenav{display:none;z-index:30;flex-direction:column;gap:7px}
.sidenav a{background:var(--kinari);border:var(--bd);border-radius:16px;padding:9px 12px 8px;box-shadow:var(--sh);transition:.15s}
.sidenav a:hover{transform:translate(-3px,-3px);box-shadow:8px 8px 0 var(--shadow)}
.sidenav a b{display:block;font-family:var(--f-en);font-weight:800;font-size:19px;letter-spacing:.05em;line-height:1.15}
.sidenav a span{display:block;font-weight:900;font-size:10.5px;margin-top:1px}
.sidenav a:nth-child(1){background:var(--aka);color:#fff}
.sidenav a:nth-child(2){background:var(--kinari)}
.sidenav a:nth-child(3){background:var(--waka)}
.sidenav a:nth-child(4){background:var(--ki)}
.sidenav a:nth-child(5){background:var(--momo)}
.sidenav a:nth-child(6){background:var(--sora)}
.sidenav a:nth-child(7){background:var(--murasaki)}
.sidenav a.rsv{background:var(--rsv);color:#fff;margin-top:9px;padding:13px 12px 12px}

.shell{display:block}

/* ---------- 画像プレースホルダ（モック用） ---------- */
.ph-fallback{width:100%;height:100%;min-height:110px;display:grid;place-content:center;text-align:center;
  padding:10px;font-size:11px;font-weight:900;line-height:1.6;color:rgba(98,65,11,.55);
  background:repeating-linear-gradient(45deg,rgba(98,65,11,.07) 0 9px,transparent 9px 18px)}
.ph-fallback::before{content:"\1F5BC";display:block;font-size:22px;margin-bottom:4px;opacity:.5}

/* ---------- PC（ここから下に上書きをまとめる） ---------- */
@media (min-width:900px){
  html{scroll-padding-top:24px}
  .shell{display:flex;justify-content:center;align-items:flex-start;gap:10px;padding:0 16px}
  /* ↓ .frame の margin:0 auto を必ず打ち消す。
       flexアイテムの auto マージンは余白を全部吸ってしまい、
       サイドナビが画面の右端まで飛ばされる。 */
  .frame{flex:0 0 var(--col);margin:0;box-shadow:0 0 0 3px var(--line),12px 14px 0 rgba(99,66,12,.18)}
  .stage{display:block}
  .hd{display:none}
  .bar{display:none}
  .ft{padding-bottom:46px}
  .sidenav{display:flex;flex:0 0 158px;position:sticky;top:24px}
}
/* 左の写真パネルは、3カラムが収まる幅から出す */
@media (min-width:1180px){
  .shell{gap:18px}
  .sidephoto{display:block;order:0;flex:0 0 290px;position:sticky;top:24px}
}
@media (min-width:1400px){
  .shell{gap:26px}
  .sidephoto{flex:0 0 290px}
}

/* ---------- reveal ---------- */
.rv{opacity:0;transform:translateY(20px);transition:opacity .5s ease,transform .5s cubic-bezier(.2,1.4,.5,1)}
.rv.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
  .rv{opacity:1;transform:none}
  html{scroll-behavior:auto}
}

#news {padding-top: 0;}
#news .mv{position: relative;}
#news .mv h1{position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%);}