@charset "UTF-8";
/* WEBINIDEA 테마 추가 스타일 — 그누보드 마크업 브릿지 (bootstrap.override.css 뒤 로드) */

/* 그누보드 스크린리더 전용 텍스트 숨김 (.sound_only 규칙이 기본 CSS에 있었으나 미로드) */
.sound_only,.sr-only{ position:absolute !important; left:-9999px !important; top:auto !important;
  width:1px !important; height:1px !important; overflow:hidden !important; }

/* 상품 카드 썸네일: 실제 상품 이미지가 .sl-thumb를 채우도록 */
.sl-thumb{ overflow:hidden; }
.sl-thumb > img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:1; }
.sl-thumb .sl-badge-platform,
.sl-thumb .sl-badge-corner,
.sl-thumb .sl-demo-link{ z-index:3; }
.sl-thumb .sl-thumb-label{ position:relative; z-index:2; }

/* 사이드바 스크롤 시 로고/CTA 정렬 보정 */
.sl-sidebar .sl-side-cta{ margin-top:auto; }

/* 로그인/회원 인증 카드: 셸(사이드바+상단바) 안에 임베드될 때 */
.sl-main .sl-auth-wrap,
.sl-main .sl-pf-wrap,
.sl-main .sl-mp-wrap,
.sl-main .sl-sp-wrap{ min-height:calc(100vh - 160px); background:transparent; padding:40px 20px; }

/* ===== 자동등록방지(그누보드 kcaptcha) 템플릿 톤 ===== */
fieldset#captcha.captcha{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; border:0; margin:0; padding:0; }
#captcha > label[for="captcha_key"]{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
#captcha_img{ height:46px; width:auto; border:1px solid var(--bs-line); border-radius:8px; background:var(--bs-surface); display:block; }
#captcha .captcha_box, #captcha_key{ width:130px; max-width:40vw; border:1px solid var(--bs-line); border-radius:10px;
  background:var(--bs-surface); font-size:13.5px; padding:0.6rem 0.8rem; color:var(--bs-ink); height:auto; }
#captcha_key:focus{ background:#fff; border-color:#e0cec7; box-shadow:0 0 0 3px rgba(196,71,44,.09); outline:0; }
#captcha_reload, #captcha_mp3{ border:1px solid var(--bs-line); background:var(--bs-surface); color:var(--bs-ink);
  border-radius:999px; font-size:12px; font-weight:500; padding:0.45rem 0.9rem; cursor:pointer; line-height:1.2; }
#captcha_reload:hover, #captcha_mp3:hover{ background:var(--bs-ink); color:#fff; border-color:var(--bs-ink); }
#captcha_info{ font-size:11px; color:var(--bs-muted); width:100%; margin-top:4px; }

/* ===== 사이드바: 데스크톱 고정 / 모바일 오프캔버스(햄버거) — lg(992) 기준 통일 ===== */
/* 데스크톱(≥992): 오프캔버스가 아닌 정적 사이드바로 */
@media (min-width:992px){
  .sl-sidebar.offcanvas{ position:sticky; top:0; height:100vh; width:var(--bs-sidebar-w);
    transform:none !important; visibility:visible !important; z-index:auto;
    border-right:1px solid var(--bs-border-color); display:flex !important; }
  .sl-sidebar .wb-oc-header{ display:none; }        /* 데스크톱에선 닫기버튼 숨김 */
  .sl-mobile-only{ display:none !important; }        /* 데스크톱 상단바 모바일 로고 숨김 */
}
/* 모바일(<992): 진짜 오프캔버스로 동작 (override 의 sticky/display:none 무력화) */
@media (max-width:991.98px){
  .sl-sidebar.offcanvas{ position:fixed; display:flex !important; height:100%;
    width:var(--bs-sidebar-w); max-width:82vw; border-right:0; }
}

/* ===== 상품목록 페이지(list.php) 크롬 → 템플릿 톤 ===== */
#sct_location{ display:flex; align-items:center; gap:8px; font-size:12px; color:var(--bs-muted); margin-bottom:20px; flex-wrap:wrap; }
#sct_location a{ color:var(--bs-ink-2); }
#sct_location .go_home{ font-size:15px; }
#sct_location .dividing-line{ color:var(--bs-muted-2); font-size:11px; }
#sct_location select,#sct_location .shop_hover_selectbox{ border:1px solid var(--bs-line); border-radius:8px;
  padding:6px 26px 6px 10px; font-size:12.5px; font-weight:600; color:var(--bs-ink); background-color:#fff; }

#sct_hhtml{ display:none; }
#sct_sortlst{ display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap;
  padding-bottom:14px; margin-bottom:26px; border-bottom:1px solid var(--bs-line); }
#sct_sort{ margin:0; }
#sct_sort h2{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
#ssch_sort{ display:flex; flex-wrap:wrap; gap:6px; list-style:none; margin:0; padding:0; }
#ssch_sort li{ margin:0; }
#ssch_sort a{ display:inline-block; border:1px solid var(--bs-line); background:#fff; color:var(--bs-ink-2);
  border-radius:999px; padding:7px 14px; font-size:12.5px; font-weight:500; white-space:nowrap; }
#ssch_sort a:hover{ border-color:#d8d5cf; color:var(--bs-ink); }
#ssch_sort .selected a,#ssch_sort a.selected{ background:var(--bs-ink); border-color:var(--bs-ink); color:#fff; font-weight:600; }

#sct_lst{ display:inline-flex; gap:4px; list-style:none; margin:0; padding:4px;
  border:1px solid var(--bs-line); border-radius:10px; }
#sct_lst li{ margin:0; }
#sct_lst .sct_lst_view{ width:34px; height:30px; border:0; background:transparent; border-radius:7px;
  color:var(--bs-muted); cursor:pointer; display:grid; place-items:center; }
