/* ============================================================
   下層ページ v2 第2段階 共通+後半3ページ(css/pages-v2-b2.css)  production KAITO / 2026-10-10
   仕様: _proposal/pages-spec-v2.md 2-1(ヒーローC)/ 3-7 /news / 3-8 /contact / 3-9 /privacy
   読み込み順: style.css → pages.css → pages-v2.css → このファイル。クラスは pg2-hc(ヒーローC)/ v2-(目次・撮影イメージ)/ nx-(お知らせ=pages-v2-news.css)/ ct-(お問い合わせ)/ pv-(プライバシー)
   動きの初期の非表示は js/site-motion.js が付ける .m-pre のときだけ。このファイルのアニメは「送信完了のチェック」(1回・.8s)以外に無い。
============================================================ */

/* ---------- ヒーローC(コンパクト型): 薄い青の地+巨大な英字の透かし+H1の左に線画アイコン ---------- */
.pg2-hc { position: relative; z-index: 3; overflow-x: clip; background: linear-gradient(180deg, #F3F8FE 0%, #E8F1FC 100%); }
.pg2-hc::before { content: ""; position: absolute; right: -80px; top: -280px; width: 560px; height: 560px; border-radius: 50%; background: radial-gradient(circle, rgba(47,123,255,.15), rgba(47,123,255,0) 68%); pointer-events: none; }
.pg2-hc--l::before { right: auto; left: -140px; top: -260px; }
.pg2-hc--b::before { top: auto; bottom: -330px; right: -40px; }
.pg2-hc .pg-wrap { position: relative; z-index: 1; }
.pg2-hc__wmw { position: absolute; inset: 0; overflow: hidden; pointer-events: none; }
.pg2-hc__wm { position: absolute; right: 3%; bottom: -26px; font-family: "Plus Jakarta Sans", sans-serif; font-size: 180px; line-height: 1; font-weight: 800; letter-spacing: -.02em; white-space: nowrap; color: rgba(47,123,255,.07); user-select: none; }
.pg2-hc__in { display: flex; align-items: center; gap: 20px; padding: 12px 0 52px; min-height: 120px; }
.pg2-hc__ic { flex: 0 0 64px; width: 64px; height: 64px; display: grid; place-items: center; border-radius: 50%; background: #fff; box-shadow: 0 14px 22px -14px rgba(20,60,140,.5), 0 0 0 1px #DCE7F6; }
.pg2-hc__ic svg { width: 30px; height: 30px; fill: none; stroke: #0B5AF5; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.pg2-hc .pg-eyebrow { margin: 0; }
.pg2-hc .pg-h1 { margin-top: 6px; font-size: 38px; }
.pg2-hc .pg-lead { margin-top: 8px; font-size: 15px; }
.pg2-hc__pill { display: inline-flex; align-items: center; height: 26px; margin-top: 10px; padding: 0 12px; border-radius: 999px; background: #fff; box-shadow: inset 0 0 0 1px #C9D6EA; color: var(--pg-sub); font-size: 12.5px; font-weight: 800; line-height: 1; }
.pg2-hc__art { flex: 0 0 auto; margin-left: auto; width: 168px; height: 168px; overflow: hidden; border-radius: 50%; background: #DCEAFC; box-shadow: 0 16px 28px -16px rgba(20,60,140,.5), 0 0 0 5px #fff; }
.pg2-hc__art img { display: block; width: 128%; height: 128%; margin: -14% 0 0 -14%; max-width: none; mix-blend-mode: multiply; }
.pg2-hc .pg2-wave--in { z-index: 0; }

/* ---------- 撮影イメージ(AI生成の仮置き写真に必ず付ける小さな表示) ---------- */
.v2-shoot { position: absolute; z-index: 3; right: 10px; bottom: 10px; display: inline-flex; align-items: center; height: 22px; padding: 0 9px; border-radius: 999px; background: rgba(255,255,255,.9); color: #4B5563; font-size: 11px; font-weight: 800; line-height: 1; white-space: nowrap; pointer-events: none; }

/* ---------- 現在地つきの目次(スティッキー)。インタビュー個別・プライバシーで共通 ---------- */
.v2-toc { position: sticky; top: 108px; }
.v2-toc__h { margin: 0 0 12px 14px; font-family: "Plus Jakarta Sans", sans-serif; font-size: 12px; font-weight: 800; letter-spacing: .3em; color: var(--pg-blue-d); }
.v2-toc ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 2px; }
.v2-toc a { position: relative; display: grid; grid-template-columns: 28px 1fr; align-items: center; gap: 8px; min-height: 46px; padding: 6px 12px 6px 14px; border-radius: 0 12px 12px 0; color: var(--pg-sub); font-size: 14.5px; font-weight: 800; line-height: 1.45; transition: color .25s ease, background-color .25s ease; }
.v2-toc a::before { content: ""; position: absolute; left: 0; top: 6px; bottom: 6px; width: 4px; border-radius: 2px; background: #0B5AF5; opacity: 0; transition: opacity .25s ease; }
.v2-toc__n { font-family: "Plus Jakarta Sans", sans-serif; font-size: 12.5px; font-weight: 800; color: #566A94; transition: color .25s ease; }
.v2-toc a.is-cur { color: #03174D; background: #F3F8FE; }
.v2-toc a.is-cur::before { opacity: 1; }
.v2-toc a.is-cur .v2-toc__n { color: #0B5AF5; }
.v2-toc a:focus-visible { outline: 3px solid #0B5AF5; outline-offset: 2px; }
.v2-anchor { scroll-margin-top: 92px; }

/* ============================================================
   /contact(単一列: 入口パネル[LINE・電話] → メールフォーム → 会社情報)
   フォーム部品(pg-input 等)は contact 専用。ここで .ct-form 配下だけ上書きする
============================================================ */
.ct-sec { padding: 44px 0 88px; }
.ct-col { width: min(720px, 100%); margin: 0 auto; display: grid; gap: 28px; }
.ct-col [hidden] { display: none !important; }

/* 入口パネル */
.ct-fast__h { margin: 0 0 14px; font-family: var(--font-display); font-size: 20px; line-height: 1.5; font-weight: 900; color: var(--pg-navy); text-wrap: balance; }
.ct-fast__g { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; }
.ct-card { padding: 18px; border-radius: 20px; background: #fff; box-shadow: var(--pg-face-shadow); }
.ct-tc { display: grid; grid-template-columns: 96px minmax(0, 1fr); column-gap: 14px; row-gap: 10px; align-items: center; box-shadow: inset 0 0 0 2px #9DBCF2, 0 18px 30px -26px rgba(40,100,220,.45); }
.ct-tc__ph { grid-column: 1; grid-row: 1; display: block; width: 96px; height: auto; }
.ct-tc__lab { grid-column: 2; grid-row: 1; margin: 0; font-family: var(--font-display); font-size: 17px; line-height: 1.5; font-weight: 900; color: var(--pg-navy); }
.ct-tc__num { grid-column: 1 / -1; margin: 0; font-family: "Plus Jakarta Sans", var(--font-display); font-size: 28px; line-height: 1.2; font-weight: 800; letter-spacing: .02em; text-align: center; color: var(--pg-navy); white-space: nowrap; }
.ct-tc__num a { display: block; color: inherit; padding: 8px 0; }
.ct-tc .ct-btn, .ct-tc .ct-note { grid-column: 1 / -1; }
.ct-btn { display: flex; align-items: center; justify-content: center; width: 100%; min-height: 56px; padding: 0 20px; border-radius: 999px; font-size: 17px; line-height: 1.3; font-weight: 800; text-align: center; text-decoration: none; }
.ct-btn--b { background: #fff; color: var(--pg-blue-d); box-shadow: inset 0 0 0 2px var(--pg-blue-d); }
.ct-btn:focus-visible { outline: 3px solid var(--pg-blue-d); outline-offset: 3px; }
.ct-note { margin: 0; font-size: 14px; line-height: 1.75; font-weight: 500; color: var(--pg-sub); }
.ct-btn--p { background: var(--pg-blue-d); color: #fff; }

/* メールフォーム */
.ct-form { padding: 24px 18px 26px; }
.ct-form__h { margin: 0; font-family: var(--font-display); font-size: 22px; line-height: 1.4; font-weight: 900; color: var(--pg-navy); }
.ct-form__lead { margin: 8px 0 0; font-size: 17px; line-height: 1.75; font-weight: 500; color: var(--pg-ink); }
.ct-form .pg-form { gap: 26px; margin-top: 22px; }
.ct-form .pg-field { gap: 8px; }
/* html に scroll-padding-top:76px があるため、20px足して固定ヘッダー分(合計96px)にする */
.ct-form :is(input, textarea, fieldset, h2) { scroll-margin-top: 20px; }
.ct-form .pg-label, .ct-lg { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 0; font-size: 16px; line-height: 1.5; font-weight: 800; color: var(--pg-navy); }
.ct-form .pg-req, .ct-form .pg-opt { height: 22px; padding: 0 9px; font-size: 13px; }
.ct-form .pg-req { background: #0B5AF5; color: #fff; }
.ct-form .pg-opt { box-shadow: inset 0 0 0 1.2px #4B5563; color: #4B5563; }
.ct-form .pg-input, .ct-form .pg-textarea { min-height: 56px; border: 1.5px solid #AFC0DC; color: #03174D; font-size: 16px; }
.ct-form .pg-textarea { min-height: 160px; line-height: 1.7; }
.ct-form .pg-input::placeholder, .ct-form .pg-textarea::placeholder { color: #6B7280; opacity: 1; }
.ct-form .pg-input:disabled { background: #fff; }
.ct-hint { margin: 0; font-size: 14px; line-height: 1.7; font-weight: 500; color: var(--pg-sub); }

/* エラーは各欄の下だけ(読み上げ用に要素は常に置き、空のときは高さ0) */
.ct-form .pg-error { display: block; position: relative; padding-left: 26px; font-size: 14.5px; line-height: 1.6; font-weight: 600; color: #B3261E; }
.ct-form .pg-error:empty { margin-top: -8px; padding: 0; height: 0; overflow: hidden; }
.ct-form .pg-field.is-error .pg-error::before { content: "!"; content: "!" / ""; position: absolute; left: 0; top: 2px; display: grid; place-items: center; width: 18px; height: 18px; border-radius: 50%; background: #B3261E; color: #fff; font-size: 12px; line-height: 1; font-weight: 900; }
.ct-form .pg-field.is-error :is(.pg-input, .pg-textarea) { border-color: #B3261E; }
.ct-sum { margin: 0; padding: 12px 14px; border-radius: 12px; box-shadow: inset 0 0 0 1.5px #B3261E; font-size: 14.5px; line-height: 1.6; font-weight: 600; color: #B3261E; }
.ct-sum:empty { margin-top: -26px; padding: 0; height: 0; overflow: hidden; box-shadow: none; }

/* 相談の内容(ラジオ3択) */
.ct-fs { min-width: 0; margin: 0; padding: 0; border: 0; }
.ct-fs .ct-lg { margin-bottom: 10px; }
.ct-opts { display: grid; gap: 10px; }
.ct-type { position: relative; display: block; cursor: pointer; }
.ct-type input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.ct-type__in { display: grid; grid-template-columns: 24px minmax(0, 1fr); align-items: center; gap: 12px; min-height: 56px; padding: 12px 16px; border-radius: 16px; background: #fff; box-shadow: inset 0 0 0 1.5px #AFC0DC; transition: background-color .2s ease, box-shadow .2s ease; }
.ct-type__tx { font-size: 17px; line-height: 1.5; font-weight: 500; color: var(--pg-navy); }
.ct-type__sub { display: block; margin-top: 2px; font-size: 14px; line-height: 1.6; font-weight: 500; color: var(--pg-sub); }
.ct-type__ck { width: 24px; height: 24px; border-radius: 50%; box-shadow: inset 0 0 0 1.6px #AFC0DC; background: #fff; display: grid; place-items: center; transition: background-color .2s ease, box-shadow .2s ease; }
.ct-type__ck::after { content: ""; width: 11px; height: 6.5px; border: solid #fff; border-width: 0 0 2.4px 2.4px; transform: translateY(-1px) rotate(-45deg); opacity: 0; transition: opacity .2s ease; }
.ct-type input:checked + .ct-type__in { background: #F3F8FE; box-shadow: inset 0 0 0 2px #0B5AF5; }
.ct-type input:checked + .ct-type__in .ct-type__ck { background: #0B5AF5; box-shadow: none; }
.ct-type input:checked + .ct-type__in .ct-type__ck::after { opacity: 1; }
.ct-type input:focus-visible + .ct-type__in, .ct-chip input:focus-visible + .ct-chip__in { outline: 3px solid #0B5AF5; outline-offset: 3px; }

/* 返信の方法(2択チップ) */
.ct-chips { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.ct-chip { position: relative; display: block; cursor: pointer; }
.ct-chip input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.ct-chip__in { display: flex; align-items: center; justify-content: center; min-height: 52px; padding: 0 12px; border-radius: 999px; background: #fff; box-shadow: inset 0 0 0 1.5px #AFC0DC; font-size: 17px; line-height: 1.3; font-weight: 800; color: var(--pg-navy); transition: background-color .2s ease, box-shadow .2s ease; }
.ct-chip input:checked + .ct-chip__in { background: #F3F8FE; box-shadow: inset 0 0 0 2px #0B5AF5; color: #0B5AF5; }

/* 同意 */
.ct-agree-note { margin: 0; font-size: 15px; line-height: 1.75; font-weight: 500; color: var(--pg-sub); }
.ct-form .pg-check { align-items: center; gap: 14px; min-height: 52px; padding: 12px 0; font-size: 17px; font-weight: 500; }
.ct-form .pg-check a { padding: 12px 2px; }  /* 文中リンクもタップ範囲を縦44px以上に(レイアウトは動かない) */
.ct-form .pg-check input { flex: 0 0 28px; width: 28px; height: 28px; }
.ct-form .pg-check input:checked::after { width: 13px; height: 8px; }
.ct-form .pg-submit .btn { width: 100%; height: 58px; }
.ct-form .pg-submit .btn:disabled { opacity: .72; cursor: progress; transform: none; }

/* 会社情報 */
.ct-co { padding: 18px 18px; border-radius: 22px; background: #E9F1FC; }
.ct-co h3 { margin: 0; font-family: var(--font-display); font-size: 16px; font-weight: 900; color: var(--pg-navy); }
.ct-co__p { display: flex; flex-wrap: wrap; align-items: center; margin: 10px 0 0; font-size: 15px; line-height: 1.7; font-weight: 500; color: var(--pg-ink); }

/* 送信後(完了画面)。円とチェックが描かれる(1回・合計0.5秒) */
.ct-done { padding: 12px 0 4px; }
.ct-ck { display: block; width: 92px; height: 92px; margin: 0 auto; }
.ct-ck circle { fill: #E6F0FE; stroke: #0B5AF5; stroke-width: 3; }
.ct-ck path { fill: none; stroke: #0B5AF5; stroke-width: 5; stroke-linecap: round; stroke-linejoin: round; }
.ct-done.is-draw .ct-ck circle { stroke-dasharray: 1; stroke-dashoffset: 1; animation: ctDraw .3s cubic-bezier(.4,0,.2,1) both; }
.ct-done.is-draw .ct-ck path { stroke-dasharray: 1; stroke-dashoffset: 1; animation: ctDraw .2s cubic-bezier(.4,0,.2,1) .3s both; }
@keyframes ctDraw { to { stroke-dashoffset: 0; } }
.ct-done__t { display: flex; align-items: center; justify-content: center; gap: 10px; flex-wrap: wrap; margin: 14px 0 0; font-family: var(--font-display); font-size: 26px; line-height: 1.4; font-weight: 900; color: var(--pg-navy); scroll-margin-top: 20px; }
.ct-done__t:focus { outline: none; }
.ct-badge { display: inline-flex; align-items: center; height: 24px; padding: 0 10px; border-radius: 999px; background: #fff; box-shadow: inset 0 0 0 1px #4B5563; color: #4B5563; font-family: var(--font-body, inherit); font-size: 13px; font-weight: 800; line-height: 1; }
.ct-done p { max-width: 460px; margin: 12px auto 0; font-size: 17px; line-height: 1.85; font-weight: 500; color: var(--pg-ink); }
.ct-done__h3 { margin: 28px 0 12px; font-size: 17px; line-height: 1.5; font-weight: 800; color: var(--pg-navy); }
.ct-done__btns { display: grid; gap: 10px; }
.ct-done .pg-minilink-a { margin-top: 6px; font-size: 16px; }
@media (prefers-reduced-motion: reduce) { .ct-done.is-draw .ct-ck circle, .ct-done.is-draw .ct-ck path { animation: none !important; stroke-dashoffset: 0; } }
@media (min-width: 769px) {
    .ct-form { padding: 36px 40px 36px; }
  .ct-form__h { font-size: 24px; }
  .ct-form .pg-submit .btn { width: 360px; }
  .ct-co { padding: 20px 24px; }
}

/* ============================================================
   /privacy
============================================================ */
.pv-sec { padding: 40px 0 96px; }
.pv-jump { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin: 0 0 48px; padding: 0; list-style: none; }
.pv-jump a { display: grid; grid-template-columns: 48px minmax(0, 1fr) 24px; align-items: center; gap: 14px; min-height: 84px; padding: 14px 18px; border-radius: 20px; background: #F3F8FE; box-shadow: inset 0 0 0 1px #DCE7F6; color: inherit; transition: box-shadow .2s ease; }
.pv-jump__ic { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; background: #fff; box-shadow: 0 0 0 1px #DCE7F6; }
.pv-jump__ic svg { width: 24px; height: 24px; fill: none; stroke: #0B5AF5; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.pv-jump small { display: block; font-size: 12px; font-weight: 800; color: var(--pg-blue-d); }
.pv-jump b { display: block; margin-top: 2px; font-family: var(--font-display); font-size: 16.5px; line-height: 1.4; font-weight: 900; color: var(--pg-navy); }
.pv-jump__go { width: 22px; height: 22px; fill: none; stroke: var(--pg-blue-d); stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }
@media (hover: hover) { .pv-jump a:hover { box-shadow: inset 0 0 0 1.5px #9DC0F5; } }
.pv-jump a:focus-visible { outline: 3px solid #0B5AF5; outline-offset: 3px; }
.pv-layout { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 48px; align-items: start; }
.pv-body { max-width: 760px; }
.pv-c { position: relative; padding: 44px 0 36px; }
.pv-c + .pv-c { border-top: 1px solid #E6EEF9; }
.pv-c:first-child { padding-top: 12px; }
.pv-c .pg2-no { top: 2px; }
.pv-c:first-child .pg2-no { top: -26px; }
.pv-c h2 { position: relative; margin: 0; font-family: var(--font-display); font-size: 26px; line-height: 1.45; font-weight: 900; color: var(--pg-navy); }
.pv-c p { position: relative; margin: 14px 0 0; font-size: 16px; line-height: 1.95; color: var(--pg-ink); word-break: auto-phrase; line-break: strict; text-wrap: pretty; }
.pv-c .pv-tent { margin-left: 8px; vertical-align: 2px; }
.pv-spnav { display: none; margin: 0 0 28px; border-radius: 16px; background: #F3F8FE; box-shadow: inset 0 0 0 1px #DCE7F6; }
.pv-spnav summary { display: flex; align-items: center; justify-content: space-between; min-height: 52px; padding: 0 18px; list-style: none; font-size: 15px; font-weight: 800; color: var(--pg-navy); cursor: pointer; }
.pv-spnav summary::-webkit-details-marker { display: none; }
.pv-spnav summary svg { width: 18px; height: 18px; fill: none; stroke: var(--pg-blue-d); stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; transition: transform .25s ease; }
.pv-spnav[open] summary svg { transform: rotate(180deg); }
.pv-spnav .v2-toc { position: static; padding: 0 6px 12px; }
.pv-spnav summary:focus-visible { outline: 3px solid #0B5AF5; outline-offset: 2px; border-radius: 16px; }

/* ============================================================
   SP / タブレット
============================================================ */
@media (max-width: 959px) {
  .pv-layout { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .pv-layout > .v2-toc { display: none; }
  .pv-spnav { display: block; }
}
@media (max-width: 768px) {
  .ct-sec { padding: 28px 0 56px; }
  .ct-col { gap: 24px; }
  .pg2-hc__wm { font-size: 84px; right: -4px; bottom: -12px; }
  .pg2-hc__in { gap: 14px; padding: 8px 0 38px; min-height: 90px; }
  .pg2-hc__ic { flex-basis: 48px; width: 48px; height: 48px; }
  .pg2-hc__ic svg { width: 24px; height: 24px; }
  .pg2-hc .pg-h1 { font-size: 27px; }
  .pg2-hc--art .pg-h1 { font-size: 22px; }
  .pg2-hc__art { display: none; }
  .pg2-hc--art .pg2-hc__art { display: block; width: 84px; height: 84px; box-shadow: 0 10px 18px -12px rgba(20,60,140,.5), 0 0 0 3px #fff; }
  .pg2-hc .pg-lead { font-size: 14px; }
  .pv-sec { padding: 24px 0 64px; }
  .pv-jump { grid-template-columns: minmax(0, 1fr); gap: 10px; margin-bottom: 28px; }
  .pv-jump a { min-height: 72px; }
  .pv-c { padding: 36px 0 28px; }
  .pv-c h2 { font-size: 21px; }
  .pv-c p { font-size: 15.5px; }
}
@media (prefers-reduced-motion: reduce) { .v2-toc a, .v2-toc a::before, .ct-type__in, .ct-chip__in, .pv-spnav summary svg { transition: none; } }