/* 굿스푼 새 스킨 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; }
/* 10/23 «결제 수단 선택»·«페이코» 앞 고른 표시: 고도몰 그림(payment_check_on/off.png · 빨간 동그라미 체크)이라 다른 체크(동의·«주문하는 분과 같아요» = 민트)와 달라 오류 표시처럼 보였다
   뜻 = 일반결제·페이코 가운데 지금 고른 쪽(order/order.html gd_settlekind_selector 가 그림 주소 _on/_off 를 바꾼다 · 필수 표시 아님) → 같은 뜻 그대로 민트 동그라미로 그린다
   _on = 민트 채움 + 흰 체크(위 input:checked 와 같은 색) · _off = 빈 동그라미 · 그림은 상자 안쪽으로 밀어 안 보이게(padding) · 누르면 바꾸는 동작(onclick)은 그대로 */
#wrap .gs-ofbox h2.order_tit img.js_payment_check_general, #wrap .gs-ofbox h2.order_tit img.js_payment_check_payco { box-sizing: content-box; width: 0 !important; height: 0 !important; padding: 9px; overflow: hidden; border: 0 solid #e2d4c4; border-radius: 50%; box-shadow: inset 0 0 0 1.5px #e2d4c4; background: #fff; font-size: 0; color: transparent; vertical-align: -4px; cursor: pointer; object-fit: none; object-position: -999px -999px; }   /* 10/23 오후 고침: 전 판(그림 칸 18 · 왼쪽 안쪽 여백 15 · 테두리 1.5)은 화면 배율 1·3 에서 테두리가 1px·1.33px 로 깎여 그림 칸이 1px 남았다 → 고도몰 빨간 그림이 오른쪽 끝에 세로 줄 1px(PC·아이폰 15·갤럭시 · SE 320 은 배율 2 라 0) · 이제 그림 칸 0×0(안쪽 여백 9px 로 18px) + 테두리 대신 안쪽 그림자 고리 = 어떤 배율·폭에서도 원래 그림이 그려질 자리가 없다 */
#wrap .gs-ofbox h2.order_tit img.js_payment_check_general[src*="_on"], #wrap .gs-ofbox h2.order_tit img.js_payment_check_payco[src*="_on"] { border-color: var(--gs-accent-ink); box-shadow: inset 0 0 0 1.5px var(--gs-accent-ink); background: var(--gs-accent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4 8-9'/%3E%3C/svg%3E") center / 13px no-repeat; }
#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 .t .gs-omenu { display: block; margin-top: 2px; font-size: 13px; color: var(--gs-sub); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }   /* 10/23 실제 주문 메뉴 한 줄(js/gs_v16_order.js mline) */
#wrap .gs-osum .t .gs-oadd { display: table; margin: 4px 0 2px; padding: 2px 9px; border-radius: 999px; background: #FDECEC; color: #D61F26; font-size: 13px; font-weight: 700; line-height: 1.5; word-break: keep-all; }   /* 10/31 0원 덤 추가상품 줄(js/gs_v16_order.js adds · 장바구니 gs-cadd 와 같은 빨간 알약) */
#wrap .gs-osum .t .gs-oadd b { font-weight: 600; color: #8f2a2e; white-space: nowrap; }
#wrap .gs-osum .t .gs-oadd i { font-style: normal; white-space: nowrap; }
#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: 12px 0 2px 20px; padding: 0 0 0 16px; }   /* 10/27 대표 «위 항목에 포함된 2가지라는 걸 알게» → 요약 아래 한 단계 들여 묶음 · 세로 선은 «없는 게 더 깔끔» 으로 뺌 */
#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: 10px 0 !important; border-bottom: 1px solid var(--gs-line); }
#wrap .gs-olines ul.my_goods > li:last-child .order-goods-layout { border-bottom: 0; }
/* 10/27 «펼치기» 상품 줄: 사진 옆에 글(전엔 사진 inline-block + 글 block 이라 글이 사진 아래로 떨어졌다 · 고도몰 table-cell 규칙은 .pay 안에서만 먹는데 줄을 .gs-olines 로 옮겨서 안 먹음) */
#wrap .gs-olines .order-goods-layout > a { display: block; }
#wrap .gs-olines .order-goods-layout > a > div { display: flex; align-items: flex-start; gap: 10px; }
#wrap .gs-olines .itemhead { float: none !important; flex: 0 0 40px; }
#wrap .gs-olines .thmb, #wrap .gs-olines .thmb_box { width: 40px !important; height: 40px !important; }
#wrap .gs-olines .thmb img { width: 40px !important; height: 40px !important; border-radius: 8px; object-fit: cover; }
#wrap .gs-olines .itembody { flex: 1 1 auto; min-width: 0; margin: 0 !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); }
/* 10/24 buyflow1024 2번 — 빈 주문서(상품 줄 0) 안내 카드 · 아래 막대 «장바구니로 가기» */
#wrap .gs-oempty { padding: 22px 4px 4px; text-align: center; }
#wrap .gs-oempty .ic { display: flex; align-items: center; justify-content: center; width: 56px; height: 56px; margin: 0 auto; border-radius: 50%; background: #fff1f1; }
#wrap .gs-oempty .ic svg { width: 28px; height: 28px; fill: none; stroke: #c92a2a; stroke-width: 2.2; stroke-linecap: round; }
#wrap .gs-oempty b { display: block; margin: 12px 0 6px; font-size: 18px; line-height: 1.4; font-weight: 800; color: var(--gs-text); }
#wrap .gs-oempty p { margin: 0 0 16px; font-size: 15px; line-height: 1.6; color: var(--gs-sub); word-break: keep-all; }
#wrap .gs-oempty .gs-btn { display: flex; align-items: center; justify-content: center; box-sizing: border-box; width: 100%; height: 52px; margin: 0; padding: 0 12px; border-radius: 16px; background: var(--gs-accent); color: var(--gs-accent-text) !important; font-size: 16px; font-weight: 800; text-decoration: none; }
/* 가입 안내(비회원 · 로그인) */
#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; }
/* 10/23 결제 시험 6번(«페이코 펼치면 신용카드·계좌 등에 선이 두 겹»): 고도몰 페이코 그림에 그려진 1px 회색 테두리를 칸 밖으로 잘라 낸다(칸 둥근 선 하나만) · 고른 칸 = 민트 테두리·연민트 면(js/gs_v16_order.js payFix sync · 그림은 _off 그대로) */
#wrap .gs-pay .pay_mth_payco .inp_rdo.payco { position: relative; padding: 0 !important; overflow: hidden; }
#wrap .gs-pay .pay_mth_payco .inp_rdo.payco img { width: calc(100% + 6px) !important; max-width: none !important; margin: -3px; }
#wrap .gs-pay .pay_mth_payco .inp_rdo.payco.gs-on { border-color: var(--gs-accent-ink); box-shadow: inset 0 0 0 1px var(--gs-accent-ink); }
#wrap .gs-pay .pay_mth_payco .inp_rdo.payco.gs-on img { opacity: .9; }
#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; }
/* 10/24 ux8 ①: 비밀번호 보기(눈) 단추 · 누름 자리 44px */
html.gs-login-ready #wrap .login .gs-pwbox { position: relative; }
html.gs-login-ready #wrap .login .gs-pwbox input { padding-right: 52px !important; }
html.gs-login-ready #wrap .login .gs-pweye { position: absolute; top: 4px; right: 4px; width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; margin: 0; padding: 0; border: 0; background: none; color: var(--gs-muted); cursor: pointer; }
html.gs-login-ready #wrap .login .gs-pweye svg { width: 22px; height: 22px; }
html.gs-login-ready #wrap .login .gs-pweye[aria-pressed="true"] { color: var(--gs-accent-ink); }
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; }
/* 10/22 점검 2번: 주문하러 온 비회원 = 로그인 단추 바로 밑 «비회원으로 주문하기»(카드 단추와 같은 모양) */
html.gs-login-ready #wrap .login .gs-gquick { display: block; width: 100%; height: 50px; margin: 10px 0 0; padding: 0; border: 0; border-radius: 12px; background: #fff; box-shadow: inset 0 0 0 1px #e2d4c4; color: var(--gs-text); font-size: 15px; font-weight: 700; cursor: pointer; }
#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; }
/* 10/24 buyflow1024 4번 — 주문하러 온 손님(html.gs-lbuy-on · js/gs_v16_order.js loginPage buyFirst): 비회원 주문 먼저 → 간편 로그인 → «아이디로 로그인» 접힌 칸
   차례는 CSS order 로만(고도몰 폼·칸은 그 자리에서 옮기거나 접기만) · 휴대폰 글자 14px 이상 */