#sct_lst .sct_lst_view.on,#sct_lst .sct_lst_view:hover{ background:var(--bs-surface); color:var(--bs-ink); }

/* 상품 카드 썸네일 이미지 채우기 */
.sl-pd-thumb{ overflow:hidden; }
.sl-pd-thumb img{ width:100%; height:100%; object-fit:cover; }

/* 페이지네이션 */
.pg_wrap{ display:flex; justify-content:center; padding:40px 0 10px; }
.pg{ display:inline-flex; gap:6px; align-items:center; }
.pg_page,.pg_current,.pg_start,.pg_end,.pg_prev,.pg_next{ min-width:40px; height:40px; padding:0 6px;
  display:grid; place-items:center; border:1px solid var(--bs-line); border-radius:10px; background:#fff;
  color:var(--bs-ink-2); font-weight:600; font-size:13px; }
.pg_current{ background:var(--bs-ink); border-color:var(--bs-ink); color:#fff; }
.pg a:hover{ border-color:var(--bs-ink); color:var(--bs-ink); }

/* 리스트뷰 토글: <576px 은 갤러리 카드 그대로(이미지 풀폭), ≥576px 만 가로형 카드 */
#wb-products.wb-view-list > .col{ flex:0 0 100% !important; max-width:100% !important; }
@media (min-width:576px){
  #wb-products.wb-view-list .sl-pd{ display:grid; grid-template-columns:220px 1fr; align-items:stretch; padding:14px; gap:18px; }
  #wb-products.wb-view-list .sl-pd-thumb{ border-radius:12px; overflow:hidden; aspect-ratio:auto !important; height:100%; min-height:150px; }
  #wb-products.wb-view-list .sl-pd > .p-3{ padding:0 !important; }
}

/* ============================================================
   상품상세(shop/item.php) — 영카트 마크업 → 템플릿 톤 브릿지
   ============================================================ */
#sit_ov_from{ margin:0; }

/* 갤러리: 큰 이미지 채우기 */
#sit_pvi .sl-gal-main img{ width:100%; height:100%; object-fit:cover; }
.sl-gal-thumbs{ flex-wrap:wrap; }

/* 우측 구매정보 컬럼 정렬 보정 */
#sit_ov > h1#sit_title{ margin-top:0; }

/* ── 선택/추가 옵션 셀렉트 (get_item_options/get_item_supply, div 모드) ── */
.sit_option .get_item_options,
.sit_option .get_item_supply{ display:grid; grid-template-columns:64px 1fr; align-items:center; gap:10px; }
.sit_option .get_item_options + .get_item_options,
.sit_option .get_item_supply + .get_item_supply{ margin-top:8px; }
.sit_option label,
.sit_option .label-title{ font-size:12px; color:var(--bs-ink-2); margin:0; font-weight:500; }
.sit_option .get_item_options > span,
.sit_option .get_item_supply > span{ display:block; min-width:0; }
select.it_option, select.it_supply{
  width:100%; border:1px solid var(--bs-line); border-radius:9px; background-color:var(--bs-surface);
  font-size:12.5px; color:var(--bs-ink); line-height:1.4; padding:0.55rem 2rem 0.55rem 0.75rem;
  appearance:none; -webkit-appearance:none; -moz-appearance:none; cursor:pointer;
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%238b8378' stroke-width='1.6' stroke-linecap='round'%3E%3Cpath d='M4 6l4 4 4-4'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 0.6rem center; background-size:14px; }
select.it_option:focus, select.it_supply:focus{
  background-color:#fff; border-color:#e0cec7; box-shadow:0 0 0 3px rgba(196,71,44,.09); outline:0; }
/* 비활성 셀렉트: 템플릿과 동일하게 배경 유지, 텍스트만 흐림(어둡게/페이드 X) */
select.it_option[disabled], select.it_supply[disabled]{ background-color:var(--bs-surface); color:var(--bs-muted-2); cursor:not-allowed; opacity:1; }

/* ── 선택된 옵션 리스트 (#sit_opt_added .sit_opt_list) → sl-picked-item 톤 ── */
#sit_opt_added{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px; }
#sit_opt_added .sit_opt_list,
#sit_opt_added .sit_spl_list{
  display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap;
  background:#fff; border:1px solid var(--bs-line); border-radius:11px; padding:11px 13px; margin:0; }
#sit_opt_added .opt_name{ flex:1 1 auto; min-width:120px; }
#sit_opt_added .sit_opt_subj{ font-size:12px; font-weight:600; color:var(--bs-ink); line-height:1.45; }
#sit_opt_added .opt_count{ display:flex; align-items:center; }

/* 수량 스테퍼 (minus/num/plus 3개 연결) */
#sit_opt_added .sit_qty_minus,
#sit_opt_added .sit_qty_plus{
  width:30px; height:30px; border:1px solid var(--bs-line); background:#fff; color:var(--bs-ink-2);
  display:flex; align-items:center; justify-content:center; cursor:pointer; font-size:13px; padding:0; }
#sit_opt_added .sit_qty_minus{ border-radius:999px 0 0 999px; border-right:0; }
#sit_opt_added .sit_qty_plus{ border-radius:0 999px 999px 0; border-left:0; }
#sit_opt_added .sit_qty_minus:hover,
#sit_opt_added .sit_qty_plus:hover{ color:var(--bs-brand); }
#sit_opt_added .num_input{
  width:38px; height:30px; border:1px solid var(--bs-line); border-left:0; border-right:0; text-align:center;
  font-family:"Poppins",sans-serif; font-size:12.5px; font-weight:600; color:var(--bs-ink); background:#fff; outline:none; padding:0; }
#sit_opt_added .sit_opt_prc{
  font-family:"Poppins",sans-serif; font-size:12px; font-weight:600; color:var(--bs-ink-2);
  margin:0 2px 0 12px; min-width:56px; text-align:right; }
#sit_opt_added .sit_opt_del{
  border:0; background:transparent; color:var(--bs-muted-2); font-size:14px; line-height:1; cursor:pointer; padding:2px 4px; margin-left:2px; }
