/* =====================================================================
   お問い合わせ（v2 / lab contact/contact.css）
   本番のフォーム（4項目・確認画面なし）に使う部分だけ。種類のヒント・確認・受付番号・デモの部品は持ち込まない
   ===================================================================== */
.nw{white-space:nowrap}

/* ---------- 並び（PC：フォーム＋右の案内／スマホ：縦） ---------- */
.ct{display:grid;grid-template-columns:minmax(0,1fr);gap:24px;padding-block:clamp(16px,2.4vw,32px) clamp(40px,5vw,72px)}
@media (min-width:1024px){ .ct{grid-template-columns:minmax(0,1fr) 340px;gap:40px;align-items:start} .ct__side{position:sticky;top:96px;transition:top .35s var(--ease-out)} html.hdr-hidden .ct__side{top:24px} }
.ct__main{min-width:0}

/* ---------- フォームのカード ---------- */
.ct-card{padding:clamp(20px,3vw,40px);border-radius:var(--r-xl);background:#fff;border:1px solid var(--line);box-shadow:var(--sh-2)}
.ct-panel__t{font-family:var(--f-heading);font-size:clamp(20px,.8vw + 16px,26px);font-weight:var(--fw-heading);line-height:1.45;scroll-margin-top:110px}
.ct-panel__lead{margin-top:6px;margin-bottom:20px;color:var(--ink-2);line-height:1.85}
.ct-panel__lead a{color:var(--violet-deep);font-weight:800;text-decoration:underline;text-underline-offset:3px}
.ct-panel .c-field+.c-field{margin-top:22px}
.ct-panel .c-errsum,.ct-panel .ct-senderr{margin-bottom:22px}
.ct-panel .c-errsum:not([hidden]),.ct-panel .ct-senderr{scroll-margin-top:110px}
/* まとめの見出しが2行以上になっても、印は1行目にそろえる（本番のサーバーの文言は長め） */
.ct-panel .c-errsum h2{align-items:flex-start;line-height:1.6}
.ct-panel .c-errsum h2 .ico{flex:none;margin-top:2px}
.ct-senderr:focus{outline:3px solid var(--danger);outline-offset:3px}
.ct-actions{margin-top:28px}
@media (max-width:767px){ .btn--block-sp{width:100%} .ct-actions .btn{width:100%} }

/* 個人情報の取り扱い */
.ct-privacy{display:grid;grid-template-columns:22px minmax(0,1fr);gap:12px;margin-top:26px;padding:16px 18px;border-radius:var(--r-m);background:var(--mint-soft)}
.ct-privacy>.ico{width:22px;height:22px;margin-top:3px;color:var(--mint-deep)}
.ct-privacy p{line-height:1.8}
.ct-privacy a{color:var(--violet-deep);font-weight:800;text-decoration:underline;text-underline-offset:3px}
.ct-privacy__fine{margin-top:4px;font-size:14px;color:var(--ink-2)}

/* 短い入力欄は、入る文字に合った幅に */
#ct-name,#ct-email,#ct-subject{max-width:28em}

/* ---------- 送信完了 ---------- */
.ct-done{text-align:left}
.ct-done__badge{display:grid;place-items:center;width:64px;height:64px;margin-bottom:14px;border-radius:50%;background:var(--mint-deep);color:#fff;box-shadow:0 0 0 8px var(--mint-soft)}
.ct-done__badge .ico{width:32px;height:32px;stroke-width:2.6}
.ct-done__lead{margin-bottom:0;font-weight:700;color:var(--ink)}
.ct-next{display:grid;gap:12px;margin-top:20px;counter-reset:n}
.ct-next li{position:relative;padding:2px 0 2px 44px;counter-increment:n}
.ct-next li::before{content:counter(n);position:absolute;left:0;top:2px;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--violet-soft);color:var(--violet-deep);font-family:var(--f-latin);font-size:14px;font-weight:700}
.ct-next b{font-weight:900;line-height:1.6}
.ct-next p{margin-top:2px;color:var(--ink-2);line-height:1.8;overflow-wrap:anywhere}
.ct-next__mail{font-weight:800;color:var(--ink)}
.ct-done__again{margin-top:14px}
.ct-done__again .c-textbtn{display:inline-flex;align-items:center;min-height:44px}

/* ---------- 右の案内 ---------- */
.ct__side{display:grid;gap:16px}
.ct-side{padding:20px 22px;border-radius:var(--r-l);background:#fff;border:1px solid var(--line);box-shadow:var(--sh-1)}
.ct-side--help{background:linear-gradient(160deg,#fff,var(--paper-3))}
.ct-side__t{font-family:var(--f-heading);display:flex;align-items:center;gap:10px;font-size:17px;font-weight:var(--fw-heading);line-height:1.5}
.ct-side__t .ico{width:22px;height:22px;color:var(--violet-deep)}
.ct-side__links{display:grid;margin-top:8px}
.ct-side__links li+li{border-top:1px solid var(--line)}
.ct-side__links a{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:48px;padding:8px 0;font-weight:700;line-height:1.55;color:var(--ink)}
.ct-side__links a:hover,.ct-side__links a:focus-visible{color:var(--violet-deep);text-decoration:underline;text-underline-offset:4px}
.ct-side__chev{flex:none;width:18px;height:18px;color:var(--violet-deep);transition:transform .2s var(--ease-out)}
.ct-side__links a:hover .ct-side__chev{transform:translateX(2px)}
.ct-side__more{margin-top:12px}
.ct-side__kv{display:grid;gap:10px;margin-top:10px}
.ct-side__kv dt{font-size:14px;font-weight:800;color:var(--ink-2)}
.ct-side__kv dd{margin:0;font-weight:700;line-height:1.7;overflow-wrap:anywhere}
.ct-side__kv a{display:inline-flex;align-items:center;min-height:44px;color:var(--violet-deep);text-decoration:underline;text-underline-offset:3px}
.ct-side__kv dd:has(a){margin-top:-8px}

/* v1 の出力をそのまま出すとき（v1 の表示が読めなかった場合だけ） */
.ct--legacy{grid-template-columns:minmax(0,1fr)!important}
.ct-legacy .ct-wrap{padding-top:0}

/* reCAPTCHA のバッジ（右下に固定）がタブレットでフォームの右端に重なるので隠す。代わりに Google が求める案内文をフォーム内に出す（contact.php）（2026-10-05 点検 L4） */
body:has(#ct-form[data-rc-key]) .grecaptcha-badge{visibility:hidden!important}   /* only with the v2 form, which carries the notice */