:root{--paper:#fff;--wash:#f4f7fb;--ink:#14243a;--muted:#536174;--line:#dfe6ef;--blue:#175bd3;--soft:#eaf1ff;--up:#b62636;--down:#175bd3;color-scheme:light;scroll-padding-top:var(--header-offset,7rem)}

*{box-sizing:border-box}
 [hidden]{display:none!important}
 html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;scrollbar-gutter:stable}
 body{margin:0;background:var(--paper);color:var(--ink);font:1.0625rem/1.65 Pretendard,'Pretendard Variable',-apple-system,BlinkMacSystemFont,'Apple SD Gothic Neo','Malgun Gothic',sans-serif;letter-spacing:-.025em;word-break:keep-all;overflow-wrap:anywhere}
body.modal-open{overflow:hidden}
button,input{font:inherit;color:inherit}
button,a,input{-webkit-tap-highlight-color:transparent}
a{color:inherit;text-decoration:none}
button{cursor:pointer}
svg{display:block}
svg.open-icon,button svg,.search-control svg{fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
h1,h2,h3,p{margin:0}
h1,h2,h3{line-height:1.3;letter-spacing:-.045em}
ul{list-style:none;margin:0;padding:0}
::selection{background:#d9e7ff}
:focus-visible{outline:3px solid var(--blue);outline-offset:4px;border-radius:.3rem}
.wrap{width:min(72rem,calc(100% - 3rem));margin-inline:auto}
.sprite{position:absolute;pointer-events:none}
.skip{position:absolute;left:1rem;top:-10rem;background:white;padding:.75rem 1rem;z-index:40}
.skip:focus{top:.5rem}
.top{position:sticky;top:0;z-index:10;background:rgba(255,255,255,.98);border-bottom:1px solid var(--line)}
.top-in{min-height:5rem;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem}
.brand{display:inline-flex;flex-shrink:0;white-space:nowrap;align-items:center;gap:.2rem;min-height:3rem;font-size:2rem;font-weight:800;letter-spacing:-.08em}
.brand-dot{width:.3rem;height:.3rem;background:var(--blue);border-radius:50%;margin-top:1.2rem}
.tabs{display:flex;flex-wrap:wrap;gap:.5rem}
.tabs a{min-height:3rem;padding:.6rem .8rem;display:inline-flex;align-items:center;font-size:1rem;font-weight:600;color:var(--muted);border-radius:.5rem}
.tabs a[aria-current]{color:var(--blue);background:var(--soft)}
.tabs a:hover{color:var(--blue)}
.hero{display:grid;grid-template-columns:1.2fr 1fr;gap:4rem;align-items:center;padding-block:4.75rem 4.25rem}
.hero-intro{color:var(--blue);font-weight:700;margin-bottom:1.2rem}
.hero h1{font-size:clamp(2.5rem,4.5vw,4rem);font-weight:750;line-height:1.18}
.hero-copy>p:not(.hero-intro){margin-top:1.5rem;color:var(--muted);max-width:32em}
.hero-actions{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem 1.5rem;margin-top:2rem}
.primary,.secondary,.buy{display:inline-flex;justify-content:center;align-items:center;gap:.6rem;min-height:3rem;padding:.65rem 1.1rem;border:1px solid transparent;border-radius:.65rem;font-weight:650;line-height:1.5;transition:background .18s,transform .18s}
.primary{color:#fff;background:var(--blue)}
.primary:hover{background:#1049af}
.secondary{background:var(--wash);border-color:var(--line)}
.secondary:hover{background:#e7edf6}
.text-link{display:inline-flex;align-items:center;justify-content:center;min-height:3rem;gap:.3rem;padding:.4rem .15rem;color:var(--blue);font-weight:650;border:0;background:none;text-underline-offset:.25em}
.text-link:hover{text-decoration:underline}
.primary:active,.secondary:active,.buy:active{transform:scale(.97)}
.feature-note{position:relative;display:block;background:var(--soft);border-radius:1.5rem;isolation:isolate;overflow:hidden;transition:background .2s}
.feature-label{display:block;padding:1.5rem 1.75rem 0;font-size:.9375rem;font-weight:600;color:#3e597b}
.feature-picture{display:block;position:relative;height:15rem;margin-inline:1.5rem}
.feature-picture:after{content:'';position:absolute;bottom:.8rem;left:8%;right:8%;height:1px;background:#bacde8;z-index:-1}
.feature-main{position:absolute;left:27%;bottom:.9rem;width:46%;height:13rem;transition:transform .4s cubic-bezier(.2,.8,.2,1)}
.feature-side{position:absolute;left:3%;bottom:.9rem;width:26%;height:7rem}
.feature-back{position:absolute;right:0;bottom:.9rem;width:30%;height:10rem}
.feature-note:hover .feature-main{transform:translateY(-.5rem) rotate(-3deg)}
.feature-bottom{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1.4rem 1.75rem;background:#dae7fb}
.feature-bottom b{display:block;font-size:1.5rem;line-height:1.4}
.feature-bottom>span>span{display:block;color:#415873;font-size:.9375rem;margin-top:.25rem}
.round-open{display:grid;place-items:center;flex-shrink:0;width:3rem;height:3rem;border-radius:50%;background:#fff;color:var(--blue);font-size:1.5rem}
.board{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:0 4rem}
.block{min-width:0;padding-block:3.5rem;border-top:1px solid var(--line)}
#collections{grid-column:1/-1}
.head{display:flex;justify-content:space-between;gap:1rem;margin-bottom:1.5rem}
.head h2{font-size:clamp(1.65rem,2.5vw,2.2rem)}
.head p{color:var(--muted);margin-top:.6rem;max-width:42em}
.search-box{display:block;margin-top:1.5rem}
.search-box label{display:block;font-weight:650;margin-bottom:.5rem}
.search-control{display:flex;align-items:center;gap:.65rem;width:min(100%,30rem);background:var(--wash);border:1px solid var(--line);border-radius:.7rem;padding:0 .8rem;min-width:0}
.search-control:focus-within{outline:2px solid var(--blue);outline-offset:2px}
.search-control svg{width:1.25rem;height:1.25rem;flex-shrink:0}
.search-control input{width:100%;min-width:0;min-height:3.25rem;border:0;outline:0;background:transparent;padding:.5rem 0}
.search-control input::placeholder{color:#637287;opacity:1}
.search-control .text-link{flex-shrink:0;font-size:.9375rem}
.result-count{font-size:.9375rem;color:var(--muted);margin-block:1rem}
.colls{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,14rem),1fr));gap:1.25rem}
.note-group+.note-group{margin-top:2rem}
.note-group>h3{font-size:1.25rem;margin-bottom:1rem}
.note-card{min-width:0}
.coll{display:flex;flex-wrap:wrap;position:relative;gap:.8rem;padding-bottom:1rem;border-bottom:1px solid var(--line);height:100%;align-content:start}
.tile{display:grid;place-items:center;background:var(--wash);border-radius:1rem;overflow:hidden}
.coll .tile{width:100%;height:8rem}
.tile .art{width:6.5rem;height:6.5rem;transition:transform .28s cubic-bezier(.2,.8,.2,1)}
.coll:hover .art{transform:translateY(-.25rem) rotate(-4deg)}
.card-copy{min-width:0;flex:1}
.card-copy b{display:block;font-size:1.125rem;line-height:1.45}
.sub{display:block;color:var(--muted);font-size:.9375rem;line-height:1.6;margin-top:.3rem}
.sub span{color:#778397;padding-inline:.15rem}
.open-icon{flex-shrink:0;width:1.2rem;height:1.2rem;margin-top:.25rem;color:var(--blue)}
.empty,.wait{padding:1.5rem;background:var(--wash);border-radius:.75rem;color:var(--muted)}
.empty p+p{margin-top:.4rem}
.empty .secondary{margin-top:1rem;background:white}
.data-status{font-size:.9375rem;color:var(--muted);margin-bottom:1rem}
.deals{border-top:1px solid var(--line)}
.deal{display:flex;align-items:center;gap:1rem;position:relative;width:100%;min-height:6rem;padding:1.25rem 0;border:0;border-bottom:1px solid var(--line);background:white;text-align:left}
.deal:hover .title{color:var(--blue);text-decoration:underline;text-underline-offset:.2em}
.meta{display:flex;align-items:center;flex-wrap:wrap;gap:.5rem .75rem;font-size:.9375rem;color:var(--muted)}
.shop{color:#334f73;font-weight:650}
.due{margin-left:auto}
.deal-group>h3{font-size:1rem;color:var(--up);padding-block:1rem .25rem}
.deal-copy{display:flex;flex:1;min-width:0;flex-direction:column;gap:.5rem}
.deal .open-icon{display:block;margin:0;align-self:center}
.title{font-size:1.125rem;font-weight:650;line-height:1.5}
.gain{color:var(--blue);font-size:1.25rem;font-weight:750}
.more{display:block;min-height:3.25rem;width:100%;border:1px solid var(--line);background:var(--wash);border-radius:.6rem;margin-top:1rem;padding:.6rem 1rem;font-weight:650}
.more:hover{background:#e7edf6}
.fine{font-size:.9375rem;line-height:1.65;color:var(--muted);margin-top:1rem}
.data-note:not(:empty){padding:1rem;background:#f4f7fb;border:1px solid var(--line);border-radius:.6rem;margin-top:1rem;color:#41536d;font-size:.9375rem}
.retry{display:flex;flex-wrap:wrap;gap:.25rem .75rem;align-items:center}
.retry .text-link{font-size:inherit}
.prices li:not(.wait){border-bottom:1px solid var(--line);padding:1rem 0}
.price-top{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem}
.price-name b{display:block;font-size:1.0625rem}
.price-name small{display:block;color:var(--muted);font-size:.9375rem}
.price-value{text-align:right;flex-shrink:0;font-variant-numeric:tabular-nums}
.price-value strong{display:block;font-size:1.25rem;line-height:1.5}
.price-value small{font-size:.875rem;color:var(--muted)}
.price-bottom{display:flex;gap:.75rem;align-items:center;margin-top:.65rem}
.comparison-track{height:.35rem;flex:1;max-width:5rem;background:#e4eaf2;border-radius:1rem;overflow:hidden}
.comparison-fill{display:block;height:100%;background:var(--muted);border-radius:1rem}
.comparison-fill.up{background:var(--up)}
.comparison-fill.down{background:var(--down)}
.chg{font-size:.9375rem;font-weight:650;line-height:1.5;font-variant-numeric:tabular-nums}
.chg.up{color:var(--up)}
.chg.down{color:var(--down)}
.chg.same{color:var(--muted)}
.contact{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;padding:2rem 2.25rem;margin-top:2rem;background:var(--wash);border-radius:1rem}
.contact h2{font-size:1.5rem}
.contact p{color:var(--muted);margin-top:.5rem}
.contact .secondary{flex-shrink:0;background:white}
.foot{border-top:1px solid var(--line);margin-top:4rem;padding-block:2.5rem;color:var(--muted);font-size:.9375rem}
.foot .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:1.5rem 2rem}
.footer-brand{display:inline-flex;min-width:48px;min-height:3rem;align-items:center;color:var(--ink);font-size:1.5rem;font-weight:800;letter-spacing:-.06em}
.footer-links{display:flex;flex-wrap:wrap;gap:.25rem 1.25rem;align-items:start}
.footer-links a{display:inline-flex;min-height:3rem;align-items:center;text-decoration:underline;text-underline-offset:.25em}
.business{width:100%;border-top:1px solid var(--line);padding-top:1.25rem}
.sheet{width:min(44rem,calc(100% - 2rem));max-width:calc(100vw - 1rem);max-height:88dvh;margin:auto;border:0;padding:0;background:white;color:var(--ink);border-radius:1.25rem;overflow:auto;overscroll-behavior:contain}
.collection-sheet{width:min(56rem,calc(100% - 2rem))}
.sheet::backdrop{background:#14243a99}
.sheet[open]{animation:sheet-in .28s cubic-bezier(.2,.8,.2,1)}
@keyframes sheet-in{from{opacity:0;transform:translateY(1.5rem) scale(.98)}
to{opacity:1;transform:none}
}
.sheet-top{display:flex;align-items:center;gap:1rem;position:sticky;top:0;z-index:2;background:white;padding:1.5rem;border-bottom:1px solid var(--line)}
.sheet-top>div{flex:1;min-width:0}
.sheet-top h2{font-size:1.65rem}
.sheet-context{font-size:.9375rem;color:var(--muted);margin-bottom:.25rem}
.tile.sm{width:3.5rem;height:3.5rem;flex-shrink:0}
.tile.sm .art{width:3rem;height:3rem}
.close{display:grid;place-items:center;min-width:3rem;min-height:3rem;width:3rem;height:3rem;flex-shrink:0;border:0;border-radius:50%;background:var(--wash)}
.close:hover{background:#e4eaf4}
.close svg{width:1.4rem;height:1.4rem}
.sheet-body{padding:1.5rem}
.disclose{padding:1rem;background:var(--wash);font-size:.9375rem;line-height:1.65;color:var(--muted);border-radius:.6rem}
.intro-fine{margin-bottom:.5rem}
.comparison-scope{max-width:44em}
.catalog-freshness{margin-top:.5rem;margin-bottom:1.5rem}
.prods{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,6rem),1fr));gap:0 1.25rem}
.prod{min-width:0;display:grid;grid-row:span 4;grid-template-rows:subgrid;align-items:start;row-gap:1rem;padding:1.25rem 0;border-top:2px solid var(--line)}
.product-info{min-width:0;display:grid;grid-row:span 2;grid-template-rows:subgrid;row-gap:1rem}
.prod .buy{justify-self:stretch;align-self:start;text-align:center;font-size:.9375rem;padding:.65rem .7rem}
.prod h3{font-size:1.125rem;font-weight:700;line-height:1.5}
.field-label{display:block;font-size:.875rem;font-weight:500;line-height:1.6;color:var(--muted);margin-bottom:.35rem}
.range{font-size:1.25rem;font-weight:750;line-height:1.5;font-variant-numeric:tabular-nums}
.product-note{font-size:1rem;line-height:1.65}
.buy{background:var(--soft);color:var(--blue)}
.buy:hover{background:#d7e5fc}
.sheet-footer{display:flex;flex-wrap:wrap;gap:1rem;padding:1.25rem 1.5rem;border-top:1px solid var(--line);background:var(--wash)}
.sheet-footer .secondary{flex:1 1 12rem;background:white}
.next-note{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;flex:1 1 12rem;gap:.2rem;min-height:3rem;border:0;border-radius:.6rem;background:transparent;padding:.5rem .75rem;color:var(--blue);text-align:left}
.next-note:hover{background:#e4ecfa}
.next-note span{font-size:.875rem;color:var(--muted)}
.next-note b{font-size:1rem}
.deal-due{font-size:1.25rem;font-weight:750;color:var(--blue)}
.deal-desc{margin-top:1rem;white-space:pre-line}
.deal-facts{margin:1.5rem 0 0}
.deal-facts>div{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.4rem 1rem;padding:.6rem 0;border-bottom:1px solid var(--line)}
.deal-facts dt{color:var(--muted)}
.deal-facts dd{margin:0;text-align:right}
.deal-go{display:flex;flex-wrap:wrap;gap:.5rem 1.25rem;align-items:center;margin-top:1.5rem}
.deal-go .buy{background:var(--blue);color:white}
.static-note{padding-block:2rem;border-top:1px solid var(--line)}
.no-script>p{padding:1.5rem;background:var(--wash)}

/* Compare columns when they fit; large text and narrow screens keep the same fields. */
@media(max-width:24rem){
 .prods{grid-template-columns:minmax(0,1fr)}
 .prod{grid-row:auto;grid-template-rows:none;row-gap:.85rem}
 .product-info{grid-row:auto;grid-template-rows:none;row-gap:.6rem}
 .prod .buy{justify-self:start}
}
@supports not (grid-template-rows:subgrid){
 .prod,.product-info{display:block}
 .product-info>*+*,.prod>*+*{margin-top:1rem}
}

@media(max-width:65rem){.hero{gap:2rem;padding-block:3rem}
.board{gap:0 2.5rem}
.hero h1{font-size:2.75rem}
.wide-only{display:none}
.feature-picture{height:13rem}
.feature-main{height:11rem}
.feature-side{height:6rem}
.feature-back{height:8rem}
}

@media(max-width:53rem){.hero{grid-template-columns:1fr;max-width:42rem;gap:2.5rem}
.hero-copy{max-width:36rem}
.feature-note{max-width:35rem;width:100%}
.feature-picture{height:13rem}
.feature-main{height:12rem}
.board{grid-template-columns:1fr}
.block{padding-block:2.5rem}
.contact{flex-wrap:wrap}
.head h2{font-size:1.8rem}
.hero h1{font-size:clamp(2.3rem,7vw,3.2rem)}
}

@media(max-width:40rem){.wrap{width:calc(100% - 2rem)}
.top{position:relative}
.top-in{flex-wrap:wrap;gap:0;min-height:0;padding-top:.5rem}
.brand{font-size:1.8rem}
.tabs{width:100%;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.15rem;padding-block:.25rem .5rem}
.tabs a{justify-content:center;text-align:center;font-size:.9375rem;padding:.5rem .2rem;line-height:1.5;min-height:3rem}
.hero{padding-block:1rem;gap:0}
.hero h1{font-size:2rem}
.hero-intro{display:none}
.hero-copy>p:not(.hero-intro){margin-top:.5rem;font-size:1rem;line-height:1.5}
.hero .search-box{margin-top:1rem}
.feature-note{display:none}
#collections{padding-top:1.25rem}
#collections .head{margin-bottom:.75rem}
#collections .head p{margin-top:.25rem;font-size:1rem;line-height:1.6}
.hero-actions{margin-top:1.5rem;gap:.5rem 1rem}
.hero-intro{margin-bottom:1rem}
.feature-label{padding:1.25rem 1.25rem 0}
.feature-bottom{padding:1.2rem}
.feature-picture{height:11rem;margin-inline:1rem}
.feature-main{height:10rem}
.feature-side{height:5.5rem}
.feature-back{height:7.5rem}
.feature-bottom b{font-size:1.3rem}
.search-box label{display:block;margin-bottom:.6rem}
.search-control{width:100%}
.coll{display:grid;grid-template-columns:3rem minmax(0,1fr) 1.2rem;align-items:center;gap:.75rem;min-height:5rem;padding-block:.75rem}
.colls{grid-template-columns:1fr;gap:0}
.coll .tile{width:3rem;height:3rem;border-radius:.65rem}
.coll .art{width:3rem;height:3rem}
.note-group>h3{margin-bottom:.25rem}
.card-copy b{font-size:1.0625rem}
.coll .open-icon{display:block}
.head h2{font-size:1.6rem}
.price-top{flex-wrap:wrap;gap:.5rem 1rem}
.price-value{margin-left:auto}
.contact{padding:1.25rem;margin-top:1rem}
.contact .secondary{flex:1 1 100%;min-width:0;max-width:100%;width:100%;padding-inline:1rem}
.foot{margin-top:2.5rem}
.sheet{width:calc(100% - 1rem);max-height:92dvh;border-radius:1rem;margin:auto}
.sheet-top{position:relative;display:block;padding:1rem 16px}
.sheet-top .sheet-context{padding-right:64px;min-height:48px;display:flex;align-items:center}
.sheet-top .close{position:absolute;top:1rem;right:16px;width:48px;height:48px;min-width:48px;min-height:48px}
.sheet-top h2{font-size:1.4rem;margin-top:.5rem}
.sheet-top .close svg{width:24px;height:24px}
.tile.sm{display:none}
.sheet-body,.sheet-footer{padding:1rem}
.prod{padding:1.25rem 0;gap:.75rem}
.product-info,.prod .range{grid-column:1/-1}
.prod .buy{width:100%}
.deal-go .buy{width:100%}
.sheet-footer .secondary,.next-note{flex-basis:100%}
.sheet-footer{gap:.5rem}
.deal-facts dd{text-align:left}
}

@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}
*,*::before,*::after{animation:none!important;transition:none!important}
.feature-note:hover .feature-main,.coll:hover .art,.primary:active,.secondary:active,.buy:active{transform:none}
}