#sit_opt_added .sit_opt_del:hover{ color:var(--bs-brand); }

/* ── 총 금액 (#sit_tot_price) — price_calculate 가 채움 ── */
#sit_tot_price{ display:flex; align-items:baseline; justify-content:flex-start; gap:6px;
  padding:14px 0; border-top:1px solid var(--bs-line); border-bottom:1px solid var(--bs-line); }
#sit_tot_price:empty{ display:none; }
#sit_tot_price span{ font-size:13px; color:var(--bs-ink-2); }
#sit_tot_price strong{ margin-left:auto; font-family:"Poppins",sans-serif; font-size:24px;
  font-weight:600; letter-spacing:-.03em; color:var(--bs-brand); }

/* 품절/판매중지 알림 톤 */
#sit_ov_soldout{ margin-bottom:12px; }

/* SNS 공유 링크 (그누보드 기본 $sns_share_links) 최소 정렬 */
#sit_btn_opt .sns_area,
#sit_btn_opt a{ display:inline-flex; align-items:center; }

/* 추천메일 버튼: 색상변형 클래스 없어 hover 시 흰글자만 → 배경 지정(아이콘 사라짐 방지) */
#sit_btn_rec:hover{ background:var(--bs-ink); border-color:var(--bs-ink); color:#fff; }

/* 링크복사 버튼: 복사됨 툴팁 (상품목록·상품상세 공통) */
.sl-share-copy{ position:relative; }
.sl-share-copy.copied::after{
  content:"복사됨!"; position:absolute; bottom:calc(100% + 7px); left:50%; transform:translateX(-50%);
  background:var(--bs-ink); color:#fff; font-size:10.5px; font-weight:600; line-height:1;
  padding:5px 9px; border-radius:7px; white-space:nowrap; pointer-events:none; z-index:20;
  box-shadow:0 4px 12px rgba(20,19,15,.18); }
.sl-share-copy.copied::before{
  content:""; position:absolute; bottom:calc(100% + 2px); left:50%; transform:translateX(-50%);
  border:5px solid transparent; border-top-color:var(--bs-ink); pointer-events:none; z-index:20; }

/* 옵션 미선택 시 구매바 클릭 → 옵션영역 강조 플래시 */
@keyframes wbFlash{ 0%,100%{ box-shadow:0 0 0 0 rgba(196,71,44,0); } 30%{ box-shadow:0 0 0 4px rgba(196,71,44,.22); } }
.wb-flash{ animation:wbFlash .9s ease; border-radius:14px; }

/* 스티키 구매바: 셸 사이드바 폭 고려하여 콘텐츠 안에서 sticky */
.sl-buybar .min-w-0{ min-width:0; }

/* ── 탭 안 사용후기/문의 ── */
#sit_info #itemuse, #sit_info #itemqa{ font-size:13px; color:var(--bs-ink-2); }
#sit_info #itemuse h2, #sit_info #itemqa h2{ display:none; }
/* 후기 요약 카드 안 여백 */
#sit_use_list .sl-rv-summary .btn{ padding:0.5rem 1rem; }
/* 후기 본문 이미지 반응형 */
.sl-rv-body img{ max-width:100%; height:auto; border-radius:8px; }

