/* 굿스푼 새 스킨 v16 주문서·로그인 관문 — 2026-10-14 (시안 v17c pages.css .flow·.ship-note·.fbox·.frow·.inp·.paygrid·.terms·.ltabs·.sns-btn·.gorder·.nudge → 실제 스킨)
   - 칸을 옮겨 묶는 건 js/gs_v16_order.js · 고도몰 칸(입력·체크·라디오·단추)은 지우지 않고 모양만 바꾼다
   - 이 파일은 _header.html 에서 gs_v16_cart.css 뒤에 붙는다 */

html.gs-pg-flow #header_wrap .sub_top { display: none !important; }
html.gs-pg-flow #header_wrap .header_box { justify-content: flex-start; }
html.gs-pg-flow #header_wrap .header_box .right_menu { margin-left: auto; }
#header_wrap .header_box .gs-hd-back { display: grid; place-items: center; width: 32px; height: 40px; margin: 0 2px 0 -8px; color: var(--gs-text); }
#header_wrap .header_box .gs-hd-back svg { width: 22px; height: 22px; stroke: currentColor; fill: none; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
#wrap .gs-off { display: none !important; }

/* ═════════════ 주문서 ═════════════ */
html.gs-order-ready #gsTabbar { display: none !important; }
html.gs-order-ready body { padding-bottom: 0 !important; }
html.gs-order-ready #footer { padding-bottom: 96px; }
html.gs-order-ready .kakao_ch { bottom: calc(86px + env(safe-area-inset-bottom)) !important; }
#wrap .order { padding: 0 !important; background: var(--gs-app); }
#wrap .order #frmOrder > .pay, #wrap .order #frmOrder > .order_box, #wrap .order #frmOrder > div:not(.gs-of):empty { margin: 0 !important; padding: 0 !important; border: 0 !important; }
#wrap .gs-of { color: var(--gs-text); padding-bottom: 8px; }
#wrap .gs-ohead h1 { margin: 0; padding: 22px var(--gs-gutter) 2px; font-size: 24px; line-height: 1.3; font-weight: 800; letter-spacing: -0.035em; }
#wrap .gs-flow { display: flex; align-items: center; justify-content: center; gap: 6px; padding: 14px var(--gs-gutter) 4px; font-size: 13px; color: var(--gs-muted); }
#wrap .gs-flow span { display: inline-flex; align-items: center; gap: 5px; white-space: nowrap; }
#wrap .gs-flow span i { width: 20px; height: 20px; border-radius: 50%; display: grid; place-items: center; font-style: normal; font-size: 11px; font-weight: 800; background: var(--gs-surface); color: var(--gs-muted); }
#wrap .gs-flow span.on { color: var(--gs-text); font-weight: 700; }
#wrap .gs-flow span.on i { background: var(--gs-accent); color: var(--gs-accent-text); }
#wrap .gs-flow span.done i { background: var(--gs-tint); color: var(--gs-accent-ink); }
#wrap .gs-flow b { width: 18px; height: 1px; background: #e2d4c4; }
#wrap .gs-shipnote { display: flex; gap: 10px; align-items: flex-start; margin: 12px var(--gs-gutter) 0; padding: 11px 14px; border-radius: 12px; background: var(--gs-band); font-size: 13px; line-height: 1.5; color: var(--gs-sub); }
#wrap .gs-shipnote img { width: 22px; height: 22px; flex: 0 0 auto; margin-top: 1px; }
#wrap .gs-shipnote b { color: var(--gs-text); }

/* 상자(시안 .fbox) */
#wrap .gs-ofbox { margin: 12px var(--gs-gutter) 0; padding: 18px 16px; border-radius: 16px; background: #fff; box-shadow: inset 0 0 0 1px var(--gs-line); }
#wrap .gs-ofbox > h3 { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 0 0 14px; font-size: 16px; line-height: 1.35; font-weight: 800; letter-spacing: -0.035em; color: var(--gs-text); }
#wrap .gs-ofbox > h3 small { font-size: 13px; font-weight: 500; color: var(--gs-muted); letter-spacing: -0.02em; }
#wrap .gs-ofbox > h3 .lnk { border: 0; background: none; padding: 4px 0; font-size: 13px; font-weight: 600; color: var(--gs-accent-ink); cursor: pointer; }
#wrap .gs-ofbox .order_box, #wrap .gs-ofbox .shipping_info_area, #wrap .gs-ofbox .shipping_info_table, #wrap .gs-ofbox .how_to_pay, #wrap .gs-ofbox fieldset, #wrap .gs-ofbox .table_box { margin: 0 !important; padding: 0 !important; border: 0 !important; background: none !important; box-shadow: none !important; }
#wrap .gs-ofbox .order_box + .order_box { margin-top: 14px !important; }
#wrap .gs-ofbox legend, #wrap .gs-ofbox caption { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
#wrap .gs-ofbox .order_box > h2.order_tit, #wrap .gs-ofbox .how_to_pay h2.order_tit { margin: 0 0 10px !important; padding: 0 !important; border: 0 !important; background: none !important; font-size: 14px !important; font-weight: 700 !important; color: var(--gs-sub) !important; line-height: 1.4 !important; height: auto !important; }
#wrap .gs-ofbox .order_box > h2.order_tit img { width: 18px; height: 18px; vertical-align: -4px; }
#wrap .gs-ohint { margin: 8px 0 0; font-size: 12px; line-height: 1.55; color: var(--gs-muted); }
#wrap .gs-fold { display: none !important; }

