
.p-consult /* .cv* 공용 블록은 layout.css 로 승격됨 — 이 페이지 고유값만 남긴다 */ .cv__char { width: clamp(96px, 10.78vw, 207px); }
/* [E-10] ============================================================ page-cons */ :root {
  --cs-pad-150: clamp(56px, 7.81vw, 150px);   /* container padding-block 150 */
  --cs-gap-170: clamp(64px, 8.85vw, 170px);   /* container gap 170 */
  --cs-line:    #e5e5e5;                       /* 입력 박스 테두리 (시안) */
  --cs-fill:    #f9f9f9;                       /* 입력 박스 배경 (시안) */
  --cs-ph:      #999999;                       /* placeholder */
}

@media (max-width: 767px) {
}
@media (max-width: 479px) {
}
/* ============================================================ container 73:2446 — py150 · gap170 · 자식 가운데 정렬 ============================================================ */ .cs-body {
  display: flex; flex-direction: column; align-items: center;
  gap: var(--cs-gap-170);
  padding-block: var(--cs-pad-150);
  width: 100%;
}
/* ============================================================ 도입안내 탭 73:2447 (440x70 · bg #f3f3f3 · r35) ============================================================ */ .ctabs { width: min(440px, calc(100% - 40px)); background: #f3f3f3; border-radius: var(--r-pill); }
.ctabs ul { display: flex; }
.ctabs li { flex: 1 1 0; min-width: 0; }
.ctabs a {
  display: flex; align-items: center; justify-content: center;
  height: clamp(52px, 3.646vw, 70px);
  border-radius: var(--r-pill);
  font-size: clamp(15px, 1.042vw, 20px); line-height: 1; font-weight: 500;
  white-space: nowrap; color: var(--ink);
  padding-top: var(--optical-y); box-sizing: border-box;
  transition: background-color var(--mo-fast) var(--ease-out),
              color var(--mo-fast) var(--ease-out);
}
.ctabs a.is-active { background: var(--brand-cta); color: var(--white); }
.ctabs a:not(.is-active):hover { color: var(--brand-cta); background: rgba(227, 84, 87, .08); }
/* ============================================================ 상담 신청 섹션 77:718 (w-full · gap 48) ============================================================ */ .cform-sec {
  width: 100%;
  display: flex; flex-direction: column; align-items: center;
  gap: clamp(24px, 2.5vw, 48px);
  padding-inline: var(--gutter);
}
/* ---- 타이틀 64:1675 (gap 30) ---- */ .cform-title {
  display: flex; flex-direction: column; align-items: center;
  gap: var(--gap-md); text-align: center; max-width: 100%;
}
.cform-title__mark { width: clamp(40px, 2.656vw, 51px); height: auto; }
/* 64:1676 51x50 */ .cform-title__h {                                  /* 64:1677 Bold 60 / lh 1.4 */
  font-size: clamp(26px, 3.125vw, 60px); line-height: 1.4;
  font-weight: 700; color: var(--ink); white-space: nowrap;
}
.cform-title__lead {                               /* 64:1678 Medium 22 / lh 1.8 / #222 */
  font-size: clamp(14px, 1.1458vw, 22px); line-height: 1.8;
  font-weight: 500; color: var(--ink-2); white-space: nowrap;
}
/* ============================================================ 폼 카드 77:719 (1000x796 · pad 60 · r30 · gap 40) ============================================================ */ .cform {
  width: min(1000px, 100%);
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  padding: clamp(16px, 3.125vw, 60px);
  box-shadow: 0 12px 16px rgba(0, 0, 0, .05);
  display: flex; flex-direction: column; align-items: stretch;
  gap: clamp(24px, 2.083vw, 40px);
}
/* ---- 필드 그룹 77:723 (gap 20) ---- */ .cform__fields { display: flex; flex-direction: column; gap: clamp(14px, 1.042vw, 20px); }
.cform__row { display: flex; gap: clamp(12px, 1.25vw, 24px); }
.cform__row > .field { flex: 1 1 0; min-width: 0; }
/* 라벨↔박스 gap 12 (row-3 두 필드만 10) */ .cform .field { gap: 12px; }
.cform__row--tight .field { gap: 10px; }
.cform .field > label, .cform__legend {                            /* Medium 18 / lh 1.0 / #222 (77:758 만 #1d1717) */
  font-size: var(--fs-body); line-height: 1.2; font-weight: 500; color: var(--ink-2);
}
.cform__legend { color: #1d1717; }
/* ---- 공통 입력 박스 (base .control 위에 시안 값 덮어쓰기) ---- */ .cform .control {
  border-color: var(--cs-line);
  border-radius: 10px;
  font-size: clamp(13px, .8333vw, 16px);
  line-height: 1;
  color: var(--ink-2);
}
.cform input.control:not(.cform__etc),
.cform select.control {
  padding-top: var(--optical-y);
  box-sizing: border-box;
}
/* background-color 만 바꾼다 — 단축 속성을 쓰면 base.css 의 select chevron 이 지워진다 */ .cform .control--fill { background-color: var(--cs-fill); }
.cform .control::placeholder { color: var(--cs-ph); opacity: 1; }
.cform .control:focus {
  border-color: var(--brand-cta); background-color: var(--white);
  box-shadow: 0 0 0 3px rgba(227, 84, 87, .15);
}
.cform select.control { background-position: right clamp(12px, .9375vw, 18px) center;
                        padding-right: clamp(38px, 2.5vw, 48px); cursor: pointer; }
.cform select.control.control--fill { background-color: var(--cs-fill); }
/* 오류 표시 (site.js 가 .has-error 를 붙인다 · 시안 미정의 → 추론) */ .cform .field.has-error .control { border-color: var(--brand); background-color: #fff5f5; }
.cform__topic.has-error .cform__etc { border-color: var(--brand); background-color: #fff5f5; }
.cform__topic.has-error .cform__legend { color: var(--brand); }
/* ---- 7. 상담 희망 내용 77:757 (label → 칩 → 직접입력 · 각 gap 12) ---- */ .cform__topic { display: block; border: 0; padding: 0; margin: 0; min-width: 0; }
.cform__topic .cform__legend { display: block; padding: 0; margin-bottom: 12px; }
.chips {
  display: flex; flex-wrap: wrap; align-content: flex-start;
  gap: clamp(8px, .625vw, 12px);
  margin-bottom: 12px;
}
.chip {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: clamp(34px, 2.083vw, 40px);
  padding: calc(12px + var(--optical-y)) clamp(14px, 1.042vw, 20px) 12px;
  border-radius: var(--r-pill);
  border: 1px solid var(--brand-cta);
  background: var(--white); color: var(--brand-cta);
  font-size: clamp(13px, .8333vw, 16px); line-height: 1; font-weight: 500;
  white-space: nowrap; cursor: pointer;
  user-select: none;
  -webkit-user-select: none;
  transition: color var(--mo-base) var(--ease-out),
              border-color var(--mo-base) var(--ease-out),
              background-color var(--mo-base) var(--ease-out);
}
.chip:hover { background-color: #fff1f1; }
.chip__input:checked + .chip,
.chip__input:checked + .chip:hover {
  background-color: var(--brand);
  border-color: var(--brand);
  color: var(--white);
}
.chip__input:focus-visible + .chip { outline: 3px solid var(--brand); outline-offset: 3px; }
.cform__etc { background-color: var(--white); padding-block: calc(12px + var(--optical-y)) 12px; box-sizing: border-box; }
/* 77:766 880x60 · bg #fff */ /* ---- 동의 영역 77:768 (gap 16) ---- */ .cform__agreement { display: flex; flex-direction: column; gap: clamp(10px, .8333vw, 16px); }
.cform__notice {                            /* 77:772 Medium 16 / #333 */
  font-size: clamp(12px, .8333vw, 16px); line-height: 1.5; color: #333333;
}
.agree { display: flex; align-items: center; gap: clamp(8px, .625vw, 12px); }
.agree__input {                             /* 77:774 24x24 · r6 · bg #e35457 · 기본 체크됨 */
  appearance: none; -webkit-appearance: none;
  flex: 0 0 auto; margin: 0;
  width: clamp(20px, 1.25vw, 24px); height: clamp(20px, 1.25vw, 24px);
  border: 1px solid var(--cs-line); border-radius: 6px;
  background: var(--white); cursor: pointer;
  transition: background-color var(--mo-fast) var(--ease-out),
              border-color var(--mo-fast) var(--ease-out);
}
.agree__input:checked {
  background: var(--brand-cta) center / 66% no-repeat
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7'/%3E%3C/svg%3E");
  border-color: var(--brand-cta);
}
.agree__label {                             /* 77:776 Medium 16 / #1d1717 */
  font-size: clamp(12px, .8333vw, 16px); line-height: 1.5;
  color: #1d1717; cursor: pointer;
  padding-top: 3px;
}
.agree.has-error .agree__input { border-color: var(--brand); box-shadow: 0 0 0 3px rgba(231, 73, 71, .18); }
/* ---- 제출 버튼 77:777 (880x70 · r10 · bg #e35457) ---- */ .cform__submit {
  display: flex; align-items: center; justify-content: center;
  width: 100%; min-height: clamp(52px, 3.646vw, 70px);
  padding: 12px clamp(20px, 2.083vw, 40px);
  border-radius: 10px; background: var(--brand-cta); color: var(--white);
  font-size: clamp(16px, 1.1458vw, 22px); line-height: 1; font-weight: 500;
  box-shadow: 0 8px 10px rgba(227, 84, 87, .2);
  border: none;
  transition: box-shadow var(--mo-fast) var(--ease-out),
              color var(--mo-base) var(--ease-out);
}
.cform__submit:hover { box-shadow: 0 12px 18px rgba(227, 84, 87, .32); }

/* ============================================================
   반응형
   ============================================================ */
@media (max-width: 1023px) {
.cform { width: min(1000px, calc(100% - 0px)); padding: 40px; }
.cform-title__h, .cform-title__lead { white-space: normal; }
}
/* 폼은 spec 대로 768 부터 1열 스택 (visual 은 intro.html 과 동일하게 767 유지) */
@media (max-width: 768px) {
.cform { padding: 24px; border-radius: var(--r-md); }
.cform__row { flex-direction: column; gap: clamp(14px, 1.042vw, 20px); }
.cform .field { gap: 10px; }
.cform .control { height: 52px; }
.ctabs { width: min(340px, calc(100% - 40px)); }
}
@media (max-width: 479px) {
.cform { padding: 16px; }
.cform__etc { padding-block: calc(10px + var(--optical-y)) 10px; }
.chip { padding: calc(10px + var(--optical-y)) 14px 10px; }
.cform__notice, .agree__label { line-height: 1.6; white-space: normal; }
}

/* ---- 장식 도형 4개 — 시안 get_design_context 실측 (중심 % + 회전) ---- */
.p-consult .cv-sh--sq1 { left: 89.48%; top: 28.5%; --rot: 0deg; --c: #ffda75; }
.p-consult .cv-sh--sq2 { left: 72.01%; top: 30.17%; --rot: -8.64deg; --c: #12deab; }
.p-consult .cv-sh--p1 { left: 89.47%; top: 81.69%; --rot: 28.89deg; }
.p-consult .cv-sh--p2 { left: 68.14%; top: 69.55%; --rot: 60.09deg; }
