@charset "utf-8";
/* ============================================================================
   v2 공통 — 팔레트 / 리셋 / 타이포 기본
   요구사항 : docs/requirements-260904.md
   설계     : docs/v2-track-design-260904.md
   ============================================================================ */

:root {
    /* phantom_26y.css 팔레트.
       --primary-color 만 예외로 시안값 #E41F20 을 쓴다 (D-36 스냅 철회).
       v1 은 #d42930 이라 서브페이지와 빨강이 다르다. */
    --dark-color:    #111111;
    --primary-color: #E41F20;
    --white-color:   #FAFAFA;
    --gray-1-color:  #F2F2F2;
    --gray-2-color:  #EBEBEB;
    --gray-3-color:  #D6D6D6;
    --gray-4-color:  #666666;
    --gray-5-color:  #222222;

    /* D-53 : 팔레트 밖 신규 색 2개 (승인분). 스냅하지 않고 시안 값을 그대로 쓴다.
       BEST 뱃지 / 뉴스 태그 / MO 대리점 CTA */
    --sub-red-color:        #F55B5C;
    --sub-red-border-color: #ED2D2D;

    /* 시안 실측 보조색 — 팔레트로 스냅한 것 */
    --input-border-color: #D6D6D6; /* 시안 #d5d5d5 → --gray-3 */

    /* 시안 실측 보조색 — 팔레트에 대응값이 없어 실측 그대로 쓰는 것. 작업 보고 대상 */
    --chip-bg-color:      #ECF0F6;
    --chip-border-color:  #D1DBEA;
    --card-bg-color:      #F6F6F6;
    --card-border-color:  #CDD1D5;
    /* 메인 대리점 지도 카드 테두리 (시안 2035:2213). 팔레트에 대응 회색이 없다 */
    --map-border-color:   #C7DAF4;
    /* 구매하기·고객지원 카드 배경은 흰색이다.
       get_design_context 는 #F9F9F9 로 읽혔으나 시안 확인 결과 흰색이라 #fff 로 쓴다.
       (변수는 남겨두되 현재 사용처 없음) */
    --card-alt-bg-color:  #FFFFFF;
    --text-sub-color:     #71797F;
    --text-sub2-color:    #676B72;
    --text-mute-color:    #A1A5AE;
    --text-dark2-color:   #3B4145;
    --placeholder-color:  #A6A6A6;
    --btn-gray-color:     #BBBFC7;
    --line-soft-color:    #E6ECF0;

    /* Ver3 기타페이지(서브 8종) 실측 보조색.
       "피그마 값 그대로 쓴다" 로 확정 (2026-09-22). 팔레트로 스냅하지 않는다.
       ※ --text-sub3 은 v2 메인에서 --gray-4(#666) 로 스냅했던 값이다.
         Ver3 범위에서만 시안 값을 쓴다. 메인 쪽은 건드리지 않는다. */
    --band-bg-color:      #F9FAFD;
    --text-sub3-color:    #55585B;
    /* 모바일 PLP 1뎁스 탭 비활성 (시안 8037:1056). 팔레트에 대응 회색이 없다 */
    --tab-off-color:      #B7C3CC;
}

/* ---------------------------------------------------------------- reset --- */
html, body, div, span, h1, h2, h3, h4, h5, h6, p, a, em, img, strong, i,
ul, ol, li, form, label, table, th, td, button, input, textarea, select, figure {
    margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline;
}
* { -webkit-box-sizing: border-box; box-sizing: border-box; }
ul, ol { list-style: none; }
img { max-width: 100%; vertical-align: top; }
a { color: inherit; text-decoration: none; }
button { background: none; border: 0; cursor: pointer; font: inherit; color: inherit; }
input, textarea, select { font: inherit; color: inherit; }
input::-webkit-input-placeholder { color: var(--placeholder-color); }
input::-moz-placeholder { color: var(--placeholder-color); }
input:-ms-input-placeholder { color: var(--placeholder-color); }
input::placeholder { color: var(--placeholder-color); }

body, input, textarea, select, button, table {
    font-family: 'Pretendard', 'Noto Sans KR', 'Malgun Gothic', sans-serif;
    color: var(--dark-color);
    -webkit-text-size-adjust: none;
}
body { background: #fff; }

/* 스크린리더 전용 */
.hiddens,
#skipnavi {
    position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0;
    overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}

/* 오버레이가 열린 동안 본문 스크롤 잠금 (A3) */
body.v2_scroll_lock { overflow: hidden; }