/* 후기/문의 이미지 타일(본문 위) — 클릭 시 크게보기 */
.sl-rv-shots{ display:flex; flex-wrap:wrap; gap:8px; margin:12px 0; }
.sl-rv-shot{ width:72px; height:72px; border-radius:10px; overflow:hidden; border:1px solid var(--bs-line);
  padding:0; background:#fff; cursor:zoom-in; flex-shrink:0; position:relative; }
.sl-rv-shot img{ width:100%; height:100%; object-fit:cover; display:block; }
.sl-rv-shot::after{ content:"\F4A0"; font-family:"bootstrap-icons"; position:absolute; right:4px; bottom:3px;
  font-size:11px; color:#fff; text-shadow:0 1px 3px rgba(0,0,0,.5); opacity:0; transition:opacity .12s; }
.sl-rv-shot:hover::after{ opacity:.95; }
.sl-rv-shot:hover{ border-color:var(--bs-brand); }

/* ============================================================
   주문서(orderform.sub.php) — 영카트 마크업 → 템플릿 톤 (.wb-order 스코프)
   결제/포인트/쿠폰/JS/PG include는 원본 그대로, CSS로만 리스타일
   ============================================================ */
/* 2단 레이아웃: 좌(주문상품+폼+결제수단) / 우(합계+버튼, sticky) */
.wb-order{ display:block; }
.wb-order > .sod_left{ display:block; }
.wb-order > .sod_right{ display:flex; flex-direction:column; }
/* 새 레이아웃: Bootstrap .row(.sl-col-l/.sl-col-r)가 2단 처리 → .wb-order 는 항상 block.
   (옛 .wb-order 그리드 minmax(0,1fr) 372px 제거 — 우측 372px 빈칸 발생 원인) */
/* 우측 컨테이너: 전체주문정보 → 결제수단 → 쿠폰 → 약관 → 버튼 */
.wb-order > .sod_right > *{ order:9; }
.wb-order > .sod_right > #sod_bsk_tot{ order:1; }
.wb-order > .sod_right > #wb_pay_body{ order:2; }
.wb-order > .sod_right > .wb-coupon{ order:3; }
.wb-order > .sod_right > .wb-agree{ order:4; }
.wb-order > .sod_right > #display_pay_button,
.wb-order > .sod_right > .btn_confirm{ order:5; }
.wb-order > .sod_right > #sod_frm_pay{ order:8; }  /* 결제수단 빠진 뒤 숨김 */
/* 우측 결제수단 카드: 2열 */
.wb-order #wb_pay_body #sod_frm_paysel{ grid-template-columns:1fr 1fr; }
.wb-order #wb_pay_body #od_pay_sl{ padding:0; }
.wb-order #wb_pay_body .od_pay_buttons_el > h3{ display:none; }  /* 카드 헤더와 중복 제거 */
/* 무통장 계좌 안내 (박스형) — #sod_frm_paysel 그리드 안에 있으므로 전체폭 span */
.wb-order #wb_pay_body #settle_bank,
.wb-order #wb_pay_body #sod_frm_paysel .sod_frm_point{ grid-column:1 / -1; }
.wb-order #wb_pay_body #settle_bank{ margin-top:16px; background:var(--bs-surface); border:1px solid var(--bs-line);
  border-radius:12px; padding:14px 16px; font-size:12.5px; color:var(--bs-ink); line-height:1.75;
  word-break:keep-all; overflow-wrap:anywhere; }
.wb-order #wb_pay_body #settle_bank label[for=od_deposit_name]{ display:block; margin:12px 0 6px; font-size:12px; font-weight:600; color:var(--bs-ink-2); }
.wb-order #wb_pay_body #settle_bank input[type=text],
.wb-order #wb_pay_body #settle_bank select{ display:block; width:100%; box-sizing:border-box; margin:0;
  border:1px solid var(--bs-line); border-radius:10px; background:#fff; font-size:13px; padding:0.55rem 0.8rem; color:var(--bs-ink); }
.wb-order #wb_pay_body #settle_bank br{ display:none; }

/* 결제 동의 체크 (템플릿 우측) */
.wb-order .wb-agree{ display:flex; align-items:flex-start; gap:9px; margin:14px 2px 4px; cursor:pointer; }
.wb-order .wb-agree .form-check-input{ margin-top:2px; flex-shrink:0; width:1.05rem; height:1.05rem; }
.wb-order .wb-agree > span{ font-size:12px; color:var(--bs-ink-2); line-height:1.6; }
.wb-order .wb-agree em{ display:block; font-style:normal; font-size:11px; color:var(--bs-muted); margin-top:3px; }
/* 요약 라벨 톤 */
.wb-order #sod_bsk_tot .wb-free{ font-style:normal; font-weight:600; color:var(--bs-ink); }
.wb-order #sod_bsk_tot .wb-point{ color:var(--bs-brand) !important; }
/* 차감 항목(쿠폰할인·포인트사용) 빨간색 */
.wb-order #sod_bsk_tot .sod_bsk_coupon strong,
.wb-order #sod_bsk_tot .sod_bsk_usepoint strong{ color:#e03131 !important; }
.wb-order #sod_bsk_tot .wb-addcost-note{ font-style:normal; color:var(--bs-muted); font-size:11px; font-weight:400; }
/* 전체 주문 정보 카드 헤더 */
.wb-order #sod_bsk_tot .wb-sum-head{ font-size:15px; font-weight:600; color:var(--bs-ink); padding:15px 20px; border-bottom:1px solid var(--bs-line-2); }
/* 쿠폰 적용 */
.wb-order .wb-coupon{ border:1px solid var(--bs-line); border-radius:16px; padding:16px 18px; margin-bottom:16px; }
.wb-order .wb-coupon .wb-flabel{ font-size:12px; font-weight:600; color:var(--bs-ink-2); margin-bottom:8px; display:block; }
.wb-order .wb-coupon .form-select{ width:100%; border:1px solid var(--bs-line); border-radius:10px; background:var(--bs-surface);
  font-size:13px; padding:0.62rem 0.85rem; color:var(--bs-ink); }
.wb-order .wb-coupon .form-select:focus{ background:#fff; border-color:#e0cec7; box-shadow:0 0 0 3px rgba(196,71,44,.09); }
/* 받으시는 분: 배송지선택 라디오 카드 */
.wb-order .order_choice_place input[type=radio], .wb-order .order_choice_place input[type=checkbox]{ position:absolute; opacity:0; width:0; height:0; }
.wb-order .order_choice_place label{ display:inline-flex; align-items:center; border:1px solid var(--bs-line); border-radius:10px;
  padding:12px 16px 12px 38px; font-size:12.5px; cursor:pointer; margin:0; position:relative; color:var(--bs-ink-2); background:#fff; }
.wb-order .order_choice_place label::before{ content:""; position:absolute; left:15px; top:50%; margin-top:-8px; width:16px; height:16px;
  border-radius:50%; border:1.5px solid var(--bs-muted-2); }
.wb-order .order_choice_place input:checked + label{ border-color:var(--bs-brand); background:var(--bs-brand-soft); font-weight:600; color:var(--bs-ink); }
.wb-order .order_choice_place input:checked + label::before{ border-color:var(--bs-brand); border-width:5px; }
/* 배송지 안내(주문자와 동일 시) */
.wb-order .wb-taker-note{ font-size:12px; color:var(--bs-ink-3); background:var(--bs-surface); border-radius:10px;
  padding:12px 14px; margin-top:14px; line-height:1.7; }

/* 섹션 카드 공통 (번호 배지 헤더) */
.wb-order section{ border:1px solid var(--bs-line); border-radius:16px; margin-bottom:16px; overflow:hidden; background:#fff; }
.wb-order section > h2{ display:flex; align-items:center; gap:10px; font-size:15px; font-weight:600; letter-spacing:-.01em;
  color:var(--bs-ink); padding:15px 20px; margin:0; border-bottom:1px solid var(--bs-line-2); }
.wb-order .wb-od-num{ font-family:"Poppins",sans-serif; font-size:10px; font-weight:600; color:var(--bs-brand);
  background:#fdeee8; border:1px solid #f4d8cd; border-radius:5px; padding:3px 7px; }
.wb-order .wb-od-count{ margin-left:auto; font-size:11px; font-weight:400; color:var(--bs-muted); }
.wb-order .sec_body{ padding:20px; }

/* 주문상품 목록 */
.wb-order .od_prd_list{ border:1px solid var(--bs-line); border-radius:16px; overflow:hidden; margin-bottom:16px; }
.wb-order .od_prd_list > table{ overflow-x:auto; }
.wb-order .wb-od-listhead{ display:flex; align-items:center; gap:10px; font-size:15px; font-weight:600;
  color:var(--bs-ink); padding:15px 20px; border-bottom:1px solid var(--bs-line-2); }
/* JS로 좌측 이동된 결제수단 섹션 */
.wb-order #wb_pay_body .sec_body{ padding:20px; }
.wb-order #sod_list{ width:100%; border-collapse:collapse; }
.wb-order #sod_list thead th{ background:var(--bs-surface); font-size:11.5px; font-weight:600; color:var(--bs-ink-2);
  padding:11px 14px; text-align:center; border-bottom:1px solid var(--bs-line); white-space:nowrap; }
.wb-order #sod_list thead th:first-child{ text-align:left; }
.wb-order #sod_list td{ padding:14px; border-bottom:1px solid var(--bs-line-2); font-size:12.5px; text-align:center;
  vertical-align:middle; font-family:"Poppins","IBM Plex Sans KR",sans-serif; font-weight:600; }
.wb-order #sod_list tr:last-child td{ border-bottom:0; }
.wb-order #sod_list .td_prd{ text-align:left; }
.wb-order .td_prd{ display:flex; align-items:center; gap:12px; }
.wb-order .sod_img img{ width:60px; height:60px; border-radius:10px; object-fit:cover; border:1px solid var(--bs-line); flex-shrink:0; }
.wb-order .sod_name{ min-width:0; font-family:"IBM Plex Sans KR",sans-serif; font-weight:400; }
.wb-order .sod_name b{ font-size:13px; font-weight:600; color:var(--bs-ink); }
.wb-order .sod_opt{ margin-top:6px; }
.wb-order .sod_opt ul{ list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:5px; }
.wb-order .sod_opt li{ font-size:11px; color:var(--bs-ink-2); background:var(--bs-surface); border:1px solid var(--bs-line);
  border-radius:6px; padding:3px 8px; }
.wb-order .cp_btn{ display:inline-block; margin-top:8px; border:1px solid var(--bs-line); background:var(--bs-surface);
  color:var(--bs-ink-2); border-radius:999px; font-size:11px; font-weight:500; padding:4px 10px; cursor:pointer; }
.wb-order .cp_btn:hover{ border-color:var(--bs-brand); color:var(--bs-brand); }
.wb-order .td_dvr{ color:var(--bs-brand); }

/* BS5 폼 행/열 (주문자/배송지) */
.wb-order .wb-frow{ display:flex; flex-wrap:wrap; gap:14px; }
.wb-order .wb-frow + .wb-frow{ margin-top:16px; }
.wb-order .wb-fcol{ flex:1 1 0; min-width:150px; display:flex; flex-direction:column; }
.wb-order .wb-fcol-full{ flex:1 1 100%; }
.wb-order .wb-flabel{ font-size:12px; font-weight:600; color:var(--bs-ink-2); margin-bottom:6px; }
.wb-order .wb-req{ color:var(--bs-brand); font-weight:600; }
.wb-order .wb-fhint{ font-size:11px; color:var(--bs-muted); margin-top:5px; line-height:1.6; }
.wb-order .wb-addr-zip{ display:flex; gap:8px; margin-bottom:8px; }
.wb-order .wb-addr-zip input{ max-width:170px; }
.wb-order .frm_input{ width:100%; border:1px solid var(--bs-line); border-radius:10px; background:var(--bs-surface);
  font-size:13px; padding:0.62rem 0.85rem; color:var(--bs-ink); line-height:1.4; }
.wb-order .frm_input:focus{ background:#fff; border-color:#e0cec7; box-shadow:0 0 0 3px rgba(196,71,44,.09); outline:0; }
.wb-order .frm_input::placeholder{ color:#b3b1ac; }
.wb-order .frm_address{ margin-top:8px; }
.wb-order textarea#od_memo{ width:100%; min-height:76px; border:1px solid var(--bs-line); border-radius:10px;
  background:var(--bs-surface); font-size:13px; padding:0.62rem 0.85rem; color:var(--bs-ink); resize:vertical; }
.wb-order textarea#od_memo:focus{ background:#fff; border-color:#e0cec7; box-shadow:0 0 0 3px rgba(196,71,44,.09); outline:0; }
.wb-order .btn_address, .wb-order .btn_frmline{ display:inline-block; flex-shrink:0; border:1px solid var(--bs-line);
  background:var(--bs-surface); color:var(--bs-ink); border-radius:10px; font-size:12px; font-weight:500;
  padding:0.62rem 0.9rem; cursor:pointer; line-height:1.4; white-space:nowrap; text-decoration:none; }
.wb-order .btn_address:hover, .wb-order .btn_frmline:hover{ background:var(--bs-ink); color:#fff; border-color:var(--bs-ink); }
/* 배송지 선택 라디오 */
.wb-order .order_choice_place{ display:flex; flex-wrap:wrap; align-items:center; gap:10px 16px; font-size:12.5px; }
.wb-order .order_choice_place label{ margin:0 4px 0 3px; color:var(--bs-ink-2); cursor:pointer; }

/* 합계(요약) */
.wb-order #sod_bsk_tot{ border:1px solid var(--bs-line); border-radius:16px; overflow:hidden; margin-bottom:16px; }
.wb-order #sod_bsk_tot ul{ list-style:none; margin:0; padding:0; }
.wb-order #sod_bsk_tot li{ display:flex; align-items:center; gap:5px;
  padding:13px 20px; font-size:12.5px; border-bottom:1px solid var(--bs-line-2); color:var(--bs-ink-2); }
.wb-order #sod_bsk_tot li > span:first-child{ margin-right:auto; }  /* 라벨만 좌측, 값+원 우측 */
.wb-order #sod_bsk_tot li strong{ font-family:"Poppins",sans-serif; font-weight:600; color:var(--bs-ink); }
.wb-order #sod_bsk_tot .wb-addcost-note{ font-style:normal; color:var(--bs-muted); font-size:11px; }
.wb-order #sod_bsk_tot .sod_bsk_cnt{ background:var(--bs-brand-soft); border-bottom:0; padding:16px 20px; }
.wb-order #sod_bsk_tot .sod_bsk_cnt span{ font-weight:600; color:var(--bs-ink); }
.wb-order #sod_bsk_tot .sod_bsk_cnt strong{ color:var(--bs-brand); font-size:20px; }

/* 결제정보 섹션 */
.wb-order #sod_frm_pay .pay_tbl{ display:none; }              /* 쿠폰 할인행 있을 때만 노출 */
.wb-order #sod_frm_pay .pay_tbl:has(tr){ display:block; padding:16px 20px 0; }
.wb-order .pay_tbl table{ width:100%; }
.wb-order .pay_tbl th{ text-align:left; font-size:12px; font-weight:500; color:var(--bs-ink-2); padding:7px 0; white-space:nowrap; }
.wb-order .pay_tbl td{ text-align:right; font-size:12.5px; padding:7px 0; }
.wb-order .pay_tbl td strong{ font-family:"Poppins",sans-serif; }
.wb-order #od_tot_price{ display:none; }                       /* 합계에 총계 있으므로 중복 숨김 */
.wb-order #od_pay_sl{ padding:20px; }
.wb-order .od_pay_buttons_el > h3{ font-size:14px; font-weight:600; color:var(--bs-ink); margin:0 0 14px; }
.wb-order #sod_frm_pt_alert{ font-size:11.5px; color:var(--bs-ink-3); background:var(--bs-surface); border-radius:10px; padding:11px 13px; margin:0 0 14px; line-height:1.7; }

/* 결제수단 라디오 → 옵션 카드 (넉넉하게) */
.wb-order #sod_frm_paysel{ border:0; margin:0; padding:0; min-inline-size:auto;
  display:grid; grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); gap:9px; }
.wb-order #sod_frm_paysel legend{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); }
.wb-order #sod_frm_paysel input[type=radio]{ position:absolute; opacity:0; width:0; height:0; }
.wb-order #sod_frm_paysel label.lb_icon{ display:flex; align-items:center; justify-content:flex-start; gap:10px; text-align:left;
  border:1px solid var(--bs-line); border-radius:12px; padding:14px 16px; font-size:13.5px; font-weight:500;
  color:var(--bs-ink-2); background:#fff; cursor:pointer; line-height:1.35; min-height:52px; }
.wb-order #sod_frm_paysel label.lb_icon::before{ content:""; width:17px; height:17px; border-radius:50%;
  border:1.5px solid var(--bs-muted-2); flex-shrink:0; transition:all .12s; }
.wb-order #sod_frm_paysel label.lb_icon:hover{ border-color:#d8d5cf; }
.wb-order #sod_frm_paysel input[type=radio]:checked + label.lb_icon{ border-color:var(--bs-brand);
  background:var(--bs-brand-soft); color:var(--bs-ink); font-weight:600; }
