/* =================================================================
   アルベホール名古屋 サイトの見た目（スマートフォンを基準に書く）

   読み込む順は  shared/tokens.css → hall.css → hall-pc.css。
   色・角丸・余白の基準値は tokens.css の変数だけを使う（R2-1）。
   @media はここに書かない。PCの上書きは hall-pc.css（R1-3）。
   本体サイトにある部品は、本体と同じ名前・同じ見た目で置く（R10）。
   ================================================================= */

/* ---------- 0. 土台 ---------------------------------------------- */
*, *::before, *::after{ box-sizing: border-box; }
html{ font-size: 68.75%; -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }   /* 1rem = 11px */
body{ margin: 0; background: var(--paper); color: var(--ink); font-family: var(--f-sans);
  font-size: 1.6rem; line-height: 1.75; font-feature-settings: "palt" 1;
  padding-bottom: calc(58px + env(safe-area-inset-bottom)); }                           /* 固定バーのぶん */
a{ color: inherit; text-decoration: none; }
img{ max-width: 100%; height: auto; }
h1, h2, h3{ margin: 0; font-weight: 600; line-height: 1.45; }
h3{ font-size: 1.6rem; margin-bottom: 6px; }
p{ margin: 0 0 12px; }
ul, ol{ margin: 0; }
:focus-visible{ outline: 2px solid var(--key); outline-offset: 2px; }                 /* R13-9・R14-2 */

/* ページの幅（4段。R6-1）。数字の正は tokens.css */
body.w-read{ --maxw: var(--w-read); }
body.w-list{ --maxw: var(--w-list); }
body.w-page{ --maxw: var(--w-page); }
body.w-wide{ --maxw: var(--w-wide); }

/* 本文へ移動（キーボード操作の方向け） */
.skip{ position: absolute; left: 8px; top: -60px; z-index: 50; padding: 8px 12px;
  background: var(--paper); border: 1px solid var(--ink); border-radius: var(--r); }
.skip:focus{ top: 8px; }

/* 確認用の帯（確認用の組み立てにだけ出る） */
.review-band{ margin: 0; padding: 6px var(--pad); background: var(--few-w); color: var(--few);
  font-size: 1.2rem; text-align: center; }

/* ---------- 1. 押せるもの（本体と同じ3種類。R7-2） ------------------ */
.cta, .act{ display: flex; align-items: center; justify-content: center; text-align: center;
  min-height: var(--tap); padding: 0 20px; font-size: 1.5rem; font-weight: 600; border-radius: var(--r); }
