/* BASIC css start */
/* =========================================================
   장바구니 리뉴얼 (Q&A·회원가입 리뉴얼과 같은 색/버튼 체계)
   ========================================================= */
.ct-wrap { --ct-main:#4f8f9c; --ct-main-dk:#3c7480; --ct-point:#a9ced7; --ct-soft:#f2f8f9; --ct-bg:#f7f8f9; --ct-line:#e7eaec; --ct-line-dk:#d3d8dc; --ct-txt:#1f2326; --ct-txt2:#4a5056; --ct-txt3:#8b9298; --ct-red:#e0565b;
    --ct-sticky-top:24px; /* 상단 고정 헤더가 있다면 그 높이만큼 늘려 주세요 */
    max-width:1260px; margin:0 auto; padding:0 0 100px; color:var(--ct-txt2); font-size:15px; line-height:1.6; letter-spacing:-0.2px; word-break:keep-all; }
.ct-wrap * { box-sizing:border-box; }
.ct-wrap a { color:inherit; font-size:inherit; text-decoration:none; }
.ct-wrap img { max-width:100%; vertical-align:middle; }
.ct-wrap .blind { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); }
.ct-wrap [hidden] { display:none !important; }
.ct-wrap a:focus-visible, .ct-wrap input:focus-visible, .ct-wrap button:focus-visible { outline:2px solid var(--ct-main); outline-offset:2px; }

