/* ===================================================================
   /contact お問い合わせ 固有CSS（確定カンプ 402:253）
   構成：ヒーロー（白・中央）→ フォーム（mist・760中央列）。器は site.css。
   =================================================================== */

/* ヒーロー（白・中央・ヘッダー72pxを避けて余白）*/
.c-hero{background:var(--paper);text-align:center;padding:150px 24px 70px}
.c-label{display:inline-flex;align-items:baseline;gap:6px;justify-content:center;font-size:13px;letter-spacing:.04em;color:var(--cobalt);font-weight:700}
.c-label b{font-family:var(--en);font-weight:700;font-size:14px;letter-spacing:.18em}
.c-hero h1{font-family:var(--jp);font-weight:900;font-size:38px;letter-spacing:.02em;color:var(--ink);margin-top:18px;line-height:1.5}
.c-hero .sub{margin-top:18px;font-size:15.5px;font-weight:400;color:var(--body-lead);line-height:2;letter-spacing:.02em}
.c-h1-sp-br{display:none}

/* フォームセクション（mist）*/
.c-form-sec{background:var(--mist-lead);padding:78px 24px 96px}
.c-form{max-width:760px;margin:0 auto}
.c-form h2{font-family:var(--jp);font-weight:900;font-size:21px;color:var(--ink);letter-spacing:.03em;line-height:1.9}
.c-form .note{margin-top:8px;font-size:12.5px;color:var(--note);line-height:1.8}
.c-form form{margin-top:30px;display:flex;flex-direction:column;gap:22px}
.field{display:flex;flex-direction:column;gap:8px}
.field label{font-size:14px;font-weight:700;color:var(--ink);letter-spacing:.02em;display:flex;align-items:center;gap:5px}
.field label .req{font-size:11.5px;font-weight:700;color:var(--cobalt);letter-spacing:.04em}
.field label .opt{font-size:11.5px;font-weight:500;color:var(--sub)}
.field input,.field textarea{font-family:var(--jp);font-size:15px;color:var(--ink);background:var(--paper);
  border:1px solid var(--line);border-radius:2px;padding:14px 16px;line-height:1.5;width:100%;transition:border-color .15s,box-shadow .15s}
.field input::placeholder,.field textarea::placeholder{color:#AAB2C4}
.field input:focus,.field textarea:focus{outline:none;border-color:var(--cobalt);box-shadow:0 0 0 3px rgba(0,48,201,.12)}
.field textarea{min-height:148px;line-height:1.6;resize:vertical}
.c-consent{display:flex;align-items:flex-start;gap:11px;margin-top:0}
.c-consent input{width:18px;height:18px;margin-top:2px;flex:none;accent-color:var(--cobalt)}
.c-consent label{font-size:13px;color:var(--body-lead);line-height:1.85}
.c-consent a{color:var(--cobalt);text-decoration:underline;text-underline-offset:2px}
.c-submit{align-self:flex-start;display:inline-flex;align-items:center;gap:10px;margin-top:6px;
  background:var(--cobalt);color:#fff;font-family:var(--jp);font-weight:700;font-size:16px;letter-spacing:.04em;
  border:0;border-radius:2px;padding:16px 46px;cursor:pointer;transition:transform .2s,background .2s}
.c-submit:hover{transform:translateY(-2px);background:var(--cobalt-deep)}
.c-submit:disabled{opacity:.6;cursor:default;transform:none}
.c-submit .arw{font-size:14px}

/* 送信ステータス（エラー／案内）＝機能用UI（カンプ外・トークン準拠）*/
.c-status{margin-top:2px;font-size:14px;line-height:1.7;letter-spacing:.01em}
.c-status.is-err{color:#C0392B;background:#FCEDEB;border:1px solid #F1C9C4;border-radius:6px;padding:12px 16px}
.c-status.is-ok{color:var(--cobalt);background:var(--chip,#EAEFFB);border:1px solid rgba(0,48,201,.18);border-radius:6px;padding:12px 16px}

/* 送信完了パネル */
.c-thanks{text-align:center;background:var(--paper);border:1px solid var(--line);border-radius:6px;padding:54px 32px}
.c-thanks-ic{display:inline-flex;align-items:center;justify-content:center;width:56px;height:56px;border-radius:50%;
  background:var(--cobalt);color:#fff;font-size:28px;font-weight:700;line-height:1}
.c-thanks h3{font-family:var(--jp);font-weight:900;font-size:22px;color:var(--ink);letter-spacing:.02em;margin-top:22px;line-height:1.6}
.c-thanks p{margin-top:14px;font-size:15px;color:var(--body-lead);line-height:2}
.c-thanks-back{display:inline-block;margin-top:26px;font-size:14px;color:var(--cobalt);font-weight:700}
.c-thanks-back:hover{text-decoration:underline;text-underline-offset:2px}

/* ===================================================================
   SP（〜767px）＝確定カンプ SP375（node 808:756）の写経。
   本体（イントロ→フォーム）は全幅1カラムの純レスポンシブ転写。
   色/コピー/書体は各面のカンプ実値。フッターは共有 site.css が処理。
   =================================================================== */
@media (max-width:767px){
  /* --- イントロ（白・中央・SP375 node 808:758）---
     SP は site.css の固定ヘッダー(.gh 56px)の下＝カンプ pt28 + ヘッダー56 を pt に内包 */
  .c-hero{padding:84px 24px 18px}
  .c-label{font-size:11px}
  .c-label b{font-size:11px;letter-spacing:.09em}
  .c-h1-sp-br{display:inline}                 /* SP は「まずは、」改行＝2行（カンプ通り）*/
  .c-hero h1{font-size:22px;line-height:1.4;letter-spacing:.009em;margin-top:5px}
  .c-hero .sub{margin-top:5px;font-size:14px;line-height:1.75;letter-spacing:0}

  /* --- フォーム（mist・全幅1カラム・SP375 node 808:768）--- */
  .c-form-sec{padding:26px 24px 30px}
  .c-form{max-width:none}
  .c-form h2{font-size:16px;line-height:1.4;letter-spacing:.01em}
  .c-form .note{margin-top:2px;font-size:12px;line-height:1.6}
  .c-form form{margin-top:15px;gap:15px}
  .field{gap:6px}
  .field label{font-size:14px}
  .field label .req{font-size:14px}            /* SP カンプは ＊必須 14px */
  .field label .opt{font-size:14px}            /* SP カンプは （任意） 14px */
  .field input,.field textarea{font-size:14px;border-radius:8px;padding:13px 15px;line-height:1.5}
  .field input::placeholder,.field textarea::placeholder{color:#9EA6B5}
  .field input{height:48px;padding-top:0;padding-bottom:0}
  .field textarea{min-height:104px;line-height:1.65}
  .c-consent{gap:8px;margin-top:0}
  .c-consent input{width:16px;height:16px;margin-top:1px}
  .c-consent label{font-size:12px;line-height:1.5}
  .c-submit{width:100%;justify-content:center;height:54px;padding:0;gap:8px;border-radius:8px;margin-top:0}
  .c-status{font-size:13px}
  .c-thanks{padding:40px 22px}
  .c-thanks-ic{width:48px;height:48px;font-size:24px}
  .c-thanks h3{font-size:18px;margin-top:18px}
  .c-thanks p{font-size:14px;line-height:1.85}
}