/* ページ固有: ヒーローリードの孤立行解消 */
.ph .ph-lead { max-width: 36em; }

/* ==== 無料相談フォーム: 既存クラス名を新デザイン（mono.css体系）へブリッジ ==== */
.myuc-form { max-width: 760px; margin-top: 8px; }

.fsec { display: flex; align-items: center; gap: 16px; font-size: 20px; font-weight: 700; color: var(--kg-ink); margin: 72px 0 30px; }
.myuc-form > .fsec:first-of-type { margin-top: 40px; }
.fsec-num { flex-shrink: 0; width: 38px; height: 38px; border-radius: 50%; background: var(--grad-btn); color: #fff; font-family: var(--font-num); font-size: 16px; font-weight: 600; display: flex; align-items: center; justify-content: center; }

.form-row { margin-bottom: 34px; }
.myuc-form fieldset { border: none; padding: 0; margin: 0 0 34px; }
.form-row > label, .myuc-form legend { display: block; font-size: 14.5px; font-weight: 600; color: var(--kg-ink); margin-bottom: 12px; padding: 0; }
.req, .opt { font-size: 10.5px; font-weight: 700; border-radius: 3px; padding: 2px 9px; margin-left: 10px; vertical-align: 2px; letter-spacing: .08em; }
.req { color: #fff; background: var(--kg-blue); }
.opt { color: var(--kg-quiet); background: var(--kg-t1); }

.form-row input[type="text"], .form-row input[type="email"], .form-row input[type="url"], .form-row textarea, .reveal input {
  width: 100%; font-size: 15px; font-family: inherit; padding: 14px 16px;
  border: 1.5px solid #C9DCF1; border-radius: 10px; background: #fff; color: var(--kg-ink); box-sizing: border-box;
}
.form-row input:focus, .form-row textarea:focus, .reveal input:focus { outline: none; border-color: var(--kg-blue); }
.myuc-form ::placeholder { color: #A9BDD3; }
.form-note { font-size: 12.5px; color: var(--kg-quiet); margin-top: 10px; line-height: 1.9; }
.form-note.center { text-align: center; }

.choice-grid, .choice-list { display: grid; gap: 10px; }
.choice-grid { grid-template-columns: repeat(2, 1fr); }
.quiz-option { display: flex; align-items: center; gap: 10px; font-size: 14.5px; font-weight: 500; color: var(--kg-body); border: 1.5px solid #C9DCF1; border-radius: 10px; padding: 12px 18px; margin: 0; cursor: pointer; background: #fff; transition: border-color .15s, background .15s; line-height: 1.7; }
.quiz-option:hover { border-color: var(--kg-blue); }
.quiz-option input { accent-color: var(--kg-blue); width: 16px; height: 16px; margin: 0; flex-shrink: 0; }
.quiz-option:has(input:checked) { border-color: var(--kg-blue); background: var(--kg-t1); }
.reveal { margin-top: 10px; }

.submit-block { margin-top: 56px; background: var(--kg-t2); border-radius: 16px; padding: 36px 32px 32px; }
.consent-row, .consent-row:hover, .consent-row:has(input:checked) { justify-content: center; border: none; background: transparent; }
.consent-row { padding: 6px 0; font-weight: 600; color: var(--kg-ink); }
.consent-row a { color: var(--kg-blue); }
.turnstile-ph { max-width: 320px; min-height: 66px; margin: 18px auto 26px; background: #fff; border-radius: 10px; font-size: 12.5px; color: var(--kg-quiet); display: flex; align-items: center; justify-content: center; text-align: center; padding: 10px; }
.turnstile-live { display: flex; justify-content: center; margin: 18px auto 26px; }
/* ボット用の罠フィールド: 視覚・タブ・支援技術のすべてから隠す */
.hp-trap { position: absolute; left: -9999px; top: -9999px; height: 0; overflow: hidden; }

.submit-btn { display: flex; align-items: center; justify-content: center; width: min(400px, 100%); height: 64px; margin: 0 auto; border: none; border-radius: 14px; background: var(--grad-btn); color: #fff; font-size: 16px; font-weight: 600; letter-spacing: .05em; font-family: inherit; cursor: pointer; box-shadow: 0 8px 22px rgba(22, 104, 220, .32); transition: opacity .2s; }
.submit-btn:hover { opacity: .9; }
.submit-btn:disabled { opacity: .6; cursor: default; }

@media (max-width: 749px) {
  .choice-grid { grid-template-columns: 1fr; }
  .fsec { margin-top: 56px; }
  .submit-block { padding: 28px 20px 26px; }
}


/* ============================================================
   v23（2026-08-09 恒久方針適用）: AGENDA横タイムライン・
   フォーム章見出しを「番号＋見出し＋下罫線」の大区切りに
   ============================================================ */
/* AGENDA: PCは4ステップ横並びの小さなタイムライン */
@media (min-width: 750px) {
  .soudan-agenda .steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 28px; max-width: none; }
  .soudan-agenda .step { display: flex; flex-direction: column; align-items: flex-start; gap: 14px; padding-bottom: 0; grid-template-columns: none; }
  .soudan-agenda .step::before { display: none; }
  .soudan-agenda .step-no { width: 44px; height: 44px; font-size: 15px; }
  .soudan-agenda .step:not(:last-child) .step-no { position: relative; }
  .soudan-agenda .step:not(:last-child) .step-no::after { content: ""; position: absolute; left: calc(100% + 10px); top: 50%; width: 220px; height: 0; border-top: 1.5px dashed #B9D6F5; }
  .soudan-agenda .step-t { font-size: 16px; padding-top: 0; }
  .soudan-agenda .step-t small { display: block; margin-left: 0; margin-top: 4px; }
  .soudan-agenda .step-d { font-size: 13px; margin-top: 0; }
  .soudan-agenda .frame { overflow: hidden; }
}

/* フォーム章見出し: 円をやめ「番号 見出し ────」の大区切り */
.fsec { gap: 14px; align-items: baseline; padding-bottom: 16px; border-bottom: 1.5px solid var(--kg-line); }
.fsec-num { width: auto; height: auto; border-radius: 0; background: none; color: var(--kg-blue); font-size: 22px; font-weight: 800; letter-spacing: .06em; display: inline; }


/* v25（2026-08-10 さき指示）: タブレット帯（750〜1023px）＋フォームの可読性・タップ領域 */

/* 必須/任意バッジ: 10.5px は小さすぎる（可読性の下限11.5px） */
.req, .opt { font-size: 11.5px; padding: 2px 8px; }
/* AGENDAの所要時間: 11px → 12px。SPでも見出しと同じ行に食い込まないよう常に改行 */
.soudan-agenda .step-t small { display: block; margin-left: 0; margin-top: 4px; font-size: 12px; }
/* 同意行のプライバシーポリシー: リンク高さ15px → 約33pxのタップ領域に */
.consent-row a { display: inline-block; padding: 9px 4px; }

@media (min-width: 750px) and (max-width: 1023px) {
  /* AGENDA: 4列（768pxでは1列135pxまで潰れる）→ 2列 */
  .soudan-agenda .steps { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 44px 28px; }
  .soudan-agenda .step:nth-child(2n) .step-no::after { display: none; } /* 行末の点線は出さない */
  .soudan-agenda .frame { padding: 40px 36px 44px; }

  /* フォーム: 章間の余白をPC(72px)とSP(56px)の中間に */
  .fsec { margin-top: 64px; }
}


/* ============================================================
   v31（2026-08-11 第2次レビュー対応）: 長いフォームを最後まで
   気持ちよく入力できる見せ方へ。均一さの解消・章の呼吸・終点感
   ------------------------------------------------------------
   ① 章区切りを「見出しの上の罫線」に変え、見出し→中身を近接させる
   ② 設問グループ（fieldset）の外周余白 > テキスト行の余白 > 選択肢間
   ③ 必須／任意バッジを右端の1列に揃える（走査しやすさ）
   ④ 送信エリアを枠付きの「終点パネル」にする
   共用先の /hearing/ にも同じ改善が乗る（同じフォーム部品のため）
   ============================================================ */

/* --- ① 章見出し: 罫線を見出しの「上」へ。視覚階層を1段強める --- */
.fsec {
  gap: 0 12px;
  font-size: 22px;
  margin: 72px 0 24px;
  padding: 34px 0 0;
  border-top: 1px solid var(--kg-line);
  border-bottom: none;
}
.fsec-num { font-size: 28px; }
/* 先頭章の上には区切るものが無いので罫線を出さない */
.myuc-form > .fsec:first-of-type { margin-top: 44px; padding-top: 0; border-top: none; }
/* 章見出しの直後だけは、その章の中身として近づける（margin相殺で24pxに揃える） */
.myuc-form .fsec + .form-row { margin-top: 0; }

/* --- ② 余白のリズム: 設問グループ44px ＞ テキスト行32px ＞ 選択肢8px --- */
.myuc-form fieldset { margin: 44px 0; }
.form-row { margin-bottom: 32px; }
.choice-grid, .choice-list { gap: 8px; }
/* 選択肢ボタン: 高さ50.6px → 47.6px（タップ領域44px以上は維持） */
.quiz-option { padding: 10px 16px; }

/* --- 見出し・小見出し・本文の視覚階層 --- */
/* 設問名（小見出し）15px/700 ＞ 選択肢・本文 14.5px/500 ＞ 補足文 13px */
.form-row > label:not(.quiz-option), .myuc-form legend {
  font-size: 15px; font-weight: 700; margin-bottom: 10px;
}
/* 補足文: --kg-quiet は白地でコントラスト不足だったので --kg-body に。近接のため上余白を詰める */
.form-note { font-size: 13px; color: var(--kg-body); margin-top: 8px; line-height: 1.85; }

/* --- ③ 必須／任意バッジを右端に整列（設問名は左、バッジは右の1列） --- */
.form-row > label:not(.quiz-option), .myuc-form legend {
  display: flex; align-items: baseline; gap: 0 10px;
  /* バッジ分だけ設問名が狭くなるため、行頭禁則を厳格に（既定autoだと「サ/ービス」で割れる・390px実測） */
  line-break: strict;
}
/* legendは既定でshrink-to-fit＝右端が確定しないので、幅を明示してバッジ列を揃える */
.myuc-form legend { width: 100%; box-sizing: border-box; }
.form-row > label:not(.quiz-option) > .req, .form-row > label:not(.quiz-option) > .opt,
.myuc-form legend > .req, .myuc-form legend > .opt { flex-shrink: 0; margin-left: 0; }
.form-row > label:not(.quiz-option) > span:first-of-type,
.myuc-form legend > span:first-of-type { margin-left: auto; }
/* 任意バッジ: 淡青地に --kg-quiet はコントラスト不足 */
.opt { color: var(--kg-body); }

/* --- ④ 送信エリア＝安心感のある終点 --- */
.submit-block {
  margin-top: 76px;
  border: 1px solid var(--kg-line);
  border-radius: 18px;
  padding: 34px 32px 32px;
}
/* 同意行: 他の選択肢と同じ「操作できる部品」の見た目にして視認性を上げる */
.submit-block .consent-row {
  max-width: 460px; margin: 0 auto; padding: 12px 20px;
  background: #fff; border: 1.5px solid #C9DCF1; border-radius: 12px;
  font-size: 14.5px; justify-content: center;
}
.submit-block .consent-row:hover { border-color: var(--kg-blue); background: #fff; }
.submit-block .consent-row:has(input:checked) { border-color: var(--kg-blue); background: var(--kg-t1); }
.submit-block .consent-row a { text-decoration: underline; text-underline-offset: 3px; }
/* 同意 → 認証 → ボタン → 注意書き の間隔を整理 */
.turnstile-ph, .turnstile-live { margin: 22px auto 24px; }
.submit-block .form-note { font-size: 13.5px; margin-top: 20px; }
.submit-block .eta { font-weight: 700; color: var(--kg-ink); }
/* hearing側は同意行・認証が無くボタン直下から始まるので、上余白を持たせる */
.submit-block > .submit-btn:first-child { margin-top: 6px; }

/* --- タブレット（750〜1023px） --- */
@media (min-width: 750px) and (max-width: 1023px) {
  .fsec { margin-top: 64px; padding-top: 30px; margin-bottom: 22px; }
  .myuc-form fieldset { margin: 40px 0; }
}

/* --- SP: 章番号を強く・見出しの前後を詰める・補足文は小さくしない --- */
@media (max-width: 749px) {
  .fsec { font-size: 19.5px; margin: 46px 0 18px; padding-top: 26px; }
  .fsec-num { font-size: 26px; }
  .myuc-form > .fsec:first-of-type { margin-top: 36px; }
  .myuc-form fieldset { margin: 34px 0; }
  .form-row { margin-bottom: 26px; }
  /* 設問名: SPはバッジの分だけ幅が減るので15pxに上げない（上げると1文字だけの孤立行が出る・実測）。
     階層は太さ700＋インク色で出す */
  .form-row > label:not(.quiz-option), .myuc-form legend { font-size: 14.5px; }
  .form-note { font-size: 13.5px; }
  .quiz-option { padding: 11px 14px; }
  .submit-block { margin-top: 56px; padding: 26px 16px 24px; }
  .submit-block .consent-row { max-width: none; padding: 12px 14px; }
}