.wb-order #sod_frm_paysel input[type=radio]:checked + label.lb_icon::before{ border-color:var(--bs-brand);
  border-width:5px; }
/* 포인트 사용 */
.wb-order .sod_frm_point{ margin-top:16px; border-top:1px solid var(--bs-line-2); padding-top:16px; }
.wb-order .sod_frm_point label{ display:block; font-size:12px; font-weight:600; color:var(--bs-ink-2); margin-bottom:6px; }
.wb-order .sod_frm_point input[type=text]{ border:1px solid var(--bs-line); border-radius:10px; background:var(--bs-surface);
  font-size:13px; padding:0.55rem 0.8rem; width:130px; }
.wb-order #sod_frm_pt{ display:flex; flex-wrap:wrap; gap:6px 18px; margin-top:8px; font-size:11.5px; color:var(--bs-muted); }
.wb-order #sod_frm_pt strong{ color:var(--bs-ink-2); margin-right:5px; }
.wb-order #settle_bank{ margin-top:14px; padding-top:14px; border-top:1px solid var(--bs-line-2); font-size:12.5px; }
.wb-order #settle_bank select, .wb-order #settle_bank input[type=text]{ border:1px solid var(--bs-line);
  border-radius:10px; background:var(--bs-surface); font-size:13px; padding:0.55rem 0.8rem; margin:4px 0; max-width:100%; }
