@charset "UTF-8";
/* ==========================================================
   飛騨ほおのき平スキー場 — components.css
   藤橋さん 8/31 デザイン（index / gelande / price）から抽出した共通部品。
   デザイン未支給の下層9ページ＋新規ページ（申し込み・ロッジ詳細）が使う。

   作成: 2026-09-03（D-1）
   出典: _review/A1c_20260902/spec/{top,slop,hour}_{pc,sp}_spec.md（イラレ実データ）
        ＋ 実装済み css/{subpage,sections/*,pages/gelande,pages/price}.css
   ガイド: deliverables/design-language_2026-09-03.md

   規約:
   ・接頭辞は .cx- のみ。既存 .c- / .g- / .price- / .h- とは一切衝突しない
   ・ドロップシャドウ禁止／グラデは spec に実在する2種（帯青の縦グラデ・青カードの横グラデ）だけ
   ・絵文字禁止。アイコンは Lucide 系インラインSVG
   ・数値はすべて spec 実値。根拠を各ブロックのコメントに残す
   ・読み込み順は subpage.css より後（ページ固有CSSより前）を想定
   ========================================================== */

/* ==========================================================
   0. トークン
   ========================================================== */
:root {
  /* 色（spec 図形・文字の実値） */
  --cx-ink:        #2d2d2d; /* 本文墨 */
  --cx-label:      #939494; /* ラベル灰（白地 3.0:1＝カンプ指定色・既知） */
  --cx-blue:       #165ce2; /* 文字青・枠線・アイコン円 */
  --cx-blue-face:  #1673e2; /* 図形の青（写真ブリードカード・フッター帯） */
  --cx-blue-band:  #007edf; /* 帯グラデ・距離の数値 */
  --cx-cyan:       #00adff; /* 区分ピル・表ヘッダ第2列以降 */
  --cx-pink:       #ff8690; /* 障がい者区分・エラー枠 */
  --cx-yellow:     #ffe434; /* KIDS カード */
  --cx-yellow-soft:#fff6d5; /* 手ぶ楽パック（弱い黄＋1px青枠） */
  --cx-lv2:        #145c97; /* 3段階カード 中段 */
  --cx-lv3:        #003c69; /* 3段階カード 下段 */
  --cx-hair:       rgba(22, 92, 226, 0.22); /* 表の行罫（カンプ実測 200,217,248） */
  --cx-ph-face:    #e3e3e3; /* プレースホルダ面 */
  --cx-ph-text:    #808080;
  --cx-error:      #d0454f; /* 白地 4.52:1 */
  /* カンプに無い部品（任意バッジ・原稿待ち表記）用の灰。ラベル灰 #939494 は白文字で 3.0:1 と
     コントラスト不足だが、あれは「カンプ指定色だから維持」という既知事項（BRIEF §5）であって、
     こちらで新設する部品にまで持ち込む理由はない。白文字 4.80:1 の濃度を使う。 */
  --cx-gray-aa:    #6e7375;

  /* 書体（base.css のトークンを継承。単独読み込みでも壊れないようフォールバックを持つ） */
  --cx-font-jp: var(--font-jp, "Shippori Antique B1 palt", "Shippori Antique B1", "Hiragino Kaku Gothic ProN", sans-serif);
  --cx-font-en: var(--font-en, "Bebas Kai", "Bebas Neue", sans-serif);
  /* Meiryo-Bold（単位 ℃ / cm / m / °）は Web 配信不可＝近似スタック（BRIEF §1） */
  --cx-font-unit: Meiryo, "Hiragino Sans", "Noto Sans JP", sans-serif;

  /* 版面・リズム */
  --cx-content:      1272px; /* 版面（広） */
  --cx-content-slim: 1200px; /* 版面（狭・料金系） */
  --cx-content-faq:   872px; /* 版面（FAQ） */
  --cx-gap-sec:        96px; /* セクション間（PC） */
  --cx-gap-sec-sp:     60px; /* セクション間（SP） */
  --cx-ease: cubic-bezier(0.22, 1, 0.36, 1);
}

/* ==========================================================
   1. レイアウト土台
   ========================================================== */
.cx-sec { padding: var(--cx-gap-sec) 0 0; }
.cx-sec--flush { padding-top: 0; }
.cx-sec--last { padding-bottom: var(--cx-gap-sec); }

.cx-inner { width: var(--cx-content); margin: 0 auto; }
.cx-inner--slim { width: var(--cx-content-slim); }
.cx-inner--faq { width: var(--cx-content-faq); }

.cx-grid { display: grid; }
.cx-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 42px; }
.cx-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 36px; }
.cx-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 28px; }

/* ==========================================================
   2. 見出し
   spec PC: EN = Bebas 53.57 / -0.015em ／ JPラベル = Shippori 17 / 0.11em / #2d2d2d
   spec SP: EN = 30.13 / -0.015em ／ JPラベル = 11 / 0.11em
   ink 中心を揃えるため align-items:center ＋ ラベルを -1.5px（subpage.css と同じ処理）
   ========================================================== */
