:root{--ink:#26211D;--ink2:#4E453D;--wall:#F6F1E6;--ramie:#EAE0CB;--ramie2:#DCCFB4;--pink:#BE3560;--pinkS:#F0B3C2;--jade:#367A65;--jadeS:#B7D9CA;--indigo:#2C3668;--indigoS:#9DA5CF;--gard:#E2B23E;--gardS:#F1DC9F;--pad:72px;--d:'Gowun Batang',Georgia,serif;--t:'Gothic A1','Helvetica Neue',Arial,sans-serif;--dash:rgba(38,33,29,.45)}
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--wall);color:var(--ink);font:17px/1.55 var(--t);overflow-x:clip}
h1,h2,h3,p,ul,ol,dl,dd,figure,blockquote{margin:0;padding:0}
ul,ol{list-style:none}
h1,h2,h3{font-family:var(--d);font-weight:700;line-height:1.12;letter-spacing:-.01em}
img,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
:focus-visible{outline:2px dashed var(--pink);outline-offset:3px}
.skip{position:absolute;left:-999px;top:8px;z-index:30;background:var(--wall);padding:10px 16px}
.skip:focus{left:8px}
.w{position:relative;z-index:1;width:100%;max-width:1368px;margin-inline:auto;padding-inline:var(--pad)}
.plus{flex:none}
/* patch of cloth: translucent fill, 2px seam, inner gekki band, ramie weave */
.pt{position:absolute;display:block;background:var(--c);box-shadow:inset 0 0 0 2px rgba(38,33,29,.18);overflow:hidden}
.pt::before,.mo::before{content:"";position:absolute;inset:0;background:url(../img/ramie.webp) 0 0/256px;opacity:.2;mix-blend-mode:overlay;pointer-events:none}
.pt::after{content:"";position:absolute;inset:7px;border:1px solid rgba(38,33,29,.1);pointer-events:none}
.mo{position:absolute;background:var(--c);box-shadow:inset 0 0 0 2px rgba(38,33,29,.18)}
.mm{display:none}
.tag{display:inline-block;width:fit-content;padding:6px 10px;border:1px dashed rgba(38,33,29,.55);background:var(--wall);font:600 12px/1.2 var(--t);letter-spacing:.08em;text-transform:uppercase}
.t-pink,.t-jade,.t-indigo,.t-persim,.t-plum{color:var(--wall);border-color:rgba(246,241,230,.55)}
.t-pink{background:var(--pink)}.t-jade{background:var(--jade)}.t-indigo{background:var(--indigo)}.t-persim{background:#AE4E28}.t-plum{background:#7A3A6C}.t-gard{background:var(--gard)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;padding:17px 24px;background:var(--ink);color:var(--wall);font:600 16px/1.2 var(--t);border:1px solid var(--ink);white-space:nowrap;transition:background .2s,color .2s,border-color .2s}
.btn:hover{background:var(--pink);border-color:var(--pink)}
.btn.gh{background:var(--wall);color:var(--ink)}
.btn.gh:hover{background:var(--pink);color:var(--wall)}
.ul{font:600 16px/1.55 var(--t);text-decoration:underline;text-underline-offset:2px}
.ul:hover{color:var(--pink)}
.crumbs ol{display:flex;flex-wrap:wrap;align-items:center;gap:10px;font-size:13px;line-height:1.3;color:var(--ink2)}
.crumbs li{display:flex;align-items:center;gap:10px}
.crumbs b{font-weight:600;color:var(--ink)}
.crumbs a:hover{text-decoration:underline}
/* chrome */
.top{position:relative;z-index:6;background:var(--wall);border-bottom:1px dashed rgba(38,33,29,.5)}
.tp{display:flex;justify-content:space-between;align-items:center;padding-block:22px}
.n-l,.n-r{width:300px;display:flex;align-items:center}
.n-r{justify-content:flex-end;gap:28px}
.top ul{display:flex;gap:36px}
.top li a{display:block;padding:4px 0 6px;border-bottom:2px dashed transparent;font:500 15px/1.2 var(--t);transition:border-color .2s}
.top li a:hover{border-color:var(--dash)}
.top li a[aria-current]{font-weight:700;border-color:var(--pink)}
.n-e{font-size:13px;color:var(--ink2);line-height:1.55}
.n-e:hover{text-decoration:underline}
.logo{display:inline-flex;align-items:center;gap:10px;font:700 24px/1.1 var(--d);letter-spacing:-.01em}
.mark{width:30px;height:30px;flex:none}
.mb,.sp,.mnav{display:none}
.foot{background:var(--indigo);color:var(--wall);padding-bottom:40px}
.kai{position:relative;height:18px;overflow:hidden;margin-bottom:56px}
.kai .pt::after{display:none}
.f-c{display:flex;gap:64px}
.f-1{flex:0 0 420px;display:flex;flex-direction:column;gap:14px;font-size:15px;box-sizing:content-box}
.f-1 p{opacity:.9}.f-1 .dis{font-size:13px;opacity:.72}
.logo.lt .mark{width:28px;height:28px}
.f-n{flex:1;min-width:0;display:flex;flex-direction:column;gap:12px}
.f-n h2{font:600 12px/1.55 var(--t);letter-spacing:.1em;text-transform:uppercase;color:var(--gardS)}
.f-n:last-child{flex:1 0 auto}
.f-n ul{display:flex;flex-direction:column;gap:12px;font-size:15px}
.f-n li{overflow-wrap:anywhere}
.f-n a:hover,.f-n button:hover{text-decoration:underline}
.f-b{margin-top:56px;border-top:1px dashed rgba(246,241,230,.35);padding-top:18px}
.f-b .w{display:flex;justify-content:space-between;gap:8px 24px;font-size:13px;opacity:.75}
/* hero: mockup coordinates scale with --u */
.hero{container-type:inline-size;position:relative;background:radial-gradient(90% 90% at 10% 0,rgba(255,244,214,.6),rgba(255,244,214,0)),linear-gradient(120deg,rgba(44,54,104,0),rgba(44,54,104,.06)),var(--wall);overflow:hidden}
.stg{--u:min(100cqw/1368,1.41px);position:relative;height:calc(740*var(--u))}
.cloth{position:absolute;left:calc(40*var(--u));top:calc(-46*var(--u));width:calc(1488*var(--u));height:calc(820*var(--u));filter:drop-shadow(6px 14px 18px rgba(38,33,29,.14));transform-origin:50% 0;animation:sway 9s ease-in-out infinite alternate}
@keyframes sway{from{transform:rotate(-.4deg)}to{transform:rotate(.4deg)}}
.ch{left:calc(var(--x)*var(--u));top:calc(var(--y)*var(--u));width:calc(var(--w)*var(--u));height:calc(var(--h)*var(--u))}
.om{display:none}
.hg{overflow:visible;transition:filter .2s}
.hg:hover{filter:brightness(1.06);z-index:2}
.hc{position:absolute;left:calc(var(--ix)*var(--u));top:calc(var(--iy)*var(--u));width:calc(176*var(--u));box-shadow:1px 3px 8px rgba(38,33,29,.18)}
.hc img{width:100%;height:auto}
.hs{left:0;right:0;top:calc(var(--sy)*var(--u));height:calc(var(--sh)*var(--u));padding:calc(12*var(--u)) calc(14*var(--u))}
.hs b,.hs small{position:relative;display:block}
.hs b{font:700 max(12px,calc(18*var(--u)))/1.1 var(--d)}
.hs small{margin-top:2px;font:600 max(9px,calc(11*var(--u)))/1.2 var(--t);letter-spacing:.08em;text-transform:uppercase}
.on-d{color:var(--wall)}.on-l{color:var(--ink)}
.lt-s{position:absolute;inset:0;pointer-events:none;--sx:14%;--sy:4%;background:radial-gradient(60% 75% at var(--sx) var(--sy),rgba(255,244,214,.5),rgba(255,244,214,0)),linear-gradient(120deg,rgba(44,54,104,0),rgba(44,54,104,.16))}
.hl{position:absolute;left:calc(64*var(--u));top:calc(110*var(--u));width:calc(572*var(--u))}
.hl h1{font-size:calc(92*var(--u));line-height:1}
.hl>p{margin-top:calc(26*var(--u));font-size:max(14px,calc(18*var(--u)));color:rgba(38,33,29,.82)}
.h-a{margin-top:calc(26*var(--u));padding-top:calc(8*var(--u))}
.h-a .btn{padding:calc(17*var(--u)) calc(24*var(--u));font-size:max(14px,calc(16*var(--u)))}
.ftab{position:absolute;left:0;top:calc(466*var(--u));display:flex;gap:6px calc(18*var(--u));flex-wrap:wrap;padding:calc(14*var(--u)) calc(22*var(--u));background:var(--gardS);border:1px dashed rgba(38,33,29,.6);box-shadow:2px 6px 14px rgba(38,33,29,.2);max-width:100%;width:max-content}
.ftab li{display:flex;align-items:center;gap:8px;font:600 max(12px,calc(14*var(--u)))/1.2 var(--t);white-space:nowrap}
/* sections */
.sec{position:relative;overflow:clip;padding-block:96px 104px;box-shadow:inset 0 6px rgba(38,33,29,.14)}
.sec>.w{display:flex;flex-direction:column;gap:40px;margin-top:6px}
.sec::before{content:"";position:absolute;inset:0;background:url(../img/ramie.webp) 0 0/256px;opacity:.3;mix-blend-mode:overlay;pointer-events:none}
.s-wall{background:var(--wall)}.s-ramie{background:var(--ramie)}.s-jadeS{background:var(--jadeS)}.s-pinkS{background:var(--pinkS)}.s-indigoS{background:var(--indigoS)}.s-gardS{background:var(--gardS)}
.li::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(75% 75% at 16% 8%,rgba(255,244,214,.32),rgba(255,244,214,0)),linear-gradient(120deg,rgba(44,54,104,0),rgba(44,54,104,.1))}
.li-r::after{background:radial-gradient(75% 75% at 90% 0,rgba(255,244,214,.4),rgba(255,244,214,0)),linear-gradient(120deg,rgba(44,54,104,0),rgba(44,54,104,.1))}
.sh{display:flex;gap:80px}
.se{align-items:flex-end}
.sh h2,.h52{font-size:52px}
.sh h2{flex:0 0 640px}
.sl h2{flex-basis:520px}
.sh p{flex:0 1 380px;color:var(--ink2)}
.sl p{flex-basis:420px;color:var(--ink)}
.w760{max-width:760px}
.glo{display:grid;grid-template-columns:repeat(4,1fr);gap:28px 24px}
.glo li{display:flex;flex-direction:column;gap:10px;padding-top:16px;border-top:1px dashed var(--dash);font-size:15px}
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,371px));gap:56px 40px}
.card{display:flex;flex-direction:column;gap:14px;--cs:16px;--o:10px;--lh:30px}
.card p{font-size:15px;color:var(--ink2)}
.card a{display:block}
.cc{position:relative;display:block;padding-bottom:calc(46px - 0px)}
.cv{position:relative;display:block;width:calc(100% - var(--cs));transition:translate .22s ease;box-shadow:2px 4px 10px rgba(38,33,29,.16)}
.cv img{width:100%;height:auto;aspect-ratio:1}
.card .bk{position:absolute;left:var(--o);top:var(--o);width:calc(100% - var(--cs));aspect-ratio:1;background:var(--c);box-shadow:inset 0 0 0 2px rgba(38,33,29,.18);transition:left .22s ease,top .22s ease}
.sti{position:absolute;inset:10px;border:1px dashed rgba(246,241,230,.75);pointer-events:none;transition:border-color .22s}
.lb{position:absolute;left:18px;right:34px;bottom:0;padding:10px 14px;background:var(--wall);border:1px dashed rgba(38,33,29,.5);box-shadow:1px 3px 6px rgba(38,33,29,.12);transition:background .22s,color .22s,translate .22s}
.lb h3{font-size:24px;line-height:1.1;font-weight:700}
.lb small{display:block;margin-top:3px;font:600 11px/1.3 var(--t);letter-spacing:.08em;text-transform:uppercase;color:var(--ink2);transition:color .22s}
.card a:hover .cv,.card a:focus-visible .cv{translate:0 -4px;box-shadow:2px 10px 22px rgba(38,33,29,.26)}
.card a:hover .bk,.card a:focus-visible .bk{left:18px;top:18px}
.card a:hover .sti,.card a:focus-visible .sti{border-color:var(--pink)}
.card a:hover .lb,.card a:focus-visible .lb{background:var(--pink);border-color:var(--pink);color:var(--wall);translate:0 -6px}
.card a:hover small,.card a:focus-visible small{color:var(--wall)}
.sewn{--z:96px;--o:5px;position:relative;display:block;flex:none;width:calc(var(--z) + var(--o));height:calc(var(--z) + var(--o))}
.sewn .bk{position:absolute;left:var(--o);top:var(--o);width:var(--z);height:var(--z);background:var(--c);box-shadow:inset 0 0 0 2px rgba(38,33,29,.18)}
.sewn img{position:relative;width:var(--z);height:var(--z);box-shadow:2px 4px 10px rgba(38,33,29,.16)}
.sewn .sti{inset:8px calc(var(--o) + 8px) calc(var(--o) + 8px) 8px}
.z460{--z:460px;--o:14px}.z440{--z:440px;--o:14px}.z140{--z:140px}
.qg{display:grid;grid-template-columns:repeat(2,1fr);gap:36px 56px}
.qt{display:flex;gap:22px}
.qt>div{display:flex;flex-direction:column;gap:8px}
.qt blockquote{font:400 20px/1.4 var(--d)}
.qt figcaption{font:600 12px/1.55 var(--t);letter-spacing:.08em;text-transform:uppercase;color:var(--ink2)}
.qt figcaption a:hover{text-decoration:underline}
.sign{font:400 20px/1.55 var(--d)}
.picks{display:grid;grid-template-columns:repeat(3,1fr)}
.pick{position:relative;display:flex;flex-direction:column;gap:16px;padding:36px 32px 40px;box-shadow:inset 0 0 0 6px rgba(38,33,29,.16);isolation:isolate}
.pick::before{content:"";position:absolute;inset:0;z-index:-1;background:url(../img/ramie.webp) 0 0/256px;opacity:.35;mix-blend-mode:overlay}
.p-gard{background:radial-gradient(75% 75% at 16% 8%,rgba(255,244,214,.3),rgba(255,244,214,0)),var(--gard)}.p-jade{background:radial-gradient(75% 75% at 16% 8%,rgba(255,244,214,.3),rgba(255,244,214,0)),var(--jade)}.p-indigo{background:radial-gradient(75% 75% at 16% 8%,rgba(255,244,214,.3),rgba(255,244,214,0)),var(--indigo)}
.pick h3{font-size:32px}
.pick>p{font-size:15px}
.pick ul{display:flex;flex-direction:column;gap:10px;padding-top:8px}
.pick li a{display:flex;align-items:center;gap:14px;padding:8px 10px;border:1px dashed currentColor;font:600 16px/1.55 var(--t);transition:background .2s}
.pick li a:hover{background:rgba(255,244,214,.18)}
.on-l li a{border-color:rgba(38,33,29,.5)}.on-d li a{border-color:rgba(246,241,230,.5)}
.pick li span{flex:1;min-width:0}
.pick img{width:56px;height:56px}
.abr{display:flex;gap:80px}
.abl{flex:0 0 380px;display:flex;flex-direction:column;align-items:flex-start;gap:22px}
.abf{flex:1;display:grid;grid-template-columns:1fr 1fr;gap:32px 48px}
.abf>div{display:flex;flex-direction:column;gap:10px;padding-top:18px;border-top:1px dashed rgba(38,33,29,.5)}
.abf h3{display:flex;align-items:center;gap:10px;font:700 15px/1.55 var(--t);letter-spacing:0}
.abf svg,.afq svg,.pk svg{color:var(--pink)}
.abf p{font-size:16px;color:var(--ink2)}
.abf a,.afq a,.kc a,.lc a{text-decoration:underline}
/* page heads */
.head{padding-block:48px 72px}
.head>.w{gap:20px}
.head h1{font-size:80px;line-height:1;max-width:760px}
.ld{max-width:560px;color:var(--ink)}
.ld.a{font-size:19px;max-width:600px}
.mt{font-size:13px;color:var(--ink2)}
.gsec{padding-block:80px}
.gr2{display:flex;gap:80px;align-items:center}
.gtx{flex:1;min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:18px}
.gtx h2{font-size:60px}
.gtx>p{color:var(--ink);max-width:none}
.fr{width:100%}
.fr.pad{padding-block:8px}
.fr>div{display:flex;gap:16px;padding:11px 0;border-bottom:1px dashed rgba(38,33,29,.4)}
.fr dt{flex:0 0 150px;display:flex;align-items:center;gap:8px;align-self:flex-start;font:600 12px/1.4 var(--t);letter-spacing:.08em;text-transform:uppercase}
.fr dd{flex:1;min-width:0;font-size:15px;overflow-wrap:anywhere}
.ghd{padding-block:40px 72px}
.ghd>.w{gap:32px}
.ghr{gap:72px;align-items:flex-start}
.ghd h1{font-size:72px;max-width:none}
.ghd .ld{font-size:18px;max-width:none}
/* tabs */
.tabs{padding-block:56px 80px}
.tabs>.w{gap:0}
.tl{display:flex;gap:6px}
.tl button{padding:14px 24px;background:var(--ramie2);border:1px dashed rgba(38,33,29,.3);font:500 15px/1.2 var(--t);color:var(--ink2);transition:background .2s}
.tl button:hover{background:var(--ramie)}
.tl button[aria-selected=true]{background:var(--ramie);border-color:rgba(38,33,29,.7);font-weight:700;color:var(--ink)}
.panel{position:relative;display:flex;gap:64px;padding:44px 44px 48px;background:var(--ramie);border:1px dashed rgba(38,33,29,.7);isolation:isolate}
.panel::before{content:"";position:absolute;inset:0;z-index:-1;background:url(../img/ramie.webp) 0 0/256px;opacity:.3;mix-blend-mode:overlay}
.ov{flex:1;min-width:0;display:flex;flex-direction:column;gap:16px}
.ov h2,.pw h2{font-size:32px}
.ov h3,.wg h3{font-size:24px}
.wg{flex:0 0 400px;display:flex;flex-direction:column;gap:12px}
.pw{flex:1;min-width:0;display:flex;flex-direction:column;gap:18px;max-width:820px}
.plist{display:flex;flex-direction:column;gap:12px;font-size:15px}
.plist li{display:flex;gap:10px}
.plist svg{margin-top:4px}
.jd svg{color:var(--jade)}
.fq{display:flex;flex-direction:column;gap:10px}
.fq h3{font:700 15px/1.55 var(--t);letter-spacing:0;margin-top:8px}
.fq p{font-size:15px;color:var(--ink2)}
.endr{display:flex;gap:80px}
.sim{flex:1;display:flex;flex-direction:column;gap:20px}
.sim h2{font-size:36px}
.smr{display:flex;gap:32px}
.sm{position:relative;flex:0 1 260px;display:flex;flex-direction:column;gap:10px}
.sm h3{font-size:20px}
.sm a::after{content:"";position:absolute;inset:0}
.sm:hover h3{text-decoration:underline}
.sm p{font-size:14px;color:var(--ink2)}
.wh{flex:0 0 420px;align-self:flex-start;display:flex;flex-direction:column;align-items:flex-start;gap:12px;padding:28px;border:1px dashed rgba(38,33,29,.4)}
.wh h2{font-size:24px}
.wh p{font-size:15px}
.wh .ul{font-size:15px}
/* about */
.abg{display:grid;grid-template-columns:1fr 1fr;gap:48px 64px}
.abg>div{display:flex;flex-direction:column;gap:12px;padding-top:20px;border-top:1px dashed var(--dash)}
.abg h2{font-size:30px}
.h44{font-size:44px}
.afq>div{display:flex;gap:48px;padding:18px 0;border-bottom:1px dashed var(--dash)}
.afq h3{flex:0 0 460px;display:flex;gap:10px;font:700 16px/1.55 var(--t);letter-spacing:0}
.afq h3 svg{margin-top:4px}
.afq p{flex:1;font-size:15px;color:var(--ink2)}
.kr{display:flex;gap:80px;align-items:flex-start}
.kl{flex:1;display:flex;flex-direction:column;gap:14px}
.kc{flex:0 0 460px;padding:18px 22px;background:var(--wall);border:1px dashed rgba(38,33,29,.5)}
/* legal */
.lh{padding-block:48px 64px}
.lh>.w{gap:18px}
.lh h1{font-size:72px}
.ld{max-width:640px}
.lgb{padding-block:64px 96px}
.strip{position:absolute;left:0;top:0;width:40px;height:3000px}
.lc{max-width:760px;padding-left:240px;display:flex;flex-direction:column;gap:36px;box-sizing:content-box;padding-right:0;width:auto;max-width:520px}
.lc>div{display:flex;flex-direction:column;gap:10px}
.lc h2{font-size:26px}
.lc p{font-size:16px}
/* cookie */
.cookie{position:fixed;right:24px;bottom:24px;z-index:20;width:min(500px,calc(100vw - 30px));max-height:calc(100dvh - 32px);overflow:auto;display:flex;flex-direction:column;align-items:flex-start;gap:14px;padding:32px 32px 30px;background:var(--wall);box-shadow:inset 0 0 0 6px rgba(38,33,29,.14),4px 10px 28px rgba(38,33,29,.22)}
.ck-c{position:absolute;right:0;top:0;width:90px;height:60px;background:rgba(190,53,96,.9)}
.cookie h2{font-size:26px;max-width:calc(100% - 80px)}
.cookie p{font-size:15px}
.ck-acts{display:flex;gap:10px;width:100%}
.ck-acts .btn{flex:1}
.cookie .ul{font-size:14px}
.ck-manage{display:flex;flex-direction:column;align-items:flex-start;gap:8px;font-size:15px}
.ck-manage label{display:flex;gap:8px;align-items:center}
.ck-manage input{accent-color:var(--pink);width:16px;height:16px}
/* desktop narrow */
@media (max-width:1367px){.sh h2{flex:0 1 640px}.sl h2{flex-basis:520px}.f-1{flex:0 1 420px}.wg{flex:0 1 400px}.wh{flex:0 1 420px}}
@media (max-width:1199px){
  :root{--pad:40px}
  .n-l,.n-r{width:auto;flex:1}.n-e{display:none}
  .sec{padding-block:72px 80px}
  .sh{gap:40px}.sh h2,.h52{font-size:42px}
  .glo{grid-template-columns:repeat(2,1fr)}
  .cards{grid-template-columns:repeat(3,minmax(0,1fr));gap:40px 24px}
  .lb h3{font-size:18px}.lb{left:10px;right:26px;padding:8px 10px}.dv{display:none}
  .qg{gap:32px 32px}.qt{gap:16px}.qt blockquote{font-size:17px}
  .pick{padding:26px 20px 30px}.pick h3{font-size:26px}.pick img{width:44px;height:44px}.pick li a{font-size:14px;gap:10px}
  .abr,.gr2,.ghr,.endr,.kr{gap:40px}.abl{flex:0 0 240px}
  .head h1{font-size:60px}
  .z460,.z440{--z:300px;--o:10px}
  .gtx h2,.ghd h1{font-size:44px}
  .fr dt{flex-basis:120px}
  .panel{gap:32px;padding:32px 28px}.wg{flex:0 0 280px}
  .wh{flex:0 0 300px}
  .afq h3{flex:0 0 300px}
  .kc{flex:0 0 340px}
  .f-c{gap:32px}.f-1{flex:0 0 280px}
  .lc{padding-left:96px;max-width:600px}
  .abg{gap:36px 40px}
}
@media (min-width:768px) and (max-width:1023px){.hs small{display:none}}
@media (max-width:767px){
  :root{--pad:20px}
  body{font-size:15px}
  .tp{padding-block:14px}
  .n-l,.n-r{display:none}
  .mb{display:block;padding:7px 9px;border:1px dashed var(--ink);font:600 12px/1.55 var(--t);letter-spacing:.06em;text-transform:uppercase}
  .sp{display:block;width:54px}
  .logo{font-size:18px}.mark{width:24px;height:24px}
  .mnav{display:block;position:absolute;left:0;right:0;top:100%;background:var(--wall);border-bottom:1px dashed var(--dash);padding:8px 20px 14px}
  .mnav ul{flex-direction:column;gap:6px}
  .foot{padding-bottom:28px}.kai{margin-bottom:36px}
  .f-c{flex-direction:column}.f-1{flex:none}.f-b{margin-top:36px}
  .f-c{gap:32px}.logo.lt{font-size:24px}
  .f-b .w{flex-direction:column}
  .stg{--u:min(100cqw/360,1.5px);height:calc(1090*var(--u))}
  .cloth{left:calc(10*var(--u));top:calc(-30*var(--u));width:calc(480*var(--u));height:calc(1170*var(--u))}
  .ch{left:calc(var(--mx)*var(--u));top:calc(var(--my)*var(--u));width:calc(var(--mw)*var(--u));height:calc(var(--mh)*var(--u))}
  .od{display:none}.om{display:block}
  .hc{left:calc(var(--mix)*var(--u));top:calc(var(--miy)*var(--u));width:calc(124*var(--u))}
  .hs{top:calc(var(--msy)*var(--u));height:calc(var(--msh)*var(--u));padding:calc(9*var(--u)) calc(10*var(--u))}
  .hs b{font-size:calc(14*var(--u))}
  .hl{left:calc(22*var(--u));top:calc(76*var(--u));width:calc(286*var(--u))}
  .hl h1{font-size:calc(46*var(--u))}
  .hl>p{margin-top:calc(16*var(--u));font-size:calc(15*var(--u))}
  .h-a{margin-top:calc(16*var(--u));padding-top:calc(2*var(--u))}
  .h-a .btn{padding:calc(14*var(--u)) calc(18*var(--u));font-size:calc(15*var(--u))}
  .ftab{position:static;margin-top:calc(16*var(--u));width:100%;display:grid;grid-template-columns:1fr 1fr;gap:calc(8*var(--u)) calc(10*var(--u));padding:calc(10*var(--u)) calc(12*var(--u))}
  .ftab li{font-size:calc(13*var(--u))}
  .sec{padding-block:56px 64px}.sec>.w{gap:28px}
  .md{display:none}.mm{display:block}
  .sh{flex-direction:column;gap:12px}.sh h2,.h52{font-size:32px;flex:none}.sl h2{flex:none}.sh p,.sl p{flex:none;font-size:15px}
  .se{align-items:stretch}
  .glo{grid-template-columns:1fr;gap:18px}
  .cards{grid-template-columns:repeat(2,minmax(0,150px));gap:26px 14px}
  .card{gap:8px;--cs:8px;--o:6px}.card p{display:none}
  .cc{padding-bottom:34px}.lb{left:6px;right:14px;padding:6px 8px}.lb h3{font-size:15px}.card a:hover .bk{left:10px;top:10px}
  .qg{grid-template-columns:1fr;gap:22px}.qt{gap:14px}.q-c{--z:72px}.qt blockquote{font-size:16px}.sign{font-size:16px}
  .picks{grid-template-columns:1fr}.pick img{width:56px;height:56px}.pick li a{font-size:16px;gap:14px}
  .abr{flex-direction:column;gap:24px}.abl{flex:none}.abf{grid-template-columns:1fr;gap:20px}
  .head{padding-block:28px 40px}.head>.w{gap:14px}.head h1{font-size:40px}.ld,.ld.a{font-size:15px}.ld.a{font-size:16px}
  .gsec{padding-block:40px}
  .gr2,.gr2.rev{flex-direction:column;align-items:flex-start;gap:22px}.gr2.rev{flex-direction:column-reverse}
  .z460,.z440{--z:min(300px,calc(100vw - 48px));--o:8px}
  .gtx{gap:12px;width:100%}.gtx h2,.ghd h1{font-size:34px}.ghd h1{font-size:38px}.ghd .ld{font-size:15px}
  .fr dt{flex-basis:110px}.fr dd{font-size:14px}
  .ghd{padding-block:24px 40px}.ghd>.w{gap:20px}
  .tabs{padding-block:32px 48px}.tl{flex-wrap:wrap;gap:4px}.tl button{padding:10px 12px;font-size:13px}
  .panel{flex-direction:column;gap:24px;padding:24px 18px 28px}.ov h2,.pw h2{font-size:26px}.ov h3,.wg h3{font-size:21px}.wg{flex:none}
  .endr{flex-direction:column;gap:32px}.sim h2{font-size:26px}.smr{gap:14px}.sm{flex:1 1 0;min-width:0}.z140{--z:96px}.sm h3{font-size:16px}
  .wh{flex:none;align-self:stretch;padding:20px 18px}.wh h2{font-size:20px}
  .abg{grid-template-columns:1fr;gap:28px}.abg h2{font-size:24px}.h44{font-size:30px}
  .afq>div{flex-direction:column;gap:6px}.afq h3{flex:none}
  .kr{flex-direction:column;gap:20px}.kl,.kc{flex:none;width:100%}
  .tabs>.w{gap:0}.lh>.w{gap:12px}
  .lh{padding-block:28px 36px}.lh h1{font-size:38px}
  .lgb{padding-block:36px 56px}.strip{display:none}.lc{padding-left:0;max-width:none;gap:26px}.lc h2{font-size:21px}
  .cookie{left:15px;right:15px;bottom:15px;width:auto;padding:24px 20px 22px}.ck-c{width:64px;height:44px}.cookie h2{font-size:22px}
  .ck-acts{flex-direction:column}
}
@media (prefers-reduced-motion:reduce){.cloth{animation:none}*,*::before,*::after{transition:none!important;animation:none!important;scroll-behavior:auto!important}}

/* social icons (footer) */
.f-n li.soc{display:flex;gap:8px}
.sic{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;flex:none;border:1px solid rgba(246,241,230,.35);color:var(--wall);transition:background .16s,color .16s,border-color .16s}
.sic:hover{background:var(--gard);border-color:var(--gard);color:var(--indigo)}
.sic .si{width:18px;height:18px}