/* 표 → 위아래 칸(시안 .frow · .inp) */
#wrap .gs-ofbox table, #wrap .gs-ofbox tbody, #wrap .gs-ofbox tr, #wrap .gs-ofbox th, #wrap .gs-ofbox td { display: block; width: auto !important; height: auto !important; border: 0 !important; background: none !important; padding: 0 !important; text-align: left !important; }
#wrap .gs-ofbox colgroup { display: none; }
#wrap .gs-ofbox tr { margin-top: 14px !important; }
#wrap .gs-ofbox tbody > tr:first-child { margin-top: 0 !important; }
#wrap .gs-ofbox tr.dn { display: none !important; }
#wrap .gs-ofbox th { margin-bottom: 7px !important; font-size: 14px !important; font-weight: 600 !important; color: var(--gs-text) !important; line-height: 1.4; }
#wrap .gs-ofbox th label { font-size: inherit !important; font-weight: inherit; color: inherit; }
#wrap .gs-ofbox th.required label::after { content: ' *'; color: var(--gs-accent-ink); font-weight: 800; }   /* 필수 표(고도몰 th.required) — 별 하나 */
#wrap .gs-ofbox th.required { background: none !important; }
#wrap .gs-ofbox th.required::before { content: none !important; display: none !important; }
#wrap .gs-ofbox tr.gs-optrow th::after { content: ' 선택'; font-size: 12px; font-weight: 500; color: var(--gs-muted); }
#wrap .gs-ofbox input[type="text"], #wrap .gs-ofbox input[type="tel"], #wrap .gs-ofbox input[type="email"], #wrap .gs-ofbox input[type="number"], #wrap .gs-ofbox input[type="password"], #wrap .gs-ofbox select {
  width: 100% !important; max-width: none !important; height: 48px !important; padding: 0 14px !important; border: 1px solid #e8dccd !important; border-radius: 12px !important; background-color: #fff !important; color: var(--gs-text) !important;
  font-size: 15px !important; letter-spacing: -0.02em; box-sizing: border-box; outline: none; -webkit-appearance: none; appearance: none; box-shadow: none !important; }
#wrap .gs-ofbox select { background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237d6c5c' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") right 12px center / 16px no-repeat !important; padding-right: 36px !important; }
#wrap .gs-ofbox input::placeholder { color: #a8998a; }
#wrap .gs-ofbox input[readonly] { background-color: var(--gs-surface) !important; color: var(--gs-sub) !important; }
#wrap .gs-ofbox input:focus, #wrap .gs-ofbox select:focus { border-color: var(--gs-accent-ink) !important; box-shadow: 0 0 0 3px rgba(44, 211, 160, .14) !important; }
#wrap .gs-ofbox .inp_sel { width: 100% !important; margin: 0 !important; }
#wrap .gs-ofbox .inp_sel select + span, #wrap .gs-ofbox .inp_sel::after { display: none !important; }
#wrap .gs-ofbox .cell_bx { display: flex !important; gap: 8px; align-items: center; }
#wrap .gs-ofbox .cell_bx .cell { flex: 1; min-width: 0; display: block !important; width: auto !important; padding: 0 !important; }
#wrap .gs-ofbox td input + input, #wrap .gs-ofbox td .cell_bx + input, #wrap .gs-ofbox td input + .cell_bx { margin-top: 8px !important; }
#wrap .gs-ofbox .address_box, #wrap .gs-ofbox .zipcode_box { display: block !important; }
#wrap .gs-ofbox .zipcode_btn_box { display: block !important; float: none !important; width: auto !important; }
#wrap .gs-ofbox .zipcode_btn1, #wrap .gs-ofbox .post_search { height: 48px !important; padding: 0 14px !important; border: 0 !important; border-radius: 12px !important; background: #fff !important; box-shadow: inset 0 0 0 1px #e8dccd !important; color: var(--gs-text) !important; font-size: 14px !important; font-weight: 600 !important; white-space: nowrap; }
/* 체크·라디오(시안 동그라미) — 고도몰 입력 그대로 */
#wrap .gs-ofbox input[type="checkbox"], #wrap .gs-ofbox input[type="radio"], #wrap .gs-lpane input[type="checkbox"], #wrap .login input[type="checkbox"] {
  -webkit-appearance: none; appearance: none; position: static !important; opacity: 1 !important; width: 22px !important; height: 22px !important; margin: 0 8px 0 0 !important; flex: 0 0 auto; display: inline-grid !important; place-items: center; vertical-align: middle;
  border-radius: 50% !important; border: 1.5px solid #e2d4c4 !important; background: #fff !important; cursor: pointer; }
