/* [클로드 개발 1팀 c1 2026-11-02 market/TASK-20261102-022] EXN 구매 화면 B안 「한 화면 한 질문」. 동작은 /exn/js/exn-wizard.js.
   .xw-on 이 붙은 상품 상세(.pd_main_container)·신청서(.order_container)와 완료 화면(.xw-done)에만 적용한다. */
.xw,.xw-done{--xw-navy:#141a3d;--xw-navy2:#20285a;--xw-on-navy:#c5cbef;--xw-brand:#4356dd;--xw-brand-ink:#2f3fc4;--xw-soft:#eef0ff;--xw-bg:#f5f6fb;--xw-line:#e3e6f0;--xw-ink:#14172b;--xw-ink2:#383e57;--xw-muted:#5f6680;--xw-warn-bg:#fff6e2;--xw-warn:#8a5200;color:var(--xw-ink);letter-spacing:-.02em}
.xw *,.xw-done *{box-sizing:border-box}
.xw-on .xw-off{display:none!important}
.xw [hidden],.xw-done [hidden]{display:none!important}
/* 틀 */
.pd_main_container.xw-on,.order_container.xw-on{display:block!important;max-width:1200px;margin:0 auto;padding:0 20px;grid-template-columns:none!important}
.pd_main_container.xw-on>.pd_top_content,.pd_main_container.xw-on>.pd_bottom_content,.order_container.xw-on>.order_info_wrap,body.xw-body .shop-application-intro{display:none!important}
.xw{display:grid;grid-template-columns:440px minmax(0,1fr);gap:44px;align-items:start;padding:28px 0 56px}
.xw-main{min-width:0;display:flex;flex-direction:column;gap:26px}
/* 남색 견적 칸 */
.xw-panel{position:sticky;top:calc(var(--xw-top,0px) + 16px);background:var(--xw-navy);color:#fff;border-radius:24px;padding:28px 30px;display:flex;flex-direction:column;gap:18px;min-width:0}
.xw-panel p,.xw-panel h1,.xw-panel dl,.xw-panel dd,.xw-panel ul{margin:0}
.xw-prod{display:flex;gap:16px;align-items:center}
.xw-pic{flex:none;width:120px;height:104px;border-radius:18px;background:var(--xw-navy2);display:grid;place-items:center;overflow:hidden}
.xw-pic img{width:108px;height:92px;object-fit:contain}
.xw-prod-info{min-width:0;display:flex;flex-direction:column;gap:8px}
.xw-code{font-size:12px;color:var(--xw-on-navy);letter-spacing:.02em}
.xw-name{font-size:31px;font-weight:900;line-height:1.25;color:#fff;letter-spacing:-.04em}
.xw-chips{display:flex;flex-wrap:wrap;gap:6px}
.xw-chip{display:inline-flex;align-items:center;gap:6px;min-height:28px;padding:0 11px;border-radius:999px;background:#ffffff14;border:1px solid #ffffff2e;color:#fff;font-size:12px;font-weight:700}
.xw-sw{display:inline-block;width:12px;height:12px;border-radius:50%;border:1px solid #0000002e;flex:none}
.xw-chip .xw-sw{border-color:#ffffff66}
.xw-lab{font-size:14px;font-weight:700;color:var(--xw-on-navy)}.xw-lab span{font-weight:400}
.xw-big{font-size:46px;white-space:nowrap;font-weight:800;line-height:1.05;margin-top:8px!important;color:#fff;font-variant-numeric:tabular-nums;letter-spacing:-.03em}
.xw-int{font-size:13px;color:var(--xw-on-navy);margin-top:8px!important}
.xw-eq{border-top:1px solid #ffffff26}
.xw-eq>div{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:9px 0;border-bottom:1px solid #ffffff1a;font-size:14px;color:var(--xw-on-navy)}
.xw-eq dd{color:#fff;font-weight:700;font-size:15px;font-variant-numeric:tabular-nums}
.xw-eq .is-minus dd{color:#ffb9b9}
.xw-month{display:flex;justify-content:space-between;align-items:center;gap:12px;background:var(--xw-navy2);border-radius:16px;padding:14px 16px}
.xw-month-k{font-size:13px;font-weight:700;color:var(--xw-on-navy)}
.xw-month-sub{font-size:12px;color:var(--xw-on-navy);margin-top:3px!important;line-height:1.5}
.xw-month-v{font-size:21px;font-weight:800;white-space:nowrap;font-variant-numeric:tabular-nums}
.xw-unc{font-size:13px;line-height:1.6;color:#ffe2a3}
.xw-panel.is-unconfirmed .xw-big{font-size:34px;color:#ffe2a3}
.xw-pduty{list-style:none;padding:0;display:flex;flex-direction:column;gap:6px;font-size:12px}
.xw-pduty li{display:flex;justify-content:space-between;gap:10px;padding:9px 12px;border-radius:10px;background:#2b2a1e;color:#ffe2a3}
.xw-pduty b{flex:none}
.xw-pduty span{text-align:right}
.xw-panel-act{display:flex;gap:8px;flex-wrap:wrap}
/* 단추 */
.xw-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:52px;padding:0 22px;border:0;border-radius:14px;font:inherit;font-size:16px;font-weight:800;cursor:pointer;text-decoration:none;line-height:1.2}
.xw-btn-main{background:var(--xw-brand);color:#fff}
.xw-btn-main:hover{background:#3445c4;color:#fff}
.xw-btn-main:disabled{background:#a9b2ec;color:#fff;cursor:wait}
.xw-btn-main.is-apply{background:var(--xw-brand)}
.xw-btn-light{background:#fff;color:var(--xw-ink2);border:1px solid #cfd4e2}
.xw-btn-light:disabled{opacity:.45;cursor:default}
.xw-btn-white{background:#fff;color:var(--xw-navy);min-height:44px;font-size:14px;border-radius:12px;flex:1 1 auto}
.xw-btn-kakao{background:#fee500;color:#191600;min-height:44px;font-size:14px;border-radius:12px}
.xw-btn:focus-visible,.xw-edit:focus-visible,.xw-link:focus-visible{outline:1px solid var(--xw-brand);outline-offset:2px}
.xw-panel .xw-btn:focus-visible{outline-color:#fff}
.xw-link{border:0;background:none;padding:6px 2px;min-height:36px;font:inherit;font-size:14px;font-weight:700;color:var(--xw-brand-ink);text-decoration:underline;text-underline-offset:3px;cursor:pointer;white-space:nowrap}
/* 진행 · 질문 */
.xw-head{display:flex;flex-direction:column;gap:14px}
.xw-head p,.xw-head h2{margin:0}
.xw-prog-row{display:flex;align-items:center;gap:16px}
.xw-qno{flex:none;font-size:14px;font-weight:800;color:var(--xw-brand-ink);font-variant-numeric:tabular-nums}
.xw-prog{flex:1;height:6px;border-radius:3px;background:var(--xw-line);overflow:hidden}
.xw-prog i{display:block;height:100%;background:var(--xw-brand);border-radius:3px;transition:width .2s}
.xw-q{font-size:36px;font-weight:900;line-height:1.3;letter-spacing:-.045em;color:var(--xw-ink);outline:none}
.xw-help{font-size:16px;line-height:1.6;color:var(--xw-muted)}
.xw-err{font-size:15px;font-weight:700;color:#b42318;background:#fdeeee;border-radius:12px;padding:10px 14px}
/* 고른 것 */
.xw-ans-wrap{border-top:1px solid var(--xw-line);padding-top:14px}
.xw-ans-t{margin:0 0 4px;font-size:13px;font-weight:800;color:var(--xw-muted)}
.xw-ans{margin:0}
.xw-ans-row{display:grid;grid-template-columns:130px minmax(0,1fr) auto;gap:12px;align-items:center;min-height:50px;padding:6px 0;border-bottom:1px solid var(--xw-line);font-size:15px}
.xw-ans-row dt{color:var(--xw-muted);font-size:14px}
.xw-ans-row dd{margin:0;font-weight:800;display:flex;align-items:center;gap:7px;min-width:0;overflow-wrap:anywhere}
.xw-ans-row .xw-sw{width:14px;height:14px}
.xw-edit{border:0;background:none;padding:6px 4px;min-height:40px;font:inherit;font-size:14px;font-weight:800;color:var(--xw-brand-ink);cursor:pointer}
.xw-next-note{margin:12px 0 0;font-size:13px;color:var(--xw-muted)}
.xw-nav{display:flex;justify-content:space-between;gap:12px}
.xw-nav .xw-btn-light{min-width:130px}
.xw-nav .xw-btn-main{min-width:260px}
/* 견적 확인 */
.xw-review{display:flex;flex-direction:column;gap:14px}
.xw-duty{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.xw-duty li{display:grid;grid-template-columns:110px minmax(0,1fr);gap:14px;padding:13px 16px;border-radius:14px;background:var(--xw-bg);font-size:14px;line-height:1.6}
.xw-duty li.is-warn{background:var(--xw-warn-bg)}
.xw-duty b{font-weight:800}
.xw-duty li.is-warn b{color:var(--xw-warn)}
.xw-review .xw-btn-kakao{align-self:flex-start;min-height:48px;padding:0 20px}
/* 상품 상세: 기존 선택 칸을 큰 칸으로 */
.xw-on .pd_middle_content_container{position:static!important;width:auto!important;max-width:none!important;margin:0!important;padding:0!important;border:0!important;background:none!important;box-shadow:none!important;height:auto!important;overflow:visible!important}
.xw-on .pd_middle_content_sub,.xw-on .pd-inline-actions{display:none!important}
.xw-on .pd_middle_content{display:flex!important;flex-direction:column;gap:26px;padding:0!important;border:0!important;background:none!important;box-shadow:none!important}
.xw-on .pd_mid_radio_button_wrap{margin:0!important;padding:0!important;border:0!important}
.xw-on .pd_mid_radio_button_label{font-size:16px!important;font-weight:800!important;margin:0 0 10px!important;color:var(--xw-ink)}
.xw-on .xw-lead>.pd_mid_radio_button_label{display:none!important}
.xw-on .pd_mid_radio_button_options_wrap[data-target]:not([data-target=color]){display:grid!important;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:12px!important}
.xw-on .pd_mid_radio_button_options_wrap[data-target] .pd_mid_radio_button_options,.xw-on .pd_mid_radio_button_options_wrap[data-target] .pd_mid_radio_button_options_yak{position:relative;display:flex!important;align-items:center;gap:12px;width:auto!important;min-height:72px!important;height:auto!important;margin:0!important;padding:16px 18px!important;border:1.5px solid var(--xw-line)!important;border-radius:18px!important;background:#fff!important;color:var(--xw-ink)!important;font-size:18px!important;font-weight:800!important;box-shadow:none!important;cursor:pointer;text-align:left}
.xw-on .pd_mid_radio_button_options_wrap[data-target] .pd_mid_radio_button_options_yak{flex-direction:column;align-items:flex-start;justify-content:center;gap:4px}
.xw-on .pd_mid_radio_button_options_yak .first{font-size:20px;font-weight:800;color:var(--xw-ink)}
.xw-on .pd_mid_radio_button_options_yak .desc{font-size:14px;font-weight:500;color:var(--xw-muted)}
.xw-on .pd_mid_radio_button_options_wrap[data-target] .selected{border-color:var(--xw-brand)!important;background:var(--xw-soft)!important;box-shadow:inset 0 0 0 1px var(--xw-brand)!important;color:var(--xw-brand-ink)!important}
.xw-on .pd_mid_radio_button_options_wrap[data-target] .selected .first{color:var(--xw-brand-ink)}
.xw-on .pd_mid_radio_button_options_wrap[data-target] .pd_mid_radio_button_options:focus-visible,.xw-on .pd_mid_radio_button_options_wrap[data-target] .pd_mid_radio_button_options_yak:focus-visible{outline:1px solid var(--xw-brand)!important;outline-offset:2px}
.xw-on .pco-logo{flex:none}
.xw-on .pco-name{font-size:17px;font-weight:800}
.xw-on .pd_mid_select_info_wrap{margin-top:12px!important;border-radius:14px!important}
/* 색상: 색 원 + 이름 */
.xw-on [data-target=color] .color-picker-group{display:grid!important;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px!important}
.xw-on [data-target=color] .color-option-wrap{width:auto!important;height:auto!important;margin:0!important;padding:0!important;border:0!important}
.xw-on [data-target=color] .color-option{position:relative;display:flex!important;align-items:center;gap:12px;width:100%!important;height:auto!important;min-height:64px;padding:12px 16px!important;border:1.5px solid var(--xw-line)!important;border-radius:16px!important;background:#fff!important;box-shadow:none!important;outline:none;cursor:pointer;transform:none!important}
.xw-on [data-target=color] .color-option::before{content:"";flex:none;width:30px;height:30px;border-radius:50%;background:var(--color);border:1px solid #0000002a;position:static!important;display:block!important;transform:none!important}
.xw-on [data-target=color] .color-option::after{content:attr(title)!important;position:static!important;display:block!important;width:auto!important;height:auto!important;border:0!important;background:none!important;transform:none!important;font-size:16px;font-weight:800;color:var(--xw-ink);opacity:1!important}
.xw-on [data-target=color] .color-option.selected{border-color:var(--xw-brand)!important;background:var(--xw-soft)!important;box-shadow:inset 0 0 0 1px var(--xw-brand)!important}
.xw-on [data-target=color] .color-option.selected::after{color:var(--xw-brand-ink)}
.xw-on #pd_color .pd_mid_radio_button_selectedoption{display:none!important}
/* 요금제·옵션·보험 선택 칸 */
.xw-on .pd_mid_custom_select_toggle{min-height:64px!important;border-radius:16px!important;border:1.5px solid var(--xw-line)!important;padding:12px 18px!important;background:#fff!important}
.xw-on .pd_mid_custom_select_toggle.open{border-color:var(--xw-brand)!important}
/* 신청서 */
.xw-on .order_input_wrap{width:auto!important;max-width:none!important;margin:0!important;padding:0!important;border:0!important;background:none!important;box-shadow:none!important}
.xw-on .order_textinput_section{padding:0!important;border:0!important;background:none!important;box-shadow:none!important}
.xw-on .order_textinput_group{display:flex!important;flex-direction:column;gap:16px;padding:0!important;border:0!important;background:none!important;max-width:620px}
.xw-on .order_textinput_input{min-height:60px;font-size:19px!important}
.xw-on #exn-member-order{margin:0 0 4px}
.xw-on .contract_toggle_card{margin:0 0 12px!important;border-radius:16px!important}
/* 완료 */
.xw-done{max-width:1040px;margin:0 auto;padding:44px 20px 56px;display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:28px;align-items:start}
.xw-done p,.xw-done h1,.xw-done h2,.xw-done dl,.xw-done dd,.xw-done ol{margin:0}
.xw-done .order_complete_container{display:flex!important;flex-direction:column;gap:24px;max-width:none!important;width:auto!important;margin:0!important;padding:0!important;border:0!important;background:none!important;box-shadow:none!important;text-align:left!important}
.xw-done .order_complete_header{display:flex!important;flex-direction:column;align-items:flex-start!important;gap:10px;text-align:left!important;margin:0!important;padding:0!important}
.xw-done .xw-done-check{width:60px;height:60px;border-radius:50%;background:var(--xw-brand);display:grid;place-items:center}
.xw-done .order_complete_customer_name{font-size:16px!important;font-weight:700!important;color:var(--xw-brand-ink)!important;margin:4px 0 0!important}
.xw-done .order_complete_title{font-size:42px!important;font-weight:900!important;line-height:1.25!important;letter-spacing:-.045em;color:var(--xw-ink)!important;margin:0!important;text-align:left!important}
.xw-done .xw-now{background:var(--xw-navy);color:#fff;border-radius:24px;padding:28px 30px;display:flex;flex-direction:column;gap:12px}
.xw-done .xw-now-k{font-size:13px;font-weight:700;color:var(--xw-on-navy)}
.xw-done .xw-now h2{font-size:26px;font-weight:900;color:#fff}
.xw-done .order_complete_message_box{margin:0!important;padding:0!important;border:0!important;background:none!important;color:var(--xw-on-navy)!important;font-size:15px;line-height:1.7;text-align:left!important}
.xw-done .order_complete_message_box p{margin:0!important;color:inherit!important}
.xw-done .order_complete_message_box strong{color:#fff}
.xw-done .order_complete_button_wrapper{display:flex!important;gap:10px;flex-wrap:wrap;margin:6px 0 0!important;padding:0!important;justify-content:flex-start!important}
.xw-done .order_complete_telecom_button{display:inline-flex!important;align-items:center;justify-content:center;gap:8px;min-height:56px;padding:0 26px!important;border-radius:14px!important;background:var(--xw-brand)!important;color:#fff!important;font-size:17px!important;font-weight:800!important;text-decoration:none;width:auto!important;border:0!important}
.xw-done .order_complete_telecom_button.is-kakao{background:#fee500!important;color:#191600!important}
.xw-done .xw-dots{list-style:none;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
.xw-done .xw-dots li{display:flex;flex-direction:column;gap:8px;font-size:13px;font-weight:600;color:var(--xw-muted)}
.xw-done .xw-dots li i{display:block;height:6px;border-radius:3px;background:var(--xw-line)}
.xw-done .xw-dots li.is-done{color:var(--xw-ink2)}.xw-done .xw-dots li.is-done i{background:var(--xw-navy)}
.xw-done .xw-dots li.is-now{color:var(--xw-brand-ink);font-weight:800}.xw-done .xw-dots li.is-now i{background:var(--xw-brand)}
.xw-done .order_complete_info_text{font-size:14px!important;line-height:1.7;color:var(--xw-muted)!important;text-align:left!important;margin:0!important}
.xw-done-sum{background:#fff;border:1px solid var(--xw-line);border-radius:22px;padding:22px;display:flex;flex-direction:column;gap:14px}
.xw-done-sum h2{font-size:17px;font-weight:800}
.xw-done-prod{display:flex;gap:12px;align-items:center}
.xw-done-pic{flex:none;width:64px;height:54px;border-radius:12px;background:var(--xw-bg);display:grid;place-items:center;overflow:hidden}
.xw-done-pic img{width:58px;height:46px;object-fit:contain}
.xw-done-sum dl{display:flex;flex-direction:column;gap:10px;font-size:14px;border-top:1px solid var(--xw-line);padding-top:14px}
.xw-done-sum dl>div{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}
.xw-done-sum dt{color:var(--xw-muted)}
.xw-done-sum .xw-done-p dt{color:var(--xw-ink);font-weight:800}
.xw-done-sum .xw-done-p dd{text-align:right}
.xw-done-sum .xw-done-p b{font-size:24px;font-weight:800;color:var(--xw-brand-ink);font-variant-numeric:tabular-nums}
.xw-done-sum .xw-done-p small{display:block;font-size:12px;color:var(--xw-muted)}
/* 좁은 화면 */
@media(max-width:991px){
 .pd_main_container.xw-on,.order_container.xw-on{padding:0}
 .xw{grid-template-columns:minmax(0,1fr);gap:0;padding:0 0 calc(96px + env(safe-area-inset-bottom,0px))}
 .xw-panel{position:static;border-radius:0 0 22px 22px;padding:16px 18px 18px;gap:12px}
 .xw-pic{width:72px;height:62px;border-radius:14px}.xw-pic img{width:64px;height:52px}
 .xw-name{font-size:27px;line-height:1.2}
 .xw-big{font-size:32px}
 .xw-code{display:none}
 .xw-chip{min-height:24px;font-size:11px;padding:0 9px}
 .xw-price{display:flex;flex-direction:column;gap:2px}
 .xw-big{margin-top:4px!important;font-size:clamp(28px,9vw,36px);white-space:nowrap}
 .xw-int{margin:4px 0 0!important;font-size:12px;line-height:1.5}
 .xw-eq{display:flex;flex-wrap:wrap;gap:2px 10px;border:0;background:var(--xw-navy2);border-radius:10px;padding:8px 12px}
 .xw-eq>div{border:0;padding:0;gap:4px;font-size:12px}
 .xw-eq dd{font-size:12px}
 .xw-month{padding:10px 14px}.xw-month-sub{display:none}.xw-month-v{font-size:17px}
 .xw-pduty{display:none}
 .xw-panel-act{gap:6px}.xw-panel-act .xw-btn{min-height:40px;font-size:13px;padding:0 14px}
 .xw-main{padding:22px 16px 0;gap:22px}
 .xw-q{font-size:27px}
 .xw-help{font-size:15px}
 .xw-ans-row{grid-template-columns:96px minmax(0,1fr) auto;font-size:14px}
 .xw-nav{position:fixed;left:0;right:0;bottom:0;z-index:40;background:#fff;border-top:1px solid var(--xw-line);box-shadow:0 -10px 24px #14172b14;padding:12px 16px calc(14px + env(safe-area-inset-bottom,0px));display:grid;grid-template-columns:100px minmax(0,1fr)}
 .xw-nav .xw-btn-light,.xw-nav .xw-btn-main{min-width:0}
 body.xw-body #submit_info_mobile_container,body.xw-body #submit_btn_mobile_container{display:none!important}
 .xw-on .pd_mid_radio_button_options_wrap[data-target]:not([data-target=color]){grid-template-columns:repeat(2,minmax(0,1fr))}
 .xw-on [data-target=color] .color-picker-group{grid-template-columns:repeat(2,minmax(0,1fr))}
 .xw-on .pd_mid_radio_button_options_wrap[data-target] .pd_mid_radio_button_options,.xw-on .pd_mid_radio_button_options_wrap[data-target] .pd_mid_radio_button_options_yak{min-height:64px!important;padding:12px 14px!important;font-size:16px!important}
 .xw-duty li{grid-template-columns:86px minmax(0,1fr);padding:12px 14px}
 .xw-done{grid-template-columns:minmax(0,1fr);padding:28px 16px 40px;gap:22px}
 .xw-done .order_complete_title{font-size:31px!important}
 .xw-done .xw-now{padding:22px 20px}
 .xw-done .xw-now h2{font-size:22px}
 .xw-done .order_complete_telecom_button{width:100%!important}
 .xw-done .xw-dots li{font-size:11px}
}