.wb-order #settle_bank label[for=od_deposit_name]{ display:inline-block; margin:8px 6px 0 0; font-weight:600; color:var(--bs-ink-2); }

/* 주문 버튼 (kcp/orderform.3.php: .btn_confirm > .btn_submit 주문하기 + .btn01 취소) */
.wb-order #display_pay_button.btn_confirm{ display:flex; flex-direction:column; gap:8px; margin-top:4px; }
.wb-order .btn_confirm .btn_submit{ width:100%; border:1px solid var(--bs-brand); background:var(--bs-brand);
  color:#fff; font-weight:600; font-size:14px; border-radius:999px; padding:0.95rem 1rem; cursor:pointer; }
.wb-order .btn_confirm .btn_submit:hover{ background:#ad3d25; border-color:#ad3d25; }
.wb-order .btn_confirm .btn_submit:disabled{ opacity:.45; cursor:not-allowed; }
.wb-order .btn_confirm .btn01{ width:100%; text-align:center; border:1px solid #e2e0dc; background:#fff;
  color:var(--bs-ink); font-weight:600; font-size:14px; border-radius:999px; padding:0.95rem 1rem; text-decoration:none; }
.wb-order .btn_confirm .btn01:hover{ background:var(--bs-surface); border-color:#d8d5cf; }
.wb-order #display_pay_process{ text-align:center; padding:16px; font-size:13px; color:var(--bs-ink-2); }

/* ── 디지털상품: 배송 주소/배송지 숨김 (배송 필요해지면 이 블록만 삭제) ── */
.wb-order .wb-del-hide{ display:none !important; }
.wb-order #wb_delivery_hidden{ display:none !important; }

/* ── 주문서 모바일: 주문상품 표 → 카드형 리플로우 ── */
@media (max-width:767.98px){
  .wb-order .od_prd_list > table{ overflow-x:visible; }
  .wb-order #sod_list thead{ display:none; }
  .wb-order #sod_list, .wb-order #sod_list tbody{ display:block; }
  .wb-order #sod_list tr{ display:flex; flex-wrap:wrap; align-items:center; gap:8px 16px;
    padding:14px 16px; border-bottom:1px solid var(--bs-line-2); }
  .wb-order #sod_list tr:last-child{ border-bottom:0; }
  .wb-order #sod_list td{ display:flex; align-items:center; gap:5px; border:0; padding:0;
    text-align:left; font-size:12px; }
  .wb-order #sod_list td.td_prd{ flex:1 1 100%; }
  .wb-order #sod_list td.td_num::before   { content:"수량"; }
  .wb-order #sod_list td.td_dvr::before   { content:"배송비"; }
  .wb-order #sod_list tr td:nth-child(3)::before{ content:"판매가"; }
  .wb-order #sod_list tr td:nth-child(4)::before{ content:"소계"; }
  .wb-order #sod_list tr td:nth-child(5)::before{ content:"포인트"; }
  .wb-order #sod_list td::before{ color:var(--bs-muted); font-weight:400; font-size:11px;
    font-family:"IBM Plex Sans KR",sans-serif; }
  .wb-order #sod_list td.td_prd::before{ content:none; }
  /* 상품명 셀: 썸네일 + 이름/옵션 정상 배치 */
  .wb-order .sod_name{ flex:1; }
  .wb-order .sod_name b{ display:block; word-break:keep-all; }
}