#wrap .gs-ofbox input[type="checkbox"]:checked, #wrap .gs-ofbox input[type="radio"]:checked, #wrap .login input[type="checkbox"]:checked { background: var(--gs-accent) !important; border-color: var(--gs-accent-ink) !important; }
#wrap .gs-ofbox input[type="checkbox"]:checked::after, #wrap .gs-ofbox input[type="radio"]:checked::after, #wrap .login input[type="checkbox"]:checked::after { content: ''; width: 6px; height: 10px; border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg) translate(-1px, -1px); }
#wrap .gs-ofbox .inp_chk, #wrap .gs-ofbox .inp_rdo { display: flex !important; align-items: flex-start; position: static !important; padding: 0 !important; background: none !important; }
#wrap .gs-ofbox .inp_chk label, #wrap .gs-ofbox .inp_rdo label { position: static !important; display: block !important; padding: 1px 0 0 !important; background: none !important; font-size: 14px !important; line-height: 1.45 !important; color: var(--gs-text) !important; }
#wrap .gs-ofbox .inp_chk label::before, #wrap .gs-ofbox .inp_chk label::after, #wrap .gs-ofbox .inp_rdo label:not([data-gs-pi])::before, #wrap .gs-ofbox .inp_rdo label::after { content: none !important; display: none !important; }
/* 쿠폰 조회 및 적용(고도몰 단추 · 시안 «쿠폰 고르기» 모양) */
#wrap .gs-ofbox .coupon_search_apply_btn, #wrap .gs-ofbox .btn_open_layer { display: inline-flex !important; align-items: center; height: 40px !important; padding: 0 14px !important; border: 0 !important; border-radius: 12px !important; background: #fff !important; box-shadow: inset 0 0 0 1px var(--gs-accent-ink) !important; color: var(--gs-accent-ink) !important; font-size: 14px !important; font-weight: 700 !important; line-height: 1 !important; }
/* 회원 카드·요청 칩 */
#wrap .gs-oaddr { padding: 14px; border-radius: 16px; background: var(--gs-surface); font-size: 14px; line-height: 1.55; }
#wrap .gs-oaddr b { font-size: 15px; }
#wrap .gs-oaddr p { margin: 0; color: var(--gs-sub); }
#wrap .gs-memo-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 8px; }
#wrap .gs-memo-chips button { height: 32px; padding: 0 12px; border: 1px solid var(--gs-line); border-radius: 999px; background: #fff; color: var(--gs-sub); font-size: 13px; cursor: pointer; }
#wrap .gs-memo-chips button[aria-pressed="true"] { border-color: var(--gs-accent-ink); color: var(--gs-accent-ink); background: var(--gs-tint); font-weight: 700; }
/* 회원 배송지 탭(고도몰 tab_btn) → 나눔 단추 */
#wrap .gs-ofbox .tab_menu, #wrap .gs-ofbox ul.tab { display: flex !important; gap: 0; margin: 0 0 14px !important; padding: 3px !important; border-radius: 12px; background: var(--gs-surface); border: 0 !important; }
#wrap .gs-ofbox .tab_btn { flex: 1; float: none !important; width: auto !important; border: 0 !important; }
#wrap .gs-ofbox .tab_btn a { display: block !important; height: 38px; line-height: 38px !important; border: 0 !important; border-radius: 8px; background: none !important; text-align: center; font-size: 14px !important; color: var(--gs-sub) !important; }
#wrap .gs-ofbox .tab_btn::before, #wrap .gs-ofbox .tab_btn::after, #wrap .gs-ofbox .tab_btn a::before, #wrap .gs-ofbox .tab_btn a::after { content: none !important; display: none !important; }
#wrap .gs-ofbox .tab_btn.active { border: 0 !important; background: none !important; }
#wrap .gs-ofbox .tab_btn.active a { background: #fff !important; color: var(--gs-text) !important; font-weight: 700; box-shadow: 0 1px 4px rgba(36, 25, 15, .08); }
/* 주문 상품 요약 */
#wrap .gs-osum { display: flex; align-items: center; gap: 12px; }
#wrap .gs-osum .pics { display: flex; flex: 0 0 auto; }
#wrap .gs-osum .pics img { width: 44px; height: 44px; margin-left: -14px; border: 2px solid #fff; border-radius: 8px; object-fit: cover; background: var(--gs-surface); }
#wrap .gs-osum .pics img:first-child { margin-left: 0; }
#wrap .gs-osum .t { flex: 1; min-width: 0; }
#wrap .gs-osum .t b { display: block; font-size: 15px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; letter-spacing: -0.03em; }
#wrap .gs-osum .t small { font-size: 13px; color: var(--gs-muted); }
#wrap .gs-osum button { flex: 0 0 auto; height: 32px; padding: 0 12px; border: 0; border-radius: 999px; background: var(--gs-surface); color: var(--gs-sub); font-size: 13px; font-weight: 600; cursor: pointer; }
#wrap .gs-olines { margin-top: 12px; border-top: 1px solid var(--gs-line); }
#wrap .gs-olines[hidden] { display: none; }
#wrap .gs-olines ul.my_goods { margin: 0 !important; padding: 0 !important; border: 0 !important; }
#wrap .gs-olines ul.my_goods > li { margin: 0 !important; padding: 0 !important; border: 0 !important; }
#wrap .gs-olines .order-goods-layout { padding: 11px 0 !important; border-bottom: 1px solid var(--gs-line); }
#wrap .gs-olines .itemhead { float: none !important; display: inline-block; vertical-align: top; }
#wrap .gs-olines .thmb, #wrap .gs-olines .thmb_box { width: 48px !important; height: 48px !important; }
#wrap .gs-olines .thmb img { width: 48px !important; height: 48px !important; border-radius: 8px; object-fit: cover; }
#wrap .gs-olines .itembody { margin: 0 0 0 58px !important; padding: 0 !important; font-size: 13px; color: var(--gs-muted); }
#wrap .gs-olines .itembody .name { font-size: 14px !important; font-weight: 600; color: var(--gs-text) !important; }
#wrap .gs-olines .itembody .prc { font-size: 14px !important; color: var(--gs-text) !important; }
#wrap .gs-ofee { display: flex; justify-content: space-between; gap: 8px; padding: 11px 0 0; font-size: 13px; color: var(--gs-sub); }
/* 가입 안내(비회원 · 로그인) */
#wrap .gs-onudge { display: flex; align-items: center; gap: 12px; margin: 12px var(--gs-gutter) 0; padding: 16px; border-radius: 16px; background: #24190f; color: #fffaf4; }
#wrap .gs-onudge img { width: 40px; height: 40px; flex: 0 0 auto; }
#wrap .gs-onudge .t { flex: 1; min-width: 0; }
#wrap .gs-onudge b { display: block; font-size: 15px; line-height: 1.4; }
#wrap .gs-onudge small { display: block; margin-top: 2px; font-size: 12px; line-height: 1.45; opacity: .75; }
#wrap .gs-onudge .gs-btn { flex: 0 0 auto; height: 36px; padding: 0 14px; border-radius: 999px; background: var(--gs-accent); color: var(--gs-accent-text); font-size: 13px; font-weight: 800; display: inline-flex; align-items: center; }
/* 결제 수단(고도몰 목록 → 바둑판) */
#wrap .gs-pay .pay_mth { display: grid !important; grid-template-columns: 1fr 1fr; gap: 8px; margin: 0 !important; padding: 0 !important; }
#wrap .gs-pay .pay_mth li { float: none !important; width: auto !important; margin: 0 !important; padding: 0 !important; }
#wrap .gs-pay .pay_mth .inp_rdo { position: relative !important; display: block !important; }
#wrap .gs-pay .pay_mth .inp_rdo input[type="radio"] { position: absolute !important; opacity: 0 !important; width: 1px !important; height: 1px !important; margin: 0 !important; }
#wrap .gs-pay .pay_mth .inp_rdo label { display: flex !important; align-items: center; justify-content: center; gap: 7px; height: 54px; padding: 0 8px !important; border: 1px solid var(--gs-line); border-radius: 16px; background: #fff !important; font-size: 14px !important; font-weight: 600; letter-spacing: -0.03em; cursor: pointer; }
#wrap .gs-pay .pay_mth .inp_rdo input[type="radio"]:checked + label { border-color: var(--gs-accent-ink); box-shadow: inset 0 0 0 1px var(--gs-accent-ink); background: var(--gs-tint) !important; color: var(--gs-accent-ink) !important; }
#wrap .gs-pay .pay_mth .inp_rdo input[type="radio"]:focus-visible + label { outline: 2px solid var(--gs-accent-ink); outline-offset: 2px; }
#wrap .gs-pay label[data-gs-pi]::before { content: attr(data-gs-pi) !important; position: static !important; width: 22px !important; height: 22px !important; margin: 0 !important; flex: 0 0 auto; display: grid !important; place-items: center; border: 0 !important; border-radius: 8px !important; font-size: 11px; font-weight: 800; line-height: 1; background: var(--gs-surface); color: var(--gs-sub); transform: none !important; }
#wrap .gs-pay label.gs-pi-c::before { background: var(--gs-accent) !important; color: var(--gs-accent-text) !important; }
#wrap .gs-pay label.gs-pi-k::before { background: #fee500 !important; color: #191919 !important; }
#wrap .gs-pay label.gs-pi-t::before { background: #3182f6 !important; color: #fff !important; }
#wrap .gs-pay label.gs-pi-p::before { background: #fa2828 !important; color: #fff !important; }
#wrap .gs-pay label.gs-pi-b::before { background: #7d6c5c !important; color: #fff !important; }
#wrap .gs-pay label.gs-pi-h::before { background: #24190f !important; color: #fff !important; }
#wrap .gs-pay .pay_mth_payco { display: flex !important; flex-wrap: wrap; gap: 8px; margin: 0 !important; padding: 0 !important; }
#wrap .gs-pay .pay_mth_payco li { width: calc(50% - 4px) !important; margin: 0 !important; float: none !important; }
#wrap .gs-pay .pay_mth_payco .inp_rdo { display: block !important; padding: 6px !important; border: 1px solid var(--gs-line); border-radius: 16px; background: #fff; }
#wrap .gs-pay .pay_mth_payco .inp_rdo input[type="radio"] { position: absolute !important; opacity: 0 !important; width: 1px !important; height: 1px !important; }
#wrap .gs-pay .pay_mth_payco img { display: block; width: 100% !important; height: auto; }
#wrap .gs-pay .pay_notice, #wrap .gs-pay .payco_notice { margin: 8px 0 0 !important; padding: 0 !important; font-size: 12px !important; line-height: 1.55; color: var(--gs-muted) !important; background: none !important; border: 0 !important; }
#wrap .gs-pay #settlekind_general_gb { margin-top: 14px !important; }
#wrap .gs-pay ul.pay_mth:not(.js_gd5_settlekind_general):not(.js_gd5_settlekind_escrow):not(.js_gd5_settlekind_overseas) { display: flex !important; flex-wrap: wrap; gap: 8px; }
/* 10/21 대표: «결제 수단 선택» 알약 줄([일반결제][에스크로결제])과 바로 아래 영수증 알약 줄 사이 = 줄 안 간격 8px(전 0 · 페이코 기본·에스크로 고름일 때 붙어 있었다)
   · 좁은 폭에선 알약이 다음 줄로 내려가고 줄 사이도 8px(위 flex-wrap · 전엔 한 줄 고정이라 344~440 폭에서 세금계산서 알약이 칸 밖으로 나갔다)
   · 알약 가로 사이도 8px(아래 label margin 0 · 전 23px = 고도몰 gd_common.css .inp_rdo label 오른쪽 15px 가 더해짐 · 그 15px 때문에 PC 500 칸에서도 괜히 줄이 꺾이지 않게) */
