/* =========================================================================
   문의 양식 (contact.js) — 밝은 화면(문의하기) 기본값, 멤버십 소개(검정)는 변수만 바꿔 쓴다
   ========================================================================= */
.cf{
  --cf-bg:#fff; --cf-chip:#F4F5FB; --cf-line:#D5D9EA; --cf-ink:#0E1430; --cf-sub:#4A5170; --cf-mute:#8389A6;
  --cf-accent:#2F5FD0; --cf-accent-soft:#E7EEFF; --cf-input:#F4F5FB; --cf-send:#0E1430; --cf-send-ink:#fff;
  display:grid;gap:18px;text-align:left;color:var(--cf-ink);
}
.cf-topics{border:0;margin:0;padding:0;min-width:0;}
.cf-topics legend{font-weight:800;font-size:18px;margin-bottom:12px;padding:0;}
.cf-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;}
.cf-topic{position:relative;display:grid;gap:4px;padding:16px 16px 15px 48px;border-radius:16px;border:1.5px solid var(--cf-line);background:var(--cf-chip);cursor:pointer;transition:border-color .15s, background .15s, transform .15s;}
.cf-topic:hover{border-color:var(--cf-accent);}
.cf-topic input{position:absolute;opacity:0;pointer-events:none;}
.cf-topic::before{content:'';position:absolute;left:16px;top:18px;width:20px;height:20px;border-radius:50%;border:2px solid var(--cf-line);background:var(--cf-bg);box-sizing:border-box;transition:.15s;}
.cf-topic:has(input:checked){border-color:var(--cf-accent);background:var(--cf-accent-soft);}
.cf-topic:has(input:checked)::before{border:6px solid var(--cf-accent);}
.cf-topic:has(input:focus-visible){outline:3px solid var(--cf-accent);outline-offset:2px;}
.cf-topic__t{font-size:17px;font-weight:700;line-height:1.35;}
.cf-topic__d{font-size:14.5px;line-height:1.5;color:var(--cf-mute);}
.cf-field{display:grid;gap:8px;}
.cf-field label{font-weight:700;font-size:17px;}
.cf-field small{font-weight:500;font-size:14.5px;color:var(--cf-mute);margin-left:4px;}
.cf-field input,.cf-field textarea{width:100%;box-sizing:border-box;padding:14px 16px;border-radius:12px;border:1px solid var(--cf-line);background:var(--cf-input);color:var(--cf-ink);font:inherit;font-size:17px;line-height:1.6;outline:none;transition:border-color .2s;}
.cf-field input:focus,.cf-field textarea:focus{border-color:var(--cf-accent);}
.cf-field input::placeholder,.cf-field textarea::placeholder{color:var(--cf-mute);}
.cf-field textarea{min-height:170px;resize:vertical;}
.cf-two{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.cf-help{margin:-8px 0 0;font-size:15px;color:var(--cf-mute);}
.cf-send{padding:16px 18px;border-radius:14px;border:0;background:var(--cf-send);color:var(--cf-send-ink);font:inherit;font-size:18px;font-weight:800;cursor:pointer;transition:filter .2s, transform .2s;}
.cf-send:hover{filter:brightness(1.1);transform:translateY(-1px);}
.cf-send:disabled{opacity:.6;cursor:wait;transform:none;}
.cf .form-msg{margin:0;min-height:0;font-size:17px;}
.cf .form-msg:empty{display:none;}
.cf .form-msg a{text-decoration:underline;}
.cf-note{margin:0;font-size:15.5px;color:var(--cf-mute);}
@media (max-width:760px){
  .cf-grid{grid-template-columns:1fr 1fr;}
  .cf-topic{padding:14px 12px 13px 42px;}
  .cf-topic::before{left:13px;top:16px;}
  .cf-topic__t{font-size:16px;}
}
@media (max-width:520px){
  /* 휴대폰: 설명은 빼고 이름만 — 여섯 개가 한 화면에 들어오게 */
  .cf-topic{padding:13px 10px 13px 40px;align-content:center;min-height:58px;}
  .cf-topic::before{top:50%;margin-top:-10px;left:12px;}
  .cf-topic__d{display:none;}
}
@media (max-width:420px){ .cf-two{grid-template-columns:1fr;} }