/* ソラデシカ 共通スタイル v2（2026-10-04 夜・下書き）
   手本＝階段下の看板③ v8（analysis/rooftop_signs_20260920/stair_sign_v8_20261004.html）。
   同じ書体・同じ色・同じ札（予約なしで＝黒／ご予約で＝白枠）・同じカードの組み
   （2本の縦線：左＝名前・誰と何名・単位／右＝値段・含むもの・次の行動。→ はぶら下げ）。
   文の強弱＝値段 → 席の名前 → 含むもの（緑太字） → 説明（灰細字）。
   スマホが主。下に固定の予約ボタン（.dock）は中身と重ならないよう body の下に余白を取る。 */
:root{
  --ground:#F3EFE6;--surface:#FAF7F0;--ink:#2B2A27;--sub:#67635B;--line:#CFC8B8;
  --wood:#8A6A45;--green:#55664A;--green2:#3B4B32;--band:#E9E1D2;--paper:#F6F3EA;
  --u:62px; /* カードの2本目の縦線（¥の位置）＝単位の欄の幅 */
}
*{box-sizing:border-box;margin:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{background:var(--ground);color:var(--ink);font-family:"Zen Kaku Gothic New","Hiragino Sans","Yu Gothic",sans-serif;font-size:16px;line-height:1.75;padding-bottom:calc(84px + env(safe-area-inset-bottom));overflow-wrap:anywhere}
a{color:inherit}
img{display:block;width:100%;height:100%;object-fit:cover}
.wrap{max-width:1000px;margin:0 auto;padding:0 20px}
.narrow{max-width:720px;margin-inline:auto}
.mincho{font-family:"Shippori Mincho","Hiragino Mincho ProN","Yu Mincho",serif}
.nw{white-space:nowrap}

/* ① 名前（看板と同じ：大きく「ソラデシカ」・下に「屋上カフェ＆貸切BBQ」・英字は小さく） */
.top{display:flex;justify-content:space-between;align-items:flex-start;padding:20px 0 14px;border-bottom:2px solid var(--ink)}
.top .name{display:block;font-family:"Shippori Mincho",serif;font-weight:600;font-size:30px;letter-spacing:.14em;line-height:1.1;text-decoration:none}
.top .name2{display:block;font-family:"Shippori Mincho",serif;font-weight:600;font-size:14.5px;letter-spacing:.12em;margin-top:8px;line-height:1.2}
.top .brand{margin:0;font-size:inherit;font-weight:inherit;line-height:inherit}
.top .en{display:block;font-family:"Cormorant Garamond",Georgia,serif;font-size:10.5px;letter-spacing:.42em;color:var(--sub);margin-top:7px;line-height:1}
.top .side{font-size:12.5px;color:var(--sub);text-align:right;line-height:1.5;padding-top:4px}
.crumb{font-size:12px;color:var(--sub);padding:10px 0 0}
.crumb a{text-underline-offset:3px}

/* ② 入口の上：タグラインと事実の一行 → 今日の屋上 */
.hero{padding:22px 0 0}
.hero .tag{font-family:"Shippori Mincho",serif;font-weight:500;font-size:clamp(26px,7.4vw,40px);letter-spacing:.1em;line-height:1.45}
.hero .fact{margin-top:8px;font-weight:700;font-size:15px;line-height:1.6}
.hero .fact span{display:inline-block;margin-right:.8em}
.today{margin-top:18px}
.today .lab{font-size:13px;font-weight:700;letter-spacing:.14em;color:var(--sub);margin-bottom:6px}
.today .plate{background:var(--ink);color:var(--paper);border-radius:8px;padding:12px 16px 12px 16px}
.today .open{display:flex;align-items:center;font-weight:900;font-size:19px;letter-spacing:.04em;line-height:1.3}
.today .open i{width:10px;height:10px;border-radius:50%;background:#A6D98F;box-shadow:0 0 0 4px rgba(166,217,143,.22);margin-right:12px;flex:none}
.today .open i.wait{background:#E2C98F;box-shadow:0 0 0 4px rgba(226,201,143,.22)}
.today .hours{font-size:14px;font-weight:500;opacity:.9;padding-left:22px;margin-top:2px}

/* ③ 2つの使い方（カフェ／貸切BBQ）のカード */
.uses{display:grid;gap:22px;margin-top:28px}
.use{background:var(--surface);border:1px solid var(--line);border-radius:10px;overflow:hidden}
.use .ph{position:relative;aspect-ratio:16/7;background:var(--line)}
.use .ph .tmp,.photo .tmp{position:absolute;right:8px;bottom:6px;background:rgba(0,0,0,.55);color:#fff;font-size:11px;padding:1px 7px;border-radius:3px}
.use .in{padding:0 18px 18px}
.ttl{padding:16px 0 12px}
.ttl .t{font-family:"Shippori Mincho",serif;font-weight:700;font-size:30px;letter-spacing:.04em;line-height:1.1}
.ttl .w{font-size:13.5px;font-weight:700;color:var(--wood);letter-spacing:.06em;margin-top:6px;line-height:1.2}

.it{border-top:1px solid var(--line);padding:16px 0 14px;display:flex;flex-direction:column}
.it .nm{display:flex;justify-content:space-between;align-items:center;gap:10px}
.it .nm b{font-family:"Shippori Mincho",serif;font-size:22px;font-weight:700;line-height:1.2;white-space:nowrap}
.pill{font-size:12px;font-weight:700;padding:3px 0;border-radius:999px;white-space:nowrap;letter-spacing:.06em;line-height:1.3;width:6.8em;text-align:center;flex:none}
.pill.now{background:var(--ink);color:var(--paper)}
.pill.rsv{background:transparent;box-shadow:inset 0 0 0 1.5px var(--ink)}
.it .use-l{font-size:14px;color:var(--sub);margin-top:4px;line-height:1.45}
.it .pr{margin-top:8px;display:flex;align-items:flex-end;white-space:nowrap}
.it .pr .u{font-size:12.5px;font-weight:500;width:var(--u);flex:none;line-height:1.25;margin-bottom:3px;white-space:normal}
.it .pr .y{font-size:34px;font-weight:900;line-height:1;margin-left:-.06em;font-feature-settings:"tnum";letter-spacing:0}
.it .pr .k{font-size:14px;font-weight:700;margin-left:3px;margin-bottom:2px}
.it .alt,.it .inc,.it .go{padding-left:var(--u)}
.it .alt{font-size:12.5px;color:var(--sub);margin-top:3px;line-height:1.45}
.it .inc{font-size:14px;font-weight:700;color:var(--green2);margin-top:6px;line-height:1.5}
.it .go{margin-top:6px;font-size:15px;font-weight:700;line-height:1.4;display:flex;align-items:center;min-height:40px}
.it .go i{font-style:normal;color:var(--wood);font-weight:900;width:1.3em;margin-left:-1.3em;flex:none}
/* 押せる行動は下線と「›」で見分ける（押せない行動＝テーブル席の「1階のレジで受付」は線なし） */
.it a.go{text-decoration:none}
.it a.go span{text-decoration:underline;text-decoration-color:var(--wood);text-decoration-thickness:2px;text-underline-offset:5px}
.it a.go::after{content:"›";margin-left:8px;color:var(--wood);font-size:20px;line-height:1}
.it .go small{display:block;font-size:12px;font-weight:400;color:var(--sub);line-height:1.4}
.more-btn{display:flex;justify-content:center;align-items:center;gap:8px;text-decoration:none;border:1.5px solid var(--ink);border-radius:6px;min-height:48px;padding:10px 12px;font-weight:700;font-size:15px;margin-top:6px;background:var(--ground)}
.more-btn::after{content:"→";color:var(--wood)}
.more-btn.green{background:var(--green);border-color:var(--green);color:var(--paper)}
.more-btn.green::after{color:var(--paper)}

/* 見学の帯（看板と同じ） */

/* 見出し（下の情報） */
.sec{margin-top:44px}
.sec>h2{font-family:"Shippori Mincho",serif;font-weight:600;font-size:22px;letter-spacing:.06em;border-bottom:1.5px solid var(--ink);padding-bottom:8px}
.sec>h2 small{font-family:"Zen Kaku Gothic New",sans-serif;font-size:13px;font-weight:700;color:var(--wood);margin-left:10px;letter-spacing:.04em}
.info dl{display:grid;grid-template-columns:4.2em minmax(0,1fr);gap:10px 12px;font-size:15px;margin-top:14px}
.info dt{color:var(--sub)}
.info dd b{font-weight:700}
.rain{font-size:14px;color:var(--sub);margin-top:12px;line-height:1.7}
.btn{display:flex;justify-content:center;align-items:center;text-align:center;text-decoration:none;background:var(--ink);color:var(--paper);min-height:50px;padding:12px;margin-top:16px;font-weight:700;letter-spacing:.06em;font-size:16px;border-radius:6px}
.btn.ghost{background:transparent;color:var(--ink);border:1.5px solid var(--ink)}
.btn.green{background:var(--green)}
.later{display:grid;gap:10px;margin-top:14px}
.later .btn{margin-top:0}
.story{margin-top:44px;padding:20px;background:var(--surface);border:1px solid var(--line);border-radius:8px}
.story h2{font-size:14px;font-weight:700;letter-spacing:.08em;color:var(--sub);margin-bottom:6px}
.story p{font-size:14px;color:var(--ink);line-height:1.85}

/* 緑の帯＝受付とお会計・きまり */
.band{background:var(--green);color:var(--paper);margin-top:44px;padding:28px 0}
.band .say{font-weight:700;font-size:clamp(20px,5.6vw,26px);line-height:1.45}
.band .who-runs{font-size:14px;margin-top:8px;opacity:.95}
.band ul{list-style:none;padding:18px 0 0;margin-top:18px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 12px;border-top:1px solid rgba(246,243,234,.4)}
.band li{display:flex;align-items:center;gap:10px;font-weight:700;font-size:15px;line-height:1.3}
.band li small{display:block;font-weight:400;font-size:11.5px;opacity:.88;margin-top:2px}
.band svg{width:34px;height:34px;flex:none}
.band .more{font-size:13.5px;margin-top:16px;opacity:.95}

/* よくあるご質問 */
.faq details{border-bottom:1px solid var(--line)}
.faq summary{cursor:pointer;list-style:none;padding:14px 30px 14px 0;font-weight:700;font-size:15.5px;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"＋";position:absolute;right:2px;top:12px;color:var(--wood);font-weight:400;font-size:18px}
.faq details[open] summary::after{content:"－"}
.faq details p{font-size:14.5px;padding:0 0 16px}
.faq .to{display:inline-block;margin-top:14px;font-weight:700;font-size:14.5px;text-underline-offset:4px;text-decoration-color:var(--wood)}

/* カフェ利用のページ：見出し */
.head{padding:24px 0 0}
.head .kicker{font-weight:700;font-size:13px;letter-spacing:.06em;color:var(--wood);line-height:1.5}
.head h1{font-family:"Shippori Mincho",serif;font-weight:600;font-size:clamp(28px,8.2vw,46px);line-height:1.3;letter-spacing:.02em;margin-top:6px}
.head .sub{color:var(--ink);font-weight:700;font-size:15px;margin-top:10px;line-height:1.7}
.head .sub span{display:inline-block}
.photo{position:relative;aspect-ratio:16/9;margin-top:18px;background:var(--line);border-radius:8px;overflow:hidden}
.intro{font-size:15px;margin-top:14px;line-height:1.9;color:var(--sub)}

/* 詳しい案内（カフェ利用のページ） */
.dtl>h2{font-family:"Shippori Mincho",serif;font-weight:700;font-size:26px;letter-spacing:.04em;border-bottom:1.5px solid var(--ink);padding-bottom:8px;display:flex;align-items:center;justify-content:space-between;gap:10px}
.dtl>h2 .pill{font-family:"Zen Kaku Gothic New",sans-serif}
.h3{font-weight:700;font-size:16px;margin-top:24px;padding-bottom:6px;border-bottom:1px solid var(--line);letter-spacing:.04em}
.duo{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:12px}
.duo.one{grid-template-columns:minmax(0,1fr)} /* 10/07 南さん: テーブル席の¥1,200の札は横幅いっぱい（平日・土日祝とも同じ額＝札1枚） */
.duo>div{background:var(--surface);border:1.5px solid var(--ink);border-radius:8px;padding:14px 8px 12px;text-align:center;min-width:0}
.duo .k{font-weight:700;font-size:13.5px;letter-spacing:.04em;line-height:1.4}
.duo .y{font-weight:900;font-size:clamp(28px,8.4vw,40px);line-height:1.15;margin-top:4px;white-space:nowrap;font-feature-settings:"tnum"}
.duo .w{font-size:12px;color:var(--sub);margin-top:6px;line-height:1.5}
.cap{font-weight:700;font-size:15px;margin-top:16px}
.cap em{font-style:normal;color:var(--wood);font-size:13.5px;margin-left:8px}
.inc-l{margin-top:12px;font-weight:700;color:var(--green2);font-size:15px}
.list{list-style:none;padding:0;margin-top:6px}
.list li{position:relative;padding:8px 0 8px 18px;border-bottom:1px solid var(--line);font-size:15px;line-height:1.6}
.list li::before{content:"";position:absolute;left:3px;top:17px;width:6px;height:6px;border-radius:50%;background:var(--wood)}
.list li small{display:block;color:var(--sub);font-size:13px}
.ptable{width:100%;border-collapse:collapse;margin-top:6px}
.ptable th,.ptable td{border-bottom:1px solid var(--line);padding:10px 0;text-align:left;vertical-align:top;font-size:15px;font-weight:500}
.ptable th{width:5.6em;color:var(--sub);font-weight:500;padding-right:10px}
.ptable td b{font-weight:700}
.steps{list-style:none;padding:0;counter-reset:s;margin-top:4px}
.steps li{counter-increment:s;border-bottom:1px solid var(--line);padding:12px 0 12px 44px;position:relative;font-weight:500;font-size:15.5px;line-height:1.55}
.steps li::before{content:counter(s);position:absolute;left:0;top:11px;width:30px;height:30px;border-radius:50%;background:var(--ink);color:var(--paper);display:grid;place-items:center;font-weight:700;font-size:15px}
.steps li small{display:block;color:var(--sub);font-size:13px;font-weight:400}
.box{border-left:3px solid var(--wood);padding:2px 0 2px 14px;margin-top:20px;font-size:14.5px;color:var(--sub)}
.box b{display:block;font-size:16px;color:var(--ink);margin-bottom:2px}
.note{font-size:13.5px;color:var(--sub);margin-top:10px}
.note a{text-underline-offset:3px}
.after{font-size:14px;color:var(--sub);margin-top:10px;text-align:center}

footer{padding:34px 0 20px;font-size:12px;color:var(--sub);text-align:center}
footer .name-note{font-size:12.5px;line-height:1.9;margin:0 auto 14px}
footer .name-note br.pc{display:none}
@media(min-width:820px){footer .name-note br.pc{display:inline}}
footer a{text-underline-offset:3px}
/* 法務 4-A: 予約サイトの規約・特商法・キャンセルへのリンク(受付開始の押せるボタンを置いた時点で必須) */
footer .legal{margin:14px 0 0;line-height:2}
footer .legal a{white-space:nowrap}

/* 下に固定する予約ボタン（スマホだけ） */
.dock{position:fixed;left:0;right:0;bottom:0;background:rgba(243,239,230,.97);border-top:1px solid var(--line);padding:10px 12px calc(10px + env(safe-area-inset-bottom));display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;z-index:10}
.dock a{display:flex;justify-content:center;align-items:center;text-align:center;text-decoration:none;font-weight:700;font-size:14.5px;min-height:46px;padding:6px;border-radius:6px;background:var(--ink);color:var(--paper);line-height:1.3}
.dock a.g{background:var(--green)}
.dock a.l{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--ink)}

@media(min-width:820px){
  body{padding-bottom:0}
  .dock{display:none}
  .top .name{font-size:36px}
  .top .name2{font-size:16px}
  /* 10/07 南さん「タイトルやメインコピーの左端と右端がでっぱってる」→ PCはページ全体を720pxの列に（カードと同じ）。
     「今日の屋上」は300→280px（タグライン2行・「10月中旬、はじまります」1行を実測で確認） */
  .wrap{max-width:760px}
  .hero-row{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:28px;align-items:end}
  .uses{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;align-items:start}
  .use .ph{aspect-ratio:16/8}
  .band ul{grid-template-columns:repeat(4,minmax(0,1fr))}
  .later{grid-template-columns:repeat(3,minmax(0,1fr))}
  .two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:40px;align-items:start}
  .head h1{font-size:46px}
}
@media(min-width:820px){.uses.solo{grid-template-columns:minmax(0,1fr)}}
.ib{display:inline-block}
@media(min-width:820px){.photo{aspect-ratio:16/6}}

/* 2026-10-07 メインコピー「1時間でも、半日でも。」（南さん決定）＝タグラインの下・事実の行の上 */
.hero .main{font-family:"Zen Kaku Gothic New",sans-serif;font-weight:700;font-size:clamp(19px,5.2vw,26px);letter-spacing:.06em;margin-top:10px;color:var(--ink)}


/* 2026-10-07 試し：メインコピーをカードの見出しへ（最初の画面の文を減らす） */
.uses-lead{font-family:"Zen Kaku Gothic New",sans-serif;font-weight:700;font-size:clamp(20px,5.6vw,28px);letter-spacing:.06em;margin:28px 0 12px;color:var(--ink)}
.info .fuji{margin-top:12px;font-weight:700}

/* 2026-10-07 試し：1時間あたりで統一＋最低時間を値段の横に目立たせる */
.it .pr .min{margin-left:8px;margin-bottom:3px;font-size:13px;font-weight:700;padding:2px 8px;border:1.5px solid var(--ink);border-radius:4px;line-height:1.3}

/* 2026-10-07 南さん指摘の4点 */
/* ① 見出し「使い方と時間料金」を下のカードの見出しに見せる＝他の節の見出しと同じ形（明朝・下線）にし、上を広く・下を狭く */
.uses-lead{font-family:"Shippori Mincho",serif;font-weight:600;font-size:22px;letter-spacing:.06em;border-bottom:1.5px solid var(--ink);padding-bottom:8px;margin:36px 0 0}
.uses-lead+.uses{margin-top:14px}
/* ② 「◯時間から」の札は、各項目の右端（上の「予約なしで／ご予約で」の札と同じ縦の線）にそろえる */
.it .pr .min{margin-left:8px}
/* ③ PCでカフェとBBQのカードの段（写真・見出し・1つ目・2つ目・ボタン）の高さを左右でそろえる＝subgrid */
@media(min-width:820px){
  /* 10/07 南さん「PCで中身が左に寄る」→デザイナー所見（designer_opinion_top_cards_20261007.md 案1）:
     中身（1項目≒280pxの固定幅の値札）を動かさず、入れ物をそれに合わせる＝見出しとカードを下の節と同じ720pxの列に載せる
     （カード348px・中身がカードの約80%＝スマホと同じ比率）。中身は左揃え（罫線・ボタンと同じ線）。
     同時に、subgridが親のgap:24pxを行間として受け継いでPCだけ縦に間延びしていたのを row-gap:0 と auto 行で詰める。
     値段と札の距離・文字の大きさ・スマホの見た目は不変。 */
  .uses-lead,.uses:not(.solo){max-width:720px;margin-left:auto;margin-right:auto}
  .uses{grid-template-rows:auto auto auto auto auto;align-items:stretch}
  .use{display:grid;grid-row:span 5;grid-template-rows:subgrid;row-gap:0}
  .use .in{display:contents}
  .use .ttl,.use .it,.use .more-btn{margin-left:18px;margin-right:18px}
  .use .more-btn{margin-bottom:18px;align-self:end}
  .it .go{margin-top:auto}
}

/* 2026-10-07 札を値段の近くに戻しつつ、4枚で同じ位置にそろえる＝値段の幅と「〜」の幅を固定 */

.it .pr .k{display:inline-block;width:1em;margin-left:2px}

/* 2026-10-07 試し：予約の札を名前のすぐ横へ */
.it .nm{justify-content:flex-start}

/* 2026-10-07 予約の札と「◯時間から」の札の左端を縦にそろえる
   ＝値段の欄の幅を固定（--yw）し、名前の欄をその合計の幅にする。
   札の左端＝単位(--u) − ¥の詰め2px ＋ 値段(--yw) ＋ 〜の欄(2px＋14px) ＋ 札の間8px */
.it{--yw:114px}
.it .pr .y{min-width:calc(var(--yw) + 16px);flex:none}
.it .nm b{min-width:calc(var(--u) - 2px + var(--yw) + 16px + 8px - 10px)}
.it .pr .y .k{font-size:14px;font-weight:700;margin-left:2px;width:auto;display:inline}

/* 10/07 南さん「スマホ表示にしたときに幅を狭めると札が切れてしまう」→ 339px以下（カード内側≒244px）では
   値段の行（単位62+値段130+札76＝固定幅）がはみ出し、カードの overflow:hidden で札が切れていた。
   一回り小さくして収める（320pxで札の右端はカードの枠から33px内側・実測）。値段と札の関係は不変 */
@media(max-width:339px){
  .it{--u:50px;--yw:92px}
  .it .pr .y{font-size:27px}
  .it .pr .min{font-size:11.5px;padding:2px 6px;margin-left:6px}
  .pill{font-size:11px;width:6.4em}
}

/* 10/07 南さん: カフェ利用ページのテーブル席・ソファ席を、入口の「カフェ／貸切BBQ」と同じカードに（枠・角丸・地色・上に写真） */
.sec.dtl.seatcard{background:var(--surface);border:1px solid var(--line);border-radius:10px;overflow:hidden;padding:0 18px 18px;margin-top:20px}
.seatcard .ph{position:relative;aspect-ratio:16/7;background:var(--line);margin:0 -18px 6px}
.seatcard .ph img{width:100%;height:100%;object-fit:cover;display:block}
.seatcard .ph .tmp{position:absolute;right:8px;bottom:6px;background:rgba(0,0,0,.55);color:#fff;font-size:11px;padding:1px 7px;border-radius:3px}
.seatcard>h2{margin-top:10px}
.two.cards+.sec{margin-top:36px}
@media(min-width:820px){
  .two.cards{gap:24px;align-items:stretch}
  .seatcard .ph{aspect-ratio:16/8}
  /* PCで2枚の高さをそろえ、ソファ席は予約ボタンと天候の一文をカードの下端へ */
  .seatcard{display:flex;flex-direction:column}
  .seatcard .ph{flex:none}
  #sofa .btn{margin-top:auto}
}

/* 10/07 南さん「PC表示の高さ位置が左右でずれてる」→ 決まりの表を行ごとの箱（.prow）にし、PCでは2枚のカードの各行を subgrid でそろえる */
.prow{display:flex;gap:10px;border-bottom:1px solid var(--line);padding:10px 0;font-size:15px;font-weight:500;line-height:1.6}
.prow .pk{flex:none;width:4.4em;color:var(--sub)} /* 10/07: 「1階でご注文か、お持ち込みで。」を375pxで1行に収めるため 5.6→4.4em */
.prow .pv{flex:1;min-width:0}
.prow .pv b{font-weight:700}
.prow .pv small{font-size:13px;color:var(--sub);display:block;margin-top:2px;font-weight:400}
@media(min-width:820px){
  .two.cards{grid-template-rows:repeat(13,auto)}
  .seatcard{display:grid;grid-row:span 13;grid-template-rows:subgrid;row-gap:0;align-content:start}
  .seatcard>*{align-self:start;min-width:0}
  .seatcard .ph{align-self:stretch}
  /* 10/07 南さん: 決まりの行の仕切り線を左右で同じ高さに＝行を段いっぱいに伸ばす（線は行の下端） */
  .seatcard>.prow{align-self:stretch}
  /* 行動の箱は段いっぱい（カードの下端まで） */
  .seatcard>.act{align-self:stretch}
}
/* 10/07 席の呼び名＝フリードリンク席／持ち寄り席（8文字）→ カードの見出しは22px（札と1行に収める・375px以上で実測）。339px以下は19px */
.seatcard>h2{font-size:22px}
@media(max-width:339px){.seatcard>h2{font-size:19px}}
@media(max-width:339px){.prow .pv .nw{white-space:normal}}
/* 10/07 南さん: 「ご利用の流れ」「空き状況とご予約」は上の決まりとは別のこと＝カードの下端に帯（地色を一段濃く・全幅）として分ける */
.seatcard>.act{background:rgba(0,0,0,.045);margin:16px -18px -18px;padding:14px 18px 18px;border-top:1px solid var(--line)}
.seatcard>.act .h3{margin-top:0}
.seatcard>.act .btn{margin-top:4px}
#sofa .act .after{margin-top:12px}

/* 2026-10-08 先行公開: 11/1 開始の表示 */
.from-note{margin:10px 0 16px;font-size:13.5px;color:var(--sub)}
.dock span.off{display:flex;justify-content:center;align-items:center;text-align:center;font-weight:700;font-size:13px;min-height:46px;padding:6px;border-radius:6px;background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--line);line-height:1.3}
.btn.off{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--line);cursor:default;flex-direction:column}
.btn.off small{display:block;font-size:12px;font-weight:400;color:var(--sub);margin-top:2px}

/* 【案C・2026-10-28 南さん「それでいこう」】PC（2列）で、カードの中の行（名前／説明句／添え書き／料金／合計／含むもの／行動）も左右で同じ高さに
   ＝カフェ利用ページの決まりの表（.seatcard 13行 subgrid・10/07 南さん「PC表示の高さ位置が左右でずれてる」）と同じやり方。
   外側の段 5 → 17（写真1・見出し1・項目7×2・ボタン1）。添え書きの無いカードは「添え書きの行」が空（高さは左右の大きい方＝半貸切の1行ぶん）。
   数値は持たない（中身の高さから自動で決まる）。スマホ（820px未満）は従来どおり縦積み（flex）で不変 */
@media(min-width:820px){
  .uses:not(.solo){grid-template-rows:repeat(17,auto);row-gap:0} /* 行間 24px は .use の row-gap:0 で消しているが、入れ子の subgrid（.it）には親の 24px が漏れる（Chrome 実測：空の行と含むものの行に +24/+2.9px）ので親でも 0 に。列の間 24px は column-gap として残る */
  .uses:not(.solo) .use{grid-row:span 17}
  .uses:not(.solo) .it{display:grid;grid-row:span 7;grid-template-rows:subgrid;row-gap:0}
  .uses:not(.solo) .it>*{align-self:start;min-width:0}
  .uses:not(.solo) .it>.nm{grid-row:1}
  .uses:not(.solo) .it>.use-l{grid-row:2}
  .uses:not(.solo) .it>.use-l+.use-l{grid-row:3}
  .uses:not(.solo) .it>.pr{grid-row:4}
  .uses:not(.solo) .it>.alt{grid-row:5}
  .uses:not(.solo) .it>.inc{grid-row:6}
  .uses:not(.solo) .it>.go{grid-row:7}
}

/* 【2026-10-28 南さん「A で、1名につき・1時間」】料金の上の説明句（ひとりでも、ふたりでも／6名まで、何名でも同じ料金）は数字から離して見出しの下へ＝入口の .use-l と同じ形。
   単位（1名につき・1時間／1組・1時間）は数字の直下・枠の中＝値札 1 枚で単位まで読める（誤認＝「2 人で ¥1,200」「6 名で ¥4,950」対策・designer_price_20261028/report.md） */
.seatcard .lead{font-size:14px;color:var(--sub);margin-top:10px;line-height:1.45;font-weight:500}
.duo .unit{font-weight:700;font-size:14px;letter-spacing:.04em;line-height:1.4;margin-top:4px}