/* 主：押すと先へ進む。1画面に1つ（R7-3） */
.cta{ background: var(--key); color: #fff; border: 1px solid var(--key); }
.cta:active{ background: var(--key-d); }
/* 副：それ以外 */
.act{ background: var(--paper); color: var(--ink); border: 1px solid var(--line-2); }
.act:hover{ border-color: var(--ink); }
/* 並び。スマホでは縦に積む */
.acts{ display: flex; flex-direction: column; gap: 8px; margin-top: 16px; }

/* 本文中のリンク（R7-8） */
.link{ border-bottom: 1px solid var(--line-2); }
.link:hover{ border-bottom-color: var(--ink); }

/* ---------- 2. 画像の入れ方（本体と同じ3通り。R11-1） ------------- */
.imgfill{ width: 100%; height: 100%; object-fit: cover; display: block; }
.imgfit{ width: 100%; height: 100%; object-fit: contain; display: block; }
.img43{ width: 100%; aspect-ratio: 4/3; object-fit: cover; display: block; border-radius: var(--r-lg); }
/* AI生成の利用イメージ。注記は img() が必ず付ける（H5-2） */
.ai-img{ margin: 0; }
.ai-img figcaption{ margin-top: 4px; font-size: 1.1rem; color: var(--ink-2); }

/* ---------- 3. 小さな調整（本体と同じ名前） ------------------------ */
.mt-8{ margin-top: 8px; }  .mt-16{ margin-top: 16px; }  .mt-24{ margin-top: 24px; }
.strong{ font-weight: 600; }
.note{ font-size: 1.3rem; color: var(--ink-2); }
.unit-l{ font-size: 1.2rem; font-weight: 400; color: var(--ink-2); margin-left: 2px; }
.pconly{ display: none; }
.sponly{ display: inline; }
.dots{ padding-left: 20px; }                                                           /* R9-2 */
.dots li{ margin-bottom: 6px; }

/* 「項目｜値」の2列表（本体と同じ。R8-1） */
table{ width: 100%; border-collapse: collapse; font-size: 1.4rem; }
.kv{ table-layout: fixed; border-top: 1px solid var(--line); }
.kv th, .kv td{ padding: 10px 12px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
.kv th{ width: 38%; font-weight: 600; background: var(--wash); }
.kv td{ word-break: break-word; }

/* ---------- 4. ヘッダーと来場者の帯 --------------------------------
   スマホ：ヘッダー（60px）を上部に固定し、その直下に来場者の帯（固定しない）。
   PC：帯＋ヘッダーをまとめて固定し、スクロールで帯だけ隠す（hall-pc.css）。 */
.masthead{ display: contents; }
.hd{ position: sticky; top: 0; z-index: 30; display: flex; align-items: center; gap: 12px;
  height: 60px; padding: 0 var(--pad); background: var(--paper); border-bottom: 1px solid var(--line); }
.hd-logo{ display: flex; align-items: center; gap: 10px; line-height: 1.3; margin-right: auto; }
.hd-logo-img{ display: block; width: auto; height: 32px; }   /* ロゴ（本体サイトの ALBE のロゴ＋HALL NAGOYA。ロゴカラー） */
.hd-nav{ display: none; }
.hd-acts{ display: none; }
.hd-menu{ display: none; min-height: var(--tap); padding: 0 14px; font: inherit; font-size: 1.3rem; font-weight: 600;
  background: var(--paper); color: var(--ink); border: 1px solid var(--line-2); border-radius: var(--r); }
/* メニューはJSが動くときだけ出す。動かなくてもフッターから全ページへ行ける（H3-2） */
.js .hd-menu{ display: block; }
.hd.is-open .hd-nav{ display: flex; flex-direction: column; position: absolute; top: 60px; left: 0; right: 0;
  padding: 8px var(--pad) 16px; background: var(--paper); border-bottom: 1px solid var(--line); }
.hd.is-open .hd-nav a{ display: flex; align-items: center; min-height: var(--tap); border-bottom: 1px solid var(--line); }

.visitor-band{ display: flex; gap: 16px; align-items: center; justify-content: center; flex-wrap: wrap;
  padding: 8px var(--pad); background: var(--ink); color: #fff; font-size: 1.3rem; }
.visitor-band a{ display: inline-flex; align-items: center; min-height: 28px; border-bottom: 1px solid currentColor; font-weight: 600; }
.visitor-band .pconly{ display: none; }

/* パンくず */
.crumbs ol{ display: flex; flex-wrap: wrap; gap: 4px; margin: 0; padding: 10px var(--pad); list-style: none;
  font-size: 1.2rem; color: var(--ink-2); }
.crumbs li + li::before{ content: "›"; margin-right: 4px; }
.crumbs a{ border-bottom: 1px solid var(--line-2); }

/* ---------- 5. 節 ------------------------------------------------ */
.sec{ padding: 40px var(--pad); }
.sec > *{ max-width: var(--maxw); margin-left: auto; margin-right: auto; }
.sec-wash{ background: var(--wash); }
.sec-ink{ background: var(--ink); color: #fff; }
.sec-ink .eyebrow, .sec-ink .sec-lead{ color: var(--line-2); }
.sec-head{ margin-bottom: 20px; }
.sec-head h2{ font-size: 2.2rem; }
.sec-head-row{ display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; }
.eyebrow{ margin: 0 0 4px; font-size: 1.1rem; font-weight: 600; letter-spacing: .12em; color: var(--ink-2); }
.sec-lead{ margin: 10px 0 0; font-size: 1.5rem; color: var(--ink-2); }
/* margin は上下だけ。左右は .sec > * の auto（中央ぞろえ）を残す（2026-09-28 margin: 0 で左に寄っていた） */
.ev-list{ display: grid; gap: 8px; margin-top: 0; margin-bottom: 0; padding: 0; list-style: none; }
.ev{ padding: 14px 16px; background: var(--paper); border: 1px solid var(--line); border-radius: var(--r-lg); }
.ev-date{ margin: 0; font-size: 1.3rem; font-weight: 600; color: var(--ink-2); }
.ev-title{ margin: 2px 0 4px; font-size: 1.6rem; font-weight: 600; }
.ev-sum{ margin: 0 0 4px; font-size: 1.4rem; }
.ev-meta{ margin: 0; font-size: 1.3rem; color: var(--ink-2); }
.empty{ padding: 16px; border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--paper); text-align: center; color: var(--ink-2); }

/* ---------- 6. ファーストビュー --------------------------------------
   画面端まで伸ばす写真なので、スマホでは角を丸めない（R12-5） */
.hero-img{ aspect-ratio: 17/11; background: var(--wash); }
/* メインビジュアルのカルーセル。写真を重ねて、表示中の1枚だけ見せる（JSが無ければ1枚目だけ） */
.kv-carousel{ position: relative; overflow: hidden; }
.kv-slide{ position: absolute; inset: 0; opacity: 0; transition: opacity .8s; }
.kv-slide.is-on{ opacity: 1; }
.kv-ctrl{ position: absolute; right: 12px; bottom: 12px; display: none; align-items: center; gap: 4px;
  padding: 0 6px; background: var(--paper); border-radius: var(--r-pill); }
.js .kv-ctrl{ display: flex; }   /* JSが無いときは切り替えられないので出さない */
.kv-dot{ width: var(--tap); height: var(--tap); padding: 0; border: 0; background: none; cursor: pointer; }
.kv-dot::before{ content: ""; display: block; width: 10px; height: 10px; margin: auto; border-radius: var(--r-pill); border: 1px solid var(--ink); }
.kv-dot[aria-current="true"]::before{ background: var(--ink); }
.kv-pause{ min-height: var(--tap); padding: 0 8px; border: 0; background: none; font: inherit; font-size: 1.2rem; font-weight: 600; color: var(--ink); cursor: pointer; }
@media (prefers-reduced-motion: reduce){ .kv-slide{ transition: none; } }
.hero-txt{ padding: 20px var(--pad) 32px; }
.hero h1{ font-size: 2.6rem; margin-bottom: 12px; }
.hero-lead{ font-size: 1.5rem; }

/* 下層ページの見出し：トップのファーストビューと見分けがつくように、文字の帯＋その下に写真（2026-09-27） */
.phead{ padding: 24px var(--pad) 28px; background: var(--wash); border-bottom: 1px solid var(--line); }
.crumbs{ background: var(--wash); }   /* 下層ページの見出しの帯とつなげる */
.phead h1{ font-size: 2.2rem; margin-bottom: 10px; }
.phead-lead{ font-size: 1.5rem; }
.phead-photo{ aspect-ratio: 1450/780; background: var(--wash); }
.spec-grid{ display: grid; grid-template-columns: 1fr 1fr; gap: 1px; margin-top: 16px;
  background: var(--line); border: 1px solid var(--line); border-radius: var(--r-lg); overflow: hidden; }
.spec-grid > div{ padding: 10px 12px; background: var(--paper); }
.spec-grid dt{ font-size: 1.2rem; color: var(--ink-2); }
.spec-grid dd{ margin: 0; font-size: 2.2rem; font-weight: 600; line-height: 1.3; }

/* ---------- 7. 用途の入口 ----------------------------------------- */
.purpose{ display: grid; gap: 10px; }
.purpose-card, .purpose-other{ display: block; padding: 16px; border: 1px solid var(--line-2); border-radius: var(--r-lg); }
.purpose-card:hover{ border-color: var(--ink); }
.purpose-card .purpose-t::after{ content: " →"; }
.purpose-other{ border-style: dashed; }
.purpose-t{ margin: 0 0 4px; font-size: 1.7rem; font-weight: 600; }
.purpose-b{ margin: 0; font-size: 1.4rem; color: var(--ink-2); }

/* ---------- 8. 360°ビューと図面 ------------------------------------ */
.view-grid{ display: grid; gap: 24px; }
.rooms{ display: grid; gap: 24px; }
/* ページ内の目次（/faq/ のカテゴリ）。小ボタン .chip（R7-2） */
.toc{ display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.chip{ display: inline-flex; align-items: center; min-height: var(--tap); padding: 0 14px; border: 1px solid var(--line-2); border-radius: var(--r-pill); background: var(--paper); font-size: 1.3rem; font-weight: 600; }
.chip:hover{ border-color: var(--ink); }
.room h3{ margin-bottom: 4px; }
.vr{ position: relative; aspect-ratio: 86/55; border-radius: var(--r-lg); overflow: hidden; background: var(--wash); }
.vr-btn{ display: block; width: 100%; height: 100%; padding: 0; border: 0; background: none; cursor: pointer; font: inherit; }
.vr-label{ position: absolute; left: 50%; bottom: 12px; transform: translateX(-50%); white-space: nowrap;
  padding: 6px 14px; background: var(--ink); color: #fff; font-size: 1.3rem; font-weight: 600; border-radius: var(--r-pill); }
.vr iframe{ width: 100%; height: 100%; border: 0; display: block; }
.plan-img{ aspect-ratio: 1200/662; margin-bottom: 12px; padding: 8px; border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--paper); }

/* ---------- 9. 遠方の企画者様へ ------------------------------------ */
.remote{ display: grid; gap: 8px; padding: 0; list-style: none; }
.remote li{ padding: 12px 14px; background: var(--paper); border: 1px solid var(--line); border-radius: var(--r-lg); }
.remote-t{ margin: 0 0 2px; font-weight: 600; }
.remote-b{ margin: 0; font-size: 1.4rem; color: var(--ink-2); }

/* ---------- 10. 選ばれる理由・ALBEの約束 ---------------------------- */
.reasons{ display: grid; gap: 0; padding: 0; list-style: none; border-top: 1px solid var(--line); }
.reasons li{ display: flex; gap: 14px; padding: 16px 0; border-bottom: 1px solid var(--line); }
.reasons-no{ flex-shrink: 0; width: 32px; font-family: var(--f-num); font-size: 1.4rem; color: var(--ink-2); }
.reasons-t{ margin: 0 0 4px; font-size: 1.7rem; font-weight: 600; }
.reasons-b{ margin: 0; font-size: 1.4rem; color: var(--ink-2); }
/* 写真の並び（photos()）。スマホは2枚まで横並び、PCは枚数どおり */
.photos{ display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 20px; margin-bottom: 20px; }
.photos-1{ grid-template-columns: 1fr; }
.photos-3 > :first-child{ grid-column: 1 / -1; }
.photos img{ width: 100%; aspect-ratio: 4/3; object-fit: cover; display: block; border-radius: var(--r-lg); background: var(--wash); }
.photos-3 > :first-child img{ aspect-ratio: 16/9; }
.purpose-img{ margin: -16px -16px 12px; }
.purpose-img img{ width: 100%; aspect-ratio: 3/2; object-fit: cover; display: block; border-radius: var(--r-lg) var(--r-lg) 0 0; }
.purpose-img .ai-img figcaption{ padding: 0 16px; }
.reasons-img{ margin-bottom: 10px; }
.reasons-img img{ width: 100%; aspect-ratio: 3/2; object-fit: cover; display: block; border-radius: var(--r-lg); }
.more-reasons > summary{ display: flex; align-items: center; justify-content: center; min-height: var(--tap); margin-top: 16px;
  list-style: none; cursor: pointer; font-weight: 600; border: 1px solid var(--line-2); border-radius: var(--r); }
.more-reasons > summary::-webkit-details-marker{ display: none; }
.more-reasons[open] > summary{ display: none; }

.promises{ display: grid; gap: 1px; padding: 0; list-style: none; background: var(--ink-2); border: 1px solid var(--ink-2); border-radius: var(--r-lg); overflow: hidden; }
.promises li{ display: grid; grid-template-columns: 48px 1fr; column-gap: 14px; align-items: start; padding: 14px 16px; background: var(--ink); }
.promises li > :not(.promises-ic){ grid-column: 2; }
.promises-ic{ grid-row: 1 / 4; }
.promises-ic{ display: flex; align-items: center; justify-content: center; width: 48px; height: 48px;
  border-radius: var(--r-pill); border: 1px solid var(--ink-2); color: #fff; }
.promises-ic .icon{ width: 26px; height: 26px; }
.promises-no{ display: block; font-family: var(--f-num); font-size: 1.2rem; color: var(--line-2); }
.promises-t{ margin: 2px 0 2px; font-size: 1.7rem; font-weight: 600; }
.promises-n{ margin: 0; font-size: 1.3rem; color: var(--line-2); }

/* ---------- 11. 料金 --------------------------------------------- */
.price-grid{ display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.price-grid > div{ padding: 14px; border: 1px solid var(--line-2); border-radius: var(--r-lg); background: var(--paper); }
.price-k{ margin: 0; font-size: 1.3rem; color: var(--ink-2); }
.price-v{ margin: 0; font-size: 2.2rem; font-weight: 600; font-feature-settings: "tnum" 1; }

/* ---------- 12. 開催事例 ------------------------------------------ */
.cases{ display: grid; gap: 10px; padding: 0; list-style: none; }
.case{ padding: 16px; border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--paper); }
.case-tag{ display: inline-block; margin: 0 0 8px; padding: 2px 10px; font-size: 1.2rem; font-weight: 600;
  border: 1px solid var(--ink); border-radius: var(--r-pill); }
.case-q{ margin: 0 0 8px; font-size: 1.5rem; }
.case-who{ margin: 0; font-size: 1.2rem; color: var(--ink-2); }

/* ---------- 13. 見学・お受けできないご利用・FAQ ---------------------- */
.methods{ display: grid; gap: 8px; padding: 0; list-style: none; }
.methods li{ padding: 12px 14px; border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--paper); }
.methods-t{ margin: 0 0 2px; font-weight: 600; }
.methods-b{ margin: 0; font-size: 1.4rem; color: var(--ink-2); }

.ng{ padding-top: 24px; padding-bottom: 24px; }
.ng-h{ font-size: 1.6rem; margin-bottom: 6px; }
.ng-lead{ font-size: 1.4rem; }
.ng-list{ display: flex; flex-wrap: wrap; gap: 6px 14px; padding: 12px 14px; list-style: none;
  font-size: 1.4rem; background: var(--wash); border-radius: var(--r-lg); }
.ng-list li::before{ content: "×"; margin-right: 4px; color: var(--ink-2); }
.ng .note{ margin-top: 8px; }

.faq{ border-top: 1px solid var(--line); margin-bottom: 16px; }
.faq-i{ border-bottom: 1px solid var(--line); }
.faq-i summary{ display: flex; align-items: center; gap: 10px; min-height: var(--tap); padding: 10px 0;
  list-style: none; cursor: pointer; font-weight: 600; }
.faq-i summary::-webkit-details-marker{ display: none; }
.faq-i summary::before{ content: "Q."; color: var(--ink-2); font-family: var(--f-num); }
.faq-i summary::after{ content: "+"; margin-left: auto; font-family: var(--f-num); color: var(--ink-2); }
.faq-i[open] summary::after{ content: "−"; }
.faq-i p{ margin: 0 0 14px; padding-left: 26px; font-size: 1.5rem; color: var(--ink-2); }

/* ---------- 14. 下層ページの塊 ------------------------------------- */
.points{ display: grid; gap: 20px; }
.points p{ font-size: 1.5rem; }
.access-list{ padding-left: 20px; margin-bottom: 12px; }
.access-list li{ margin-bottom: 6px; }
.closing{ text-align: center; }
.closing h2{ font-size: 2.2rem; }

/* ---------- 14-2. 下層ページの見出し・注意書き・表（本体と同じ名前） ---- */
.page-h1, .visitor-note h1{ font-size: 2.6rem; margin-bottom: 16px; }
/* 予約システムのカレンダー（iframe）。高さは assets/shared/embed.js が合わせる（本体と同じ） */
.embedwrap iframe{ display: block; width: 100%; border: 0; min-height: 280px; background: var(--paper); border-radius: var(--r-lg); }
.map{ border-radius: var(--r-lg); overflow: hidden; background: var(--wash); }
.map iframe{ display: block; width: 100%; aspect-ratio: 4/3; border: 0; }
.notebox{ padding: 14px; background: var(--wash); border: 1px solid var(--line); border-radius: var(--r-lg); }
.notebox p:last-child{ margin-bottom: 0; }
.phead .notebox{ background: var(--paper); }
.m0{ margin: 0; }
.nowrap{ white-space: nowrap; }
/* 番号つきの手順（R9-1） */
.steps{ padding: 0; list-style: none; counter-reset: step; }
.steps li{ position: relative; padding: 0 0 16px 40px; counter-increment: step; }
.steps li::before{ content: counter(step); position: absolute; left: 0; top: 0; width: 28px; height: 28px;
  display: flex; align-items: center; justify-content: center; font-family: var(--f-num); font-size: 1.3rem;
  color: #fff; background: var(--ink); border-radius: var(--r-pill); }
.steps li p{ margin-bottom: 4px; }
/* 横に長い表は横スクロール（R8-2） */
.tbl{ overflow-x: auto; }
.price-matrix, .sim{ min-width: 480px; border-top: 1px solid var(--line); }
.price-matrix th, .price-matrix td, .sim th, .sim td{ padding: 10px 12px; border-bottom: 1px solid var(--line); text-align: left; }
.price-matrix td{ font-size: 1.7rem; font-weight: 600; }
.sim th[scope="row"]{ font-weight: 600; }

/* ---------- 15. フッター・固定バー ---------------------------------- */
.ft{ padding: 32px var(--pad) 24px; border-top: 1px solid var(--line); font-size: 1.3rem; }
.ft-in{ max-width: var(--maxw); margin-left: auto; margin-right: auto; }
.ft-brand{ display: flex; flex-direction: column; align-items: flex-start; gap: 8px; margin-bottom: 4px; font-size: 1.6rem; font-weight: 600; }
.ft-logo{ display: block; width: auto; height: 40px; }
.ft-addr{ color: var(--ink-2); }
.ft-tel{ font-weight: 600; }
.ft-tel a{ border-bottom: 1px solid currentColor; }
.ft-nav{ display: grid; grid-template-columns: 1fr 1fr; margin: 16px 0; border-top: 1px solid var(--line); }
.ft-nav a{ display: flex; align-items: center; min-height: var(--tap); padding: 0 4px; border-bottom: 1px solid var(--line); }
.ft-op{ color: var(--ink-2); }

.fixbar{ position: fixed; left: 0; right: 0; bottom: 0; z-index: 40; display: grid; grid-template-columns: 1fr 1.4fr 1fr;
  gap: 1px; background: var(--line); border-top: 1px solid var(--line); padding-bottom: env(safe-area-inset-bottom); }
.fixbar a{ display: flex; align-items: center; justify-content: center; min-height: 58px;
  font-size: 1.3rem; font-weight: 600; background: var(--paper); text-align: center; }
.fixbar .fixbar-main{ background: var(--ink); color: #fff; font-size: 1.5rem; }

/* ---------- 13. フォーム（/contact/。R13：枠は --field、文字16px以上・高さ44px以上、フォーカスは2pxの枠、ラベルは欄の外） ---------- */
.cform .f{ margin-bottom: 20px; }
.cform label{ display: block; margin-bottom: 6px; font-weight: 600; }
.cform input[type="text"], .cform input[type="email"], .cform input[type="tel"], .cform input[type="date"], .cform select, .cform textarea{
  display: block; width: 100%; min-height: var(--tap); padding: 10px 12px; font: inherit; font-size: 1.6rem;
  color: var(--ink); background: var(--paper); border: 1px solid var(--field); border-radius: var(--r); }
.cform textarea{ resize: vertical; }
.cform .slot-row{ display: grid; grid-template-columns: 1fr 8rem; gap: 8px; }
/* いたずら対策の見えない欄（人には見せない・読み上げない） */
.cform .hp{ position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.cform input:focus-visible, .cform select:focus-visible, .cform textarea:focus-visible{ outline: 2px solid var(--key); outline-offset: 0; border-color: var(--key); }
.cform .f-check label{ padding: 10px 0; font-weight: 400; }
.cform .f-check input{ width: 22px; height: 22px; margin: 0 8px 0 0; vertical-align: -5px; accent-color: var(--key); }
/* ヘッダーが上に固定されているので、切り替えたときの見出しが隠れないよう余白をとる */
.cform, .cform-step{ scroll-margin-top: 96px; }
.req{ display: inline-block; margin-left: 8px; padding: 0 6px; font-size: 1.1rem; font-weight: 600; color: #fff; background: var(--ink); border-radius: var(--r-pill); vertical-align: 2px; }
.hint{ margin: 6px 0 0; font-size: 1.3rem; color: var(--ink-2); }
.f.bad input, .f.bad select, .f.bad textarea{ border-color: var(--full); }
.emsg{ margin: 6px 0 0; font-size: 1.4rem; font-weight: 600; color: var(--full); }
.fsum{ margin: 16px 0; border-top: 1px solid var(--line); }
.fsum div{ display: grid; gap: 4px; padding: 12px 0; border-bottom: 1px solid var(--line); }
.fsum dt{ font-size: 1.3rem; color: var(--ink-2); }
.fsum dd{ margin: 0; white-space: pre-wrap; }
.tel-big{ margin-top: 16px; font-size: 2.2rem; font-weight: 600; }
.tel-big a{ border-bottom: 1px solid currentColor; }
.tel-big .note{ margin-left: 8px; font-size: 1.3rem; font-weight: 400; }


/* 備品の写真カード（/floor/。2026-09-27） */
.eq-cards{ display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 12px; margin-bottom: 12px; padding: 0; list-style: none; }
.eq-card{ display: flex; flex-direction: column; border: 1px solid var(--line); border-radius: var(--r-lg); overflow: hidden; background: var(--paper); }
.eq-card .eq-img{ width: 100%; aspect-ratio: 4/3; object-fit: cover; display: block; background: var(--wash); }
.eq-body{ padding: 8px 12px 12px; }
.eq-body h4{ margin-top: 0; margin-bottom: 4px; font-size: 1.5rem; font-weight: 600; line-height: 1.5; }
.eq-body p{ margin-top: 0; margin-bottom: 0; font-size: 1.3rem; line-height: 1.6; }
.eq-price{ color: var(--ink-2); }

/* 写真の拡大（hall.js の 8）。写真そのものを押せるようにする（形はボタンに見せない） */
.zoom{ display: block; width: 100%; padding: 0; border: 0; background: none; cursor: zoom-in; border-radius: var(--r-lg); }
.zoom:focus-visible{ outline: 2px solid var(--key); outline-offset: 2px; }
.lb{ width: min(1200px, 100vw - 16px); max-width: none; max-height: none; padding: 12px; border: 0; border-radius: var(--r-lg); background: var(--ink); color: var(--paper); }
.lb::backdrop{ background: color-mix(in srgb, var(--ink) 85%, transparent); }
.lb-fig{ margin: 0; }
.lb-img{ display: block; width: 100%; height: auto; max-height: calc(100vh - 160px); object-fit: contain; }
.lb-cap{ margin-top: 8px; font-size: 1.3rem; }
.lb-bar{ display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 12px; }
.lb-count{ font-size: 1.3rem; font-feature-settings: "tnum" 1; }
.lb-close{ margin-left: auto; }

/* 規約（/rules/・/privacy-policy/）。長い文を読みやすく、見出しの前をあける */
.rules h2{ margin-top: 40px; margin-bottom: 12px; font-size: 2.2rem; }
.rules h2:first-child{ margin-top: 0; }
.rules h3{ margin-top: 20px; }
.rules .kv{ margin-top: 12px; margin-bottom: 12px; }
.rules-ol{ padding-left: 1.6em; }
.rules-ol li + li{ margin-top: 8px; }

/* ブログ・お知らせ（src/pages/_posts.mjs・blog.mjs・news.mjs） */
.post{ max-width: var(--maxw); margin-left: auto; margin-right: auto; padding: 24px var(--pad) 40px; }
.post-head h1{ font-size: 2.2rem; line-height: 1.5; }
.post-kind{ font-size: 1.2rem; color: var(--ink-2); }
.post-date{ margin-top: 8px; font-size: 1.3rem; color: var(--ink-2); }
.post-eye{ display: block; width: 100%; height: auto; margin-top: 20px; border-radius: var(--r-lg); }
.prose{ margin-top: 24px; }
.prose > * + *{ margin-top: 16px; }
.prose h2{ margin-top: 40px; font-size: 2.2rem; line-height: 1.5; }
.prose h3{ margin-top: 32px; font-size: 1.7rem; }
.prose h4, .prose h5{ margin-top: 24px; font-size: 1.6rem; }
.prose img{ display: block; max-width: 100%; height: auto; border-radius: var(--r-lg); }
.prose ul, .prose ol{ padding-left: 1.4em; }
.prose table{ width: 100%; border-collapse: collapse; font-size: 1.4rem; }
.prose th, .prose td{ padding: 8px 10px; border: 1px solid var(--line); text-align: left; vertical-align: top; }
.prose th{ background: var(--wash); }
.prose blockquote{ padding: 12px 16px; border-left: 4px solid var(--line); background: var(--wash); }
.prose iframe{ display: block; width: 100%; aspect-ratio: 4/3; border: 0; border-radius: var(--r-lg); }
.prose a{ text-decoration: underline; text-underline-offset: 2px; }
.post-exit-h{ font-size: 2.2rem; }
.post-exit-cards{ display: grid; gap: 12px; margin-top: 16px; }
.post-exit-card{ display: flex; flex-direction: column; gap: 4px; min-height: var(--tap); padding: 16px; border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--paper); }
.post-cards{ display: grid; grid-template-columns: 1fr; gap: 20px; padding: 0; list-style: none; }
.post-card a{ display: block; }
.post-card-img{ aspect-ratio: 3/2; overflow: hidden; border-radius: var(--r-lg); background: var(--wash); }
.post-card-img img{ width: 100%; height: 100%; object-fit: cover; display: block; }
.post-card-date{ margin-top: 8px; font-size: 1.2rem; color: var(--ink-2); }
.post-card-title{ margin-top: 4px; font-size: 1.6rem; line-height: 1.5; }
.news-list{ padding: 0; list-style: none; border-top: 1px solid var(--line); }
.news-list li{ display: flex; flex-direction: column; gap: 4px; padding: 14px 0; border-bottom: 1px solid var(--line); }
.news-list time{ font-size: 1.3rem; color: var(--ink-2); }