#wrap .gs-pay .js_pay_content + .order_box { margin-top: 8px !important; }
#wrap .gs-pay ul.pay_mth:not(.js_gd5_settlekind_general):not(.js_gd5_settlekind_escrow):not(.js_gd5_settlekind_overseas) li { flex: 0 0 auto; }
#wrap .gs-pay ul.pay_mth:not(.js_gd5_settlekind_general):not(.js_gd5_settlekind_escrow):not(.js_gd5_settlekind_overseas) .inp_rdo label { height: 36px; margin: 0 !important; padding: 0 14px !important; font-size: 13px !important; border-radius: 999px; }
/* 결제 금액(시안 .sumbox) */
#wrap .gs-osumbox tr { display: flex !important; justify-content: space-between; align-items: baseline; gap: 8px; margin-top: 8px !important; }
#wrap .gs-osumbox th { margin: 0 !important; font-size: 14px !important; font-weight: 400 !important; color: var(--gs-sub) !important; }
#wrap .gs-osumbox td { text-align: right !important; font-size: 14px !important; color: var(--gs-sub) !important; }
#wrap .gs-osumbox td strong, #wrap .gs-osumbox td .total { font-size: 14px !important; font-weight: 600 !important; color: var(--gs-text) !important; }
#wrap .gs-osumbox td p { margin: 0 0 2px !important; font-size: 13px !important; }
#wrap .gs-osumbox .sum_prc_wrap { margin-top: 12px !important; padding-top: 14px !important; border-top: 1px solid var(--gs-line) !important; background: none !important; }
#wrap .gs-osumbox .sum_prc { display: flex !important; justify-content: space-between; align-items: baseline; margin: 0 !important; padding: 0 !important; border: 0 !important; background: none !important; }
#wrap .gs-osumbox .sum_prc dt { float: none !important; font-size: 18px !important; font-weight: 800 !important; color: var(--gs-text) !important; }
#wrap .gs-osumbox .sum_prc dd { float: none !important; margin: 0 !important; text-align: right; }
#wrap .gs-osumbox .sum_prc dd .c_red, #wrap .gs-osumbox .sum_prc dd strong { color: var(--gs-accent-ink) !important; font-size: 18px !important; font-weight: 800 !important; }
/* 주문 동의 */
#wrap .gs-ofbox[data-gs-sec="order_agree"] h3.my_tit { margin: 0 0 6px !important; padding: 14px !important; border: 0 !important; border-radius: 16px; background: var(--gs-band) !important; font-size: 14px !important; line-height: 1.45; }
#wrap .gs-ofbox[data-gs-sec="order_agree"] h3.my_tit .inp_chk label { font-size: 14px !important; font-weight: 700 !important; }
#wrap .gs-ofbox[data-gs-sec="order_agree"] .order_box { padding: 12px 0 !important; border-bottom: 1px solid var(--gs-line) !important; }
#wrap .gs-ofbox[data-gs-sec="order_agree"] .order_box:last-child { border-bottom: 0 !important; }
#wrap .gs-ofbox[data-gs-sec="order_agree"] .order_box + .order_box { margin-top: 0 !important; }
#wrap .gs-agree-tit { display: flex !important; align-items: center; justify-content: space-between; gap: 8px; margin: 0 0 8px !important; }
#wrap .gs-terms-btn { flex: 0 0 auto; border: 0; background: none; padding: 4px 0 4px 6px; color: var(--gs-muted); font-size: 13px; text-decoration: underline; text-underline-offset: 2px; cursor: pointer; }
#wrap .gs-terms-body { margin: 0 0 10px !important; padding: 14px !important; max-height: 220px; overflow: auto; border: 1.5px dashed #ead9c6 !important; border-radius: 12px; background: #fffdf9 !important; font-size: 13px !important; line-height: 1.6; color: var(--gs-muted) !important; height: auto !important; }
#wrap .gs-terms-body[hidden] { display: none !important; }
#wrap .gs-ofbox .re_confirm, #wrap .gs-ofbox .guest_info { margin: 0 !important; padding: 0 !important; border: 0 !important; background: none !important; }
#wrap .gs-ofbox .inp_chk label strong, #wrap .gs-ofbox .inp_chk label .c_red { color: var(--gs-accent-ink) !important; font-weight: 700; }
/* 결제하기 — 고도몰 단추는 숨기고(아래 막대가 대신 누른다) · 결제불가 안내는 보인다 */
#wrap .btn_pay_wrap.gs-hide-pay { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }
#wrap .btn_pay_wrap.gs-nopay { margin: 12px var(--gs-gutter) 0 !important; }
#gsOrderBar .gs-btn { flex: 1.5; }