html.gs-lbuy-on #wrap .login .login_box > .gs-lbuy { order: -5; }
html.gs-lbuy-on #wrap .login .login_box > .gs-or { order: -4; margin: 20px 0 12px; font-size: 14px; }
html.gs-lbuy-on #wrap .login .login_box > .sns_login { order: -3; }
html.gs-lbuy-on #wrap .login .login_box > .gs-lid { order: -2; }
html.gs-lbuy-on #wrap .login .login_box > form { order: -1; margin-top: 12px; }
html.gs-lbuy-on #wrap .login .login_box > .login_find:not(.gs-lnote) { order: 0; }
html.gs-lbuy-on #wrap .login .login_box > .gs-lbuy-tip { order: 4; }
html.gs-lbuy-on #wrap .login .login_box:not(.gs-lid-open) > form, html.gs-lbuy-on #wrap .login .login_box:not(.gs-lid-open) > .login_find:not(.gs-lnote) { display: none !important; }
html.gs-lbuy-on #wrap .login .login_find li a, html.gs-lbuy-on #wrap .login .login_find.gs-lnote p { font-size: 14px !important; }
#wrap .gs-lbuy h2 { margin: 0 0 4px; font-size: 20px; line-height: 1.35; font-weight: 800; letter-spacing: -0.03em; color: var(--gs-text); }
#wrap .gs-lbuy > p { margin: 0 0 16px; font-size: 15px; line-height: 1.5; color: var(--gs-sub); }
#wrap .gs-lbuy form, #wrap .gs-lbuy fieldset { margin: 0 !important; padding: 0 !important; border: 0 !important; }
html.gs-login-ready #wrap .login .gs-lbuy .member_login_order_btn { display: block; width: 100% !important; height: 56px !important; margin: 0 !important; padding: 0 12px !important; border: 0 !important; border-radius: 16px !important; background: var(--gs-accent) !important; color: var(--gs-accent-text) !important; font-size: 18px !important; font-weight: 800 !important; letter-spacing: -0.02em; cursor: pointer; }
html.gs-login-ready #wrap .login .gs-lid { display: flex; align-items: center; justify-content: space-between; width: 100%; min-height: 56px; margin: 10px 0 0; padding: 0 16px; border: 0; border-radius: 16px; background: #fff; box-shadow: inset 0 0 0 1.5px var(--gs-line); color: var(--gs-text); font-size: 16px; font-weight: 700; text-align: left; cursor: pointer; }
html.gs-login-ready #wrap .login .gs-lid svg { width: 18px; height: 18px; flex: none; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; transition: transform .2s; }
html.gs-login-ready #wrap .login .gs-lid[aria-expanded="true"] svg { transform: rotate(180deg); }
#wrap .gs-lbuy-tip { margin: 14px 0 0; font-size: 14px; line-height: 1.55; color: var(--gs-muted); text-align: center; }
#wrap .gs-gorder .gs-gproxy { display: block; width: 100%; height: 52px; margin-top: 12px; border: 0; border-radius: 16px; background: var(--gs-accent); color: var(--gs-accent-text); font-size: 16px; font-weight: 800; cursor: pointer; }
/* 10/24 buyflow1024 4번 ③ — 주문 완료(비회원) 가입 권유 카드 = 로그인 화면 가입 안내와 같은 모양 */
#wrap .gs-oend .gs-end-join { margin-top: 16px; }
html.gs-lbuy-on #wrap .gs-lnudge small, #wrap .gs-end-join small { font-size: 14px; line-height: 1.5; }
html.gs-lbuy-on #wrap .gs-lnudge .gs-btn, #wrap .gs-end-join .gs-btn { height: 40px; font-size: 14px; }