.cx-head {
  display: flex;
  align-items: center;
  gap: 18px;
  margin-bottom: 34px;
}
.cx-head__en {
  font-family: var(--cx-font-en);
  font-feature-settings: normal;
  font-size: 53.57px;
  line-height: 1;
  letter-spacing: -0.015em;
  color: var(--cx-blue);
  font-weight: 400;
}
.cx-head__label {
  position: relative;
  top: -1.5px;
  font-family: var(--cx-font-jp);
  font-size: 17px;
  line-height: 1;
  letter-spacing: 0.11em;
  color: var(--cx-ink);
  font-weight: 400;
}
.cx-head--center { justify-content: center; }
/* 青帯・青カードの上に置く見出し */
.cx-head--white .cx-head__en { color: #fff; }
.cx-head--white .cx-head__label { color: #fff; }
/* カード内の小見出し（spec: INFORMATION / PAYMENT / KIDS = Bebas 34.42 / SP 19.58） */
.cx-head--sm { gap: 14px; margin-bottom: 22px; }
.cx-head--sm .cx-head__en { font-size: 34.42px; }

/* ==========================================================
   3. テキストの型
   ========================================================== */
/* キャッチ（spec: 30 / 0.11em / 1行は字面高 36.6px で組む） */
.cx-catch {
  font-family: var(--cx-font-jp);
  font-size: 30px;
  line-height: 36.6px;
  letter-spacing: 0.11em;
  font-weight: 400;
  color: var(--cx-ink);
}
/* リード（spec: 16 / 0.17em / leading 33） */
.cx-lead {
  font-size: 16px;
  line-height: 33px;
  letter-spacing: 0.17em;
  color: var(--cx-ink);
}
/* 本文（spec: 17 / 0.07em / leading 27） */
.cx-text {
  font-size: 17px;
  line-height: 27px;
  letter-spacing: 0.07em;
  color: var(--cx-ink);
}
/* 注記（spec: 15 / 0.07em / leading 23） */
.cx-note {
  font-size: 15px;
  line-height: 23px;
  letter-spacing: 0.07em;
  color: var(--cx-ink);
}
/* 箇条書き（spec: 15 / 0.07em / leading 23〜27・ぶら下げ1em） */
.cx-list li {
  font-size: 15px;
  line-height: 25px;
  letter-spacing: 0.07em;
  color: var(--cx-ink);
  padding-left: 1em;
  text-indent: -1em;
}
/* 青枠カード内の長文（spec: 16 / 0.15em / leading 33・ぶら下げ1.2em） */
.cx-list--wide li {
  font-size: 16px;
  line-height: 33px;
  letter-spacing: 0.15em;
  padding-left: 1.2em;
  text-indent: -1.2em;
}
.cx-list--white li { color: #fff; }
/* 青の●（装飾。本文と同サイズ＝最小サイズ判定を通す） */
.cx-dot { color: var(--cx-blue); font-size: 1em; }
.cx-dot--white { color: #fff; }
/* ラベル（spec: 17 / 0.11em / #939494） */
.cx-label {
  font-size: 17px;
  line-height: 19.13px;
  letter-spacing: 0.11em;
  color: var(--cx-label);
}
/* 原稿待ちの明示（面は作らず文字だけ薄く）。カンプ外の表記なので AA を満たす灰を使う */
.cx-tbd { color: var(--cx-gray-aa); }

/* ==========================================================
   4. 値（和文ラベル小＋Bebas数字大の混植）
   spec: 「平日：3,700円」= 和文ラン Shippori 17 / 0.11em ＋ 数字ラン Bebas 35 / 0.005em
   ========================================================== */
.cx-val {
  font-size: 17px;
  line-height: 1;
  letter-spacing: 0.11em;
  white-space: nowrap;
  color: var(--cx-ink);
}
.cx-val__num {
  font-family: var(--cx-font-en);
  font-feature-settings: normal;
  font-size: 35px;
  line-height: 0.9;
  letter-spacing: 0.005em;
  color: inherit;
  margin: 0 1px;
}
/* 時刻は spec で全体が Bebas 1ラン */
.cx-val--time { font-size: 35px; letter-spacing: 0.005em; font-family: var(--cx-font-en); font-feature-settings: normal; }
.cx-val--white { color: #fff; }
/* 単位（℃ / cm / m / °）は Meiryo 代替スタック 700・26.33px（spec 実値） */
.cx-unit {
  font-family: var(--cx-font-unit);
  font-weight: 700;
  font-size: 26.33px;
  letter-spacing: 0.11em;
}
/* 度記号は句点に見えないよう肩に揃える */
.cx-deg { vertical-align: 0.72em; margin-left: 2px; }

/* ==========================================================
   5. 区分ピル
   spec 図形: 123.8×27.7 / 角丸full / 白文字 14px 0.11em（PC）
             SP 91.2×20.4（2列組は 66.6×20.4）/ 文字 10.31px 0.11em
   ========================================================== */
.cx-pill {
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 123.8px;
  height: 27.7px;
  padding: 0 12px;
  border-radius: 999px;
  background: var(--cx-cyan);
  color: #fff;
  font-size: 14px;
  line-height: 1;
  letter-spacing: 0.11em;
  white-space: nowrap;
}
.cx-pill--pink { background: var(--cx-pink); }
.cx-pill--blue { background: var(--cx-blue); }
.cx-pill--narrow { min-width: 90.4px; }
/* 小バッジ（ニュース分類）spec 図形 70×22・文字 11 / 0.11em */
.cx-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 70px;
  height: 22px;
  border-radius: 999px;
  background: var(--cx-blue);
  color: #fff;
  font-size: 11px;
  line-height: 1;
  letter-spacing: 0.11em;
}

/* ==========================================================
   6. ボタン
   spec 図形: 300×70 / 角丸6 / #165ce2、白丸アイコン 23px・右15px
             SP 265.2×61.9、文字 PC 17/0.05em・SP 15.03/0.05em
   ========================================================== */
.cx-btn {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 300px;
  min-height: 70px;
  margin: 0 auto;
  padding: 0 44px 0 20px;
  background: var(--cx-blue);
  border-radius: 6px;
  color: #fff;
  transition: filter 0.35s var(--cx-ease);
}
.cx-btn__text { font-size: 17px; line-height: 1; letter-spacing: 0.05em; }
.cx-btn__icon {
  position: absolute;
  top: 50%;
  right: 15px;
  transform: translateY(-50%);
  display: flex;
  align-items: center;
  justify-content: center;
  width: 23px;
  height: 23px;
  border-radius: 50%;
  background: #fff;
  color: var(--cx-blue);
}
.cx-btn__icon svg { width: 14px; height: 14px; stroke: currentColor; transition: transform 0.35s var(--cx-ease); }
@media (hover: hover) {
  .cx-btn:hover { filter: brightness(1.08); }
  .cx-btn:hover .cx-btn__icon svg { transform: translateX(3px); }
}
/* 小ボタン spec 図形 205.5×50（SP 178.8×43.5）・文字 17/0.11em（SP 14.79） */
.cx-btn--sm {
  width: 205.5px;
  min-height: 50px;
  padding: 0 46px 0 20px;
}
.cx-btn--sm .cx-btn__text { font-size: 17px; letter-spacing: 0.11em; }
.cx-btn--sm .cx-btn__icon { right: 10px; width: 26px; height: 26px; }
.cx-btn--sm .cx-btn__icon svg { width: 12px; height: 12px; }
/* 白ボタン（青の面の上に置く）spec 図形 165.3×50・文字 17/0.11em #165ce2 */
.cx-btn--white {
  width: 165.3px;
  min-height: 50px;
  padding: 0 44px 0 22px;
  background: #fff;
  color: var(--cx-blue);
}
.cx-btn--white .cx-btn__text { font-size: 17px; letter-spacing: 0.11em; }
.cx-btn--white .cx-btn__icon { right: 12px; width: 24px; height: 24px; background: var(--cx-blue); color: #fff; }
.cx-btn--white .cx-btn__icon svg { width: 13px; height: 13px; }
@media (hover: hover) { .cx-btn--white:hover { filter: none; background: #f0f6ff; } }
/* 線ボタン（副導線） */
.cx-btn--outline {
  background: #fff;
  border: 1px solid var(--cx-blue);
  color: var(--cx-blue);
}
.cx-btn--outline .cx-btn__icon { background: var(--cx-blue); color: #fff; }
@media (hover: hover) { .cx-btn--outline:hover { filter: none; background: #f0f6ff; } }
/* 幅可変（フォーム送信・カード内） */
.cx-btn--auto { width: auto; min-width: 0; margin: 0; }
.cx-btn[disabled], .cx-btn.is-disabled { opacity: 0.45; pointer-events: none; }

/* CTAペア spec 図形: 300×70 が 2つ・間 31px（x404.5 / x735.5） */
.cx-btnpair { display: flex; justify-content: center; gap: 31px; }
.cx-btnpair .cx-btn { margin: 0; }

/* ==========================================================
   7. 写真の全幅青帯（GELANDE OVERVIEW 型）
   spec 図形: 写真ラスタ y744.7 x-16.6 1494.2×995.7（帯上端の16.3px上）
             青 y761.0 1440×964.6 ＝ #007edf 100%→0% の縦グラデ1枚
             白フェード y1345.3 1440×380.2（44.1%まで0 → 100%で白）
   ========================================================== */
.cx-band {
  position: relative;
  z-index: 0;
  padding: 113px 0 55px;
  overflow: visible;
}
.cx-band__bg {
  position: absolute;
  top: -16.3px;
  left: 0;
  width: 100%;
  height: 995.7px;
  object-fit: cover;
  z-index: 0;
}
.cx-band::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 964.6px;
  z-index: 1;
  background: linear-gradient(180deg, var(--cx-blue-band) 0%, rgba(0, 126, 223, 0) 100%);
}
/* 白フェードは spec の 584.3+380.2=964.6 だと写真ラスタの下端（-16.3+995.7=979.4）より
   15px 手前で終わり、写真の下端が硬いエッジで出る（写真が明るい雪面なら目立たないが、
   稜線などの暗い写真では線が見える）。フェードの終端を写真下端に合わせて 395.4px にする。 */
.cx-band::after {
  content: "";
  position: absolute;
  top: 584.3px; left: 0; right: 0;
  height: 395.4px;
  z-index: 1;
  background: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 42.4%, #fff 100%);
}
.cx-band__inner { position: relative; z-index: 2; }

/* ==========================================================
   8. 白ピルカード（スペック値）
   spec 図形: 616×120 / 角丸16 / 白、アイコン円 76 #165ce2、2列・列間42・段間24
   spec 文字: ラベル 17/0.11em/#939494、値 25.32/0.11em/leading39.81、数値 Bebas 54.47/0.005em
   ========================================================== */
.cx-statgrid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 42px;
  row-gap: 24px;
}
.cx-statgrid--1 { grid-template-columns: minmax(0, 1fr); }
.cx-statcard {
  display: flex;
  align-items: center;
  gap: 22px;
  min-height: 120px;
  padding: 0 28px;
  background: #fff;
  border-radius: 16px;
}
.cx-statcard__icn {
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 76px;
  height: 76px;
  border-radius: 50%;
  background: var(--cx-blue);
  color: #fff;
}
.cx-statcard__icn svg { width: 38px; height: 38px; }
.cx-statcard__label {
  flex: none;
  width: 116px;
  font-size: 17px;
  line-height: 1.4;
  letter-spacing: 0.11em;
  color: var(--cx-label);
}
.cx-statcard__value {
  flex: 1;
  min-width: 0;
  text-align: center;
  font-size: 25.32px;
  line-height: 39.81px;
  letter-spacing: 0.11em;
  color: var(--cx-ink);
}
.cx-statcard__value--left { text-align: left; }
.cx-statcard__num {
  font-family: var(--cx-font-en);
  font-feature-settings: normal;
  font-size: 54.47px;
  line-height: 0.9;
  letter-spacing: 0.005em;
  color: inherit;
  margin: 0 1px;
}

/* ==========================================================
   9. 3段階の青ブロック（写真上・青下・右下角丸55）
   spec 図形: 写真 400×280（10:7）／ブロック 400×305.6・角丸 0 0 55px 0
             塗り lv1 #165ce2 / lv2 #135c97（実装 #145c97） / lv3 #003c69
   spec 文字: 見出し 22/0.07em/27、説明 17/0.07em/27、一覧 15/0.07em/23（すべて白）
   ========================================================== */
.cx-lvgrid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 36px; }
.cx-lvcard { display: flex; flex-direction: column; }
.cx-lvcard__photo { position: relative; aspect-ratio: 400 / 280; overflow: hidden; }
.cx-lvcard__photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.cx-lvcard__body {
  display: flex;
  flex-direction: column;
  flex: 1;
  padding: 26px 24px 34.6px;
  color: #fff;
  background: var(--cx-blue);
  border-radius: 0 0 55px 0;
}
.cx-lvcard--lv2 .cx-lvcard__body { background: var(--cx-lv2); }
.cx-lvcard--lv3 .cx-lvcard__body { background: var(--cx-lv3); }
.cx-lvcard__title {
  font-size: 22px;
  line-height: 27px;
  letter-spacing: 0.07em;
  font-weight: 400;
  margin-bottom: 12px;
}
.cx-lvcard__desc {
  font-size: 17px;
  line-height: 27px;
  letter-spacing: 0.07em;
  margin-bottom: 14px;
}
.cx-lvcard__list li {
  font-size: 15px;
  line-height: 23px;
  letter-spacing: 0.07em;
  padding-left: 1em;
  text-indent: -1em;
}

/* ==========================================================
   10. 写真ブリードの青カード
   spec 図形: 740.7×340（青グラデ 0%透明→36.4%不透明 #1673e2）＋ 563.3×340 の #1986c7
             カードは版面より内側 x120（幅1200）・段間33
   spec 文字: 見出し 30/0.11em、本文 15/0.07em/leading27（白）
   ========================================================== */
.cx-photostack { display: grid; gap: 33px; }
.cx-photocard {
  position: relative;
  display: flex;
  align-items: center;
  min-height: 339px;
  padding: 34px 0;
  overflow: hidden;
  border-radius: 8px;
  background: var(--cx-blue-face);
}
.cx-photocard__photo { position: absolute; top: 0; right: 0; bottom: 0; left: 39%; z-index: 0; }
.cx-photocard__photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.cx-photocard__photo::after {
  content: "";
  position: absolute;
  inset: 0;
  /* 【2026-09-04 市岡さん指摘「パッツリ切れてる」】2点の直線グラデは両端に段差（マッハバンド）が出るため
     smoothstep で減衰させた多段グラデに変更。遷移幅も 45%→52% に広げてカンプの溶け方に寄せた。 */
  background: linear-gradient(90deg, rgba(22, 115, 226, 1.000) 3.1px, rgba(22, 115, 226, 0.985) 26.9px, rgba(22, 115, 226, 0.941) 50.6px, rgba(22, 115, 226, 0.861) 77.3px, rgba(22, 115, 226, 0.760) 104.0px, rgba(22, 115, 226, 0.640) 130.8px, rgba(22, 115, 226, 0.530) 151.5px, rgba(22, 115, 226, 0.404) 175.3px, rgba(22, 115, 226, 0.278) 202.0px, rgba(22, 115, 226, 0.166) 228.7px, rgba(22, 115, 226, 0.078) 255.5px, rgba(22, 115, 226, 0.022) 279.2px, rgba(22, 115, 226, 0.000) 300.0px);
}
.cx-photocard__body { position: relative; z-index: 1; width: 36%; padding-left: 55px; }
.cx-photocard__title {
  font-size: 30px;
  line-height: 36.6px;
  letter-spacing: 0.11em;
  font-weight: 400;
  color: #fff;
}
.cx-photocard__text {
  margin-top: 20px;
  font-size: 15px;
  line-height: 27px;
  letter-spacing: 0.07em;
  color: #fff;
}
.cx-photocard__list { margin-top: 20px; }
.cx-photocard__list li {
  font-size: 15px;
  line-height: 27px;
  letter-spacing: 0.07em;
  color: #fff;
  padding-left: 1em;
  text-indent: -1em;
}
.cx-photocard__actions { margin-top: 22px; }
/* 写真を左に置く版 */
.cx-photocard--rev .cx-photocard__photo { left: 0; right: 39%; }
.cx-photocard--rev .cx-photocard__photo::after { background: linear-gradient(270deg, rgba(22, 115, 226, 1.000) 3.1px, rgba(22, 115, 226, 0.985) 26.9px, rgba(22, 115, 226, 0.941) 50.6px, rgba(22, 115, 226, 0.861) 77.3px, rgba(22, 115, 226, 0.760) 104.0px, rgba(22, 115, 226, 0.640) 130.8px, rgba(22, 115, 226, 0.530) 151.5px, rgba(22, 115, 226, 0.404) 175.3px, rgba(22, 115, 226, 0.278) 202.0px, rgba(22, 115, 226, 0.166) 228.7px, rgba(22, 115, 226, 0.078) 255.5px, rgba(22, 115, 226, 0.022) 279.2px, rgba(22, 115, 226, 0.000) 300.0px); }
.cx-photocard--rev { justify-content: flex-end; }
.cx-photocard--rev .cx-photocard__body { padding-left: 0; padding-right: 55px; }

/* ==========================================================
   11. 白×1px青枠パネル＋青丸アイコン
   spec 図形: 617.3×329.9 / 白 ＋ #165ce2 1px、アイコン円 57.3 #165ce2
   spec 文字: EN小ラベル 12.6/0.12em、JP見出し 19.8/0.04em
   ========================================================== */
.cx-panel {
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid var(--cx-blue);
  border-radius: 6px;
  padding: 40px 44px 44px;
}
.cx-panel__head { display: flex; align-items: center; gap: 18px; margin-bottom: 4px; }
.cx-panel__icn {
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 57.3px;
  height: 57.3px;
  border-radius: 50%;
  background: var(--cx-blue);
  color: #fff;
}
.cx-panel__icn svg { width: 26px; height: 26px; }
.cx-panel__heading { min-width: 0; }
.cx-panel__label {
  display: block;
  font-family: var(--cx-font-en);
  font-feature-settings: normal;
  font-size: 12.6px;
  line-height: 1;
  letter-spacing: 0.12em;
  color: var(--cx-label);
}
.cx-panel__title {
  margin-top: 10px;
  font-size: 19.8px;
  line-height: 1.5;
  letter-spacing: 0.04em;
  font-weight: 400;
  color: var(--cx-ink);
}
.cx-panel__body { margin-top: 26px; }
.cx-panel__actions { display: flex; gap: 20px; margin-top: 28px; }
.cx-panel__actions .cx-btn { flex: 1; width: auto; min-height: 56px; margin: 0; }
.cx-panel__actions .cx-btn__text { font-size: 15px; letter-spacing: 0.06em; }

/* ==========================================================
   12. 黄カード
   spec 図形: 角丸16 / #ffe434、内側 32/36/31
   spec 文字: 見出し Bebas 34.42/-0.015em #165ce2、条件 17/0.11em、値 25.87/0.11em（黒）
   --soft: 手ぶ楽パック（#fff6d5 ＋ #165ce2 1px）
   ========================================================== */
.cx-ycard {
  border-radius: 16px;
  background: var(--cx-yellow);
  padding: 32px 36px 31px;
}
.cx-ycard--soft { background: var(--cx-yellow-soft); border: 1px solid var(--cx-blue); }
.cx-ycard__label {
  font-family: var(--cx-font-en);
  font-feature-settings: normal;
  font-size: 34.42px;
  line-height: 1;
  letter-spacing: -0.015em;
  color: var(--cx-blue);
  margin-bottom: 11px;
}
.cx-ycard__row { display: flex; align-items: baseline; gap: 18px; color: var(--cx-ink); }
.cx-ycard__cond { font-size: 17px; letter-spacing: 0.11em; }
.cx-ycard__value { font-size: 25.87px; letter-spacing: 0.11em; }
.cx-ycard__note {
  margin-top: 23px;
  font-size: 15px;
  line-height: 25px;
  letter-spacing: 0.07em;
  color: var(--cx-ink);
}

/* ==========================================================
   13. 全幅ベタ青帯＋白カード
   spec 図形: 帯 1440×1009.5 #165ce2、白カード 角丸16、見出し下 5px、帯内側下 74px
   ========================================================== */
.cx-bluesec {
  background: var(--cx-blue);
  padding: 74px 0;
  margin-top: 83px;
}
.cx-bluesec .cx-head { margin-bottom: 30px; }
.cx-bluesec .cx-head__en,
.cx-bluesec .cx-head__label { color: #fff; }
.cx-wcard {
  background: #fff;
  border-radius: 16px;
  padding: 32px 28px;
}
.cx-wcard__title {
  font-size: 17px;
  line-height: 1;
  letter-spacing: 0.11em;
  color: var(--cx-ink);
  margin-bottom: 16px;
  font-weight: 400;
}
.cx-wcard__rows { display: grid; gap: 16px; }
.cx-wcard__row { display: flex; align-items: center; gap: 17px; height: 27.7px; }

/* ==========================================================
   14. 罫線テーブル
   spec 図形: 白カード ＋ #165ce2 1px・角丸16・内側45/44、表2本・表間45
             ヘッダ h37.7（品目=#165ce2 / 大人・子供=#00adff）・列間の白アキ5px
             行罫は青ヘア1px・行高63.4
   spec 文字: 品目名 17/0.11em、ヘッダ 14/0.11em
   ========================================================== */
.cx-tablebox {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 45px;
  background: #fff;
  border: 1px solid var(--cx-blue);
  border-radius: 16px;
  padding: 45px 44px;
}
.cx-tablebox--1 { grid-template-columns: minmax(0, 1fr); }
.cx-table {
  width: 100%;
  table-layout: fixed;
  border-collapse: separate;
  border-spacing: 0;
}
.cx-table th, .cx-table td {
  border: 0;
  padding: 0 14px;
  height: 63.4px;
  font-size: 17px;
  letter-spacing: 0.11em;
  font-weight: 400;
  color: var(--cx-ink);
}
.cx-table thead th {
  height: 37.7px;
  padding: 0;
  background: var(--cx-cyan);
  color: #fff;
  text-align: center;
  font-size: 14px;
  letter-spacing: 0.11em;
}
.cx-table thead th:first-child { background: var(--cx-blue); width: 36.3%; }
.cx-table thead th + th { border-left: 5px solid #fff; }
.cx-table tbody th[scope="row"] { text-align: left; border-bottom: 1px solid var(--cx-hair); }
.cx-table tbody td { text-align: center; border-bottom: 1px solid var(--cx-hair); }
.cx-table tbody tr:last-child th,
.cx-table tbody tr:last-child td { border-bottom: 0; }

/* ==========================================================
   15. 罫線行（営業時間型）
   spec: 上下 #165ce2 1px・カード高96・ラベル左17/0.11em・時刻右 Bebas 54.47/0.005em（黒）
   ========================================================== */
.cx-hairrows { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 40px; }
.cx-hairrows--1 { grid-template-columns: minmax(0, 1fr); }
.cx-hairrow {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  height: 96px;
  padding: 0 45px 0 0;
  border-top: 1px solid var(--cx-blue);
  border-bottom: 1px solid var(--cx-blue);
}
.cx-hairrow__label { font-size: 17px; letter-spacing: 0.11em; color: var(--cx-ink); white-space: nowrap; }
.cx-hairrow__value {
  font-family: var(--cx-font-en);
  font-feature-settings: normal;
  font-size: 54.47px;
  line-height: 1;
  letter-spacing: 0.005em;
  color: var(--cx-ink);
  white-space: nowrap;
}

/* ==========================================================
   16. FAQ
   spec: Q. = Bebas 34.42/-0.015em、設問 = 16/0.15em/leading33
        ＋ / − のマークは Shippori 24.17/0.15em
   ========================================================== */
.cx-faq { border-top: 1px solid var(--cx-hair); }
.cx-faq__item { border-bottom: 1px solid var(--cx-hair); }
.cx-faq__q {
  display: flex;
  align-items: baseline;
  gap: 18px;
  padding: 24px 48px 24px 6px;
  cursor: pointer;
  list-style: none;
  position: relative;
  font-size: 16px;
  line-height: 33px;
  letter-spacing: 0.15em;
  color: var(--cx-ink);
}
.cx-faq__q::-webkit-details-marker { display: none; }
.cx-faq__mark {
  flex: none;
  font-family: var(--cx-font-en);
  font-feature-settings: normal;
  font-size: 34.42px;
  line-height: 1;
  letter-spacing: -0.015em;
  color: var(--cx-blue);
  transform: translateY(2px);
}
.cx-faq__sign {
  position: absolute;
  right: 6px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 24.17px;
  line-height: 1;
  letter-spacing: 0.15em;
  color: var(--cx-blue);
}
.cx-faq__item[open] .cx-faq__sign::before { content: "−"; }
.cx-faq__sign::before { content: "＋"; }
.cx-faq__a {
  display: flex;
  align-items: baseline;
  gap: 18px;
  padding: 0 48px 26px 6px;
  font-size: 15px;
  line-height: 27px;
  letter-spacing: 0.07em;
  color: var(--cx-ink);
}
.cx-faq__a .cx-faq__mark { color: var(--cx-label); }

/* ==========================================================
   17. 情報カード（白×1px青枠・カード内見出し＋箇条書き）
   spec 図形: 615×249 / #ffffff ＋ #165ce2 1px・角丸16
   ========================================================== */
.cx-infocard {
  border: 1px solid var(--cx-blue);
  border-radius: 16px;
  background: #fff;
  padding: 34px 24px 36px 30px;
}

/* ==========================================================
   18. 写真＋青バー＋白ボタン（ロッジ・施設・大会カード）
   spec 図形: 青バー h95（SP 81.1）・白ボタン 165.3×50（SP 144.6×43.8）
   spec 文字: 施設名 19/0.07em/leading27（白）
   ========================================================== */
.cx-lodge { border-radius: 10px; overflow: hidden; }
.cx-lodge__photo { aspect-ratio: 3 / 2; }
.cx-lodge__photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.cx-lodge__bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 95px;
  padding: 0 16px 0 26px;
  background: var(--cx-blue);
}
.cx-lodge__name {
  font-size: 19px;
  line-height: 27px;
  letter-spacing: 0.07em;
  color: #fff;
  font-weight: 400;
}
.cx-lodge__meta {
  display: block;
  margin-top: 4px;
  font-size: 15px;
  line-height: 23px;
  letter-spacing: 0.07em;
  color: #fff;
}

/* ==========================================================
   19. 写真＋青ブロック＋白ボタン（EXPERIENCE 型）
   spec 図形: 写真 400×281／ブロック 400×166 #165ce2／白ボタン 165.3×50（右18.7・下22）
   spec 文字: 見出し 22/0.07em、メタ 15/0.07em/leading21（白）
   ========================================================== */
.cx-actgrid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: 36px; row-gap: 37px; }
.cx-actcard { display: flex; flex-direction: column; }
.cx-actcard__photo { aspect-ratio: 400 / 281; overflow: hidden; }
.cx-actcard__photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.cx-actcard__body {
  position: relative;
  min-height: 166px;
  background: var(--cx-blue);
  color: #fff;
  padding: 19px 20px 22px 24px;
}
.cx-actcard__title { font-size: 22px; line-height: 1; letter-spacing: 0.07em; font-weight: 400; }
.cx-actcard__meta { margin-top: 17px; font-size: 15px; line-height: 21px; letter-spacing: 0.07em; }
.cx-actcard__meta li { padding-left: 0; text-indent: 0; }
.cx-actcard__more { position: absolute; right: 18.7px; bottom: 22px; margin: 0; }

/* ==========================================================
   20. ニュースカード
   spec: 写真 → タイトル 17/0.07em/leading27（2行クランプ）→ 青バッジ70×22 ＋ 日付 13/0.07em
   ========================================================== */
.cx-newsgrid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 40px 40px; }
.cx-newscard { display: flex; flex-direction: column; }
.cx-newscard__thumb { aspect-ratio: 4 / 3; overflow: hidden; }
.cx-newscard__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 0.6s var(--cx-ease); }
@media (hover: hover) { a.cx-newscard:hover .cx-newscard__thumb img { transform: scale(1.05); } }
.cx-newscard__title {
  margin-top: 18px;
  font-size: 17px;
  line-height: 27px;
  letter-spacing: 0.07em;
  color: var(--cx-ink);
  font-weight: 400;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.cx-newscard__meta { display: flex; align-items: center; gap: 12px; margin-top: 31px; }
.cx-newscard__date { font-size: 13px; line-height: 1; letter-spacing: 0.07em; color: var(--cx-ink); }

/* ==========================================================
   21. 手順（青丸番号）
   カンプに手順UIは無い。青丸アイコン（statcard）とEN小ラベル（panel）の語彙で組む。
   ========================================================== */
.cx-flow { display: flex; align-items: stretch; gap: 18px; }
.cx-flow__step {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 20px;
  background: #fff;
  border: 1px solid var(--cx-blue);
  border-radius: 6px;
  padding: 30px 24px;
}
.cx-flow__num {
  flex: none;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 46px;
  border-radius: 50%;
  background: var(--cx-blue);
  color: #fff;
  font-family: var(--cx-font-en);
  font-feature-settings: normal;
  font-size: 21px;
  line-height: 1;
}
.cx-flow__label {
  display: block;
  font-family: var(--cx-font-en);
  font-feature-settings: normal;
  font-size: 12.6px;
  line-height: 1;
  letter-spacing: 0.12em;
  color: var(--cx-label);
}
.cx-flow__title { margin-top: 8px; font-size: 17px; line-height: 1.4; letter-spacing: 0.07em; font-weight: 400; color: var(--cx-ink); }
.cx-flow__arrow { flex: none; align-self: center; color: var(--cx-blue); }
.cx-flow__arrow svg { width: 22px; height: 22px; }

/* ==========================================================
   22. プレースホルダ面
   spec: 面 #e3e3e3 ／ 文字 15/0.07em/leading23 #808080（コースマップ枠が原型）
   ========================================================== */
.cx-ph {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  background: var(--cx-ph-face);
  color: var(--cx-ph-text);
  font-size: 15px;
  line-height: 23px;
  letter-spacing: 0.07em;
  padding: 16px;
}
.cx-ph--map { height: 560px; }
.cx-ph--photo { aspect-ratio: 3 / 2; }
.cx-ph--wide { aspect-ratio: 1272 / 480; }

/* ==========================================================
   23. フォームUI
   カンプにフォームは存在しない。カンプの原則（白×1px青枠・角丸小・面はベタ・影なし）を適用。
   ラベル 17/0.11em、入力 17/0.07em、必須バッジはニュースバッジ 70×22 と同型。
   ========================================================== */
.cx-form { display: block; }
.cx-form__row + .cx-form__row { margin-top: 34px; }
.cx-form__label {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 13px;
  font-size: 17px;
  line-height: 1;
  letter-spacing: 0.11em;
  color: var(--cx-ink);
}
.cx-req, .cx-opt {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 70px;
  height: 22px;
  border-radius: 999px;
  font-size: 11px;
  line-height: 1;
  letter-spacing: 0.11em;
  color: #fff;
}
.cx-req { background: var(--cx-blue); }
.cx-opt { background: var(--cx-gray-aa); } /* カンプ外の新設部品＝可読性基準を満たす濃度 */

.cx-input, .cx-select, .cx-textarea {
  width: 100%;
  background: #fff;
  border: 1px solid var(--cx-blue);
  border-radius: 6px;
  padding: 0 17px;
  height: 56px;
  font-family: var(--cx-font-jp);
  font-size: 17px;
  letter-spacing: 0.07em;
  color: var(--cx-ink);
}
.cx-textarea { height: auto; min-height: 240px; padding: 15px 17px; line-height: 27px; resize: vertical; }
.cx-input::placeholder, .cx-textarea::placeholder { color: var(--cx-label); }
.cx-select {
  appearance: none;
  padding-right: 44px;
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23165ce2' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 16px center;
  background-size: 18px;
}
.cx-input:focus-visible, .cx-select:focus-visible, .cx-textarea:focus-visible {
  outline: 2px solid var(--cx-blue);
  outline-offset: 2px;
}

/* ラジオ・チェック（未選択=白地1px青枠 / 選択=青ベタ＋白マーク） */
.cx-choices { display: flex; flex-wrap: wrap; gap: 14px 28px; }
.cx-choices--col { flex-direction: column; gap: 14px; }
.cx-choice {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  min-height: 44px;
  font-size: 17px;
  letter-spacing: 0.07em;
  color: var(--cx-ink);
  cursor: pointer;
}
.cx-choice input[type="radio"],
.cx-choice input[type="checkbox"] {
  appearance: none;
  flex: none;
  width: 22px;
  height: 22px;
  margin: 0;
  background: #fff;
  border: 1px solid var(--cx-blue);
  cursor: pointer;
  position: relative;
}
.cx-choice input[type="radio"] { border-radius: 50%; }
.cx-choice input[type="checkbox"] { border-radius: 4px; }
.cx-choice input:checked { background: var(--cx-blue); }
.cx-choice input[type="radio"]:checked::after {
  content: "";
  position: absolute;
  inset: 6px;
  border-radius: 50%;
  background: #fff;
}
.cx-choice input[type="checkbox"]:checked::after {
  content: "";
  position: absolute;
  left: 7px;
  top: 3px;
  width: 6px;
  height: 11px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}
.cx-choice input:focus-visible { outline: 2px solid var(--cx-blue); outline-offset: 2px; }

/* エラー（枠をピンクに・下に文言。アイコンは使わない） */
.cx-form__row.is-error .cx-input,
.cx-form__row.is-error .cx-select,
.cx-form__row.is-error .cx-textarea { border-color: var(--cx-pink); }
.cx-form__error {
  margin-top: 8px;
  font-size: 15px;
  line-height: 23px;
  letter-spacing: 0.07em;
  color: var(--cx-error);
}

/* アップロード枠（写真応募） */
.cx-upload {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 14px;
  min-height: 190px;
  border: 1px dashed var(--cx-blue);
  border-radius: 6px;
  background: #fff;
  color: var(--cx-ink);
  font-size: 15px;
  line-height: 23px;
  letter-spacing: 0.07em;
  text-align: center;
  cursor: pointer;
}
.cx-upload svg { width: 34px; height: 34px; stroke: var(--cx-blue); }
.cx-upload input[type="file"] { position: absolute; inset: 0; opacity: 0; cursor: pointer; }

/* プライバシー同意 */
.cx-consent {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  margin-top: 40px;
  font-size: 17px;
  letter-spacing: 0.07em;
  color: var(--cx-ink);
}
.cx-consent a { color: var(--cx-blue); text-decoration: underline; }
.cx-form__submit { margin-top: 36px; }

/* ==========================================================
   24. SP（〜768px）
   spec SP: 版面 350（左右22）／見出し EN 30.13・ラベル 11／ボタン 265.2×61.9
           ピル 91.2×20.4（文字 10.31）／数値 Bebas 32.87 / 25.79 / 23.22
   ※ カンプに 14px 未満の値（SPリード10.71・注記9.7）があるが、新規ページでは
      本文14px・注記12pxを下限にする（design-language §2 の決定）。
   ========================================================== */
@media (max-width: 768px) {
  .cx-sec { padding-top: var(--cx-gap-sec-sp); }
  .cx-sec--last { padding-bottom: var(--cx-gap-sec-sp); }
  .cx-inner, .cx-inner--slim, .cx-inner--faq { width: auto; padding: 0 22px; }

  .cx-grid--2, .cx-grid--3, .cx-grid--4 { grid-template-columns: minmax(0, 1fr); gap: 15px; }

  /* 見出し */
  .cx-head { gap: 14px; margin-bottom: 22px; }
  .cx-head__en { font-size: 30.13px; }
  .cx-head__label { font-size: 11px; }
  .cx-head--sm { margin-bottom: 16px; }
  .cx-head--sm .cx-head__en { font-size: 19.58px; }

  /* テキスト */
  .cx-catch { font-size: 19px; line-height: 31.62px; }
  .cx-lead { font-size: 14px; line-height: 24px; letter-spacing: 0.13em; }
  .cx-text { font-size: 14px; line-height: 21.75px; }
  .cx-note { font-size: 12px; line-height: 16.17px; }
  .cx-list li { font-size: 14px; line-height: 21.75px; }
  .cx-list--wide li { font-size: 14px; line-height: 24px; letter-spacing: 0.1em; }
  .cx-label { font-size: 12.53px; line-height: 1.4; }

  /* 値・ピル */
  .cx-val { font-size: 12.53px; }
  .cx-val__num { font-size: 25.79px; }
  .cx-val--time { font-size: 25.79px; }
  .cx-unit { font-size: 15.89px; }
  .cx-pill { min-width: 91.2px; height: 20.4px; padding: 0 6px; font-size: 10.31px; }
  .cx-pill--narrow { min-width: 66.6px; }

  /* ボタン */
  .cx-btn { width: 100%; max-width: 265.2px; min-height: 61.9px; padding: 0 40px 0 16px; }
  .cx-btn__text { font-size: 15.03px; }
  .cx-btn--sm { width: 178.8px; max-width: 178.8px; min-height: 43.5px; }
  .cx-btn--sm .cx-btn__text { font-size: 14.79px; }
  .cx-btn--white { width: 144.6px; max-width: 144.6px; min-height: 43.8px; padding: 0 38px 0 12px; }
  .cx-btn--white .cx-btn__text { font-size: 14.88px; }
  .cx-btn--auto { width: auto; max-width: none; }
  .cx-btnpair { flex-direction: column; align-items: center; gap: 16px; }

  /* 帯（SPタイルは 785.4×1396.2 を x-195.7 に敷く前提。帯の高さはPCの実比で縮める） */
  .cx-band { padding: 44px 0 40px; }
  .cx-band__bg { top: -10px; height: 420px; }
  .cx-band::before { height: 645px; }
  .cx-band::after { top: 390px; height: 255px; }

  /* 白ピルカード spec SP: 350×68 / r10 / 円43 / ラベル11 / 値14.39 leading22.62 / 数値30.95 */
  .cx-statgrid { grid-template-columns: minmax(0, 1fr); column-gap: 0; row-gap: 10px; }
  .cx-statcard { gap: 12px; min-height: 68px; padding: 0 12px 0 15px; border-radius: 10px; }
  .cx-statcard__icn { width: 43px; height: 43px; }
  .cx-statcard__icn svg { width: 22px; height: 22px; }
  .cx-statcard__label { width: 78px; font-size: 11px; }
  .cx-statcard__value { font-size: 14.39px; line-height: 22.62px; }
  .cx-statcard__num { font-size: 30.95px; }

  /* 3段階カード spec SP: 見出し19.25/leading23.62、説明15/23.62、一覧15/21、角丸 0 0 40 0 */
  .cx-lvgrid { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .cx-lvcard__body { padding: 22px 20px; border-radius: 0 0 40px 0; }
  .cx-lvcard__title { font-size: 19.25px; line-height: 23.62px; margin-bottom: 10px; }
  .cx-lvcard__desc { font-size: 15px; line-height: 23.62px; margin-bottom: 12px; }
  .cx-lvcard__list li { font-size: 15px; line-height: 21px; }

  /* 写真ブリードの青カード spec SP: 縦積み・見出し25/0.11em中央・本文15/24・写真11:5 */
  .cx-photostack { gap: 20px; }
  .cx-photocard, .cx-photocard--rev {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    min-height: 0;
    padding: 26px 0 0;
  }
  .cx-photocard__photo, .cx-photocard--rev .cx-photocard__photo {
    order: 2;
    position: relative;
    inset: auto;
    left: auto; right: auto;
    margin-top: 20px;
    aspect-ratio: 11 / 5;
  }
  .cx-photocard__photo img { position: absolute; inset: 0; }
  .cx-photocard__photo::after { display: none; }
  .cx-photocard__body, .cx-photocard--rev .cx-photocard__body { order: 1; width: auto; padding: 0 24px; }
  .cx-photocard__title { font-size: 25px; line-height: 30.5px; text-align: center; }
  .cx-photocard__text { margin-top: 16px; font-size: 15px; line-height: 24px; }
  .cx-photocard__list li { font-size: 15px; line-height: 24px; }
  .cx-photocard__actions { display: flex; justify-content: center; }

  /* パネル */
  .cx-panel { padding: 18px 16px 20px; }
  .cx-panel__head { gap: 14px; }
  .cx-panel__icn { width: 44px; height: 44px; }
  .cx-panel__icn svg { width: 21px; height: 21px; }
  .cx-panel__label { font-size: 11.14px; letter-spacing: 0.085em; }
  .cx-panel__title { margin-top: 6px; font-size: 15.25px; line-height: 18.72px; letter-spacing: 0.17em; }
  .cx-panel__body { margin-top: 16px; }
  .cx-panel__actions { gap: 12px; margin-top: 20px; }
  .cx-panel__actions .cx-btn { min-height: 48px; max-width: none; }
  .cx-panel__actions .cx-btn__text { font-size: 12.53px; }

  /* 黄カード spec SP: r12 / padding14 / 見出しBebas23 / 条件12.53 / 値19.06 / 注記12 */
  .cx-ycard { padding: 14px; border-radius: 12px; }
  .cx-ycard__label { font-size: 23px; margin-bottom: 10px; }
  .cx-ycard__row { gap: 10px; flex-wrap: wrap; }
  .cx-ycard__cond { font-size: 12.53px; }
  .cx-ycard__value { font-size: 19.06px; }
  .cx-ycard__note { margin-top: 14px; font-size: 12px; line-height: 16.17px; }

  /* 青帯＋白カード */
  .cx-bluesec { margin-top: 60px; padding: 40px 0; }
  .cx-bluesec .cx-head { margin-bottom: 18px; }
  .cx-wcard { padding: 14px 15px; border-radius: 14px; }
  .cx-wcard__title {
    background: var(--cx-blue);
    color: #fff;
    text-align: center;
    border-radius: 4px;
    padding: 5px 10px;
    margin-bottom: 13px;
    font-size: 12.53px;
    line-height: 1.3;
  }
  .cx-wcard__rows { gap: 11px; }
  .cx-wcard__row { gap: 11px; height: 24px; }

  /* テーブル spec SP: セル13/0.07em/leading20・行高38.4・ヘッダ10.31/h22.9 */
  .cx-tablebox { grid-template-columns: minmax(0, 1fr); gap: 0; padding: 16px 14px 18px; border-radius: 14px; }
  .cx-table th, .cx-table td { height: 38.4px; padding: 0 8px; font-size: 13px; line-height: 20px; letter-spacing: 0.07em; }
  .cx-table thead th { height: 22.9px; font-size: 10.31px; letter-spacing: 0.11em; }
  .cx-table thead th + th { border-left-width: 3.2px; }

  /* 罫線行 spec SP: 高58・ラベル12/0.11em・時刻 Bebas 32.87 */
  .cx-hairrows { grid-template-columns: minmax(0, 1fr); }
  .cx-hairrow { height: 58px; gap: 10px; padding: 0; }
  .cx-hairrow + .cx-hairrow { border-top: 0; }
  .cx-hairrow__label { font-size: 12px; }
  .cx-hairrow__value { font-size: 32.87px; }

  /* FAQ spec SP: Q. Bebas25 / 設問14/0.07em/leading20 */
  .cx-faq__q { font-size: 14px; line-height: 20px; letter-spacing: 0.07em; padding: 18px 36px 18px 2px; gap: 12px; }
  .cx-faq__mark { font-size: 25px; }
  .cx-faq__sign { font-size: 17px; right: 2px; }
  .cx-faq__a { font-size: 14px; line-height: 21.75px; padding: 0 36px 22px 2px; gap: 12px; }

  /* 情報カード spec SP: r14 / padding 22/20/24 / 本文10→14（下限適用） */
  .cx-infocard { padding: 22px 20px 24px; border-radius: 14px; }

  /* ロッジ spec SP: バー81.1 / 施設名16.62/leading23.62 */
  .cx-lodge__bar { min-height: 81.1px; padding: 0 12px 0 18px; }
  .cx-lodge__name { font-size: 16.62px; line-height: 23.62px; }
  .cx-lodge__meta { font-size: 12px; line-height: 16.17px; }

  /* EXPERIENCE 型 spec SP: 見出し19.25/leading23.62・メタ13.12/leading18.38 */
  .cx-actgrid { grid-template-columns: minmax(0, 1fr); row-gap: 20px; }
  .cx-actcard__body { min-height: 0; padding: 16px 16px 76px; }
  .cx-actcard__title { font-size: 19.25px; line-height: 23.62px; }
  .cx-actcard__meta { margin-top: 12px; font-size: 13.12px; line-height: 18.38px; }
  .cx-actcard__more { right: 16px; bottom: 16px; }

  /* ニュース */
  .cx-newsgrid { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .cx-newscard__title { margin-top: 14px; font-size: 15px; line-height: 23.62px; }
  .cx-newscard__meta { margin-top: 16px; }
  .cx-newscard__date { font-size: 12px; }

  /* 手順 */
  .cx-flow { flex-direction: column; gap: 12px; }
  .cx-flow__step { padding: 18px 16px; }
  .cx-flow__arrow { transform: rotate(90deg); }
  .cx-flow__num { width: 40px; height: 40px; font-size: 18px; }
  .cx-flow__title { font-size: 15px; }

  /* プレースホルダ */
  .cx-ph { font-size: 12px; line-height: 18px; }
  .cx-ph--map { height: 163px; }

  /* フォーム */
  .cx-form__row + .cx-form__row { margin-top: 26px; }
  .cx-form__label { font-size: 12.53px; margin-bottom: 10px; }
  .cx-req, .cx-opt { min-width: 60px; height: 20.4px; font-size: 10.31px; }
  .cx-input, .cx-select { height: 48px; font-size: 14px; padding: 0 14px; }
  .cx-select { padding-right: 40px; }
  .cx-textarea { min-height: 180px; font-size: 14px; line-height: 24px; padding: 12px 14px; }
  .cx-choice { font-size: 14px; }
  .cx-choices { gap: 10px 18px; }
  .cx-upload { min-height: 150px; font-size: 12px; line-height: 18px; }
  .cx-consent { font-size: 14px; margin-top: 30px; align-items: flex-start; text-align: left; }
  .cx-form__error { font-size: 12px; line-height: 18px; }
}

/* ==========================================================================
   .cx-wash — 下層ページ共通の淡青ウォッシュ（メイン判断 2026-09-03 21:00）
   藤橋さん下層カンプの「空写真EPS 50%」タイルを、デザイン未支給ページでは
   ヒーロー直下から縦リピートで敷く（タイル上下端は白なので継ぎ目は出ない）。
   使い方: <main class="subpage cx-wash"> に付ける。ページ側で wash_* を個別配置している場合は撤去する。
   ========================================================================== */
main.cx-wash {
  background-color: #fff;
  background-image: url("../img/bg/wash_pc.jpg");
  background-repeat: repeat-y;
  background-size: 1440px 2560px;
  background-position: center 0;
}
@media (max-width: 768px) {
  main.cx-wash {
    background-image: url("../img/bg/wash_sp.jpg");
    background-size: 785px 1396px;
    background-position: -195.7px 0;
  }
}

/* 【2026-09-17 深夜3】写真つきカードは見出し青帯＋本文白地（楽しみ方 アクティビティ／レベル別カード）。ライトボックスは gelande.css から共通化 */
.lb { position: fixed; inset: 0; z-index: 1000; background: rgba(10, 20, 40, 0.88); overflow: auto; padding: 24px; -webkit-overflow-scrolling: touch; }
.lb__scroll { min-height: 100%; display: flex; align-items: flex-start; justify-content: center; }
.lb__img { display: block; width: min(1000px, 100%); max-width: none; height: auto; cursor: zoom-out; }
.lb__close { position: fixed; top: 16px; right: 16px; z-index: 1001; width: 44px; height: 44px; border-radius: 50%; background: #fff; color: #1f2521; font-size: 22px; line-height: 44px; text-align: center; }
.cx-actcard__body { min-height: 0; padding: 0 0 22px; background: #fff; color: var(--cx-ink); border: 1px solid rgba(22, 92, 226, 0.35); border-top: 0; }
.cx-actcard__title { padding: 16px 24px 15px; background: var(--cx-blue); color: #fff; }
.cx-actcard__meta { margin: 17px 24px 0; }
.cx-actcard__more.cx-btn--white { background: var(--cx-blue); color: #fff; }
.cx-actcard__more.cx-btn--white .cx-btn__icon { background: #fff; color: var(--cx-blue); }
.cx-lvcard__body { padding: 0 0 30px; background: #fff; color: var(--cx-ink); border: 1px solid rgba(22, 92, 226, 0.35); border-top: 0; }
.cx-lvcard__title { margin: 0 0 18px; padding: 16px 24px 15px; background: var(--cx-blue); color: #fff; }
.cx-lvcard--lv2 .cx-lvcard__body, .cx-lvcard--lv3 .cx-lvcard__body { background: #fff; }
.cx-lvcard--lv2 .cx-lvcard__title { background: var(--cx-lv2); }
.cx-lvcard--lv3 .cx-lvcard__title { background: var(--cx-lv3); }
.cx-lvcard__body > :not(.cx-lvcard__title) { margin-left: 24px; margin-right: 24px; }
@media (max-width: 768px) {
  .cx-actcard__body { min-height: 0; padding: 0 0 76px; }
  .cx-actcard__title { padding: 12px 16px 11px; }
  .cx-actcard__meta { margin: 14px 16px 0; }
  .cx-lvcard__body { padding: 0 0 22px; border-radius: 0 0 40px 0; }
  .cx-lvcard__title { margin-bottom: 12px; padding: 12px 20px 11px; }
  .cx-lvcard__body > :not(.cx-lvcard__title) { margin-left: 20px; margin-right: 20px; }
}
/* 【2026-09-17 深夜3】ロッジ型カードの帯ボタンは右端に（.cx-btn の margin:0 auto を打ち消す）。BRIOボタンは1行に */
.cx-lodge__bar .cx-btn { margin: 0 0 0 auto; flex: 0 0 auto; }
.sj-jsba .cx-lodge__bar .cx-btn--white { width: auto; min-width: 165.3px; white-space: nowrap; padding-right: 48px; }
.sj-jsba .cx-lodge__bar .cx-btn--white { max-width: none; }
/* 【2026-09-17 議事録】レベル別カードの枠線は帯と同じ色（上級はネイビー・中級はやや薄いネイビー） */
.cx-lvcard--lv2 .cx-lvcard__body { border-color: rgba(20, 92, 151, 0.55); }
.cx-lvcard--lv3 .cx-lvcard__body { border-color: rgba(0, 60, 105, 0.6); }

/* 【2026-09-18】写真カードのピンク版（スクール入口の SAJ バナー＝旧サイトと同じ配色。白文字 4.5:1 を満たす #c4476a） */
.cx-photocard--pink { background: #c4476a; }
.cx-photocard--pink .cx-photocard__photo::after { background: linear-gradient(90deg, rgba(196, 71, 106, 1.000) 3.1px, rgba(196, 71, 106, 0.985) 26.9px, rgba(196, 71, 106, 0.941) 50.6px, rgba(196, 71, 106, 0.861) 77.3px, rgba(196, 71, 106, 0.760) 104.0px, rgba(196, 71, 106, 0.640) 130.8px, rgba(196, 71, 106, 0.530) 151.5px, rgba(196, 71, 106, 0.404) 175.3px, rgba(196, 71, 106, 0.278) 202.0px, rgba(196, 71, 106, 0.166) 228.7px, rgba(196, 71, 106, 0.078) 255.5px, rgba(196, 71, 106, 0.022) 279.2px, rgba(196, 71, 106, 0.000) 300.0px); }
.cx-photocard--pink .cx-btn--white { color: #c4476a; }
.cx-photocard--pink .cx-btn--white .cx-btn__icon { background: #c4476a; }