/* ═════════════ 로그인 관문 ═════════════ */
html.gs-login-ready #wrap .login { padding: 0 0 24px !important; background: var(--gs-app); }
#wrap .gs-lhead h1 { margin: 0; padding: 22px var(--gs-gutter) 10px; font-size: 24px; line-height: 1.3; font-weight: 800; letter-spacing: -0.035em; color: var(--gs-text); }
#wrap .gs-ltabs { display: grid; grid-template-columns: 1fr 1fr; border-bottom: 1px solid var(--gs-line); }
#wrap .gs-ltabs > * { display: grid; place-items: center; height: 48px; margin-bottom: -1px; border: 0; border-bottom: 2px solid transparent; background: none; font-size: 15px; color: var(--gs-muted); cursor: pointer; }
#wrap .gs-ltabs > [aria-selected="true"] { color: var(--gs-text); font-weight: 700; border-bottom-color: var(--gs-accent-ink); }
html.gs-login-ready #wrap .login .login_box, html.gs-login-ready #wrap .gs-lpane { margin: 0 !important; padding: 22px var(--gs-gutter) 0 !important; border: 0 !important; background: none !important; }
html.gs-login-ready #wrap .login .login_box[hidden], html.gs-login-ready #wrap .gs-lpane[hidden] { display: none !important; }
html.gs-login-ready #wrap .login fieldset { margin: 0; padding: 0; border: 0; }
html.gs-login-ready #wrap .login legend { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
html.gs-login-ready #wrap .login dl { margin: 0 0 8px !important; padding: 0 !important; border: 0 !important; }
html.gs-login-ready #wrap .login dt { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
html.gs-login-ready #wrap .login dd { margin: 0 !important; padding: 0 !important; }
html.gs-login-ready #wrap .login input[type="text"], html.gs-login-ready #wrap .login input[type="password"] { width: 100% !important; height: 52px !important; padding: 0 14px !important; border: 1px solid #e8dccd !important; border-radius: 12px !important; background: #fff !important; font-size: 15px !important; color: var(--gs-text) !important; box-sizing: border-box; -webkit-appearance: none; appearance: none; }
html.gs-login-ready #wrap .login input[type="text"]:focus, html.gs-login-ready #wrap .login input[type="password"]:focus { border-color: var(--gs-accent-ink) !important; box-shadow: 0 0 0 3px rgba(44, 211, 160, .14); outline: none; }
html.gs-login-ready #wrap .login .inp_chk { display: flex !important; align-items: center; gap: 16px; margin: 12px 0 0 !important; padding: 0 !important; }
html.gs-login-ready #wrap .login .inp_chk label { position: static !important; display: inline-flex !important; align-items: center; margin: 0 0 0 -2px !important; padding: 0 !important; background: none !important; font-size: 14px !important; color: var(--gs-sub) !important; }
html.gs-login-ready #wrap .login .inp_chk label::before, html.gs-login-ready #wrap .login .inp_chk label::after { content: none !important; display: none !important; }
html.gs-login-ready #wrap .login .inp_chk input[type="checkbox"] { width: 20px !important; height: 20px !important; margin: 0 6px 0 0 !important; }
html.gs-login-ready #wrap .login .submit { margin: 16px 0 0 !important; }
html.gs-login-ready #wrap .login .member_login_btn { width: 100% !important; height: 54px !important; border: 0 !important; border-radius: 16px !important; background: var(--gs-accent) !important; color: var(--gs-accent-text) !important; font-size: 16px !important; font-weight: 800 !important; }
html.gs-login-ready #wrap .login .login_find { display: flex !important; justify-content: center; margin: 16px 0 0 !important; padding: 0 !important; border: 0 !important; font-size: 13px; color: var(--gs-sub); }
html.gs-login-ready #wrap .login .login_find li { float: none !important; padding: 4px 12px !important; border: 0 !important; background: none !important; }
html.gs-login-ready #wrap .login .login_find li + li { border-left: 1px solid var(--gs-line) !important; }
html.gs-login-ready #wrap .login .login_find li a { color: var(--gs-sub) !important; font-size: 13px !important; }
html.gs-login-ready #wrap .login .login_find.gs-lnote { order: 3; margin-top: 14px !important; }
html.gs-login-ready #wrap .login .login_find.gs-lnote p { margin: 0; padding: 0 !important; text-align: center; font-size: 13px !important; font-weight: 400 !important; color: var(--gs-muted) !important; background: none !important; box-shadow: none !important; }
html.gs-login-ready #wrap .login .login_box { display: flex; flex-direction: column; }
html.gs-login-ready #wrap .login .login_box > form { order: 0; }
html.gs-login-ready #wrap .login .login_box > .login_find:not(.gs-lnote) { order: 1; }
html.gs-login-ready #wrap .login .login_box > .gs-or { order: 2; }
html.gs-login-ready #wrap .login .login_box > .sns_login { order: 2; }
#wrap .gs-or { display: flex; align-items: center; gap: 10px; margin: 26px 0 14px; font-size: 12px; color: var(--gs-muted); }
#wrap .gs-or::before, #wrap .gs-or::after { content: ''; flex: 1; height: 1px; background: var(--gs-line); }
html.gs-login-ready #wrap .login .sns_login { display: flex !important; flex-direction: column; gap: 8px; margin: 0 !important; padding: 0 !important; border: 0 !important; }
html.gs-login-ready #wrap .login .sns_login li { float: none !important; width: 100% !important; height: auto !important; margin: 0 !important; padding: 0 !important; border: 0 !important; background: none !important; }   /* 10/21 height auto — 고도몰 li 42px 고정에 52px 단추가 넘쳐 카카오·네이버 간격 8px 이 사라짐 */
html.gs-login-ready #wrap .login .sns_login li.gs-sns-kakao { order: 0; }
html.gs-login-ready #wrap .login .sns_login li.gs-sns-naver { order: 1; }
html.gs-login-ready #wrap .login .sns_login li:not(.gs-sns) { order: 2; }
#wrap .gs-sns-in { position: relative; display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; height: 52px; border-radius: 16px; font-size: 15px; font-weight: 700; letter-spacing: -0.03em; cursor: pointer; }
#wrap .gs-sns-in svg { position: absolute; left: 18px; width: 22px; height: 22px; }
#wrap .gs-sns-kakao .gs-sns-in { background: #fee500; color: #191919; }
#wrap .gs-sns-naver .gs-sns-in { background: #03c75a; color: #fff; }
html.gs-login-ready #wrap .login .guest_order_box { margin: 0 !important; padding: 0 var(--gs-gutter) !important; border: 0 !important; background: none !important; }
html.gs-login-ready #wrap .login .guest_order_box:empty { display: none; }
html.gs-login-ready #wrap .login .guest_txt { margin: 0 0 16px !important; padding: 0 !important; border: 0 !important; background: none !important; text-align: left; font-size: 14px; color: var(--gs-sub); }
html.gs-login-ready #wrap .login .guest_txt strong { display: block; font-size: 15px; color: var(--gs-text); }
html.gs-login-ready #wrap .login #formOrderLogin .member_login_order_btn { width: 100% !important; height: 54px !important; margin-top: 8px !important; border: 0 !important; border-radius: 16px !important; background: var(--gs-accent) !important; color: var(--gs-accent-text) !important; font-size: 16px !important; font-weight: 800 !important; }
#wrap .gs-gorder { margin: 26px var(--gs-gutter) 0; padding: 18px 16px; border-radius: 16px; background: var(--gs-surface); }
#wrap .gs-gorder[hidden] { display: none; }
#wrap .gs-gorder > b { display: block; font-size: 15px; color: var(--gs-text); }
#wrap .gs-gorder > p { margin: 3px 0 0; font-size: 13px; color: var(--gs-muted); }
#wrap .gs-gorder form, #wrap .gs-gorder fieldset { margin: 0 !important; padding: 0 !important; border: 0 !important; }
#wrap .gs-gorder .member_login_order_btn { width: 100% !important; height: 48px !important; margin-top: 12px !important; border: 0 !important; border-radius: 12px !important; background: #fff !important; box-shadow: inset 0 0 0 1px #e2d4c4; color: var(--gs-text) !important; font-size: 15px !important; font-weight: 700 !important; }
#wrap .gs-lnudge { margin-top: 22px; }