/* 머리말 */
.ct-wrap .ct-head { display:flex; align-items:flex-end; justify-content:space-between; gap:24px; padding:44px 0 22px; border-bottom:2px solid var(--ct-txt); }
.ct-wrap .ct-loc { margin:0 0 8px; font-size:13px; color:var(--ct-txt3); }
.ct-wrap .ct-title { margin:0; font-size:30px; font-weight:700; color:var(--ct-txt); line-height:1.2; letter-spacing:-0.6px; }
.ct-wrap .ct-title::after { content:""; display:block; width:28px; height:4px; margin-top:12px; border-radius:2px; background:var(--ct-point); }
.ct-wrap .ct-count { display:inline-flex; align-items:center; justify-content:center; min-width:28px; height:28px; margin-left:6px; padding:0 8px; border-radius:14px; background:var(--ct-main); color:#fff; font-size:15px; font-weight:600; vertical-align:4px; letter-spacing:0; }
.ct-wrap .ct-steps { display:flex; gap:28px; margin:0; padding:0; list-style:none; }
.ct-wrap .ct-steps li { position:relative; display:flex; align-items:center; gap:8px; font-size:14px; color:var(--ct-txt3); list-style:none; }
.ct-wrap .ct-steps li + li::before { content:""; position:absolute; left:-20px; top:50%; width:12px; height:1px; background:var(--ct-line-dk); }
.ct-wrap .ct-steps li span { display:inline-flex; align-items:center; justify-content:center; width:24px; height:24px; border:1px solid var(--ct-line-dk); border-radius:50%; font-size:12px; font-weight:600; }
.ct-wrap .ct-steps li.on { color:var(--ct-txt); font-weight:600; }
.ct-wrap .ct-steps li.on span { border-color:var(--ct-txt); background:var(--ct-txt); color:#fff; }

/* 버튼 */
.ct-wrap .ct-btn { display:inline-flex; align-items:center; justify-content:center; gap:6px; height:48px; padding:0 24px; border:1px solid var(--ct-line-dk); border-radius:8px; background:#fff; color:var(--ct-txt); font-size:15px; font-weight:500; line-height:1; cursor:pointer; transition:background .2s, border-color .2s, color .2s; }
.ct-wrap .ct-btn:hover { border-color:var(--ct-txt); }
.ct-wrap .ct-btn svg { width:17px; height:17px; flex:none; }
.ct-wrap .ct-btn-primary { background:var(--ct-main); border-color:var(--ct-main); color:#fff; }
.ct-wrap .ct-btn-primary:hover { background:var(--ct-main-dk); border-color:var(--ct-main-dk); color:#fff; }
.ct-wrap .ct-btn-lg { height:58px; font-size:17px; font-weight:700; }
.ct-wrap .ct-btn-sm { height:38px; padding:0 14px; border-radius:6px; font-size:14px; color:var(--ct-txt2); }
.ct-wrap .ct-btn-block { display:flex; width:100%; }

/* 회원 등급 */
.ct-wrap .ct-member { display:flex; align-items:center; gap:16px; margin-top:24px; padding:18px 22px; border-radius:12px; background:var(--ct-soft); font-size:15px; color:var(--ct-txt2); }
.ct-wrap .ct-member-img img { max-height:48px; width:auto; }
.ct-wrap .ct-member strong { color:var(--ct-txt); }
.ct-wrap .ct-member em { font-style:normal; font-weight:600; color:var(--ct-main-dk); }

/* 2단 배치 */
.ct-wrap .ct-layout { display:grid; grid-template-columns:minmax(0,1fr) 340px; gap:40px; align-items:start; margin-top:8px; }
.ct-wrap .ct-main { min-width:0; }
.ct-wrap .ct-aside { position:sticky; top:var(--ct-sticky-top); padding-top:24px; }

/* 상품 목록 (장바구니/관심상품 공용 행) */
.ct-wrap .ct-list-head, .ct-wrap .ct-item, .ct-wrap .ct-witem { display:grid; grid-template-columns:96px minmax(0,1fr) 128px 118px 88px; column-gap:20px; align-items:center; }
.ct-wrap .ct-list-head { height:52px; border-bottom:1px solid var(--ct-line-dk); font-size:14px; color:var(--ct-txt3); }
.ct-wrap .ct-list-head .c-info { grid-column:1 / 3; }
.ct-wrap .ct-list-head .c-qty { text-align:center; }
.ct-wrap .ct-list-head .c-price { text-align:right; }
.ct-wrap .ct-item, .ct-wrap .ct-witem { padding:24px 0; border-bottom:1px solid var(--ct-line); }

.ct-wrap .ct-thumb { display:block; width:96px; height:96px; border:1px solid var(--ct-line); border-radius:10px; overflow:hidden; background:var(--ct-bg); }
.ct-wrap .ct-thumb img { display:block; width:100%; height:100%; object-fit:cover; }

.ct-wrap .ct-info { min-width:0; }
.ct-wrap .ct-name { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; font-size:16px; font-weight:500; line-height:1.5; color:var(--ct-txt); }
.ct-wrap a.ct-name:hover { color:var(--ct-main-dk); text-decoration:underline; text-underline-offset:3px; }
.ct-wrap .ct-icons:empty { display:none; }
.ct-wrap .ct-icons img { margin:4px 2px 0 0; }
.ct-wrap .ct-opt { display:inline-block; max-width:100%; margin-top:8px; padding:6px 12px; border-radius:6px; background:var(--ct-bg); font-size:14px; color:var(--ct-txt2); }
.ct-wrap .ct-opt img { display:none; }
.ct-wrap .ct-meta { display:flex; flex-wrap:wrap; gap:6px 14px; margin-top:8px; font-size:13px; color:var(--ct-txt3); }
.ct-wrap .ct-meta-item { position:relative; }
.ct-wrap .ct-meta-item + .ct-meta-item::before { content:""; position:absolute; left:-8px; top:50%; width:1px; height:11px; margin-top:-5px; background:var(--ct-line-dk); }

/* 수량 */
.ct-wrap .ct-qty { display:flex; justify-content:center; }
.ct-wrap .ct-stepper { display:inline-flex; align-items:center; height:40px; border:1px solid var(--ct-line-dk); border-radius:8px; background:#fff; overflow:hidden; }
.ct-wrap .ct-step-btn { display:flex; align-items:center; justify-content:center; width:36px; height:100%; color:var(--ct-txt2); transition:background .15s; }
.ct-wrap .ct-step-btn:hover { background:var(--ct-bg); color:var(--ct-txt); }
.ct-wrap .ct-step-btn svg { width:16px; height:16px; }
.ct-wrap .ct-stepper input { width:44px !important; height:38px !important; margin:0; padding:0 !important; border:0 !important; border-left:1px solid var(--ct-line) !important; border-right:1px solid var(--ct-line) !important; border-radius:0; background:#fff; font-size:15px !important; font-weight:600; color:var(--ct-txt); text-align:center; }
.ct-wrap .ct-stepper input:focus { outline:none; background:var(--ct-soft); }

/* 금액 */
.ct-wrap .ct-price { text-align:right; font-size:15px; color:var(--ct-txt); white-space:nowrap; }
.ct-wrap .ct-price strong { font-size:18px; font-weight:700; }

/* 관심상품 / 삭제 */
.ct-wrap .ct-act { display:flex; flex-direction:column; gap:6px; }
.ct-wrap .ct-act-btn { display:inline-flex; align-items:center; justify-content:center; gap:5px; height:34px; border:1px solid var(--ct-line-dk); border-radius:6px; background:#fff; font-size:13px; color:var(--ct-txt2); transition:border-color .2s, color .2s, background .2s; }
.ct-wrap .ct-act-btn svg { width:15px; height:15px; flex:none; }
.ct-wrap .ct-act-btn:hover { border-color:var(--ct-main); color:var(--ct-main-dk); background:var(--ct-soft); }
.ct-wrap .ct-act-del:hover { border-color:var(--ct-red); color:var(--ct-red); background:#fff5f5; }
.ct-wrap .ct-act-cart { border-color:var(--ct-main); color:var(--ct-main-dk); }

.ct-wrap .ct-list-tools { display:flex; justify-content:space-between; gap:10px; margin-top:16px; }

/* 결제 예정 금액 */
.ct-wrap .ct-summary { padding:26px 24px 24px; border:1px solid var(--ct-line-dk); border-radius:14px; background:#fff; }
.ct-wrap .ct-summary-tit { margin:0 0 16px; font-size:18px; font-weight:700; color:var(--ct-txt); }
.ct-wrap .ct-sum-rows { margin:0; }
.ct-wrap .ct-sum-row { display:flex; justify-content:space-between; padding:6px 0; font-size:15px; }
.ct-wrap .ct-sum-row dt { color:var(--ct-txt3); }
.ct-wrap .ct-sum-row dd { margin:0; color:var(--ct-txt); font-weight:500; }
.ct-wrap .ct-sum-row.is-discount dd { color:var(--ct-red); }
.ct-wrap .ct-sum-total { display:flex; justify-content:space-between; align-items:baseline; margin-top:14px; padding-top:18px; border-top:1px solid var(--ct-line); }
.ct-wrap .ct-sum-total span { font-size:15px; font-weight:600; color:var(--ct-txt); }
.ct-wrap .ct-sum-total strong { font-size:26px; font-weight:800; color:var(--ct-txt); letter-spacing:-0.5px; }
.ct-wrap .ct-sum-total em { margin-left:2px; font-size:17px; font-style:normal; font-weight:600; }
.ct-wrap .ct-sum-reserve { margin:6px 0 0; text-align:right; font-size:13px; color:var(--ct-txt3); }
.ct-wrap .ct-sum-reserve strong { color:var(--ct-main-dk); font-weight:600; }

.ct-wrap .ct-freebar { margin-top:18px; padding:14px 16px; border-radius:10px; background:var(--ct-soft); }
.ct-wrap .ct-freebar-txt { margin:0 0 10px; font-size:14px; color:var(--ct-txt2); }
.ct-wrap .ct-freebar-txt strong { color:var(--ct-main-dk); }
.ct-wrap .ct-freebar-track { height:6px; border-radius:3px; background:#dbe8eb; overflow:hidden; }
.ct-wrap .ct-freebar-fill { display:block; width:0; height:100%; border-radius:3px; background:var(--ct-main); transition:width .5s ease; }
.ct-wrap .ct-freebar.is-done .ct-freebar-txt { margin:0; color:var(--ct-main-dk); font-weight:600; }
.ct-wrap .ct-freebar.is-done .ct-freebar-track { display:none; }
.ct-wrap .ct-delivery-msg { margin:12px 0 0; font-size:13px; color:var(--ct-txt3); text-align:center; }

.ct-wrap .ct-order-btns { display:flex; flex-direction:column; gap:8px; margin-top:20px; }
.ct-wrap .ct-easypay { margin-top:16px; text-align:center; }
.ct-wrap .ct-easypay:empty { display:none; }
.ct-wrap .ct-easypay > * { max-width:100%; margin-left:auto; margin-right:auto; }
.ct-wrap #nhn_btn { padding-top:0; text-align:center; }

/* 무료배송 추천상품 */
.ct-wrap .ct-free { margin-top:32px; border:1px solid var(--ct-line); border-radius:12px; overflow:hidden; }
.ct-wrap .ct-free-head { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:16px 20px; background:var(--ct-bg); }
.ct-wrap .ct-free-head p { margin:0; font-size:15px; color:var(--ct-txt2); }
.ct-wrap .ct-free-head strong { color:var(--ct-main-dk); }
.ct-wrap .ct-free-toggle { flex:none; height:36px; padding:0 14px; border:1px solid var(--ct-line-dk); border-radius:18px; background:#fff; font-size:14px; color:var(--ct-txt2); cursor:pointer; font-family:inherit; }
.ct-wrap .ct-free-toggle::after { content:""; display:inline-block; width:6px; height:6px; margin-left:8px; border-right:1.5px solid currentColor; border-bottom:1.5px solid currentColor; transform:translateY(-3px) rotate(45deg); transition:transform .2s; }
.ct-wrap .ct-free-toggle[aria-expanded="true"]::after { transform:translateY(1px) rotate(-135deg); }
.ct-wrap .ct-free-list { display:none; padding:20px; }
.ct-wrap .ct-free-list ul { display:grid; grid-template-columns:repeat(auto-fill, minmax(150px, 1fr)); gap:18px; margin:0; padding:0; list-style:none; }
.ct-wrap .ct-free-list li { list-style:none; }
.ct-wrap .ct-free-thumb { display:block; aspect-ratio:1 / 1; border-radius:8px; overflow:hidden; background:var(--ct-bg); }
.ct-wrap .ct-free-thumb img { width:100%; height:100%; object-fit:cover; }
.ct-wrap .ct-free-name { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; margin:8px 0 2px; font-size:14px; color:var(--ct-txt); }
.ct-wrap .ct-free-price { margin:0 0 8px; font-size:15px; font-weight:700; color:var(--ct-txt); }
.ct-wrap .ct-free-more { display:block; margin-top:18px; text-align:center; font-size:14px; color:var(--ct-main-dk); text-decoration:underline; text-underline-offset:3px; }

/* 빈 장바구니 */
.ct-wrap .ct-empty { padding:90px 20px; text-align:center; border-bottom:1px solid var(--ct-line); }
.ct-wrap .ct-empty svg { width:64px; height:64px; color:var(--ct-point); }
.ct-wrap .ct-empty-tit { margin:18px 0 6px; font-size:20px; font-weight:700; color:var(--ct-txt); }
.ct-wrap .ct-empty-txt { margin:0 0 26px; font-size:15px; color:var(--ct-txt3); }

/* 관심상품 */
.ct-wrap .ct-wish { margin-top:72px; }
.ct-wrap .ct-sec-tit { margin:0; padding-bottom:16px; border-bottom:2px solid var(--ct-txt); font-size:22px; font-weight:700; color:var(--ct-txt); }
.ct-wrap .ct-witem { grid-template-columns:72px minmax(0,1fr) 96px 118px 88px; padding:18px 0; }
.ct-wrap .ct-witem .ct-thumb { width:72px; height:72px; border-radius:8px; }
.ct-wrap .ct-witem .ct-name { font-size:15px; }
.ct-wrap .ct-wqty { display:flex; align-items:center; justify-content:center; gap:6px; font-size:14px; }
.ct-wrap .ct-wqty input { width:52px !important; height:36px !important; padding:0 8px !important; border:1px solid var(--ct-line-dk) !important; border-radius:6px; font-size:15px !important; text-align:center; }
.ct-wrap .ct-wish-empty { padding:40px 0; margin:0; text-align:center; font-size:15px; color:var(--ct-txt3); border-bottom:1px solid var(--ct-line); }

/* 모바일 하단 주문 바 */
.ct-wrap .ct-mbar { display:none; }

/* ---------- 반응형 ---------- */
@media (max-width:1080px) {
    .ct-wrap .ct-layout { grid-template-columns:minmax(0,1fr); gap:24px; }
    .ct-wrap .ct-aside { position:static; padding-top:0; }
}
@media (max-width:760px) {
    .ct-wrap { padding:0 16px 120px; font-size:14px; }
    .ct-wrap .ct-head { flex-direction:column; align-items:flex-start; gap:18px; padding-top:28px; }
    .ct-wrap .ct-title { font-size:24px; }
    .ct-wrap .ct-steps { gap:28px; }
    .ct-wrap .ct-steps li { font-size:13px; }
    .ct-wrap .ct-list-head { display:none; }
    .ct-wrap .ct-item, .ct-wrap .ct-witem { grid-template-columns:80px minmax(0,1fr) auto; grid-template-areas:"thumb info info" "qty qty price" "act act act"; row-gap:14px; column-gap:14px; padding:20px 0; }
    .ct-wrap .ct-item .ct-thumb, .ct-wrap .ct-witem .ct-thumb { grid-area:thumb; width:80px; height:80px; align-self:start; }
    .ct-wrap .ct-info { grid-area:info; }
    .ct-wrap .ct-qty, .ct-wrap .ct-wqty { grid-area:qty; justify-content:flex-start; }
    .ct-wrap .ct-price { grid-area:price; align-self:center; }
    .ct-wrap .ct-act { grid-area:act; flex-direction:row; }
    .ct-wrap .ct-act-btn { flex:1; height:38px; }
    .ct-wrap .ct-list-tools .ct-btn { flex:1; }
    .ct-wrap .ct-free-head { flex-direction:column; align-items:flex-start; }
    .ct-wrap .ct-free-list ul { grid-template-columns:repeat(2, 1fr); gap:12px; }
    .ct-wrap .ct-order-btns { display:none; }
    .ct-wrap .ct-mbar { position:fixed; left:0; right:0; bottom:0; z-index:90; display:flex; align-items:center; gap:14px; padding:12px 16px calc(12px + env(safe-area-inset-bottom, 0px)); border-top:1px solid var(--ct-line); background:#fff; box-shadow:0 -4px 16px rgba(31,35,38,.08); }
    .ct-wrap .ct-mbar-price { flex:1; display:flex; flex-direction:column; line-height:1.3; }
    .ct-wrap .ct-mbar-price span { font-size:12px; color:var(--ct-txt3); }
    .ct-wrap .ct-mbar-price strong { font-size:19px; font-weight:800; color:var(--ct-txt); }
    .ct-wrap .ct-mbar .ct-btn { flex:none; height:50px; padding:0 34px; font-size:16px; font-weight:700; }
    .ct-wrap .ct-wish { margin-top:52px; }
}
@media (prefers-reduced-motion:reduce) {
    .ct-wrap * { transition:none !important; }
}


/* BASIC css end */