/* ═════════════ 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); }
/* [10/22 저녁 대표 승인 9번 ①] 금액 덩어리 줄바꿈 금지(«1,» / «500원» 갈림) — js/gs_v16_order.js nw() */
.gs-nw { white-space: nowrap; }
/* [10/22 저녁 대표 승인 4번] 결제 수단 — 페이코 칸 한 줄로 접기 · js/gs_v16_order.js payFix()
   [10/23 19시 대표 결정] «일반결제/에스크로결제» 고르는 줄은 처음부터 늘 보임(구매안전 서비스 표시 규정) → 그 줄 숨김(ul.gs-paymode-off)·작은 글(.gs-esc-note) 규칙 걷음 */
#wrap .gs-pay .gs-payco-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; width: 100%; box-sizing: border-box; margin: 4px 0 16px; padding: 16px; border: 1.5px solid #e2d9cd; border-radius: 16px; background: #fff; font-family: inherit; font-size: 16px; font-weight: 700; color: #2b2420; text-align: left; cursor: pointer; }
#wrap .gs-pay .gs-payco-row small { flex: 0 1 auto; font-size: 13px; font-weight: 500; color: var(--gs-muted); text-align: right; }
#wrap .gs-pay .gs-payco-row[aria-expanded="true"] { margin-bottom: 10px; border-color: var(--gs-accent-ink); }
#wrap .gs-pay .gs-payco-row.on { box-shadow: inset 0 0 0 1px var(--gs-accent-ink); background: var(--gs-tint); }
#wrap .gs-pay .order_box.gs-payco-box:not(.gs-open) { display: none !important; }
/* [10/23 밤 떠난 손님] 페이코 칸 아래 한 줄 안내(고르기 전·고른 뒤) + «접기» — js/gs_v16_order.js payFix() paycoHint */
#wrap .gs-pay .gs-payco-hint { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; margin: 8px 0 16px; padding: 10px 14px; border-radius: 12px; background: var(--gs-tint); font-size: 13px; font-weight: 500; line-height: 1.5; color: #3b332d; text-align: left; word-break: keep-all; }
#wrap .gs-pay .gs-payco-hint[hidden] { display: none; }
#wrap .gs-pay .gs-payco-hint.on { font-weight: 700; color: var(--gs-accent-ink); }
#wrap .gs-pay .gs-payco-fold { flex: 0 0 auto; margin: 0; padding: 0 2px; border: 0; background: none; font-family: inherit; font-size: 13px; font-weight: 500; line-height: 1.5; color: #6b5f55; text-decoration: underline; text-underline-offset: 2px; cursor: pointer; }
#wrap .gs-pay .gs-payco-fold[hidden] { display: none; }
/* [10/23 영수증 알약] 현금성이 아닌 결제수단(신용카드·카카오페이·토스페이·페이코 카드 등)이면 «현금영수증·세금계산서» 칸 묶음을 숨김 · 고도몰이 숨긴 현금영수증 알약 한 칸도 숨김
   js/gs_v16_order.js rcptFix() 가 class 를 붙인다 · id 2겹 = 위 «ul.pay_mth:not(…)» flex !important·«.pay_mth .inp_rdo» block !important 보다 세게 */