/* ═════════════ v18o 이식 P-B(2026-10-17) — 주문서 «받은 혜택» 띠(스위치 켜졌을 때만) · 주문 완료 화면(시안 pageOrderEnd) ═════════════ */
#wrap .gs-shipnote.gs-pk-got { align-items: center; background: var(--gs-tint); color: var(--gs-accent-text); }
#wrap .gs-shipnote.gs-pk-got svg { width: 20px; height: 20px; flex: none; color: var(--gs-accent-ink); }
#wrap .gs-shipnote.gs-pk-got b { color: var(--gs-accent-text); }
#wrap .gs-shipnote.gs-pk-got .pk-n { white-space: nowrap; }
/* 주문 완료 — 고도몰 칸은 숨기고(지우지 않음) 같은 글·값을 시안 모양으로 */
html.gs-end-ready #wrap .order_end { padding: 0 0 24px; background: var(--gs-app); }
#wrap .gs-oend { color: var(--gs-text); }
#wrap .gs-end-hero { padding: 30px var(--gs-gutter) 6px; text-align: center; }
#wrap .gs-end-hero .ok { width: 68px; height: 68px; margin: 0 auto 14px; border-radius: 50%; background: var(--gs-accent); display: grid; place-items: center; box-shadow: 0 10px 26px rgba(44, 211, 160, .3); }
#wrap .gs-end-hero .ok svg { width: 34px; height: 34px; stroke: #fff; fill: none; stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }
#wrap .gs-end-hero .ok.wait { background: #ffb36b; box-shadow: 0 10px 26px rgba(255, 179, 107, .3); }
#wrap .gs-end-hero .ok.fail { background: #b9a898; box-shadow: none; }
#wrap .gs-end-hero h1 { margin: 0; font-size: 24px; line-height: 1.35; font-weight: 800; letter-spacing: -0.035em; color: var(--gs-text); }
#wrap .gs-end-hero p { margin: 6px 0 0; font-size: 14px; line-height: 1.5; color: var(--gs-sub); word-break: keep-all; }
#wrap .gs-end-no { margin: 18px auto 0; display: inline-flex; align-items: center; gap: 8px; max-width: 100%; padding: 9px 10px 9px 14px; border-radius: 999px; background: #fff; box-shadow: inset 0 0 0 1px var(--gs-line); font-size: 13px; color: var(--gs-sub); box-sizing: border-box; }
#wrap .gs-end-no b { color: var(--gs-text); font-variant-numeric: tabular-nums; letter-spacing: 0; overflow-wrap: anywhere; }
#wrap .gs-end-no button { flex: none; height: 26px; padding: 0 10px; border: 0; border-radius: 999px; background: var(--gs-surface); color: var(--gs-sub); font-size: 12px; font-weight: 600; cursor: pointer; }
#wrap .gs-edl { display: grid; grid-template-columns: auto 1fr; gap: 9px 12px; margin: 0; font-size: 14px; }
#wrap .gs-edl dt { color: var(--gs-muted); white-space: nowrap; }
#wrap .gs-edl dd { margin: 0; color: var(--gs-text); text-align: right; font-weight: 600; overflow-wrap: anywhere; }
#wrap .gs-edl dd.big { font-size: 18px; font-weight: 800; color: var(--gs-accent-ink); }
#wrap .gs-end-pay .tx { font-size: 14px; line-height: 1.7; color: var(--gs-sub); }
#wrap .gs-end-note { margin: 12px var(--gs-gutter) 0; font-size: 13px; line-height: 1.6; color: var(--gs-muted); word-break: keep-all; }
#wrap .gs-end-pay .gs-end-note { margin: 12px 0 0; padding-top: 12px; border-top: 1px solid var(--gs-line); }
#wrap .gs-end-note b { color: var(--gs-sub); }
#wrap .gs-end-recheck { text-align: center; }
#wrap .gs-end-recheck a { font-weight: 800; color: var(--gs-accent-ink); }
#wrap .gs-end-btns { display: flex; gap: 8px; margin: 18px var(--gs-gutter) 0; }
#wrap .gs-end-btns .gs-btn { flex: 1; display: inline-flex; align-items: center; justify-content: center; height: 50px; padding: 0 8px; border: 0; border-radius: 16px; background: var(--gs-accent); color: var(--gs-accent-text) !important; font-size: 15px; font-weight: 800; text-decoration: none; white-space: nowrap; box-sizing: border-box; }
#wrap .gs-end-btns .gs-btn.ghost { background: #fff; color: var(--gs-text) !important; box-shadow: inset 0 0 0 1px var(--gs-line); }

