@charset "utf-8";

/* =========================================================
   주문/결제
   ========================================================= */
:root{
  --ord-max:1040px;
  --ord-field-bg:#f6f7f8;        /* 입력 필드 배경 */
  --ord-sum-bg:#f6f7f8;          /* 금액 합계 박스 배경 */
  --ord-line:var(--color-line);
  --ord-blue:#2f6fe0;            /* 정상여부확인 등 블루 */
  --ord-blue-line:#2f6fe0;       /* 발급받기 아웃라인 블루 */
  --ord-purple:#6a3fb5;          /* 사용/취소 보라 */
  --ord-purple-ink:#ffffff;
  --ord-dark-btn:#3a4150;        /* 주소검색 차콜 */
  --ord-pay-line:#d7dae0;        /* 결제수단 기본 보더 */
  --ord-pay-on:#cd0111;          /* 결제수단 선택 보더(레드) */
  --ord-rate-bg:#fdeced;        /* 할인율 배지 배경(연한 레드) */
  --ord-rate-ink:var(--point);  /* 할인율 배지 텍스트(레드) */
  --ord-benefit-btn:#3a4150;   /* 적립금·쿠폰·포인트 버튼(차콜) */
}

/* ---- 레이아웃 / 타이틀 ---- */
.order{max-width:var(--ord-max);margin:0 auto;padding:44px 20px 80px;color:var(--color-text-default);}
.order__title{font-size:1.9rem;font-weight:500;letter-spacing:-0.03em;color:var(--color-text-default);font-family:'NoonnuBasicGothic', sans-serif;text-align:center;}

/* ---- 섹션 공통 ---- */
.ord-sec{padding:34px 0;}
.ord-sec:last-of-type{border-bottom:0;}
.ord-sec--recv{border-bottom:0;}
.ord-sec__head{display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:2px solid var(--color-text-default);padding-bottom:12px;margin-bottom:8px;}
.ord-sec__title{font-size:1.15rem;font-weight:800;color:var(--color-text-default);padding-bottom:12px;border-bottom:2px solid var(--color-text-default);}
.ord-sec__title--inline{padding-bottom:0;border-bottom:0;}
.ord-sec__head .ord-sec__title{padding-bottom:0;border-bottom:0;}
.ord-sec__desc{margin-top:14px;font-size:.8rem;color:var(--color-text-sub);line-height:1.6;}

/* ---- 공통 인풋 ---- */
.ord-input{width:100%;height:40px;padding:0 14px;font-size:.92rem;color:var(--color-text-default);background:var(--ord-field-bg);border:1px solid var(--ord-line);border-radius:4px;outline:none;transition:border-color .15s;}
.ord-input::placeholder{color:var(--color-text-placeholder);}
select.ord-input{padding-right:38px;}