/* ============================================================
   장바구니 옵션수정 모달 (cartoption.php ajax) — sl-modal 톤
   내부 .get_item_options/#sit_opt_added/#sit_tot_price 는 상품상세 글루 재사용
   ============================================================ */
.mod_option_bg{ position:fixed; inset:0; z-index:1049; background:rgba(20,19,15,.42); backdrop-filter:blur(3px); }
#mod_option_frm{ position:fixed; z-index:1050; top:50%; left:50%; transform:translate(-50%,-50%);
  width:calc(100% - 40px); max-width:480px; max-height:88vh; overflow-y:auto; background:#fff;
  border:1px solid var(--bs-line); border-radius:18px; box-shadow:0 24px 60px rgba(20,19,15,.18); padding:22px; }
#mod_option_frm > h2{ font-size:15px; font-weight:600; letter-spacing:-.01em; margin:0 0 18px; color:var(--bs-ink); }
#mod_option_frm .option_wr{ border:1px solid var(--bs-line); border-radius:14px; padding:16px; margin-bottom:12px; }
#mod_option_frm .option_wr h3{ font-size:12px; font-weight:600; color:var(--bs-ink); margin:0 0 12px; }
#mod_option_frm #sit_sel_option{ background:var(--bs-surface); border:1px solid var(--bs-line);
  border-radius:14px; padding:16px; margin-bottom:14px; }
#mod_option_frm #sit_sel_option > h3{ font-size:12px; font-weight:600; color:var(--bs-ink); margin:0 0 12px; }
#mod_option_frm #sit_tot_price{ margin-bottom:16px; }
#mod_option_frm .btn_confirm{ display:flex; align-items:center; gap:10px; }
#mod_option_frm .btn_submit,
#mod_option_frm .btn_close{ font-weight:600; font-size:14px; border-radius:999px; padding:0.7rem 1.3rem;
  cursor:pointer; line-height:1.2; }
#mod_option_frm .btn_submit{ flex:1 1 auto; border:1px solid var(--bs-brand); background:var(--bs-brand); color:#fff; } /* 확인 = 왼쪽 */
#mod_option_frm .btn_submit:hover{ background:#ad3d25; border-color:#ad3d25; }
#mod_option_frm .btn_close{ flex-shrink:0; border:1px solid #e2e0dc; background:#fff; color:var(--bs-ink); } /* 취소 = 오른쪽 */
#mod_option_frm .btn_close:hover{ background:var(--bs-surface); border-color:#d8d5cf; }
#mod_option_frm .btn_close .fa{ display:none; }
#mod_option_frm .btn_close::after{ content:"취소"; }

/* (옛 .wb-lightbox 라이트박스 CSS 제거 — 공용 전체화면 뷰어 .sl-iv(wb-imgview.js)로 대체됨, PR#47) */

/* 문의 아코디언 캐럿 회전 */
.sl-qna-q .sit_qa_caret{ transition:transform .18s ease; }
.sl-qna-q.open .sit_qa_caret{ transform:rotate(180deg); }
.sl-qna-q{ gap:10px; }
.sl-qna-a img{ max-width:100%; height:auto; border-radius:8px; }
/* 작은 수정/삭제 버튼 */
#sit_info .btn-sm{ padding:0.3rem 0.7rem; font-size:11.5px; border-radius:8px; }