/* ══ v18v 이식 P-B(2026-10-19) ══ */
/* v18r: 3D 그림(Fluent 상자·돈주머니) → 선 아이콘(.gs-lic) — 출고 안내 = 트럭 · 가입 유도 = 선물(시안 pages.js shipNote·nudge) */
#wrap .gs-lic { display: inline-grid; place-items: center; flex: none; line-height: 0; color: var(--gs-accent-ink); }
#wrap .gs-lic svg { display: block; width: 20px; height: 20px; }
#wrap .gs-lic.xs svg { width: 18px; height: 18px; }
#wrap .gs-lic.md { width: 40px; height: 40px; border-radius: 50%; background: #fff; }
#wrap .gs-lic.md svg { width: 22px; height: 22px; }
#wrap .gs-shipnote .gs-lic { margin-top: 2px; }
/* v18t A③(대표 10/19 «진갈색 꽉 찬 면 → 연민트»): 가입 유도 칸(주문서·로그인) = 연민트 면 + 진초록 글자 */
#wrap .gs-onudge { background: #E6F8F2; color: #053B31; }
#wrap .gs-onudge small { opacity: 1; color: #2F5A50; }
/* 결정 4: 사은품 덧말 «네이버페이 결제 시 제외» */
#wrap .gs-shipnote.gs-pk-got .gs-pk-note { display: inline; margin-left: 4px; font-size: 12px; font-weight: 500; color: var(--gs-sub); }