/* ---- 공통 버튼 ---- */
.ord-btn{flex:0 0 auto;height:40px;padding:0 16px;font-size:.8rem;font-weight:600;border-radius:4px;white-space:nowrap;cursor:pointer;transition:filter .15s,border-color .15s,color .15s;}
.ord-btn--dark{background:var(--ord-dark-btn);color:#fff;border:0;padding:0 14px;}
.ord-btn--blue{background:var(--ord-blue);color:#fff;border:0;}
.ord-btn--blue-line{max-width:200px;background:transparent;color:var(--ord-blue-line);border:1px solid var(--ord-blue-line);}
.ord-btn--purple{background:var(--ord-benefit-btn);color:#fff;border:0;height:40px;padding:0 18px;}

/* ---- 받는사람 폼 ---- */
.ord-form{margin-top:20px;}
.ord-field{display:flex;gap:20px;padding:12px 0;border-bottom:1px solid var(--ord-line);}
.ord-field:last-child{border-bottom:0;}
.ord-field__label{flex:0 0 130px;padding-top:13px;font-size:.92rem;font-weight:600;color:var(--color-text-default);}
.ord-field__body{flex:1;min-width:0;display:flex;flex-direction:column;gap:8px;}
.ord-field__body > .ord-input{max-width:340px;}
.ord-field__hint{font-size:.84rem;color:var(--color-text-sub);}
.ord-field__note{padding:3px 0 5px 0;font-size:.84rem;color:var(--color-text-sub);line-height:1.5;letter-spacing:-0.05em;max-width:600px;   /* 데스크톱 고정너비 */}
.ord-field__note strong{color:var(--ord-blue);font-weight:600;}

/* ---- 이메일(@ 분리) ---- */
.ord-email{display:flex;align-items:center;gap:10px;max-width:480px;}
.ord-email .ord-input{flex:1;max-width:none;}
.ord-email__at{flex:0 0 auto;color:var(--color-text-sub);}

/* ---- 주소 ---- */
.ord-addr{display:flex;flex-direction:column;gap:8px;max-width:480px;}
.ord-addr__zip{display:flex;align-items:center;gap:8px;}
.ord-addr__zip .ord-input{width:120px;}

/* ---- 개인통관부호 ---- */
.ord-pccc{display:flex;align-items:center;gap:8px;max-width:480px;}
.ord-pccc .ord-input{flex:1;}

/* ---- 체크박스 행 ---- */
.ord-field--check{justify-content:flex-start;   /* center → 왼쪽 정렬 */padding-top:18px;padding-left:150px;/* 라벨(130) + gap(20) 만큼 들여쓰기 */}
.ord-check{display:inline-flex;align-items:center;gap:8px;font-size:.9rem;color:var(--color-text-default);cursor:pointer;}
.ord-check input{width:18px;height:18px;accent-color:var(--point);}

/* ---- 주문상품 ---- */
.ord-products{margin-top:10px;}
.ord-product{display:flex;align-items:center;gap:16px;padding:14px 0;border-bottom:1px solid var(--ord-line);}
.ord-product__thumb{flex:0 0 auto;width:64px;height:64px;overflow:hidden;border-radius:8px;background:var(--ord-field-bg);display:block;}
.ord-product__thumb img{width:100%;height:100%;object-fit:cover;}
.ord-product__info{flex:1;min-width:0;}
.ord-product__name{font-size:.92rem;font-weight:500;color:var(--color-text-default);line-height:1.4;margin-bottom:6px;}
.ord-product__name a{color:inherit;transition:color .15s;}
.ord-product__meta{display:flex;align-items:center;gap:10px;font-family:'Roboto', sans-serif;}
.ord-product__meta strong{font-size:.95rem;font-weight:700;color:var(--color-text-default);}
.ord-product__qty{font-size:.85rem;color:var(--color-text-sub);padding-left:10px;border-left:1px solid var(--ord-line);}

/* ---- 금액 합계 박스 ---- */
.ord-sum{margin-top:20px;padding:22px 24px;background:var(--ord-sum-bg);border-radius:8px;}
.ord-sum__row{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:5px 0;font-size:.95rem;color:var(--color-text-default);}
.ord-sum__row dt{font-weight:600;}
.ord-sum__row dd{font-weight:700;font-family:'Roboto', sans-serif;white-space:nowrap;}
.ord-sum__row dd .won{font-size:.85rem;font-weight:400;color:var(--color-text-sub);margin-left:1px;}
.ord-sum__row--discount dt,.ord-sum__row--discount dd{color:var(--point);}
.ord-sum__row--discount{border-bottom:1px solid var(--ord-line);padding-bottom:12px;}
.ord-sum__info{display:inline-flex;align-items:center;justify-content:center;width:15px;height:15px;border-radius:50%;border:1px solid var(--color-text-placeholder);color:var(--color-text-placeholder);font-size:.62rem;font-weight:700;}
.ord-sum__sub{display:block;margin-top:4px;font-size:.8rem;font-weight:400;color:var(--color-text-sub);line-height:1.5;}
.ord-sum__tag{display:inline-flex;align-items:center;gap:5px;font-weight:700;}
.ord-sum__tag-ico{width:17px;height:17px;flex:0 0 auto;color:var(--point);transform:translateY(2px);}
.ord-sum__rate{font-size:.85rem;font-weight:700;color:var(--ord-rate-ink);background:var(--ord-rate-bg);padding:2px 8px;border-radius:5px;display:inline-block;transform:translateY(-2px);}

/* ---- 적립금·쿠폰·포인트 ---- */
.ord-guide{flex:0 0 auto;padding:6px 12px;font-size:.78rem;font-weight:600;color:#fff;background:var(--ord-purple);border-radius:4px;}
.ord-benefit{margin-top:22px;display:flex;flex-direction:column;gap:8px;}
.ord-benefit__row{display:flex;align-items:center;flex-wrap:wrap;gap:12px;}
.ord-benefit__label{flex:0 0 120px;font-size:.9rem;font-weight:500;color:var(--color-text-sub);display:flex;align-items:center;gap:5px;letter-spacing:-0.05em;}
.ord-benefit__own{flex:0 0 70px;font-size:.9rem;font-weight:600;color:var(--color-text-default);font-family:'Roboto', sans-serif;}
.ord-benefit__input{flex:1;min-width:0;max-width:300px;text-align:right;}
select.ord-benefit__input{text-align:left;}
.ord-benefit__max{flex:0 0 auto;font-size:.82rem;color:var(--color-text-sub);}
/* 쿠폰 select 를 .select-wrap 으로 감쌀 때 폭/정렬/화살표 유지 */
.ord-benefit .select-wrap{flex:1;min-width:0;max-width:300px;display:block;position:relative;}
.ord-benefit .select-wrap .ord-benefit__input{width:100%;max-width:none;flex:none;}
.ord-benefit .select-wrap::after{right:14px;width:8px;height:8px;border-color:#999;}

/* ---- 총 금액 ---- */
.ord-total{margin-top:30px;padding-top:22px;border-top:1px solid var(--ord-line);display:flex;flex-direction:column;gap:10px;align-items:flex-end;}
.ord-total__row{display:flex;align-items:baseline;gap:18px;}
.ord-total__label{font-size:.95rem;font-weight:600;color:var(--color-text-default);}
.ord-total__discount{font-size:1.05rem;font-weight:700;color:var(--point);font-family:'Roboto', sans-serif;min-width:110px;text-align:right;}
.ord-total__final{font-size:1.5rem;font-weight:800;color:var(--point);font-family:'Roboto', sans-serif;min-width:110px;text-align:right;}
.ord-total .won{font-size:.9rem;font-weight:600;margin-left:2px;}

/* ---- 결제하기 (수단 선택) ---- */
.ord-pay{margin-top:20px;display:grid;grid-template-columns:repeat(2,1fr);gap:14px;max-width:520px;}
.ord-pay__method{cursor:pointer;}
.ord-pay__radio{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none;}
.ord-pay__box{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;min-height:92px;padding:18px;border:1px solid var(--ord-pay-line);border-radius:8px;color:var(--color-text-default);transition:border-color .15s,color .15s,box-shadow .15s;}
.ord-pay__ico{width:30px;height:30px;color:var(--color-text-sub);}
.ord-pay__ico svg{width:100%;height:100%;}
.ord-pay__name{font-size:.95rem;font-weight:600;}
.ord-pay__radio:checked + .ord-pay__box{border-color:var(--ord-pay-on);box-shadow:0 0 0 1px var(--ord-pay-on) inset;} /* 선택 시: 레드 외곽선 */
.ord-pay__radio:checked + .ord-pay__box .ord-pay__ico{color:var(--ord-pay-on);}
.ord-pay__radio:focus-visible + .ord-pay__box{outline:2px solid var(--ord-pay-on);outline-offset:2px;}

/* ---- 무통장입금: 입금자명 (JS로 노출 토글) ---- */
.ord-bank{margin-top:18px;padding:22px 24px;background:var(--ord-sum-bg);border-radius:8px;display:none;}
.ord-bank.is-open{display:block;}
.ord-bank__field{display:flex;align-items:center;gap:12px;}
.ord-bank__label{flex:0 0 auto;font-size:.9rem;font-weight:600;color:var(--color-text-default);}
.ord-bank__input{max-width:260px;background:var(--color-background);}
.ord-bank__hint{margin-top:8px;padding-left:74px;font-size:.82rem;color:var(--color-text-placeholder);}
.ord-bank__notice{margin-top:12px;font-size:.85rem;color:var(--color-text-sub);}

/* ---- 결제하기 버튼 ---- */
.ord-submit{margin-top:36px;text-align:center;}
.ord-submit__btn{min-width:460px;max-width:100%;height:62px;padding:0 40px;font-size:1.15rem;font-weight:700;color:#fff;background:var(--point);border-radius:6px;transition:filter .15s,transform .05s;}

/* ---- 반응형 ---- */
@media (max-width:1024px){
  .order{padding:36px 20px 64px;}
  .ord-benefit__label{flex:0 0 104px;white-space:nowrap;}  /* 세 행 라벨 폭 통일(보유 적립금 ⓘ 한 줄) */
  .ord-benefit__own{flex:0 0 60px;}        /* 세 행 보유금액 폭 통일 → 입력란 너비 동일 */
  .ord-benefit__input{flex:1;min-width:0;max-width:none;}
  .ord-benefit .select-wrap{flex:1;max-width:none;}        /* 쿠폰 wrap도 통일 폭 */
  .ord-benefit__max{flex:0 0 100%;text-align:right;}
}
@media (max-width:768px){

  .ord-field{flex-direction:column;gap:8px;}
  .ord-field__label{flex:none;padding-top:0;}
  .ord-field__body > .ord-input,
  .ord-email,.ord-addr,.ord-pccc,
  .ord-field__note{max-width:none;}
  .ord-submit__btn{min-width:0;width:100%;}
  .ord-field--check{padding-left:0;padding-top:15px !important;}
  
  .ord-submit{margin-top:10px;}
  .ord-input{font-size:16px;}
  select.ord-benefit__input{font-size:0.92rem;}

}
@media (max-width:560px){
	
  .order{padding:20px 16px 35px;}
  .order__title{font-size:1.4rem;}
  .ord-form{margin-top:10px;}
  .ord-field{gap:8px;padding:8px 0;}
  .ord-field__label{font-size:.92rem;}
  .ord-sec{padding:20px 0;}
  .ord-sec__title{font-size:1.05rem;}
  .ord-products{margin-top:5px;}
  .ord-product{padding:10px 0;}
  .ord-sum{padding:18px 18px;}
  .ord-sum__row{padding:3px 0;}
  .ord-pay{grid-template-columns:repeat(2,1fr);gap:10px;}
  .ord-pay__box{min-height:80px;padding:14px;}
  .ord-total__final{font-size:1.3rem;}
  .ord-bank__field{flex-direction:row;align-items:center;gap:12px;}
  .ord-bank__input{max-width:none;flex:1;}
  .ord-bank__hint{padding-left:0;}
  .ord-submit__btn{height:56px;font-size:1.05rem;}
  .ord-btn--blue-line{max-width:none;width:100%;}
  .ord-benefit__row{gap:4px;}
  .ord-benefit__input{flex:1 1 50px;min-width:50px;}
  .ord-benefit .select-wrap{flex:1 1 50px;min-width:50px;}
  .ord-benefit__label{font-size:.85rem;}
  .ord-benefit__own{font-size:.92rem;}
  .ord-btn--purple{padding:0 10px;}
  .ord-benefit{margin-top:18px;}
  .ord-total{margin-top:18px;padding-top:18px;gap:2px;}
  .ord-bank{padding:18px 18px;}
  .ord-bank__notice{margin-top:5px;}
}
@media (max-width:420px){
  .ord-benefit__label{flex:0 0 78px;}
  .ord-benefit__own{flex:0 0 52px;}
}


/* =========================================================
   주문 결제완료
   ========================================================= */
/* ---- 주문 확인 헤더 ---- */
.ordc-hero{margin:28px 0 8px;padding:30px 24px;text-align:center;background:var(--ord-sum-bg);border-radius:10px;}
.ordc-hero__title{font-size:1.3rem;font-weight:600;color:var(--color-text-default);letter-spacing:-0.02em;}
.ordc-hero__no{margin-top:10px;font-size:.95rem;color:var(--color-text-sub);}
.ordc-hero__no strong{color:var(--color-text-default);font-weight:700;font-family:'Roboto', sans-serif;text-decoration:underline;text-underline-offset:3px;}
.ordc-hero__link{color:inherit;transition:color .15s;}
.ordc-hero__link:hover strong{color:var(--point);}

/* ---- 입금계좌 ---- */
.ordc-account{margin-top:18px;padding-bottom:18px;border-bottom:1px solid var(--ord-line);}
.ordc-account__row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:7px 0;}
.ordc-account__row dt{font-size:.92rem;color:var(--color-text-sub);}
.ordc-account__row dd{font-size:.98rem;font-weight:500;color:var(--color-text-default);text-align:right;font-family:'Roboto', sans-serif;}
.ordc-account__row--amount dd{font-size:1.15rem;color:var(--point);}
.ordc-account__row--amount .won{font-size:.9rem;margin-left:1px;}

/* 안내 문구 */
.ordc-notice{margin-top:16px;display:flex;flex-direction:column;gap:6px;list-style:none;padding:0;}
.ordc-notice li{position:relative;padding-left:14px;font-size:.9rem;color:var(--color-text-sub);line-height:1.6;letter-spacing:-0.05em;}
.ordc-notice li::before{content:"";position:absolute;left:2px;top:9px;width:4px;height:4px;border-radius:50%;background:var(--color-text-placeholder);}
.ordc-notice strong{color:var(--ord-blue);font-weight:700;}

/* 문자로 받기 버튼(레드 채움) */
.ordc-sms{margin-top:22px;text-align:center;}
.ordc-sms__btn{min-width:480px;max-width:100%;height:58px;padding:0 36px;font-size:1.05rem;font-weight:700;color:#fff;background:var(--point);border-radius:6px;transition:filter .15s,transform .05s;}

/* ---- 쇼핑 계속하기 ---- */
.ordc-actions{margin-top:30px;text-align:center;}
.ordc-continue{display:inline-flex;align-items:center;justify-content:center;min-width:480px;max-width:100%;height:56px;padding:0 36px;font-size:1rem;font-weight:600;color:var(--color-text-default);background:var(--color-background);border:1px solid var(--mp-btn-line, #b4b3b3);border-radius:6px;transition:border-color .15s,color .15s;}

/* ---- 반응형 ---- */
@media (max-width:560px){
  .ordc-hero{margin:20px 0 4px;padding:24px 18px;}
  .ordc-hero__title{font-size:1.1rem;}
  .ordc-hero__no{font-size:.9rem;}
  .ordc-account{margin-top:10px;padding-bottom:10px;}
  .ordc-account__row{gap:12px;padding:4px 0;}
  .ordc-account__row dd{font-size:.92rem;}
  .ordc-account__row--amount dd{font-size:1.05rem;}
  .ordc-notice li{font-size:.86rem;line-height:1.4;}
  .ordc-sms__btn,
  .ordc-continue{min-width:0;width:100%;}
  .ordc-sms__btn{height:54px;font-size:1rem;}
}

/* =========================================================
   운송수단 선택 + 배송비
   ========================================================= */
.ship-select{
  --ship-line:var(--color-line);
  --ship-point:var(--point);
  display:flex;align-items:stretch;gap:32px;padding:4px 0;
}

/* ---- 좌 : 운송수단 선택 ---- */
.ship-select__methods{flex:1;min-width:0;}
.ship-select__head{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;margin-bottom:14px;}
.ship-select__title{font-size:1rem;font-weight:700;color:var(--color-text-default);}
.ship-select__guide{font-size:.82rem;color:var(--color-text-sub);}
.ship-method{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;}
.ship-method__item{display:block;position:relative;cursor:pointer;}
.ship-method__radio{position:absolute;opacity:0;width:0;height:0;}
.ship-method__box{
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;
  min-height:120px;padding:20px 12px;
  border:1px solid var(--ship-line);border-radius:10px;background:#fff;
  transition:border-color .15s,color .15s;
}
.ship-method__ico{width:40px;height:40px;color:var(--color-text-sub);transition:color .15s;}
.ship-method__ico svg{width:100%;height:100%;display:block;}
.ship-method__name{font-size:1.02rem;font-weight:700;color:var(--color-text-default);}
.ship-method__desc{font-size:.8rem;color:var(--color-text-sub);}
/* 선택 상태 */
.ship-method__radio:checked + .ship-method__box{border:2px solid var(--ship-point);}
.ship-method__radio:checked + .ship-method__box .ship-method__ico,
.ship-method__radio:checked + .ship-method__box .ship-method__name{color:var(--ship-point);}
.ship-method__radio:focus-visible + .ship-method__box{outline:2px solid var(--ship-point);outline-offset:2px;}

/* ---- 우 : 배송비 ---- */
.ship-select__fee{flex:0 0 auto;width:250px;display:flex;flex-direction:column;padding-left:32px;border-left:1px solid var(--ship-line);   /* 중간 구분선 */}
.ship-fee__head{display:flex;align-items:center;gap:4px;margin-bottom:12px;}
.ship-fee__title{font-size:1rem;font-weight:700;color:var(--color-text-default);}
.ship-fee__help{position:relative;width:20px;height:20px;padding:0;line-height:0;color:var(--color-text-default);background:none;}
.ship-fee__help svg{width:100%;height:100%;display:block;transform:translateY(2px);}
.ship-fee__desc{font-size:.88rem;color:var(--color-text-sub);line-height:1.6;}
.ship-fee__amount{margin-top:auto;text-align:right;font-size:1.35rem;font-weight:800;color:var(--color-text-default);font-family:'Roboto',sans-serif;}
.ship-fee__amount .won{font-size:.9rem;font-weight:600;margin-left:2px;}

/* ---- 반응형 ---- */
@media (max-width:768px){
  .ship-select{flex-direction:column;gap:15px;}
  .ship-select__fee{width:auto;padding-left:0;border-left:0;padding-top:10px;border-top:1px solid var(--ship-line);}
  .ship-fee__amount{margin-top:0;}
  .ship-fee__help svg{transform:translateY(0);}
  .ship-fee__head {margin-bottom:4px;}
}
@media (max-width:480px){
  .ship-method{gap:10px;}
  .ship-method__box{min-height:104px;padding:16px 8px;}
  .ship-method__ico{width:34px;height:34px;}
  .ship-method__name{font-size:.98rem;}
  .ship-method__desc{font-size:.78rem;}
}

/* =========================================================
   배송비 안내 모달
   ========================================================= */
.fee-modal{overscroll-behavior:contain;}
.fee-modal{
  --fee-th-bg:#f6f7f8;
  --fee-surface:#ffffff;
  position:fixed;inset:0;z-index:1000;display:none;
}
.fee-modal.is-open{display:block;}
.fee-modal__dim{position:absolute;inset:0;background:rgba(0,0,0,.5);overscroll-behavior:contain;touch-action:none;}
.fee-modal__box{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  display:flex;flex-direction:column;
  width:calc(100% - 40px);max-width:540px;max-height:65vh;
  background:var(--fee-surface);border-radius:14px;overflow:hidden;
  box-shadow:0 20px 60px rgba(0,0,0,.25);animation:feeUp .22s ease;
}
@keyframes feeUp{from{opacity:0;transform:translate(-50%,-46%);}to{opacity:1;transform:translate(-50%,-50%);}}

/* 헤더 */
.fee-modal__head{
  flex:0 0 auto;                                              
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:20px 22px 14px;
  border-bottom:1px solid var(--color-line);
}
.fee-modal__title{font-size:1.2rem;font-weight:800;color:var(--color-text-default);}
.fee-modal__close{width:34px;height:34px;display:flex;align-items:center;justify-content:center;color:var(--color-text-sub);background:none;position: relative;top: -5px;}
.fee-modal__close svg{width:24px;height:24px;}

/* 본문 (스크롤) */
.fee-modal__body{
  flex:1 1 auto; 
  min-height:0;             
  overflow-y:auto;-webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;      
  padding:20px 22px 22px;         
  font-size:.86rem;line-height:1.65;color:var(--color-text-sub);
}
.fee-modal__intro{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:22px;}
.fee-modal__desc{}
.fee-modal__ico{flex:0 0 auto;width:72px;height:72px;color:var(--color-text-default);}
.fee-modal__ico svg{width:100%;height:100%;}
.fee-modal__subtitle{margin-bottom:12px;font-size:0.9rem;font-weight:600;color:var(--color-text-default);}

/* 표 */
.fee-table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;}
.fee-table{width:100%;border-collapse:collapse;min-width:420px;font-size:.8rem;text-align:center;}
.fee-table__caption{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;}
.fee-table th,.fee-table td{border:1px solid var(--color-line);padding:10px 8px;line-height:1.5;vertical-align:middle;}
.fee-table thead th{background:var(--fee-th-bg);color:var(--color-text-default);font-weight:600;}
.fee-table tbody th{background:var(--fee-th-bg);color:var(--color-text-default);font-weight:600;white-space:nowrap;}
.fee-table tbody td{color:var(--color-text-sub);}
.fee-modal__note{margin-top:12px;font-size:.72rem;line-height:1.4;color:var(--color-text-placeholder);}

/* 하단 확인 버튼 (풀 위드) */

.btn-fee-primary{width:100%;height:54px;font-size:1.05rem;font-weight:700;color:#fff;background:var(--point);border-radius:4px;transition:background .15s;margin-top:6px;}
.fee-modal__foot{flex:0 0 auto;padding:14px 22px;border-top:1px solid var(--color-line)}
.fee-modal__foot .btn-fee-primary{height:48px;margin-top:0;font-size:1rem;}
.fee-modal__confirm{height:48px;margin-top:0;font-size:1rem;}
body.fee-modal-open{overflow:hidden;}

/* ---- 반응형 ---- */
@media (max-width:560px){
  .fee-modal__box{width:calc(100% - 28px);max-height:70vh;}
  .fee-modal__head{padding:18px 18px 12px;}
  .fee-modal__body{padding:18px 18px 18px;}
  .fee-modal__ico{width:60px;height:60px;}
  .fee-modal__intro{gap:12px;}
  .fee-table{min-width:100%;}
  .fee-table th,.fee-table td{padding:10px 8px;}
  .fee-modal__confirm{height:54px;}
}