#wrap #gsOrder .how_to_pay .gs-rcpt-off { display: none !important; }
/* [10/22 저녁 대표 승인 2번] «하나씩 직접 확인할게요» → 내려 준 동의 칸 잠깐 표시 */
#wrap .gs-agree-hl { border-radius: 16px; box-shadow: 0 0 0 3px rgba(44, 211, 160, .55); transition: box-shadow .3s ease; }
/* [10/22 저녁 4번] 에스크로 칸: 고도몰이 «에스크로결제»를 고르면 #settlekind_escrow 에 show()(인라인 display:block)를 주는데 class «dn»(display:none !important)이 이겨
   에스크로 수단(계좌이체·가상계좌)이 안 보였다(지금 운영도 같음 · 첫 수단만 몰래 골라짐) → 고도몰이 보이라고 한 때만 보이게(고르는 것은 고도몰 그대로) */
#wrap #gsOrder .how_to_pay #settlekind_escrow.dn[style*="block"] { display: block !important; }
/* [10/23 pgback1023b ③ 휴대폰 결제창 «<»] 결제 화면에서 «새 칸»으로 열린 주문서를 표 남긴 칸으로 되감는 동안 가림(js/gs_v16_order.js pgReturnCheck · 3초 안에 안 떠나면 class 를 뗀다) */
html.gs-pg-rew :is(#contents_wrap, #gsTabbar, #gsOrderBar) { visibility: hidden !important; }
html.gs-pg-rew body::after { content: '주문서로 돌아가는 중이에요'; position: fixed; left: 0; right: 0; top: 42%; z-index: 5; text-align: center; font-size: 15px; font-weight: 600; color: var(--gs-muted, #6b5f55); pointer-events: none; }
/* 10/23 ship1023 받는 곳 아래 제주·도서산간 한 줄(js/gs_v16_order.js #gsIsland) · 지역 배송비가 매겨지면 .on(진한 글) */
#wrap .gs-island { margin: 12px 0 0; padding: 0; font-size: 13px; line-height: 1.5; color: var(--gs-sub); word-break: keep-all; }
#wrap .gs-island.on { color: var(--gs-accent-text); font-weight: 700; }

/* 10/24 ux8 ④ 주문서: «전체 동의» 맨 위·크게 · 비회원 가입 권유 = 결제 금액 상자 안 작은 한 줄(js/gs_v16_order.js) */
#wrap .gs-ofbox[data-gs-sec="order_agree"] h3.my_tit.gs-agree-all { margin: 0 0 10px !important; background: var(--gs-tint, #E8F7F1) !important; }
#wrap .gs-ofbox[data-gs-sec="order_agree"] h3.my_tit.gs-agree-all .inp_chk label { font-size: 15px !important; font-weight: 800 !important; color: var(--gs-text) !important; }
#wrap .gs-onudge.gs-onudge-mini { margin: 12px 0 0; padding: 10px 12px; gap: 10px; border-radius: 12px; background: var(--gs-band, #FFF6EC); color: var(--gs-text); }
#wrap .gs-onudge.gs-onudge-mini b { font-size: 13px; font-weight: 700; }
#wrap .gs-onudge.gs-onudge-mini small { font-size: 12px; opacity: 1; color: var(--gs-sub); }
#wrap .gs-onudge.gs-onudge-mini .gs-btn { height: 32px; padding: 0 12px; font-size: 13px; position: relative; }
#wrap .gs-onudge.gs-onudge-mini .gs-btn::after { content: ''; position: absolute; left: 50%; top: 50%; width: max(100%, 44px); height: 44px; transform: translate(-50%, -50%); }

/* ═════════════ 10/24 acct1024 비회원 주문 불가 안내(order/cert_warning · 만 14세 미만 확인) — 고도몰 기본 모양(빨간 세모 그림·12~13px 글·회색 상자·네모 단추)을 새 화면 모양으로 · 글은 그대로 ═════════════ */
#wrap .cert_warning { padding: 32px var(--gs-gutter) 40px !important; letter-spacing: -0.02em; text-align: center; }
#wrap .cert_warning .cert_warning_wrap { margin: 0 !important; padding: 76px 0 0 !important; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Ccircle cx='32' cy='32' r='32' fill='%23E6F8F2'/%3E%3Cpath d='M32 18v17' stroke='%2300785F' stroke-width='4.5' stroke-linecap='round'/%3E%3Ccircle cx='32' cy='44.5' r='3' fill='%2300785F'/%3E%3C/svg%3E") no-repeat center top / 60px 60px !important; }
#wrap .cert_warning .cert_warning_wrap strong { display: block; font-size: 18px !important; line-height: 1.45 !important; font-weight: 800 !important; color: var(--gs-text) !important; word-break: keep-all; }
#wrap .cert_warning .cert_warning_wrap p { margin: 16px 0 0 !important; padding: 14px 16px !important; border-radius: 12px; background: var(--gs-surface) !important; font-size: 13px !important; line-height: 1.6 !important; color: var(--gs-sub) !important; text-align: left; word-break: keep-all; }
#wrap .cert_warning .cert_warning_wrap p span { display: block; margin: 2px 0 0; }
#wrap .cert_warning .cert_warning_wrap p a.c_point { display: inline-flex; align-items: center; min-height: 44px; font-size: 13px !important; font-weight: 700 !important; color: var(--gs-accent-ink) !important; }
#wrap .cert_warning .cert_warning_wrap > a.ly_more_btn { display: flex !important; align-items: center; justify-content: center; width: 100% !important; height: 54px !important; margin: 22px 0 0 !important; padding: 0 16px !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; line-height: 1 !important; text-decoration: none !important; box-sizing: border-box; }

/* 10/24 ux16 ⑪ 찜에서 온 로그인 안내(js/gs_v16_order.js loginPage) — 제목 «로그인» 바로 아래 · 탭 위(탭에 붙지 않게 · 좌우 여백은 제목과 같은 줄) */
.login .gs-lhead .gs-lwish { margin: 2px var(--gs-gutter, 16px) 14px; padding: 12px 14px; border-radius: 12px; background: var(--gs-tint, #e6f8f2); }
.login .gs-lhead .gs-lwish b { display: block; font-size: 15px; font-weight: 700; line-height: 1.4; color: var(--gs-accent-ink, #00785f); }
.login .gs-lhead .gs-lwish span { display: block; margin-top: 2px; font-size: 13px; line-height: 1.45; color: var(--gs-sub, #5e4f40); }

/* [10/24 pg1024] 고도몰 «결제 진행 중» 띠 → 가운데 카드(대표 10/24 «1~6 시안» 1번 · js/gs_v16_order.js pgGate · 틀 order/pg_gate.html 은 그대로)
   뒤 = 어둡게 · 카드 = 420px 까지 · 고도몰 글(.tx 안에 결제 폼·스크립트가 있어 지우지 않고 안 보이게만) · 고도몰 단추는 자리·글만 바꿈
   🟥 display 에 !important 를 쓰지 않는다(js pgWatch·pgBackSheet 가 인라인 display:none 으로 카드를 숨긴다) */
html body #pgSettlementApplyLayer .pg_gate.gs-pgc { display: flex; align-items: center; justify-content: center; box-sizing: border-box; padding: 16px; background: rgba(36, 25, 15, .55); text-align: center; font-family: var(--gs-font); -webkit-text-size-adjust: 100%; }
html body #pgSettlementApplyLayer .gs-pgc.gs-pgc-done { z-index: 10100; }
html body #pgSettlementApplyLayer .gs-pgc .pg_buy_info { width: 100%; max-width: 420px; max-height: calc(100% - 8px); margin: 0; overflow-y: auto; box-sizing: border-box; border-radius: 24px; background: var(--gs-app, #fffcf7); box-shadow: 0 20px 60px rgba(0, 0, 0, .25); }
html body #pgSettlementApplyLayer .gs-pgc .pg_buy_info .pg_bx { padding: 32px 24px 20px; border: 0; }
html body #pgSettlementApplyLayer .gs-pgc .pg_buy_info .pg_bx > .tx { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
#pgSettlementApplyLayer .gs-pgc .gs-pgc-ring { display: block; box-sizing: border-box; width: 64px; height: 64px; margin: 0 auto 18px; border-radius: 50%; border: 5px solid var(--gs-tint, #E6F8F2); border-top-color: var(--gs-accent, #2CD3A0); animation: gsPgcSpin 1s linear infinite; }
@keyframes gsPgcSpin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { #pgSettlementApplyLayer .gs-pgc .gs-pgc-ring { animation: none; } }
#pgSettlementApplyLayer .gs-pgc h3 { margin: 0 0 10px; font-size: 20px; font-weight: 800; line-height: 1.35; letter-spacing: -.4px; color: var(--gs-text, #24190f); word-break: keep-all; }
#pgSettlementApplyLayer .gs-pgc .gs-pgc-msg { margin: 0 0 18px; font-size: 16px; line-height: 1.6; color: var(--gs-sub, #5e4f40); word-break: keep-all; }
#pgSettlementApplyLayer .gs-pgc .gs-pgc-live { display: inline-flex; align-items: center; gap: 8px; max-width: 100%; box-sizing: border-box; margin: 0 0 22px; padding: 8px 14px; border-radius: 999px; background: var(--gs-band, #EEF9F5); font-size: 14px; font-weight: 600; line-height: 1.45; color: var(--gs-accent-ink, #00785F); text-align: left; word-break: keep-all; }
#pgSettlementApplyLayer .gs-pgc .gs-pgc-live[hidden] { display: none; }
#pgSettlementApplyLayer .gs-pgc .gs-pgc-live i { flex: none; width: 8px; height: 8px; border-radius: 50%; background: var(--gs-accent, #2CD3A0); box-shadow: 0 0 0 4px rgba(44, 211, 160, .25); }
#pgSettlementApplyLayer .gs-pgc .gs-pgc-live.warn { background: #FFF3E6; color: #8A4A0B; }
#pgSettlementApplyLayer .gs-pgc .gs-pgc-live.warn i { background: #E8892F; box-shadow: 0 0 0 4px rgba(232, 137, 47, .22); }
html body #pgSettlementApplyLayer .gs-pgc .pg_buy_info .pg_bx .btn_wish_bx { padding: 0; }
html body #pgSettlementApplyLayer .gs-pgc .pg_buy_info .pg_bx .btn_wish_bx .btn_bx { display: block; margin: 0; padding: 0; list-style: none; }
html body #pgSettlementApplyLayer .gs-pgc .pg_buy_info .pg_bx .btn_wish_bx .btn_bx li { display: block; }
html body #pgSettlementApplyLayer .gs-pgc .gs-off { display: none; }
html body #pgSettlementApplyLayer .gs-pgc .gs-pgc-btn { display: flex; align-items: center; justify-content: center; width: 100%; height: 54px; margin: 10px 0 0; padding: 0 12px; box-sizing: border-box; border-radius: 16px; font-family: inherit; font-size: 18px; font-weight: 700; line-height: 1.2; letter-spacing: -.2px; text-decoration: none; cursor: pointer; }
html body #pgSettlementApplyLayer .gs-pgc .gs-pgc-btn.pri { border: 0; background: var(--gs-accent, #2CD3A0); color: var(--gs-accent-text, #053B31); }
html body #pgSettlementApplyLayer .gs-pgc .gs-pgc-btn.sec { border: 1.5px solid var(--gs-line, #ece5db); background: #fff; color: var(--gs-text, #24190f); }
html body #pgSettlementApplyLayer .gs-pgc .gs-pgc-btn[aria-busy="true"] { opacity: .85; }
html body #pgSettlementApplyLayer .gs-pgc .gs-pgc-links { display: flex; justify-content: center; flex-wrap: wrap; gap: 6px; margin: 12px 0 0; }
html body #pgSettlementApplyLayer .gs-pgc .gs-pgc-links a { display: inline-block; margin: 0; padding: 8px; border: 0; background: none; font-size: 14px; font-weight: 500; color: #73624f; text-decoration: underline; text-underline-offset: 3px; }
/* 결제가 확인됨 = 카드 안을 «확인됐어요»로 바꿈(기다림·단추 줄 숨김) */
#pgSettlementApplyLayer .gs-pgc.gs-pgc-done .gs-pgc-head, html body #pgSettlementApplyLayer .gs-pgc.gs-pgc-done .pg_buy_info .pg_bx .btn_wish_bx { display: none; }
#pgSettlementApplyLayer .gs-pgc .gs-pgc-check { display: flex; align-items: center; justify-content: center; width: 64px; height: 64px; margin: 0 auto 18px; border-radius: 50%; background: var(--gs-tint, #E6F8F2); }
#pgSettlementApplyLayer .gs-pgc .gs-pgc-check svg { width: 34px; height: 34px; fill: none; stroke: var(--gs-accent-ink, #00785F); stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }
#pgSettlementApplyLayer .gs-pgc .gs-pgc-prog { height: 6px; margin: 4px 0 8px; overflow: hidden; border-radius: 8px; background: var(--gs-line, #ece5db); }
#pgSettlementApplyLayer .gs-pgc .gs-pgc-prog i { display: block; width: 0; height: 100%; background: var(--gs-accent, #2CD3A0); animation: gsPgcProg 1.5s linear forwards; }
@keyframes gsPgcProg { to { width: 100%; } }
#pgSettlementApplyLayer .gs-pgc .gs-pgc-small { margin: 0 0 8px; font-size: 14px; color: var(--gs-muted, #7d6c5c); }
@media (max-width: 380px) { #pgSettlementApplyLayer .gs-pgc h3 { font-size: 20px; } html body #pgSettlementApplyLayer .gs-pgc .pg_buy_info .pg_bx { padding: 28px 18px 16px; } }
/* [GS 10/30 결제 승인 실패 안내] 주문서 결제 수단 칸 위 한 줄(js/gs_v16_order.js orderPage PAYFAIL) · 색 = 로그인 «돌아옴» 안내(js/gd_naver.js gs-snsback)와 같은 옅은 주황 */
#wrap .gs-payfail-note { margin: 0 0 12px; padding: 12px 14px; border-radius: 12px; background: #fff8ec; box-shadow: inset 0 0 0 1px #ecd9bd; color: var(--gs-text, #2b2420); font-size: 14px; line-height: 1.5; word-break: keep-all; }
#wrap .gs-payfail-note b { display: block; font-size: 15px; font-weight: 800; }
#wrap .gs-payfail-note span { display: block; margin-top: 2px; color: var(--gs-text-sub, #6f6253); }

/* ── 10/30 cpn1030 주문서 쿠폰 창 = 이 주문에 쓸 수 있는 쿠폰만(js/gs_v16_order.js 끝) ── */
#popupCouponApply .gs-cpt-off { display: none !important; }
#popupCouponApply .gs-cpt-none { margin: 28px 16px; padding: 28px 18px; border-radius: 16px; background: #fff; box-shadow: inset 0 0 0 1px var(--gs-line, #ECE5DB); text-align: center; word-break: keep-all; }
#popupCouponApply .gs-cpt-none b { display: block; font-size: 16px; font-weight: 700; color: var(--gs-text, #24190f); }
#popupCouponApply .gs-cpt-none small { display: block; margin-top: 6px; font-size: 13px; line-height: 1.5; color: var(--gs-sub, #73624f); }