/* IMPETVS shop pages (product / cart / order / login / signup / info pages) + shared header icons.
   Prefixed shp-/hd- so it can sit next to the home page styles. */
:root{--shp-h:84px;--shp-tab-h:56px}
@media (max-width:900px){:root{--shp-h:60px;--shp-tab-h:52px}}

/* the header is mounted into a placeholder: the placeholder must not become the sticky header's (short) containing block */
[data-shp-header]{display:contents}

/* ---------- shared header (sub pages) ---------- */
.shp-hd{position:sticky;top:0;z-index:70;height:var(--shp-h);background:#000;color:#fff;font-family:var(--font-sans)}
.shp-hd *{box-sizing:border-box}
.shp-hd a{color:inherit;text-decoration:none}
.shp-hd-in{display:flex;align-items:center;justify-content:space-between;gap:16px;height:100%;padding:0 40px}
.shp-logo{font-family:var(--font-brand);font-size:39px;line-height:1;letter-spacing:.02em;white-space:nowrap}
.shp-nav{display:flex;align-items:center;gap:20px;font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap}
.shp-hd a:hover{opacity:.6}
.shp-hd a:focus-visible{outline:2px solid #fff;outline-offset:-2px}

/* ---------- icon buttons (also used by the home header) ---------- */
.hd-ics{display:flex;align-items:center;gap:4px}
.hd-ic{position:relative;display:inline-grid;place-items:center;flex:none;width:44px;height:44px;color:inherit;text-decoration:none}
.hd-ic svg{display:block;width:22px;height:22px}
.hd-ic b{position:absolute;top:3px;right:1px;display:grid;place-items:center;min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:#fff;color:#000;font:700 11px/1 var(--font-sans);letter-spacing:0;text-transform:none}
.hd-ic:hover{opacity:.6}
/* hover / keyboard-focus tooltip (mouse devices only) */
@media (hover:hover) and (pointer:fine){
[data-tip]:hover::after,[data-tip]:focus-visible::after{content:attr(data-tip);position:absolute;top:calc(100% + 6px);left:50%;transform:translateX(-50%);z-index:100;padding:7px 10px;background:#2e2f33;color:#fff;font:500 12px/1 var(--font-sans);letter-spacing:0;text-transform:none;white-space:nowrap;pointer-events:none;box-shadow:0 6px 16px rgba(0,0,0,.25)}
.hd-ic[data-tip]:hover::after,.hd-ic[data-tip]:focus-visible::after{left:auto;right:0;transform:none}
.shp-share[data-tip]:hover::after,.shp-share[data-tip]:focus-visible::after{left:auto;right:0;transform:none}
}
[data-tip]{position:relative}
@media (max-width:900px){
.shp-hd-in{padding:0 12px 0 20px;gap:8px}
.shp-logo{font-size:32px}
.shp-nav{gap:8px}
}
@media (max-width:520px){
.shp-logo{font-size:28px}
}
@media (max-width:360px){.shp-logo{font-size:24px}.hd-ics{gap:0}}

/* ---------- pages ---------- */
.shp-page{min-height:100vh;background:#fff;color:var(--label-normal-3,#171719);font-family:var(--font-sans);word-break:keep-all;overflow-wrap:anywhere;-webkit-font-smoothing:antialiased}
.shp-page *{box-sizing:border-box}
.shp-page[hidden]{display:none}
.shp-page a{color:inherit;text-decoration:none}
.shp-page a:hover{opacity:.6}
.shp-page a.shp-btn{color:#fff}
.shp-page a.shp-btn.line{color:#171719}
.shp-page a.shp-btn:hover{opacity:.85}
.shp-page a.shp-btn.line:hover{opacity:1}
.shp-page button{font-family:inherit}
.shp-wrap{max-width:1200px;margin:0 auto;padding:0 40px}
.shp-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.shp-page :focus-visible{outline:2px solid #000;outline-offset:2px}

/* buttons */
.shp-btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;height:56px;padding:0 24px;border-radius:999px;border:1px solid #000;background:#000;color:#fff;font-size:16px;font-weight:600;letter-spacing:-.01em;cursor:pointer;transition:opacity .25s}
.shp-btn:hover{opacity:.85}
.shp-btn.line{background:#fff;color:#171719;border-color:rgba(112,115,124,.52)}
.shp-btn.line:hover{opacity:1;border-color:#000}
.shp-btn[disabled],.shp-btn[aria-disabled="true"]{background:#e1e2e4;border-color:#e1e2e4;color:#878a93;cursor:not-allowed;opacity:1}
.shp-btn.sm{height:44px;font-size:14px;width:auto;display:inline-flex}
.shp-notice{margin:12px 0 0;padding:14px 16px;background:#f7f7f8;font-size:14px;line-height:1.6;color:rgba(46,47,51,.88)}
.shp-notice[hidden]{display:none}

/* ---------- product ---------- */
.shp-pd{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:72px;padding:56px 0 96px;align-items:start}
/* NOT sticky: the image sits in its place in the purchase area and scrolls away with the page */
.shp-gallery{position:static}
.shp-main{position:relative;aspect-ratio:1012/1350;background:#f7f7f8;overflow:hidden}
.shp-main img{display:block;width:100%;height:100%;object-fit:contain}
.shp-info{min-width:0}
.shp-title{margin:0;font-size:30px;line-height:1.3;font-weight:700;letter-spacing:-.04em;color:#000}
.shp-sub{margin:8px 0 0;font-size:15px;color:rgba(55,56,60,.61)}
.shp-intro{margin:20px 0 32px;font-size:16px;line-height:1.7;color:rgba(46,47,51,.88)}
.shp-accs{border-top:1px solid #171719}
.shp-acc{border-bottom:1px solid rgba(112,115,124,.32)}
.shp-acc>button{display:flex;align-items:center;justify-content:space-between;width:100%;min-height:56px;padding:0;border:0;background:none;text-align:left;font-size:15px;font-weight:600;color:#171719;cursor:pointer}
.shp-acc>button::after{content:"";flex:none;width:12px;height:12px;background:linear-gradient(#171719,#171719) center/12px 1.5px no-repeat,linear-gradient(#171719,#171719) center/1.5px 12px no-repeat}
.shp-acc>button[aria-expanded="true"]::after{background:linear-gradient(#171719,#171719) center/12px 1.5px no-repeat}
.shp-acc-p{padding:0 0 20px;font-size:14px;line-height:1.8;color:rgba(46,47,51,.88)}
.shp-acc-p[hidden]{display:none}
.shp-acc-p p{margin:0}.shp-acc-p p+p{margin-top:8px}
.shp-acc-p ul{margin:4px 0 0;padding-left:18px}.shp-acc-p li{margin:2px 0}.shp-acc-p p+ul,.shp-acc-p ul+p{margin-top:8px}
.shp-notes{display:grid;gap:10px;margin:0}
.shp-notes div{display:grid;grid-template-columns:72px minmax(0,1fr);gap:12px}
.shp-notes dt{font-weight:700;color:#000;letter-spacing:.04em}
.shp-notes dd{margin:0}
.shp-opt{margin:32px 0 0}
.shp-opt-note{margin:0 0 16px;font-size:14px;line-height:1.7;color:rgba(55,56,60,.61)}
/* capacity choice */
.shp-sizes{margin:0 0 20px;padding:0;border:0;min-width:0}
.shp-sizes legend{padding:0;margin:0 0 10px;font-size:14px;font-weight:600;color:#000}
.shp-sizes-in{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.shp-size{position:relative;display:block}
.shp-size input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.shp-size span{display:flex;align-items:center;justify-content:center;height:52px;border:1px solid rgba(112,115,124,.52);background:#fff;font-size:16px;font-weight:600;color:#171719;transition:border-color .2s,background .2s,color .2s}
.shp-size:hover span{border-color:#000}
.shp-size input:checked+span{background:#000;border-color:#000;color:#fff}
.shp-size input:focus-visible+span{outline:2px solid #000;outline-offset:2px}
.shp-sel{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 0;border-top:1px solid rgba(112,115,124,.32);border-bottom:1px solid rgba(112,115,124,.32)}
.shp-sel-name{min-width:0;font-size:15px;font-weight:600;color:#000}
.shp-sel-name small{display:block;margin-top:2px;font-size:13px;font-weight:400;color:rgba(55,56,60,.61)}
.shp-qty{display:inline-flex;flex:none;align-items:stretch;border:1px solid rgba(112,115,124,.32)}
.shp-qty button{width:44px;height:44px;border:0;background:#fff;font-size:20px;line-height:1;color:#171719;cursor:pointer}
.shp-qty button:hover{background:#f7f7f8}
.shp-qty button[disabled]{color:#c2c4c8;cursor:not-allowed;background:#fff}
.shp-qty input{width:56px;height:44px;border:0;border-left:1px solid rgba(112,115,124,.32);border-right:1px solid rgba(112,115,124,.32);text-align:center;font:600 16px/1 var(--font-sans);color:#000;background:#fff;-moz-appearance:textfield;appearance:textfield}
.shp-qty input::-webkit-outer-spin-button,.shp-qty input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
/* the only place a price is shown on the product page (desktop); on mobile the fixed bottom bar takes over */
.shp-total{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin:28px 0 24px}
.shp-total span{font-size:16px;font-weight:700;color:#000}
.shp-total b{font-size:24px;font-weight:700;letter-spacing:-.03em;color:#000;text-align:right}
.shp-total small{font-size:13px;font-weight:400;color:rgba(55,56,60,.61);margin-left:6px}
.shp-act2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px;margin-top:8px}
.shp-act2 .shp-btn{height:56px;font-size:16px;padding:0 12px}

/* ---------- detail area: tabs + sections share one centered column ---------- */
.shp-dwrap{max-width:860px;margin:0 auto}
.shp-tabs{position:sticky;top:var(--shp-h);z-index:40;background:#fff;border-bottom:1px solid rgba(112,115,124,.32)}
.shp-tabs ul{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:0;padding:0;list-style:none}
.shp-tabs a{display:flex;align-items:center;justify-content:center;height:var(--shp-tab-h);padding:0 4px;white-space:nowrap;font-size:15px;color:rgba(55,56,60,.61);border-bottom:2px solid transparent;margin-bottom:-1px}
.shp-tabs a:hover{opacity:1;color:#000}
.shp-tabs a[aria-current="true"]{color:#000;font-weight:700;border-bottom-color:#000}
.shp-sec{scroll-margin-top:calc(var(--shp-h) + var(--shp-tab-h) + 16px);padding:64px 0}
.shp-pad{padding:0 20px}
.shp-sec h2{margin:0;font-size:22px;font-weight:700;letter-spacing:-.03em;color:#000}
.shp-sec-h{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0 0 24px}
.shp-sec-h+*,.shp-sec h2+.shp-empty{margin-top:0}
.shp-sec h2:not(.x)+.shp-guide,.shp-sec h2:not(.x)+.shp-empty{margin-top:24px}
.shp-detail-img img{display:block;width:100%;height:auto}
.shp-desc{margin:0 0 40px;font-size:16px;line-height:1.9;color:rgba(46,47,51,.88);text-align:center}
.shp-empty{padding:56px 0;margin:0;text-align:center;font-size:15px;color:rgba(55,56,60,.61);border-top:1px solid rgba(112,115,124,.22);border-bottom:1px solid rgba(112,115,124,.22)}
.shp-guide{margin:0;border-top:1px solid #171719}
.shp-guide div{display:grid;grid-template-columns:160px minmax(0,1fr);gap:24px;padding:20px 0;border-bottom:1px solid rgba(112,115,124,.22)}
.shp-guide dt{font-size:15px;font-weight:700;color:#000}
.shp-guide dd{margin:0;font-size:15px;line-height:1.8;color:rgba(46,47,51,.88)}

/* mobile buy bar */
.shp-bar{display:none}

/* ---------- cart / auth ---------- */
.shp-narrow{max-width:960px;margin:0 auto;padding:56px 40px 120px}
.shp-h1{margin:0 0 32px;font-size:30px;font-weight:700;letter-spacing:-.04em;color:#000}
.shp-list{margin:0;padding:0;list-style:none;border-top:1px solid rgba(112,115,124,.22)}
.shp-item{display:grid;grid-template-columns:96px minmax(0,1fr) auto;gap:20px 24px;align-items:center;padding:24px 0;border-bottom:1px solid rgba(112,115,124,.32)}
.shp-item img{display:block;width:96px;height:128px;object-fit:contain;background:#f7f7f8}
.shp-item-name{margin:0;font-size:16px;font-weight:600;color:#000}
.shp-item-opt,.shp-item-unit{margin:4px 0 0;font-size:13px;color:rgba(55,56,60,.61)}
.shp-item-amt{margin:12px 0 0;font-size:15px;font-weight:600;color:#000}
.shp-item-side{display:grid;gap:12px;justify-items:end}
.shp-rm{min-width:44px;min-height:44px;padding:0 8px;border:0;background:none;font-size:13px;color:rgba(55,56,60,.61);text-decoration:underline;cursor:pointer}
.shp-rm:hover{color:#000}
.shp-sum{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding:28px 0}
.shp-sum span{font-size:16px;font-weight:700;color:#000}
.shp-sum b{font-size:22px;font-weight:700;color:#000;text-align:right}
.shp-cart-empty{padding:88px 0;text-align:center;border-top:1px solid rgba(112,115,124,.22);border-bottom:1px solid rgba(112,115,124,.22)}
.shp-cart-empty p{margin:0;font-size:15px;color:rgba(55,56,60,.61)}
.shp-cart-go{display:flex;justify-content:center;margin-top:40px}
.shp-cart-go .shp-btn{width:auto;padding:0 44px}
.shp-form{width:100%;max-width:390px;margin:0 auto}
.shp-form fieldset{margin:0;padding:0;border:0;min-width:0}
.shp-field{display:block;margin:0 0 20px}
.shp-field span{display:block;margin-bottom:8px;font-size:14px;font-weight:600;color:#000}
.shp-field input{display:block;width:100%;height:52px;padding:0 16px;border:1px solid rgba(112,115,124,.32);border-radius:0;background:#f7f7f8;font:400 15px/1 var(--font-sans);color:#171719}
.shp-field input:disabled{cursor:not-allowed;color:#878a93}
.shp-alt{margin:24px 0 0;text-align:center;font-size:14px;color:rgba(55,56,60,.61)}
.shp-alt a{color:#000;font-weight:600;text-decoration:underline}

/* toast */
.shp-toast{position:fixed;left:50%;bottom:32px;z-index:200;display:flex;align-items:center;gap:16px;max-width:calc(100vw - 32px);padding:14px 20px;background:#171719;color:#fff;font:500 14px/1.5 var(--font-sans);box-shadow:0 12px 40px rgba(0,0,0,.35);opacity:0;pointer-events:none;transform:translate(-50%,12px);transition:opacity .3s,transform .3s}
.shp-toast.on{opacity:1;pointer-events:auto;transform:translate(-50%,0)}
.shp-toast a{flex:none;color:#fff;font-weight:700;text-decoration:underline}

@media (max-width:900px){
.shp-wrap{padding-left:20px;padding-right:20px}
.shp-pd{grid-template-columns:minmax(0,1fr);gap:28px;padding:0 0 40px}
.shp-gallery{margin:0 -20px}
.shp-info{padding:0}
.shp-title{font-size:24px}
.shp-opt{margin-bottom:24px}
.shp-sec{padding:48px 0}
.shp-guide div{grid-template-columns:minmax(0,1fr);gap:6px}
.shp-tabs a{font-size:13px;letter-spacing:-.02em}
.shp-narrow{padding:32px 20px 96px}
.shp-h1{font-size:24px}
.shp-item{grid-template-columns:72px minmax(0,1fr);gap:12px 16px}
.shp-item img{width:72px;height:96px}
.shp-item-side{grid-column:1/-1;grid-template-columns:auto auto;justify-content:space-between;justify-items:start;align-items:center}
.shp-page.shp-has-bar{padding-bottom:calc(88px + env(safe-area-inset-bottom))}
.shp-bar{position:fixed;left:0;right:0;bottom:0;z-index:60;display:flex;align-items:center;gap:16px;padding:12px 20px calc(12px + env(safe-area-inset-bottom));background:#fff;border-top:1px solid rgba(112,115,124,.22)}
.shp-bar .shp-btn{height:52px;flex:1}
.shp-toast{bottom:96px}
}
@media (max-width:380px){.shp-tabs a{font-size:12px}}

/* ---------- login (and signup): centered, 390px column ---------- */
.shp-auth{padding:88px 20px 120px}
.shp-auth h1{margin:0 0 56px;text-align:center;font-size:30px;font-weight:700;letter-spacing:-.04em;color:#000}
.shp-in{display:block;width:100%;height:52px;padding:0 16px;border:1px solid rgba(112,115,124,.32);border-radius:0;background:#fff;font:400 15px/1 var(--font-sans);color:#171719}
.shp-in::placeholder{color:#a8abb2}
.shp-in:disabled{background:#f7f7f8;cursor:not-allowed}
.shp-in+.shp-in{margin-top:8px}
.shp-auth .shp-btn.main{margin-top:28px}
.shp-links{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:20px;font-size:13px;color:#171719}
.shp-links i{width:1px;height:12px;background:rgba(112,115,124,.52)}
.shp-links a,.shp-lk{padding:12px 2px;border:0;background:none;font:inherit;color:inherit;cursor:pointer;text-decoration:none}
.shp-links a:hover,.shp-lk:hover{text-decoration:underline;opacity:1}
.shp-note{margin:16px 0 0;font-size:13px;line-height:1.6;text-align:center;color:rgba(55,56,60,.61)}
.shp-social{display:grid;gap:8px;margin-top:40px}
.shp-sbtn{position:relative;display:flex;align-items:center;justify-content:center;width:100%;height:52px;padding:0 48px;border:0;border-radius:999px;font:600 15px/1 var(--font-sans);cursor:pointer;transition:opacity .2s}
.shp-sbtn:hover{opacity:.9}
.shp-sbtn svg{position:absolute;left:20px;top:50%;width:22px;height:22px;margin-top:-11px}
.shp-sbtn.kakao{background:#fee500;color:#191600}
.shp-sbtn.naver{background:#03c75a;color:#fff}
.shp-btn[aria-disabled="true"].main{background:#000;border-color:#000;color:#fff;cursor:pointer}
.shp-btn[aria-disabled="true"].main:hover{opacity:.85}

/* ---------- cart: wide margins, centered big title, thin rules ---------- */
.shp-cartpg{max-width:1000px;margin:0 auto;padding:96px 40px 140px}
.shp-cartpg h1{margin:0 0 72px;text-align:center;font-size:34px;font-weight:700;letter-spacing:-.04em;color:#000}
@media (max-width:900px){
.shp-auth{padding:56px 20px 88px}
.shp-auth h1{margin-bottom:40px;font-size:26px}
.shp-cartpg{padding:56px 20px 96px}
.shp-cartpg h1{margin-bottom:40px;font-size:26px}
.shp-list{border-top:0}
.shp-item{margin:0 0 12px;padding:16px;border:1px solid rgba(112,115,124,.32)}
}

/* ---------- product: title + share icon ---------- */
.shp-titlebar{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}
.shp-titlebar .shp-title{min-width:0;flex:1}
.shp-share{flex:none;display:grid;place-items:center;width:44px;height:44px;margin:-6px -10px 0 0;padding:0;border:0;background:none;color:#171719;cursor:pointer}
.shp-share:hover{opacity:.6}
.shp-share svg{display:block;width:22px;height:22px}
.shp-sec-h h2{margin:0}

/* ---------- reviews / inquiries ---------- */
.shp-cform{margin:0 0 32px;padding:24px;border:1px solid rgba(112,115,124,.32);background:#fff}
.shp-cform[hidden]{display:none}
.shp-cform .shp-field{margin:0 0 16px}
.shp-ta{height:auto;min-height:120px;padding:14px 16px;line-height:1.6;resize:vertical}
select.shp-in{appearance:auto}
.shp-rate{margin:0 0 16px;padding:0;border:0;min-width:0}
.shp-rate legend{padding:0;margin:0 0 8px;font-size:14px;font-weight:600;color:#000}
.shp-rate-in{display:flex;flex-wrap:wrap;gap:8px}
.shp-rate-in label{position:relative;display:block}
.shp-rate-in input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.shp-rate-in span{display:flex;align-items:center;min-height:44px;padding:0 16px;border:1px solid rgba(112,115,124,.52);background:#fff;font-size:14px;font-weight:600;color:#171719}
.shp-rate-in input:checked+span{background:#000;border-color:#000;color:#fff}
.shp-rate-in input:focus-visible+span{outline:2px solid #000;outline-offset:2px}
.shp-rate-in.two{flex-direction:column}
.shp-cform-act{display:flex;gap:8px}
.shp-err{margin:0 0 16px;font-size:14px;line-height:1.6;color:#c62828}
.shp-err[hidden]{display:none}
.shp-okmsg{margin:0 0 16px;padding:14px 16px;background:#f7f7f8;font-size:14px;line-height:1.7;color:#171719}
.shp-rv{padding:24px 0;border-bottom:1px solid rgba(112,115,124,.22)}
.shp-rv:first-child{border-top:1px solid #171719}
.shp-rv-h{display:flex;justify-content:space-between;gap:12px;font-size:14px}
.shp-rv-h b{color:#000}
.shp-rv-h span{flex:none;color:rgba(55,56,60,.61)}
.shp-rv-r{margin:8px 0 0;font-size:13px;color:rgba(55,56,60,.61)}
.shp-rv-t{margin:8px 0 0;font-size:15px;line-height:1.8;color:rgba(46,47,51,.88);white-space:pre-line}
.shp-lock{font-style:normal;margin-right:4px;padding:2px 6px;border:1px solid rgba(112,115,124,.52);font-size:12px;font-weight:600}
.shp-ans{margin-top:16px;padding:16px;background:#f7f7f8}
.shp-ans b{font-size:13px;color:#000}
.shp-ans p{margin:6px 0 0;font-size:14px;line-height:1.7;white-space:pre-line}
.shp-lk2{padding:12px 4px;border:0;background:none;font:inherit;color:#000;text-decoration:underline;cursor:pointer}

/* ---------- header account menu ---------- */
.hd-ic[data-on]::before{content:"";position:absolute;top:9px;right:10px;width:7px;height:7px;border-radius:50%;background:#fff}
.hd-menu{position:fixed;z-index:120;min-width:190px;padding:8px;background:#fff;color:#171719;box-shadow:0 12px 32px rgba(0,0,0,.3);font-family:var(--font-sans)}
.hd-menu-n{margin:0;padding:10px 12px;border-bottom:1px solid rgba(112,115,124,.22);font-size:13px;font-weight:700}
.hd-menu a,.hd-menu button{display:block;width:100%;min-height:44px;padding:12px;border:0;background:none;text-align:left;font:inherit;font-size:14px;color:inherit;text-decoration:none;cursor:pointer}
.hd-menu a:hover,.hd-menu button:hover{background:#f7f7f8;opacity:1}

/* ---------- info / policy pages ---------- */
.shp-doc{max-width:760px;margin:0 auto;padding:96px 20px 140px}
.shp-doc h1{margin:0 0 56px;text-align:center;font-size:34px;font-weight:700;letter-spacing:-.04em;color:#000}
.shp-doc h2{margin:48px 0 16px;font-size:20px;font-weight:700;letter-spacing:-.03em;color:#000}
.shp-doc p,.shp-doc li{font-size:15px;line-height:1.9;color:rgba(46,47,51,.88)}
.shp-doc p{margin:0 0 12px}
.shp-doc ul{margin:0 0 12px;padding-left:20px}
.shp-banner{margin:0 0 40px;padding:20px 24px;background:#f7f7f8;font-size:15px;line-height:1.7;text-align:center;color:#171719}
.shp-todo{color:rgba(55,56,60,.61)}
.shp-doc .shp-form{max-width:520px}
.shp-doc .shp-field{margin:0 0 20px}
.shp-faqcat{margin:48px 0 0}
.shp-faqcat h2{margin:0 0 12px}
.shp-faqcat{margin:0}
.shp-faq .sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.shp-ftabs{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 24px}
.shp-ftabs button{flex:0 0 auto;min-height:44px;padding:0 18px;border:1px solid rgba(112,115,124,.32);border-radius:22px;background:#fff;font:inherit;font-size:15px;color:#171719;cursor:pointer}
.shp-ftabs button[aria-selected="true"]{background:#171719;border-color:#171719;color:#fff;font-weight:700}
.shp-ftabs button:focus-visible{outline:2px solid #171719;outline-offset:2px}
@media (max-width:480px){.shp-ftabs{gap:6px}.shp-ftabs button{padding:0 14px;font-size:14px}}
.shp-faq .shp-acc>button{font-size:16px;line-height:1.5;padding:14px 0}
.shp-faq .shp-acc-p{font-size:15px;line-height:1.9}
.shp-nl{margin:0;padding:0;list-style:none;border-top:1px solid #171719}
.shp-nl>li{border-bottom:1px solid rgba(112,115,124,.22)}
.shp-nl button{display:flex;justify-content:space-between;gap:16px;width:100%;min-height:56px;padding:16px 0;border:0;background:none;text-align:left;font:inherit;font-size:16px;color:#171719;cursor:pointer}
.shp-nl button span{flex:none;font-size:13px;color:rgba(55,56,60,.61)}
.shp-adm{display:flex;gap:8px;margin:0 0 24px}
.shp-adm[hidden],[data-shp-header] [hidden],main [hidden]{display:none!important}
.shp-ndetail{padding:24px 0;border-top:1px solid #171719;border-bottom:1px solid rgba(112,115,124,.22)}
.shp-ndetail h2{margin:0 0 8px}
.shp-ndetail time{display:block;margin:0 0 20px;font-size:13px;color:rgba(55,56,60,.61)}
.shp-ndetail div{font-size:15px;line-height:1.9;white-space:pre-line;color:rgba(46,47,51,.88)}
.shp-hist{margin:48px 0 0}

/* ---------- order ---------- */
.shp-order{max-width:1000px;margin:0 auto;padding:96px 40px 140px}
.shp-order>h1{margin:0 0 56px;text-align:center;font-size:34px;font-weight:700;letter-spacing:-.04em;color:#000}
.shp-ogrid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:56px;align-items:start}
.shp-box{margin:0 0 40px}
.shp-box h2{margin:0 0 16px;font-size:18px;font-weight:700;letter-spacing:-.02em;color:#000}
.shp-fgrid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 12px}
.shp-fgrid .full{grid-column:1/-1}
.shp-chk{display:flex;align-items:flex-start;gap:10px;margin:0 0 12px;font-size:14px;line-height:1.6;color:#171719;cursor:pointer}
.shp-chk input{flex:none;width:20px;height:20px;margin:1px 0 0;accent-color:#000}
.shp-chk a{text-decoration:underline}
.shp-osum{border-top:1px solid #171719;padding-top:8px}
.shp-orow{display:flex;justify-content:space-between;gap:16px;padding:12px 0;font-size:15px;color:#171719}
.shp-orow.t{padding-top:20px;border-top:1px solid rgba(112,115,124,.22);font-weight:700}
.shp-orow.t b{font-size:22px}
.shp-orow .muted{color:rgba(55,56,60,.61);font-size:14px}

@media (max-width:900px){
.shp-doc{padding:56px 20px 96px}
.shp-doc h1,.shp-order>h1{margin-bottom:36px;font-size:26px}
.shp-order{padding:56px 20px 96px}
.shp-ogrid{grid-template-columns:minmax(0,1fr);gap:8px}
.shp-fgrid{grid-template-columns:minmax(0,1fr)}
.shp-cform{padding:16px}
.shp-share{margin-right:-10px}
}

/* ---- shared footer for every shop / info page (same look as the home footer .pf) ---- */
.shp-ft{background:#000;color:rgba(255,255,255,.6);font-family:var(--font-sans);padding:80px 20px 0}
.shp-ft *{box-sizing:border-box}
.shp-ft a{color:inherit;text-decoration:none}.shp-ft a:hover{color:#fff}
.shp-ft-top{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 20px;font-size:13px;line-height:1.8;padding-bottom:56px;max-width:1440px;margin:0 auto}
.shp-ft-top>div:nth-child(1),.shp-ft-top>div:nth-child(2),.shp-ft-top>div:nth-child(5){grid-column:1/-1}
.shp-ft-top>div{min-width:0;overflow-wrap:anywhere}
.shp-ft-l{display:block;margin-bottom:8px;color:#fff;font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase}
.shp-ft ul{margin:0;padding:0;list-style:none}.shp-ft li a{display:inline-block;padding:2px 0}
.shp-ft-bot{display:flex;flex-direction:column;gap:6px;justify-content:space-between;padding:20px 0 28px;font-size:12px;letter-spacing:.08em;text-transform:uppercase;box-shadow:inset 0 1px 0 rgba(255,255,255,.18);max-width:1440px;margin:0 auto}
@media (min-width:901px){
.shp-ft{padding:120px 40px 0}
.shp-ft-top{grid-template-columns:repeat(5,auto);justify-content:center;column-gap:clamp(32px,4.5vw,88px);font-size:12px;padding-bottom:64px}
.shp-ft-top>div:nth-child(1),.shp-ft-top>div:nth-child(2),.shp-ft-top>div:nth-child(5){grid-column:auto}
.shp-ft-bot{flex-direction:row}
}
@media (max-width:900px){#product-root~.shp-ft{padding-bottom:calc(88px + env(safe-area-inset-bottom))}}

/* ---- shipping summary / notes, numbered steps ---- */
.shp-shipnote{margin:12px 0 0;font-size:13px;line-height:1.7;color:rgba(55,56,60,.72);word-break:keep-all}
.shp-cartsum{margin:20px 0 4px}
.shp-steps{margin:0 0 20px;padding-left:22px;line-height:1.8}
.shp-steps li{margin:0 0 8px;word-break:keep-all}

/* ---- cost table on the returns page ---- */
.shp-tablewrap{overflow-x:auto;margin:0 0 16px}
.shp-table{width:100%;border-collapse:collapse;font-size:15px;line-height:1.6}
.shp-table th,.shp-table td{padding:12px 14px;text-align:left;vertical-align:top;border-bottom:1px solid rgba(112,115,124,.22);word-break:keep-all}
.shp-table thead th{font-weight:700;border-bottom:1px solid #000}
.shp-table td:first-child{width:56%}
@media (max-width:520px){.shp-table{font-size:14px}.shp-table th,.shp-table td{padding:10px 8px}}

/* ---- payment result pages ---- */
.shp-banner.ok{background:#000;color:#fff}
.shp-kv{margin:0 0 20px;border-top:1px solid #000}
.shp-kv div{display:grid;grid-template-columns:140px minmax(0,1fr);gap:16px;padding:14px 0;border-bottom:1px solid rgba(112,115,124,.22);font-size:15px}
.shp-kv dt{font-weight:700}.shp-kv dd{margin:0;word-break:break-all}
@media (max-width:520px){.shp-kv div{grid-template-columns:minmax(0,1fr);gap:4px}}

/* ---- footer (shop pages): business info column ---- */
@media (min-width:901px){.shp-ft-top{grid-template-columns:minmax(0,2.3fr) repeat(4,auto);justify-content:stretch;column-gap:clamp(28px,3.6vw,72px)}}

.shp-ft-co{word-break:keep-all;overflow-wrap:anywhere}
.shp-ft-co p{margin:0}.shp-ft-co p+p{margin-top:2px}
.shp-ft-co .shp-ft-legal{margin-top:var(--pf-legal-gap,28px)}   /* the gap is CSS spacing, not blank lines */
/* cart: short shipping note under the total; >= 24px before the order button */
.shp-cartnote{margin:16px 0 24px}
#cart-pay-note{margin-bottom:24px}
/* phone line breaks: balanced / no orphan words; PC forced breaks become spaces; long addresses and e-mails wrap inside the screen */
@media (max-width:640px){
  .shp-desc br{display:none}
  .shp-page :is(p,li,dd,td,.shp-note,.shp-notice){text-wrap:pretty}
  .shp-page :is(h1,h2,h3){text-wrap:balance}
  .shp-page :is(a,dd,td,li,p){overflow-wrap:anywhere}
}

/* ---------- share menu ---------- */
.shp-sh-ov{position:fixed;inset:0;z-index:1200;font-family:var(--font-sans);word-break:keep-all;overflow-wrap:anywhere}
.shp-sh{position:fixed;left:0;right:0;bottom:0;max-height:80vh;overflow:auto;box-sizing:border-box;padding:20px 20px calc(20px + env(safe-area-inset-bottom));background:#fff;color:#171719;border-radius:16px 16px 0 0;box-shadow:0 -12px 40px rgba(0,0,0,.28);outline:0}
.shp-sh-ov{background:rgba(0,0,0,.45)}
.shp-sh-lock{overflow:hidden}
.shp-sh-h{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 8px}
.shp-sh-h h2{margin:0;font-size:18px;font-weight:700;letter-spacing:-.03em;color:#000}
.shp-sh-x{display:grid;place-items:center;flex:none;width:44px;height:44px;margin:-8px -12px -8px 0;padding:0;border:0;background:none;color:#171719;cursor:pointer}
.shp-sh-x svg{width:22px;height:22px}
.shp-sh-l{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:0;padding:0;list-style:none}
.shp-sh-i{display:flex;align-items:center;gap:10px;width:100%;min-height:48px;padding:0 14px;box-sizing:border-box;border:1px solid rgba(112,115,124,.32);border-radius:8px;background:#fff;color:#171719;font:inherit;font-size:15px;text-decoration:none;text-align:left;cursor:pointer}
.shp-sh-i svg{flex:none;width:22px;height:22px}
.shp-sh-i:hover{background:#f7f7f8}
.shp-sh-i:disabled{opacity:.4;cursor:not-allowed}
.shp-sh-i:focus-visible,.shp-sh-x:focus-visible{outline:2px solid #171719;outline-offset:2px}
.shp-sh-u{margin:12px 0 0;padding:10px 12px;background:#f7f7f8;border-radius:8px;font-size:13px;line-height:1.6;color:rgba(55,56,60,.72);user-select:all}
.shp-sh-m{min-height:1.6em;margin:8px 0 0;font-size:14px;line-height:1.6;color:#171719}
@media (min-width:641px){
  .shp-sh-ov{background:transparent}
  .shp-sh{left:auto;right:auto;bottom:auto;width:300px;max-height:calc(100vh - 24px);padding:16px;border-radius:12px;border:1px solid rgba(112,115,124,.32);box-shadow:0 12px 32px rgba(0,0,0,.18)}
  .shp-sh-lock{overflow:visible}
}
.shp-sh-i small{display:block;font-size:12px;line-height:1.3;color:rgba(55,56,60,.72)}

/* sign-up: "all agree" box */
.su-all{padding:0 0 12px;margin:0 0 12px;border-bottom:1px solid rgba(112,115,124,.32)}
.su-all b{font-weight:700}
.su-msg.shp-err,.su-msg.shp-okmsg,.su-msg.shp-note{font-size:14px;line-height:1.6}

/* confirmation window (회원탈퇴): centred, never wider than the screen, buttons >= 48px */
.shp-dlg-ov{position:fixed;inset:0;z-index:1300;display:grid;place-items:center;padding:20px;background:rgba(0,0,0,.55);font-family:var(--font-sans);word-break:keep-all;overflow-wrap:anywhere}
.shp-dlg{box-sizing:border-box;width:100%;max-width:400px;max-height:calc(100vh - 40px);overflow:auto;padding:28px 24px 24px;background:#fff;color:#171719;border-radius:12px;box-shadow:0 20px 60px rgba(0,0,0,.35);outline:0}
.shp-dlg-t{margin:0 0 12px;font-size:20px;font-weight:700;letter-spacing:-.03em;color:#000}
.shp-dlg-d{margin:0 0 24px;font-size:16px;line-height:1.7}
.shp-dlg-a{display:flex;gap:10px}
.shp-dlg-a .shp-btn{flex:1 1 0;min-width:0;min-height:48px}
.shp-dlg-lock{overflow:hidden}

/* controlled line breaks: .shp-ln = one line (may wrap further on narrow screens, words stay whole); .shp-nw = never split (for a short ending such as "보내 드립니다.") */
.shp-ln{display:block}
.shp-nw{white-space:nowrap}
.su-msg a{text-decoration:underline}

/* legal tables with 3+ columns: on phones each row becomes a card, the column name sits above each value (no one-character-per-line columns) */
@media (max-width:700px){
  .shp-table-stack,.shp-table-stack tbody,.shp-table-stack tr,.shp-table-stack td{display:block;width:auto}
  .shp-table-stack thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .shp-table-stack tr{padding:6px 0 10px;border-bottom:1px solid #000}
  .shp-table-stack td,.shp-table-stack td:first-child{width:auto;padding:6px 2px;border-bottom:0}
  .shp-table-stack td::before{content:attr(data-label);display:block;margin:0 0 2px;font-size:12px;font-weight:700;letter-spacing:0;color:#70737c}
  .shp-table-stack td:first-child{font-weight:700}
}
/* postal-address pieces that must not break in the middle (house number "30-12", floor "2F") */
.shp-nb{white-space:nowrap}

/* buy buttons carry the same shadow as the 카카오톡 상담 button (default / hover / focus alike) */
.shp-bar .shp-btn{overflow:visible}

/* shipping item names (배송업체 ...) are as bold as the 교환 및 반품 주소 title */
.shp-k{font-weight:700;color:#000}
/* dot bullets in the shopping guide: the text of a wrapped line starts at the text start, not under the dot */
.shp-dots{margin:0;padding:0;list-style:none}
.shp-dots li{position:relative;padding-left:14px}
.shp-dots li+li{margin-top:2px}
.shp-dots li::before{content:"";position:absolute;left:3px;top:.82em;width:4px;height:4px;border-radius:50%;background:currentColor}

/* login: 자동 로그인 box, three links under the button, ID/PW 찾기 tabs */
.shp-auto{margin:14px 0 0}
.shp-auto-n{margin:4px 0 0 30px;font-size:12px}
.shp-links3{flex-wrap:wrap;row-gap:0;column-gap:12px}
.shp-links3 a,.shp-links3 .shp-lk{white-space:nowrap}
.fd-tabs{display:grid;grid-template-columns:1fr 1fr;margin:0 0 28px;border-bottom:1px solid rgba(112,115,124,.32)}
.fd-tabs button{min-height:48px;padding:0 8px;border:0;border-bottom:2px solid transparent;margin-bottom:-1px;background:none;font:600 16px/1.2 var(--font-sans);color:rgba(55,56,60,.61);cursor:pointer}
.fd-tabs button[aria-selected="true"]{color:#000;border-bottom-color:#000}
.shp-meth{display:flex;gap:20px;margin:0 0 16px;padding:0;border:0}
.shp-meth legend{padding:0;margin:0 0 8px;font-size:13px;font-weight:600;color:rgba(55,56,60,.8)}
.shp-meth label{display:flex;align-items:center;gap:8px;min-height:44px;font-size:15px;color:#171719;cursor:pointer}
.shp-meth input{width:20px;height:20px;margin:0;accent-color:#000}
.shp-hlp{margin:-4px 0 12px;font-size:13px}

/* ===== MY PAGE: wide margins, thin lines, greeting box on top, menu on the left / content on the right (one column on phones) ===== */
.shp-my{max-width:1200px;margin:0 auto;padding:48px 20px 120px;box-sizing:border-box}
.my-hello{padding:36px 40px;border:1px solid rgba(112,115,124,.32)}
.my-hello h1{margin:0 0 10px;font-size:28px;font-weight:700;letter-spacing:-.04em;line-height:1.35;color:#000;word-break:keep-all;overflow-wrap:anywhere}
.my-hello p{margin:0;font-size:14px;color:rgba(55,56,60,.72)}
.my-grid{display:grid;grid-template-columns:240px minmax(0,1fr);gap:56px;margin-top:40px;align-items:start}
.my-g{padding:0 0 22px;margin:0 0 22px;border-bottom:1px solid rgba(112,115,124,.22)}
.my-g:last-child{border-bottom:0}
.my-g h2{margin:0 0 6px;font-size:13px;font-weight:500;color:rgba(55,56,60,.5)}
.my-nav button{display:block;width:100%;min-height:44px;padding:8px 0;border:0;background:none;text-align:left;font:500 16px/1.4 var(--font-sans);color:#171719;cursor:pointer;letter-spacing:-.02em}
.my-nav button:hover{text-decoration:underline}
.my-nav button[aria-current="page"]{font-weight:700;color:#000}
.my-main{min-width:0;outline:0}
.my-t{margin:0 0 20px;padding:0 0 16px;border-bottom:1px solid #000;font-size:20px;font-weight:700;letter-spacing:-.03em;color:#000}
.my-t3{margin:32px 0 12px;font-size:16px;font-weight:700;color:#000}
.my-empty{padding:56px 0;text-align:center;border-bottom:1px solid rgba(112,115,124,.22)}
.my-rg{display:flex;flex-wrap:wrap;gap:12px 20px;align-items:center;margin:0 0 20px}
.my-chips{display:flex;flex-wrap:wrap;gap:6px}
.my-chips button{min-height:40px;padding:0 14px;border:1px solid rgba(112,115,124,.4);background:#fff;font:500 14px/1 var(--font-sans);color:#171719;cursor:pointer}
.my-chips button[aria-pressed="true"]{background:#000;border-color:#000;color:#fff}
.my-dates{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.my-dates input{height:40px;padding:0 10px;border:1px solid rgba(112,115,124,.4);font:400 14px var(--font-sans);color:#171719;background:#fff;box-sizing:border-box}
.my-dates .shp-btn{width:auto;height:40px;padding:0 18px;font-size:14px}
.my-tbl{border-top:0}
.my-tr{display:grid;grid-template-columns:104px 150px minmax(0,1fr) 110px 90px;gap:16px;align-items:center;padding:14px 8px;border-bottom:1px solid rgba(112,115,124,.22);font-size:14px}
.my-th{padding:12px 8px;font-size:13px;color:rgba(55,56,60,.61);border-bottom:1px solid rgba(112,115,124,.32)}
.my-no .shp-lk2{padding:6px 0;text-align:left;word-break:break-all}
.my-pi{display:flex;align-items:center;gap:12px;min-width:0}
.my-pi img,.my-items img,.my-ph{width:64px;height:64px;object-fit:cover;flex:none;background:#f4f4f5}
.my-ph{display:inline-block}
.my-am{text-align:right;font-weight:600}
.my-dl{margin:0 0 8px;border-top:1px solid rgba(112,115,124,.22)}
.my-dl div{display:grid;grid-template-columns:120px minmax(0,1fr);gap:16px;padding:12px 0;border-bottom:1px solid rgba(112,115,124,.22);font-size:15px}
.my-dl dt{color:rgba(55,56,60,.72)}.my-dl dd{margin:0;word-break:keep-all;overflow-wrap:anywhere}
.my-items{margin:0;padding:0;list-style:none;border-top:1px solid rgba(112,115,124,.22)}
.my-items li{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid rgba(112,115,124,.22);font-size:15px}
.my-items li span{flex:1;min-width:0}
.my-form{max-width:520px}
.my-btns{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.my-btns .shp-btn{width:auto;flex:1 1 160px}
.my-nt{margin:24px 0 0;font-size:13px;line-height:1.7}
.my-hlp{margin:-4px 0 12px;font-size:13px}
.my-cur{margin:0 0 12px;font-size:15px;color:#171719;word-break:break-all}
.my-soon{margin:0;padding:32px 24px;border:1px solid rgba(112,115,124,.32);font-size:15px;line-height:1.8;color:#171719}
.my-rv,.my-iq{margin:0;padding:0;list-style:none;border-top:1px solid rgba(112,115,124,.22)}
.my-rv li{padding:18px 0;border-bottom:1px solid rgba(112,115,124,.22)}
.my-rvh{display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px 12px;font-size:15px}
.my-rvh span{font-size:13px;color:rgba(55,56,60,.61)}
.my-star{margin:4px 0 6px;font-size:14px;letter-spacing:2px;color:#000}.my-star i{font-style:normal;color:rgba(112,115,124,.4)}
.my-rv p{margin:0;font-size:15px;line-height:1.7;word-break:keep-all;overflow-wrap:anywhere}
.my-act{margin-top:6px;font-size:13px}
.my-iq li{border-bottom:1px solid rgba(112,115,124,.22)}
.my-iqh{display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px 12px;width:100%;min-height:48px;padding:14px 0;border:0;background:none;text-align:left;font:500 15px/1.5 var(--font-sans);color:#171719;cursor:pointer}
.my-iqt{flex:1 1 220px;min-width:0;word-break:keep-all;overflow-wrap:anywhere}.my-iqt em{font-style:normal;font-size:12px;color:rgba(55,56,60,.61)}
.my-iqm{font-size:13px;color:rgba(55,56,60,.61)}
.my-iqb{padding:0 0 16px;font-size:14px;line-height:1.7;word-break:keep-all;overflow-wrap:anywhere}.my-iqb p{margin:0 0 8px}
.my-ans{padding:12px 14px;background:#f7f7f8}.my-ans b{display:block;margin-bottom:4px}
@media (max-width:900px){
  .shp-my{padding:28px 20px 88px}
  .my-hello{padding:24px 20px}.my-hello h1{font-size:22px}
  .my-grid{grid-template-columns:minmax(0,1fr);gap:28px;margin-top:28px}
  .my-nav{display:block}
  .my-g{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 16px;padding:0 0 12px;margin:0 0 12px}
  .my-g h2{grid-column:1 / -1}
  .my-g:last-child{border-bottom:1px solid rgba(112,115,124,.22);margin-bottom:0}
  .my-nav button{font-size:15px;min-height:44px}
  .my-tr.my-th{display:none}
  .my-tr{grid-template-columns:minmax(0,1fr) auto;gap:6px 12px;padding:16px 0}
  .my-d{grid-column:1;font-size:13px;color:rgba(55,56,60,.72)}.my-st{grid-column:2;grid-row:1;text-align:right;font-weight:600}
  .my-no{grid-column:1 / -1}.my-pi{grid-column:1 / -1}.my-am{grid-column:1 / -1;text-align:left}
  .my-dl div{grid-template-columns:96px minmax(0,1fr);gap:12px}
}

/* ID/PW 찾기: centred, compact */
.fd-tabs button{font-size:16px}
.fd-meth{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:4px 22px;margin:0 0 20px}
.fd-ml{font-size:14px;font-weight:600;color:rgba(55,56,60,.8)}
.fd-meth label{display:flex;align-items:center;gap:8px;min-height:44px;font-size:15px;color:#171719;cursor:pointer}
.fd-meth input{width:20px;height:20px;margin:0;accent-color:#000}
[data-mode="find"] .shp-form{max-width:none}
[data-mode="find"] .shp-btn.main{margin-top:20px}
[data-mode="find"] .shp-in+.shp-in,[data-mode="find"] .shp-in+div{margin-top:8px}
.shp-btn.is-off{opacity:.45;cursor:not-allowed}
@media (max-width:900px){.shp-auth{padding-left:20px;padding-right:20px}}

/* shopping guide (상품 하단 쇼핑가이드): body text is regular weight and ONE colour; item names inside it are not bold. The product top notice keeps its own bold item names (.shp-k elsewhere). */
.shp-guide dd,.shp-guide dd *{font-weight:400}
.shp-guide dd .shp-k{font-weight:400;color:inherit}
.shp-guide dd a{color:inherit}

/* product detail tab bar on phones: left / right gutter like the content, names stay on one line and never overlap; if they do not all fit, only the tab bar scrolls sideways */
@media (max-width:900px){
  .shp-tabs ul{display:flex;overflow-x:auto;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding:0 20px;scroll-padding:0 20px}
  .shp-tabs ul::-webkit-scrollbar{display:none}
  .shp-tabs li{flex:1 0 auto}
  .shp-tabs a{padding:0 12px;white-space:nowrap}
}

/* MY PAGE: title only */
.my-title{margin:0 0 8px;padding:0 0 20px;border-bottom:1px solid #000;font-size:28px;font-weight:700;letter-spacing:-.04em;color:#000}
@media (max-width:900px){.my-title{font-size:22px}}
/* 배송지 관리 */
.ab-count{margin:-4px 0 12px;font-size:14px;color:rgba(55,56,60,.72)}
.ab-tbl{border-top:1px solid #000}
.ab-tr{display:grid;grid-template-columns:84px minmax(120px,1.1fr) 90px 108px 120px minmax(0,2fr) 76px;gap:12px;align-items:center;padding:14px 8px;border-bottom:1px solid rgba(112,115,124,.22);font-size:14px;line-height:1.5;word-break:keep-all;overflow-wrap:anywhere}
.ab-th{padding:12px 8px;font-size:13px;color:rgba(55,56,60,.72);background:#fafafa}
.ab-th span,.ab-pin{text-align:center}
.ab-chk{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;cursor:pointer}
.ab-chk input{width:20px;height:20px;margin:0;accent-color:#000}
.ab-nm b{font-weight:600}
.ab-badge{margin-left:4px;padding:2px 6px;border:1px solid #000;font-style:normal;font-size:11px;font-weight:600}
.ab-lnk{display:block;margin-top:2px;padding:6px 0;border:0;background:none;font:inherit;font-size:12px;color:rgba(55,56,60,.72);text-decoration:underline;cursor:pointer}
.ab-ed .shp-btn{width:auto;height:40px;padding:0 14px;font-size:13px}
.ab-empty{padding:72px 0;text-align:center;font-size:15px;color:rgba(55,56,60,.72);border-top:1px solid #000;border-bottom:1px solid rgba(112,115,124,.22)}
.ab-add{display:flex;justify-content:center;margin:28px 0 0}
.ab-add .shp-btn{width:auto;min-width:200px}
.ab-full{text-align:center}
.ab-notes{margin:48px 0 0;padding:24px 0 0;border-top:1px solid rgba(112,115,124,.32)}
.ab-notes h3{margin:0 0 10px;font-size:15px;font-weight:700;color:#000}
.ab-notes ul{margin:0;padding-left:18px}
.ab-notes li{margin:0 0 6px;font-size:13px;line-height:1.7;color:rgba(55,56,60,.8);word-break:keep-all;overflow-wrap:anywhere}
.ab-del{margin-top:20px;text-align:center}
@media (max-width:900px){
  .ab-th{display:none}
  .ab-tbl{border-top:0}
  .ab-tr{grid-template-columns:minmax(0,1fr) auto;gap:6px 12px;padding:16px;margin:0 0 12px;border:1px solid rgba(112,115,124,.32)}
  .ab-tr>span[data-l]{display:grid;grid-template-columns:84px minmax(0,1fr);gap:8px;grid-column:1 / -1}
  .ab-tr>span[data-l]::before{content:attr(data-l);font-size:12px;color:rgba(55,56,60,.6)}
  .ab-ed{grid-column:1 / -1}.ab-ed .shp-btn{width:100%;height:44px}
  .ab-pin{align-items:center}.ab-pin .ab-chk{justify-self:start;margin:-8px 0 -8px -10px}
}
/* 회원 정보 수정: thin lines, label left / input right */
.pf-form{border-top:1px solid #000}
.pf-row{display:grid;grid-template-columns:170px minmax(0,1fr);align-items:center;gap:16px;padding:14px 8px;border-bottom:1px solid rgba(112,115,124,.22)}
.pf-l{font-size:14px;font-weight:600;color:#171719}
.pf-req{font-style:normal;color:#d92d20}
.pf-v .shp-in{max-width:420px}
.pf-v .shp-in[readonly]{background:#f4f4f5;color:rgba(55,56,60,.8)}
.pf-ph{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:8px;max-width:420px}
.pf-ph .shp-in{min-width:0;padding-left:8px;padding-right:8px;text-align:center}
.pf-txt{font-size:14px;line-height:1.6;word-break:keep-all;overflow-wrap:anywhere}
.pf-res{margin:20px 0 0}
.pf-res p{margin:0 0 6px;font-size:14px}
.pf-sum{font-weight:700;color:#000}.pf-sum.is-part{color:#b54708}
.pf-wait{color:#b54708}
.pf-btns{display:flex;gap:10px;justify-content:center;margin:32px 0 0}
.pf-btns .shp-btn{width:auto;flex:1 1 0;max-width:220px}
.pf-out{margin:20px 0 0;text-align:center;font-size:13px}
@media (max-width:900px){
  .pf-row{grid-template-columns:minmax(0,1fr);gap:6px;padding:14px 0}
  .pf-v .shp-in,.pf-ph{max-width:none}
  .pf-btns .shp-btn{max-width:none}
}

/* ---- reference layouts (2nd round) ---- */
/* ID/PW 찾기: narrow centred column */
[data-mode="find"]{max-width:376px;margin:0 auto}
[data-mode="find"] h1{margin-bottom:48px}
.fd-tabs{margin-bottom:32px}
.fd-tabs button{font-weight:700;color:#9a9a9a;border-bottom-width:1px}
.fd-tabs button[aria-selected="true"]{color:#222;border-bottom-color:#222}
.fd-meth{display:block;margin:0 0 16px}
.fd-ml{display:block;margin:0 0 6px;font-size:15px;font-weight:600;color:#000}
.fd-rd{display:flex;flex-wrap:wrap;gap:0 24px}
[data-mode="find"] .shp-in{height:60px;padding:0 20px;border-radius:0}
/* 배송지 관리 */
.ab-th{background:none;color:#000;font-size:14px;font-weight:500;border-bottom:1px solid #ddd}
.ab-tbl{border-top:0}
.ab-empty{padding:64px 0 72px;color:#999;border-top:0;border-bottom:1px solid #ddd}
.ab-empty::before{content:"!";display:block;margin:0 auto 18px;width:62px;height:62px;border:2px solid #ddd;border-radius:50%;line-height:58px;font-size:30px;color:#ddd}
.ab-add{margin:12px 0 0}
.ab-add .shp-btn{width:136px;min-width:0;height:40px;border-radius:0;background:#1a1a1a;border-color:#1a1a1a;font-size:14px;font-weight:500}
.ab-notes{border-top:0;padding-top:0}
.ab-notes h3{margin:0 0 20px;padding:0 0 12px;border-bottom:2px solid #000;font-size:16px}
.ab-notes ul{padding-left:14px}.ab-notes li{font-size:12px;color:#777}
/* 회원 정보 수정 */
.pf-head{display:flex;justify-content:space-between;align-items:baseline;margin:0 0 0;padding:0 0 12px;border-bottom:1px solid #000}
.pf-head h3{margin:0;font-size:16px;font-weight:700;color:#000}.pf-head span{font-size:12px;color:#555}
.pf-form{border-top:0}
.pf-l{position:relative;padding-left:20px;font-weight:500}
.pf-req{position:absolute;left:4px;top:0;font-style:normal;color:#e5484d}
.pf-head .pf-req{position:static;margin-right:4px}
.pf-row{padding:12px 0;border-bottom:1px solid #eee}
.pf-eye{position:relative;max-width:420px}.pf-eye .shp-in{padding-right:48px}
.pf-eyeb{position:absolute;right:4px;top:50%;width:44px;height:44px;margin-top:-22px;border:0;background:none;color:#555;cursor:pointer}
select.shp-in{appearance:auto;height:56px}
.pf-btns{margin:28px 0 0;gap:12px;justify-content:flex-start;max-width:none}
.pf-btns .shp-btn{max-width:none;border-radius:0;height:56px}
.pf-btns .shp-btn.main{background:#1a1a1a;border-color:#1a1a1a}
.pf-out{margin:24px 0 0;text-align:left}
.pf-outb{display:inline-flex;align-items:center;min-height:44px;padding:0 18px;border:1px solid #ccc;font-size:14px;color:#222;text-decoration:none}
@media (max-width:900px){.pf-row{padding:12px 0}.pf-l{padding-left:14px}.pf-ph{grid-template-columns:minmax(0,1.1fr) auto minmax(0,1fr) auto minmax(0,1fr)}.pf-ph select.shp-in{padding-left:8px;padding-right:2px}}

/* ===== 3rd round ===== */
/* product top notice: the shipping item names take the same colour as the text next to them (weight stays bold) */
.shp-acc-p .shp-k{color:inherit}
/* mobile tab bar: ONE continuous grey base line (on the bar), the selected tab draws a 3px black line exactly over it: no gap, no height change */
@media (max-width:900px){
  .shp-tabs{border-bottom:0}
  .shp-tabs ul{box-shadow:inset 0 -1px 0 rgba(112,115,124,.32)}
  .shp-tabs a{margin-bottom:0;border-bottom:0}
  .shp-tabs a[aria-current="true"]{box-shadow:inset 0 -3px 0 #000}
}
/* MY PAGE (shared by every MY PAGE page): the title has no line under it, and the menu / the content start at the same top */
.my-title{margin:0 0 40px;padding:0;border-bottom:0}
.shp-my .my-t{margin:0 0 20px;padding:0 0 16px;line-height:28px}
.shp-my .my-g h2{margin:0 0 6px;line-height:28px}
.my-nav a{display:block;min-height:44px;padding:8px 0;box-sizing:border-box;font:500 16px/1.4 var(--font-sans);letter-spacing:-.02em;color:#171719;text-decoration:none}
.my-nav a:hover{text-decoration:underline;opacity:1}
.my-nav a[aria-current="page"]{font-weight:700;color:#000}
.my-logout{display:block;width:100%;min-height:44px;padding:8px 0;border:0;background:none;text-align:left;font:500 16px/1.4 var(--font-sans);color:#171719;cursor:pointer}
.my-logout:hover{text-decoration:underline}
.my-back{display:none}
.mt-tabs{display:grid;grid-template-columns:1fr 1fr;margin:0 0 20px;border-bottom:1px solid rgba(112,115,124,.32)}
.mt-tabs a{display:flex;align-items:center;justify-content:center;min-height:48px;margin-bottom:-1px;border-bottom:2px solid transparent;font-size:15px;font-weight:500;color:rgba(55,56,60,.61);text-decoration:none}
.mt-tabs a[aria-selected="true"]{color:#000;font-weight:700;border-bottom-color:#000}
.my-sel{width:100%;height:48px;padding:0 12px;border:1px solid rgba(112,115,124,.4);background:#fff;font:400 14px var(--font-sans);color:#171719;box-sizing:border-box;border-radius:0}
.my-rg .my-sel{flex:1 1 100%}
.my-ask{display:inline-flex;width:auto;min-width:160px;margin:0 0 8px}
.my-empty-i::before,.my-empty::before{content:none}
.my-empty-i{padding:48px 0}
.my-empty-i::before{content:"!";display:block;margin:0 auto 14px;width:52px;height:52px;border:2px solid #ddd;border-radius:50%;line-height:48px;font-size:26px;color:#ddd}
/* 배송지 관리 list: every value centred under its column, vertically centred; long addresses wrap inside their cell */
.ab-tr{align-items:center;justify-items:center;text-align:center}
.ab-nm{display:flex;flex-direction:column;align-items:center}
.ab-ad{text-align:center}
.ab-chk{margin:0}
/* address block (one item): zip + 주소검색, base address, rest of the address */
.ab-addr{display:block;margin:0 0 20px}
.ab-addr>span{display:block;margin:0 0 8px}
.ab-zr{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;margin:0 0 8px}
.ab-zr .shp-btn{width:auto;min-width:96px;height:auto;padding:0 18px;font-size:15px}
.ab-addr>.shp-in{margin:0 0 8px}
.shp-dlg-ov.ab-pc-ov{padding:12px;z-index:1400}
.ab-pc{display:flex;flex-direction:column;width:min(500px,100%);height:min(560px,calc(100vh - 24px));height:min(560px,calc(100dvh - 24px));background:#fff;color:#171719;overflow:hidden;box-shadow:0 20px 60px rgba(0,0,0,.35)}
.ab-pc-h{display:flex;justify-content:space-between;align-items:center;flex:none;height:52px;padding:0 6px 0 16px;border-bottom:1px solid #ddd;font-size:15px}
.ab-pc-x{min-width:44px;min-height:44px;padding:0 10px;border:0;background:none;font:500 14px var(--font-sans);color:#171719;cursor:pointer}
.ab-pc-b{flex:1;min-height:0}
/* 회원 정보 수정 (3rd round) */
.pf-head{border-bottom:0;padding-bottom:8px}
.pf-l{position:static;display:flex;align-items:baseline;padding-left:0}
.pf-d{display:inline-block;flex:none;width:16px}
.pf-req{position:static}
.shp-my .pf-out{margin:40px 0 0;text-align:right}
@media (max-width:900px){
  .pf-l{padding-left:0}
  /* mobile MY PAGE: a plain left-aligned vertical menu (landing page); every other MY PAGE page is its own page with a back button */
  .my-nav{display:block}
  .my-g{display:block;padding:0 0 12px;margin:0 0 12px;border-bottom:1px solid rgba(112,115,124,.22)}
  .my-g h2{padding:0}
  .my-g:last-of-type{border-bottom:1px solid rgba(112,115,124,.22)}
  .my-nav a{text-align:left}
  .my-nav .my-logout{width:100%;min-height:56px;margin:12px 0 0;padding:0 16px;border:1px solid rgba(112,115,124,.5);background:#fff;text-align:center;font-weight:500;color:rgba(55,56,60,.85)}
  .my-home .my-main{display:none}
  .my-home .my-nav a[aria-current="page"]{font-weight:500;color:#171719}
  .my-page .my-nav,.my-page .my-title{display:none}
  .my-back{display:flex;align-items:center;gap:6px;min-height:44px;margin:0 0 4px;font-size:15px;font-weight:500;color:#171719;text-decoration:none}
  .my-page .my-grid{margin-top:8px}
  .ab-tr{justify-items:stretch;text-align:left}
  .ab-nm{align-items:flex-start}.ab-ad{text-align:left}
  .ab-pin{text-align:left}
  .ab-pin .ab-chk{justify-self:start;justify-content:flex-start;width:44px;margin:-12px 0}
  .ab-pin .ab-chk input{margin:0}
}

/* ===== 4th round ===== */
.shp-my .my-t{border-bottom:0;padding-bottom:12px}
.ot-tabs{display:grid;grid-template-columns:1fr 1fr;margin:0}
.ot-tab{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:0 2px;min-height:52px;padding:6px 8px;border:1px solid #d9d9dc;background:#fff;color:#8a8a8f;font:600 14px/1.35 var(--font-sans);letter-spacing:-.02em;text-align:center;word-break:keep-all;cursor:pointer;border-radius:0}
.ot-tab+.ot-tab{border-left:0}
.ot-tab[aria-selected="true"]{background:#424242;border-color:#424242;color:#fff}
.ot-n{white-space:nowrap}
.ot-box{margin:0 0 24px;padding:16px 12px;background:#f7f7f7}
.ot-box .my-sel{display:block;width:100%;max-width:420px;margin:0 auto 12px;background:#fff}
.ot-line{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:10px 22px}
.ot-box .my-chips{gap:0}
.ot-box .my-chips button{min-height:32px;padding:0 14px;border:0;border-right:1px solid #cfcfd3;background:none;color:#333;font:500 14px/1 var(--font-sans)}
.ot-box .my-chips button:last-child{border-right:0}
.ot-box .my-chips button[aria-pressed="true"]{background:none;color:#000;font-weight:700;text-decoration:underline;text-underline-offset:6px}
.ot-dates{display:flex;align-items:center;gap:6px;min-height:46px;padding:0 2px 0 12px;background:#fff;border:1px solid #e1e1e4}
.ot-dates input{width:128px;height:40px;padding:0;border:0;background:none;font:400 14px var(--font-sans);color:#222;min-width:0}
.ot-go{display:flex;align-items:center;justify-content:center;flex:none;width:44px;height:44px;border:0;background:none;color:#222;cursor:pointer}
.my-bar{display:none}
@media (max-width:900px){
  .my-bar{display:grid;grid-template-columns:44px minmax(0,1fr) 44px;align-items:center;margin:0 0 12px}
  .my-bar .my-back{display:flex;align-items:center;justify-content:center;width:44px;height:44px;min-height:44px;margin:0;padding:0;color:#171719}
  .my-bt{margin:0;text-align:center;font-size:20px;font-weight:700;letter-spacing:-.03em;line-height:1.3;color:#000;word-break:keep-all}
  .my-page .my-t-main{display:none}
  .my-page .my-grid{margin-top:0}
  .ot-box{padding:14px 12px}
  .ot-dates{width:100%;box-sizing:border-box}.ot-dates input{flex:1 1 0;width:auto}
  .ot-box .my-chips{width:100%;justify-content:center}.ot-box .my-chips button{padding:0 10px}
  .pf-d{position:relative;width:0;overflow:visible}
  .pf-req{position:absolute;left:-13px;top:0}
  .pf-l{gap:0}
}
/* 회원 정보 수정 page: no MY PAGE menu, centred title like the MY PAGE title, the form below it */
.my-solo .my-nav{display:none}
.my-solo .my-grid{grid-template-columns:minmax(0,1fr);margin-top:0}
.my-solo .my-main{max-width:760px;width:100%;margin:0 auto}
.pf-head{border-bottom:1px solid #000;padding-bottom:12px}

/* phone: the page header title must beat the generic .shp-doc p rule; the date fields must not be cut off */
@media (max-width:900px){
  .shp-my .my-bt{margin:0;font-size:20px;font-weight:700;line-height:1.3;color:#000;letter-spacing:-.03em;text-align:center}
  .ot-dates{gap:4px;padding-left:10px}
  .ot-dates input{font-size:14px;min-width:0}
  .ot-dates input::-webkit-calendar-picker-indicator{display:none}
}

/* ===== 5th round ===== */
/* underline tabs (same selected look as the product page tabs): ONE grey base line, the selected tab draws a 3px black line exactly over it */
.ut-tabs{display:grid;grid-template-columns:1fr 1fr;margin:0 0 16px;box-shadow:inset 0 -1px 0 rgba(112,115,124,.32)}
.ut-tab{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:0 2px;min-height:52px;padding:6px 6px;border:0;border-radius:0;background:none;color:rgba(55,56,60,.61);font:500 15px/1.35 var(--font-sans);letter-spacing:-.02em;text-align:center;word-break:keep-all;cursor:pointer}
.ut-tab[aria-selected="true"]{color:#000;font-weight:700;box-shadow:inset 0 -3px 0 #000}
.ut-tab .ot-n{white-space:nowrap}
/* period box */
.pd-box{margin:0 0 24px;padding:16px;border:1px solid #e1e1e4;background:#fff}
.pd-chips{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));margin:0 0 12px}
.pd-chips button{min-height:44px;padding:0 2px;border:1px solid #d9d9dc;border-left-width:0;background:#fff;color:#555;font:500 14px/1 var(--font-sans);cursor:pointer;border-radius:0}
.pd-chips button:first-child{border-left-width:1px}
.pd-chips button[aria-pressed="true"]{border:1px solid #000;color:#000;font-weight:700;position:relative}
.pd-box .my-sel{display:block;width:100%;max-width:none;margin:0 0 12px;background:#fff;height:48px}
.pd-dates{display:flex;align-items:center;gap:8px;margin:0 0 14px}
.pd-dates input{flex:1 1 0;min-width:0;height:48px;padding:0 10px;border:1px solid #d9d9dc;border-radius:0;background:#fff;font:400 14px var(--font-sans);color:#222;box-sizing:border-box}
.pd-go{display:block;width:100%;min-height:48px;border:0;border-radius:999px;background:#000;color:#fff;font:600 15px/1 var(--font-sans);cursor:pointer}
.my-ask{display:flex;width:100%;min-width:0;margin:0 0 16px}
@media (min-width:901px){.pd-box{max-width:560px}.my-ask{width:auto;min-width:200px;display:inline-flex}}
/* 배송지 관리 */
.ab-sel{display:inline-flex;align-items:center;gap:8px;cursor:pointer;word-break:keep-all}
.ab-sel input{width:18px;height:18px;margin:0;accent-color:#000;flex:none}
.ab-acts{display:flex;gap:12px;justify-content:center;margin:28px 0 0}
.ab-acts .shp-btn{width:auto;flex:1 1 0;max-width:240px;min-width:0;height:52px;border-radius:0;font-size:15px;padding:0 8px;line-height:1.3}
.ab-acts .shp-btn.main{background:#1a1a1a;border-color:#1a1a1a}
.ab-derr{text-align:center;margin:10px 0 0}
.ab-add{display:none}
@media (max-width:900px){
  .ab-nm{align-items:flex-start}
  .ab-ed{justify-self:end;grid-column:1 / -1;display:flex;justify-content:flex-end}
  .ab-ed .shp-btn{position:relative;width:auto;min-width:56px;height:32px;padding:0 14px;font-size:13px;border-radius:0}
  .ab-ed .shp-btn::after{content:"";position:absolute;inset:-7px -6px}   /* the tap area is larger than the small square */
}
/* 회원 정보 수정 on phones: the required dot sits right before the label text; optional labels keep their position */
@media (max-width:900px){
  .pf-d{position:static;width:auto;overflow:visible}
  .pf-req{position:static;margin-right:5px}
}
.my-dlg .shp-dlg-d{text-align:center}

.shp-sub{display:block}

/* ===== 6th round ===== */
/* ---- 장바구니: list columns on PC (상품 정보 | 용량 | 수량 | 상품금액), card layout on phones. Only the lines that are needed: header, row separators. ---- */
.ct-list{margin:0;padding:0;list-style:none}
.ct-head,.ct-row{display:grid;grid-template-columns:88px minmax(0,2.4fr) minmax(70px,1fr) 150px minmax(110px,1.2fr) 44px;align-items:center;column-gap:12px}
.ct-head{padding:12px 0;border-top:1px solid #000;border-bottom:1px solid rgba(112,115,124,.32);font-size:13px;color:rgba(55,56,60,.72);text-align:center}
.ct-head .ct-h-info{grid-column:1 / 3;text-align:left}
.ct-row{padding:16px 0;border-bottom:1px solid rgba(112,115,124,.22)}
.ct-meta{display:contents}
.ct-img{grid-column:1;display:block}.ct-img img{display:block;width:88px;height:auto;aspect-ratio:3/4;object-fit:cover;background:#f4f4f5}
.ct-name{grid-column:2;margin:0;font-size:16px;font-weight:600;color:#000;word-break:keep-all;overflow-wrap:anywhere}
.ct-opt{grid-column:3;margin:0;text-align:center;font-size:15px}
.ct-nm{display:none}
.ct-qty{grid-column:4;justify-self:center}
.ct-amt{grid-column:5;margin:0;text-align:center;font-size:15px}.ct-amt b{font-weight:700;color:#000}
.ct-l{display:none}
.ct-rm{grid-column:6;display:flex;align-items:center;justify-content:center;width:44px;height:44px;border:0;background:none;color:rgba(55,56,60,.61);cursor:pointer}
.ct-rm:hover{color:#000}
.shp-cartsum{margin-top:0}
@media (min-width:901px){.ct-row>*,.ct-meta>*{grid-row:1}}
/* phones: image | name + capacity + amount | trash, quantity under the text */
@media (max-width:900px){
  .ct-head,.ct-name{display:none}
  .ct-list{border-top:1px solid rgba(112,115,124,.32)}
  .ct-row{grid-template-columns:88px minmax(0,1fr) 44px;grid-template-areas:"img meta rm" "img qty qty";column-gap:12px;row-gap:8px;align-items:start;padding:16px 0}
  .ct-img{grid-area:img}
  .ct-meta{display:block;grid-area:meta;min-width:0;align-self:center}
  .ct-nm{display:inline}
  .ct-opt{margin:0 0 6px;text-align:left;font-size:15px;font-weight:600;color:#000;word-break:keep-all}
  .ct-amt{margin:0;text-align:left;font-size:14px}
  .ct-amt b{font-size:16px;white-space:nowrap}
  .ct-rm{grid-area:rm;align-self:start}
  .ct-qty{grid-area:qty;align-self:end;justify-self:start}
}
/* ---- 쇼핑 안내 목록: the list starts on the same left line as the paragraph above it; wrapped text lines up with the text start, not with the dot ---- */
.shp-doc .shp-dots{padding-left:0;margin:0 0 12px}
.shp-dots li::before{left:0}
.shp-dots li{padding-left:16px}
/* ---- 주문 내역 검색 (PC only): everything on one line inside a bordered box ---- */
@media (min-width:901px){
  .pd-box{display:flex;flex-wrap:wrap;align-items:center;gap:12px 16px;max-width:none;padding:18px 24px}
  .pd-box .my-sel{order:1;flex:0 0 190px;width:190px;margin:0;height:44px}
  .pd-chips{order:2;flex:0 0 auto;display:flex;margin:0}
  .pd-chips button{min-width:62px;min-height:44px;padding:0 14px}
  .pd-chips button[data-days="7"]{display:none}
  .pd-dates{order:3;flex:0 1 auto;margin:0;gap:10px}
  .pd-dates input{flex:0 0 150px;width:150px;height:44px}
  .pd-box .shp-err{order:9;flex:1 0 100%;margin:0}
  .pd-go{order:4;width:auto;min-width:76px;min-height:44px;padding:0 22px;border-radius:0;background:#1a1a1a;font-size:14px}
}
/* ---- 나의 문의 내역 ---- */
.iq-filter{margin:0 0 20px}
.iq-sel{display:block;width:100%;height:48px;border-radius:0;background:#fff}
.iq-tbl{border-top:1px solid #000}
.iq-tr{display:grid;grid-template-columns:90px minmax(0,1fr) 130px 130px;align-items:center;column-gap:12px;width:100%;box-sizing:border-box;padding:14px 8px;text-align:center}
.iq-th{border-bottom:1px solid #e1e1e4;font-size:14px;color:#171719}
.iq-hd{border:0;border-bottom:1px solid #e1e1e4;background:none;font:400 14px/1.5 var(--font-sans);color:#171719;cursor:pointer}
.iq-t{text-align:left;min-width:0;word-break:keep-all;overflow-wrap:anywhere}
.iq-tt em{font-style:normal;font-size:12px;color:rgba(55,56,60,.61)}
.iq-st{margin-left:10px;font-size:12px;color:rgba(55,56,60,.61);white-space:nowrap}
.iq-empty{padding:84px 12px;text-align:center;font-size:14px;color:#9a9a9f;border-bottom:1px solid #e1e1e4}
.iq-item .my-iqb{padding:12px 16px 18px;background:#fafafa;border-bottom:1px solid #e1e1e4}
.iq-ask{display:flex;justify-content:flex-end;margin:28px 0 0}
.iq-ask .my-ask{width:156px;min-width:0;height:52px;margin:0;border-radius:0;background:#000;border-color:#000;font-size:15px}
@media (min-width:901px){
  .iq-filter{margin:0 0 24px;padding:20px;background:#f7f7f7;display:flex;justify-content:center}
  .iq-sel{width:420px;max-width:100%;height:44px;border-color:#e1e1e4}
}
@media (max-width:900px){
  .iq-tbl{border-top:1px solid rgba(112,115,124,.32)}
  .iq-th{display:none}
  .iq-hd{grid-template-columns:minmax(0,1fr) auto;text-align:left;padding:14px 0;row-gap:2px}
  .iq-n,.iq-a{display:none}
  .iq-t{grid-column:1 / -1}
  .iq-d{grid-column:1;grid-row:2;font-size:13px;color:rgba(55,56,60,.61)}
  .iq-st{grid-column:2;grid-row:2;margin:0}
  .iq-empty{padding:56px 0}
  .iq-ask{justify-content:stretch;margin:20px 0 0}
  .iq-ask .my-ask{width:100%;height:56px}
  .iq-item .my-iqb{padding:12px 0 18px}
}

/* PC order search: tighter so that the whole row fits into the content column */
@media (min-width:901px){
  .pd-box{padding:16px 18px;gap:12px}
  .pd-box .my-sel{flex:0 0 150px;width:150px}
  .pd-chips button{min-width:52px;padding:0 10px}
  .pd-dates{gap:8px}.pd-dates input{flex:0 0 132px;width:132px}
  .pd-go{min-width:66px;padding:0 16px}
}


/* ===== 7th round: role tokens + role layer =====
   One place for the values that every page shares. Roles: text, line, shape (radius), control height, focus.
   Intended exceptions (not changed on purpose): home main title / HOW TO USE card / PRODUCT SAFETY image (own sizes),
   Kakao button (external-service logo: circle, white), home floating buy bar (premium.css). */
:root{
  --c-title:#000;--c-name:#171719;--c-body:rgba(46,47,51,.88);--c-meta:rgba(55,56,60,.61);--c-ph:#a8abb2;--c-off:#878a93;
  --c-err:#d92d20;--c-ok:#067647;--c-link:#000;
  --ln-strong:#171719;--ln:rgba(112,115,124,.32);--ln-soft:rgba(112,115,124,.22);--ln-tab:3px;
  --r-btn:0;--r-in:0;--r-card:0;--r-dlg:0;
  --h-btn:56px;--h-btn-sm:44px;--h-in:52px;--h-touch:44px;
  --bg-soft:#f7f7f8;--sh-cta:0 4px 16px rgba(0,0,0,.28);
  --focus:2px solid #000;
}
/* shape: buttons, inputs, cards and dialogs read their radius from the tokens (square everywhere on the shop pages) */
.shp-btn{border-radius:var(--r-btn);min-height:var(--h-touch)}
.shp-in,.my-sel,.shp-field input{border-radius:var(--r-in)}
.shp-notice,.shp-dlg{border-radius:var(--r-dlg)}
:where(.shp-btn,.shp-in,.my-sel,.shp-qty button,.shp-qty input,.pm-x,.shp-size input):focus-visible{outline:var(--focus);outline-offset:2px}
.shp-size input:focus-visible+span{outline:var(--focus)}
.shp-btn.sm{min-height:var(--h-btn-sm)}

/* select: ONE custom arrow (the native one is switched off), 16px from the right border, text never reaches the arrow */
select.shp-in,.my-sel{-webkit-appearance:none;-moz-appearance:none;appearance:none;padding-right:44px;
  background-color:#fff;background-repeat:no-repeat;background-position:right 16px center;background-size:12px 8px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none' stroke='%23171719' stroke-width='1.6' stroke-linecap='square'%3E%3Cpath d='M1 1.5l5 5 5-5'/%3E%3C/svg%3E");
  text-overflow:ellipsis;cursor:pointer}
select.shp-in::-ms-expand,.my-sel::-ms-expand{display:none}
select.shp-in:disabled,.my-sel:disabled{cursor:not-allowed;color:var(--c-off)}
.pf-ph select.shp-in{padding-left:8px;padding-right:28px;background-position:right 10px center}

/* cart: the shipping notice uses the full totals width, left aligned */
.shp-cartnote{display:block;width:100%;max-width:none;box-sizing:border-box;text-align:left}
.shp-cartnote{white-space:normal}

/* product: 옵션 선택 area + square CTA buttons (shadow and functions unchanged) */
.shp-opt-h{margin:0 0 14px;font-size:16px;font-weight:700;color:var(--c-title)}
.shp-sizes legend{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.shp-act2 .shp-btn,.shp-bar .shp-btn{border-radius:var(--r-btn)}
.shp-qty,.shp-size span{border-radius:0}

/* mobile purchase sheet (square, bottom-fixed buttons stay usable, body scrolls on small screens) */
.pm[hidden]{display:none}
.pm{position:fixed;inset:0;z-index:120;display:flex;align-items:flex-end}
.pm-bd{position:absolute;inset:0;background:rgba(0,0,0,.5)}
.pm-sheet{position:relative;display:flex;flex-direction:column;width:100%;max-height:calc(100% - 24px);max-height:calc(100dvh - 24px);background:#fff;border-radius:0;outline:0;box-shadow:0 -8px 32px rgba(0,0,0,.2)}
.pm-h{flex:none;display:flex;align-items:center;justify-content:space-between;padding:0 8px 0 20px;min-height:56px;border-bottom:1px solid var(--ln-soft)}
.pm-h h2{margin:0;font-size:16px;font-weight:700;color:var(--c-title)}
.pm-x{display:flex;align-items:center;justify-content:center;width:44px;height:44px;border:0;border-radius:0;background:none;color:var(--c-name);cursor:pointer}
.pm-body{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:20px 20px 8px}
.pm .shp-total{display:flex;margin:20px 0 12px}
.pm .shp-sizes{margin:0 0 16px}
.pm-f{flex:none;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px;padding:12px 20px calc(12px + env(safe-area-inset-bottom));background:#fff;border-top:1px solid var(--ln-soft)}
.pm-f .shp-btn{height:var(--h-btn);font-size:16px;padding:0 12px}
html.pm-lock,html.pm-lock body{overflow:hidden}
@media (min-width:901px){.pm{display:none}}

/* mobile: the page itself shows only the price bar + 구매하기; the options live in the sheet */
@media (max-width:900px){
  .shp-info>.shp-opt,.shp-info>.shp-act2,.shp-info>#pd-pay-note{display:none}
  .shp-bar .shp-btn{flex:1;max-width:60%}
  .shp-toast{z-index:200}
}
/* the toast must not cover the sheet's controls: while the sheet is open it shows at the top */
html.pm-lock .shp-toast{bottom:auto;top:72px;transform:translate(-50%,-12px)}
html.pm-lock .shp-toast.on{transform:translate(-50%,0)}

/* ===== 9th round: option dropdown (PC page + mobile sheet), mobile bar (리뷰 | 구매하기), mobile cart ===== */
.shp-opt-row{display:flex;align-items:center;gap:24px}
.shp-opt-h{flex:none;min-width:84px;margin:0;font-size:14px;font-weight:400;color:var(--c-meta)}
.shp-opt-sel{flex:1;min-width:0;height:var(--h-in);font-size:15px}
.shp-opt-sel[aria-invalid="true"]{border-color:var(--c-err)}
.shp-sel[hidden]{display:none}
.shp-sizes,.shp-sizes-in,.shp-size{display:none}
/* mobile sheet: the select fills the width between the side margins; no rule under the 옵션 선택 area */
.pm-h{border-bottom:0}
.pm .shp-opt-sel{display:block;width:100%;margin:0 0 16px}
.pm .shp-sel{border-top:0;padding-top:4px}
@media (max-width:900px){
  /* the price row that used to live in the bar is shown on the page (the bar now holds 리뷰 | 구매하기) */
  .shp-total{margin:8px 0 0}
  .shp-bar{gap:0;align-items:stretch;padding:0 0 env(safe-area-inset-bottom)}
  .shp-bar-rv{flex:none;display:flex;flex-direction:column;align-items:center;justify-content:center;width:76px;height:56px;padding:0;border:0;border-right:1px solid var(--ln-soft);border-radius:0;background:#fff;color:var(--c-name);font:500 14px/1.3 var(--font-sans);cursor:pointer}
  .shp-bar-rv:focus-visible{outline:var(--focus);outline-offset:-2px}
  .shp-bar-rvn{font-size:13px;color:var(--c-meta)}
  .shp-bar .shp-btn{flex:1;max-width:none;height:56px;border-radius:0;box-shadow:none}
  .shp-page.shp-has-bar{padding-bottom:calc(72px + env(safe-area-inset-bottom))}
  /* cart: quantity control on the right, shipping notice centred */
  .ct-qty{justify-self:end}
  .shp-cartnote{text-align:center}
}

/* ===== 10th round ===== */
/* PC product: the selected-item row sits 20px under the dropdown and no longer draws a second line at the dropdown's border; the line above 총 상품금액 stays */
.shp-opt .shp-sel{margin-top:20px;padding:20px 0;border-top:0}
/* 상품문의 공개 여부: round radio buttons side by side; the whole label (circle + text) is clickable */
.shp-radios{display:flex;flex-wrap:wrap;gap:8px 28px}
.shp-rd{display:inline-flex;align-items:center;gap:8px;min-height:44px;cursor:pointer;font-size:14px;color:var(--c-name)}
.shp-rd input{-webkit-appearance:none;appearance:none;display:grid;place-content:center;flex:none;width:20px;height:20px;margin:0;border:1px solid rgba(112,115,124,.52);border-radius:50%;background:#fff;cursor:pointer}
.shp-rd input::before{content:"";width:10px;height:10px;border-radius:50%;background:#000;transform:scale(0)}
.shp-rd input:checked{border-color:#000}
.shp-rd input:checked::before{transform:scale(1)}
.shp-rd input:focus-visible{outline:var(--focus);outline-offset:2px}

/* ===== 11th round ===== */
/* cart: the two shipping sentences are gone; the order button keeps the normal distance to the totals */
#cart-order{margin-top:28px}
/* product: no shadow on 구매하기 (mobile bar), and no 1px top border / shadow haze above the black button: the bar is only as tall as its buttons.
   The review area draws its own 1px top line (inset, adds no height) so the two stay aligned. */
#pd-qna-submit{box-shadow:none}
@media (max-width:900px){
  .shp-bar{border-top:0}
  .shp-bar-rv{box-shadow:inset 0 1px 0 var(--ln-soft)}
  #pd-bar-buy,#pd-bar-buy:hover,#pd-bar-buy:active,#pd-bar-buy:focus,#pd-bar-buy:focus-visible{box-shadow:none}
}