/* ── 후기/문의 작성 팝업(head.sub 미니멀, BS5) ── */
.new_win{ max-width:720px; margin:0 auto; }
#win_title{ letter-spacing:-.02em; }
/* 별점 선택 위젯 (radio → ★) */
.wb-star-rate{ display:inline-flex; flex-direction:row-reverse; gap:4px; }
.wb-star-rate input{ position:absolute; opacity:0; width:0; height:0; }
.wb-star-rate label{ font-size:30px; line-height:1; color:var(--bs-line); cursor:pointer; margin:0; transition:color .1s; }
.wb-star-rate label:hover,
.wb-star-rate label:hover ~ label,
.wb-star-rate input:checked ~ label{ color:var(--bs-brand); }
.new_win .form-control:focus{ border-color:#e0cec7; box-shadow:0 0 0 3px rgba(196,71,44,.09); }

/* ──────────────────────────────────────────────────────────────
   셸 안 모든 쇼핑 페이지 공통 세로 여백 (사이트 기본 여백)
   shop.head.php에서 .sl-container 안에 별도 <div class="wb-page">로 전 페이지
   콘텐츠(+푸터)를 감쌈 → 페이지마다 감쌀 필요 없음. 그 아래 요소들은 상/하단
   세로여백을 따로 줄 필요 없음(요소 간 간격만 mb-* 등으로). 좌우 패딩은
   .sl-container가 담당하므로 여기선 세로만(별도 div라 단축형 사용 OK).
   폭은 전 페이지 공통으로 .sl-container(max 1650)가 관장 — 페이지별 폭 제한
   클래스는 두지 않음(폭을 줄이려면 .sl-container를 줄여 전체를 일괄 조정). */
.wb-page{ padding:36px 0; }

/* ──────────────────────────────────────────────────────────────
   주문완료/주문상세 (orderinquiryview, .wb-orderview)
   ────────────────────────────────────────────────────────────── */
/* 요약카드 sticky 해제: 같은 컬럼 아래 형제(버튼·취소박스·안내)가 있어
   sticky면 스크롤 시 카드가 그 위를 덮어 겹침 발생. 주문완료 페이지는
   요약이 따라다닐 필요가 없으므로 항상 static 처리 */
.wb-orderview .sl-sum-card{ position:static; top:auto; }
/* 진행상태 트랙: 디지털 상품 3단계(주문접수·결제확인·제공완료)
   override.css 기본 repeat(5,1fr) → 3열로 재정의 */
.wb-orderview .wb-track-box{ padding:20px 22px; }
.wb-orderview .sl-track{ grid-template-columns:repeat(3, 1fr); }
.wb-orderview .sl-track-step{ font-size:11px; }
.wb-orderview .sl-track-desc{ white-space:nowrap; }

/* ---------------------------------------------------------------------------
   사이드뷰 get_sideview() — BS5 다크 드롭다운
   토글: js/common.js 가 .sv_member 클릭 시 .sv 에 .sv_on 추가/제거.
   그누보드 고정 마크업: .sv_wrap > (a.sv_member|a.sv_guest) + span.sv > a...
   --------------------------------------------------------------------------- */
.sv_wrap { position: relative; display: inline-block; }
.sv_member, .sv_guest {
  display: inline-flex; align-items: center; background: none; border: 0; padding: 0;
  font-weight: 600; color: var(--bs-ink-2); text-decoration: none; cursor: pointer;
}
.sv_member:hover, .sv_guest:hover { color: var(--bs-brand); text-decoration: underline; }
.sv {
  display: none; position: absolute; top: calc(100% + 8px); left: 0; z-index: 60;
  min-width: 152px; background: var(--bs-ink); border-radius: 10px; padding: 6px;
  box-shadow: 0 20px 40px -18px rgba(20, 12, 8, .62);
}
.sv.sv_on { display: block; }
.sv::before {
  content: ""; position: absolute; top: -5px; left: 17px; width: 10px; height: 10px;
  background: var(--bs-ink); transform: rotate(45deg); border-radius: 2px;
}
.sv a {
  display: block; width: 100%; text-align: left; color: rgba(255, 255, 255, .82);
  font-size: 12.5px; font-weight: 500; padding: 8px 12px; border-radius: 7px;
  text-decoration: none; white-space: nowrap;
}
.sv a:hover { background: rgba(255, 255, 255, .1); color: #fff; }
.sv_nojs { display: none; }

/* 주문서 재설계: 05 할인 카드 포인트 입력 (이동된 .sod_frm_point) — 시안형 */
.wb-order #wb_point_slot .sod_frm_point{ display:block; margin:0 !important; padding:0 !important; border:0 !important; }
.wb-order #wb_point_slot .wb-pt-field label{ display:block; font-size:12px; font-weight:600; color:var(--bs-ink-2); margin-bottom:6px; }
.wb-order #wb_point_slot .wb-pt-unit{ font-weight:400; color:var(--bs-muted); }
.wb-order #wb_point_slot #od_temp_point{ width:100%; box-sizing:border-box; border:1px solid var(--bs-line); border-radius:10px;
  background:var(--bs-surface); font-size:13px; line-height:1.5; padding:0.66rem 0.85rem; color:var(--bs-ink); text-align:right; font-family:"Poppins",sans-serif; }
.wb-order #wb_point_slot #od_temp_point:focus{ background:#fff; border-color:#e0cec7; box-shadow:0 0 0 3px rgba(196,71,44,.09); outline:0; }
.wb-order #wb_point_slot .wb-pt-hint{ margin-top:8px; font-size:11px; color:var(--bs-muted); display:flex; align-items:center; gap:6px; flex-wrap:wrap; }
.wb-order #wb_point_slot .wb-pt-sep{ color:var(--bs-line); }
.wb-order #wb_point_slot .wb-pt-max{ border:0; background:transparent; padding:0; font-size:11px; color:var(--bs-brand); font-weight:600; text-decoration:underline; cursor:pointer; }
.wb-order #wb_point_slot .wb-pt-max em{ font-style:normal; }
/* 결제하기 버튼: 요약 카드 폭 꽉 채우기 */
.wb-order #wb_submit_slot .btn_submit,
.wb-order #wb_submit_slot button[type=submit]{ width:100%; }