/* 島クリエイト：お問い合わせ（contact.html）
   読み込む順：base.css → parts.css → ページの CSS（2026-11-03 site.css を分けた） */

/* お問い合わせ */

.reach{ border-top:3px solid var(--ink); }

.reach div{ display:grid; grid-template-columns:6em 1fr; gap:12px; padding:16px 0; border-bottom:1px solid var(--ink); align-items:baseline; }

.reach dt{ font-weight:800; font-size:15px; }

.reach dd{ font-weight:800; font-size:clamp(19px,1.7vw,24px); line-height:1.5; }

.reach dd a{ text-decoration:none; word-break:break-all; border-bottom:2px solid var(--or); }

.reach dd a:hover,.reach dd a:focus-visible{ background:var(--or); }

.reach dd .tbd-i{ display:block; font-size:14px; white-space:normal; }

.cform__grid{ display:grid; grid-template-columns:minmax(0,7fr) minmax(0,5fr); gap:72px; align-items:start; }

.form{ display:grid; gap:26px; }

.fld{ display:grid; gap:8px; border:0; margin:0; padding:0; min-width:0; }

.fld__l{ display:flex; align-items:center; flex-wrap:wrap; gap:4px 8px; font-weight:800; font-size:16px; line-height:1.5; padding:0; }

.fld__l em{ font-style:normal; font-size:12px; padding:1px 6px; background:var(--ink); color:var(--wh); }

.fld__l small{ font-size:13px; font-weight:700; }

.form input[type="text"],.form input[type="email"],.form input[type="tel"],.form input[type="url"],.form textarea{ width:100%; font:inherit; font-size:17px; padding:12px 14px; border:2px solid var(--ink); border-radius:0; background:var(--wh); color:var(--ink); }

.form textarea{ min-height:180px; resize:vertical; }

.form input:focus-visible,.form textarea:focus-visible{ outline:3px solid var(--or); outline-offset:0; }

.picks{ display:grid; grid-template-columns:1fr 1fr; gap:0; border-top:2px solid var(--ink); }

.picks label{ display:flex; align-items:center; gap:10px; min-height:52px; padding:8px 8px 8px 0; border-bottom:1px solid var(--ink); font-weight:700; font-size:16px; line-height:1.5; cursor:pointer; }

.picks input,.agree input{ flex:none; width:22px; height:22px; margin:0; accent-color:var(--ink); }

.agree{ display:flex; align-items:center; gap:10px; font-weight:700; font-size:16px; cursor:pointer; }

.agree a{ text-underline-offset:3px; }

.pnote{ font-size:15px; line-height:1.8; }

.pnote a{ font-weight:700; text-underline-offset:3px; }

.err{ display:flex; gap:6px; align-items:baseline; padding:6px 10px; background:var(--ink); color:var(--wh); font-weight:700; font-size:14px; line-height:1.5; }

.err::before{ content:"！"; color:var(--or); }

.err[hidden]{ display:none; }

.form [aria-invalid="true"]{ border-width:3px; background:var(--or-l); }

.fld.is-bad .picks{ border-top-width:3px; }

.form button[type="submit"]{ justify-self:start; min-width:240px; }

@media (max-width:1023px){
  .cform__grid{ grid-template-columns:1fr; gap:56px; }
  .cform__ways{ order:-1; }
}

@media (max-width:767px){
  .picks{ grid-template-columns:1fr; }
  .form button[type="submit"]{ justify-self:stretch; }
}

/* 受付の時間を見出しの下に（2026-11-09 本人）・お返事の目安 */
.reach__hr{ margin-top:12px; font-weight:800; font-size:16px; }
.pnote--ng{ margin-top:-8px; font-size:14px; font-weight:700; }