body{margin:0;background:#fff}
a{color:#0b0b0b}a:hover{color:#6b6b6b}
.ch,.ch *{box-sizing:border-box}
.ch{font-family:Inter,'Noto Sans KR',sans-serif;color:#0b0b0b;background:#fff;-webkit-font-smoothing:antialiased;word-break:keep-all}
:where(.ch) :where(button,input,select,textarea){font:inherit;color:inherit;border-radius:0}
:where(.ch) :where(button){background:none;border:0;padding:0;cursor:pointer;text-align:left}
.ch button:focus-visible,.ch a:focus-visible,.ch input:focus-visible,.ch select:focus-visible,.ch textarea:focus-visible{outline:2px solid #0b0b0b;outline-offset:2px}
.big-ic{width:1em;height:1em;display:block}

.hd{position:sticky;top:0;z-index:100;height:56px;display:flex;align-items:center;justify-content:space-between;padding:0 24px;background:#fff;border-bottom:1px solid #0b0b0b}
.hd-logo{min-height:44px;font-size:24px;font-weight:900;letter-spacing:-.04em}
.hd-nav{display:flex;align-items:center;gap:4px}
.hd-nav button{min-height:44px;padding:0 12px;font-size:13px;font-weight:500}
.hd-nav button:hover{color:#6b6b6b}
.hd-nav .add{background:#0b0b0b;color:#fff;font-weight:700;min-height:36px;margin-left:8px}
.hd-nav .add:hover{background:#3d3d3d;color:#fff}

.track{position:relative;height:calc(min(100vh,1200px)*3)}
.stage{--wf:min(29vw,40vh);--zt:calc(30px + 2% + var(--wf));--fw:clamp(170px,min(20vw,30vh),300px);position:sticky;top:56px;height:calc(min(100vh,1200px) - 56px);overflow:hidden;background:#e8e8e8}
.bar{position:absolute;inset:0 0 auto 0;height:28px;display:flex;align-items:center;justify-content:space-between;padding:0 14px;background:#fff;border-bottom:1px solid #c9c9c9;font-size:12px;font-weight:700;z-index:60}
.bar-r{display:flex;align-items:center;gap:12px}
.bar-n{min-height:27px;padding:0 10px!important;margin-left:-10px;user-select:none;-webkit-user-select:none;touch-action:manipulation}
.wall{position:absolute;left:0;right:0;top:calc(28px + 2%);margin:0;text-align:center;font-weight:900;font-size:var(--wf);line-height:1;letter-spacing:-.04em;white-space:nowrap;user-select:none}

.w{position:absolute;top:calc(var(--zt) + (100% - var(--zt))*var(--y)/100);width:calc(var(--wd)*var(--u,min(1vw,1.6vh)));background:#fff;border:1px solid #0b0b0b;box-shadow:0 14px 34px rgba(0,0,0,.2);will-change:transform,opacity}
.w-t{height:26px;display:flex;align-items:center;gap:5px;padding:0 9px;border-bottom:1px solid #d4d4d4;font-size:11px;font-weight:500;background:#fff;white-space:nowrap;overflow:hidden}
.w-t i{flex:none;width:9px;height:9px;border-radius:50%;background:#0b0b0b}
.w-t i+i{background:#8c8c8c}.w-t i+i+i{background:#d2d2d2}
.w-t span{margin-left:6px;overflow:hidden;text-overflow:ellipsis}
.w-b:disabled{cursor:default}
.w-b{display:block;width:100%;aspect-ratio:var(--r,4/3)}
.thumb{display:flex;align-items:center;justify-content:center;width:100%;height:100%;container-type:inline-size;overflow:hidden;position:relative}
.thumb b{font-size:42cqw;font-weight:900;letter-spacing:-.06em;line-height:1}
.thumb img{width:100%;height:100%;object-fit:cover;display:block}
.w .thumb img{filter:grayscale(1)}
.th-a{background:#fff;color:#0b0b0b}
.th-b{background:#0b0b0b;color:#fff}
.th-c{background:#bdbdbd;color:#0b0b0b}
.th-s b{font-size:21cqw;letter-spacing:-.04em;white-space:nowrap}
.th-e{background:repeating-linear-gradient(#fff 0 22px,#c4c4c4 22px 23px);color:#0b0b0b}

.pl button{display:flex;align-items:center;justify-content:space-between;width:100%;min-height:44px;padding:0 12px;border-bottom:1px solid #d4d4d4;font-size:clamp(13px,1.4vw,19px);font-weight:700}
.pl button:last-child{border-bottom:0}
.pl button:hover{background:#0b0b0b;color:#fff}
.ad{display:flex;align-items:center;justify-content:center;width:100%;aspect-ratio:1/1;position:relative;background:#fff}
.ad i{position:absolute;border:1px solid #0b0b0b;border-radius:50%}
.ad i:nth-child(1){width:74%;height:74%}.ad i:nth-child(2){width:52%;height:52%}.ad i:nth-child(3){width:30%;height:30%}
.ad b{position:relative;font-size:clamp(18px,3vw,44px);line-height:1;font-weight:900;background:#0b0b0b;color:#fff;width:1.3em;height:1.3em;display:flex;align-items:center;justify-content:center;border-radius:50%}

.fd{position:absolute;left:50%;top:max(calc(var(--zt) + 24px),46%);z-index:50;width:var(--fw);margin-left:calc(var(--fw)/-2);aspect-ratio:13/10;transform-origin:50% 0;will-change:transform}
.fd button{position:absolute;inset:0;width:100%;height:100%;display:block}
.fd-tab,.fd-body{position:absolute;background:#fff url(leopard.svg) 0 0/210px auto;border:2px solid #0b0b0b}
.fd-tab{left:0;top:0;width:42%;height:16%;border-bottom:0}
.fd-body{left:0;right:0;top:14%;bottom:0;box-shadow:0 18px 38px rgba(0,0,0,.28)}
.fd-paper{position:absolute;left:5%;right:5%;top:10%;height:8%;background:#fff;border:2px solid #0b0b0b}
.fd-label{position:absolute;left:50%;top:60%;transform:translate(-50%,-50%);padding:.25em .6em;background:#0b0b0b;color:#fff;font-size:clamp(15px,1.7vw,24px);font-weight:900;letter-spacing:.02em;white-space:nowrap}

.dock{position:absolute;left:50%;bottom:18px;transform:translateX(-50%);display:flex;background:#fff;border:1px solid #0b0b0b;z-index:60}
.dock button{display:flex;align-items:center;justify-content:center;width:58px;height:54px;border-right:1px solid #d4d4d4;font-size:24px;font-weight:900}
.dock a{display:flex;align-items:center;justify-content:center;width:58px;height:54px;border-right:1px solid #d4d4d4;text-decoration:none;font-size:13px;font-weight:900}
.dock>:last-child{border-right:0}
.dock button:hover,.dock a:hover{background:#0b0b0b;color:#fff}

.browse{padding:48px 24px 120px;scroll-margin-top:56px}
.top{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid #0b0b0b;border-bottom:1px solid #0b0b0b}
.top button{display:flex;align-items:center;gap:.16em;min-height:clamp(150px,22vw,300px);padding:0 24px;font-size:clamp(52px,11vw,172px);font-weight:900;letter-spacing:-.05em;line-height:1}
.top button+button{border-left:1px solid #0b0b0b}
.top button:hover{background:#efefef}
.top button.on{background:#0b0b0b;color:#fff}
.row{display:grid;grid-template-columns:repeat(var(--n,3),minmax(0,1fr))}
.cell{display:flex;align-items:flex-end;justify-content:space-between;min-height:clamp(96px,12vw,172px);padding:16px 24px;font-size:clamp(30px,5.4vw,84px);font-weight:900;letter-spacing:-.04em;line-height:1;border-right:1px solid #0b0b0b;border-bottom:1px solid #0b0b0b}
.cell:last-child{border-right:0}
.cell small{font-size:13px;font-weight:500;letter-spacing:0;line-height:1.4}
.cell:hover{background:#efefef}
.cell.on{background:#0b0b0b;color:#fff}
.row.sm .cell{min-height:clamp(84px,9vw,132px);padding:14px 16px;font-size:clamp(20px,2.7vw,40px)}
.row.gr .cell{font-size:clamp(34px,6.4vw,100px);padding:14px 16px}
.row.gr .cell small{font-size:clamp(12px,1.2vw,16px);font-weight:700}
.res-h{display:flex;align-items:baseline;justify-content:space-between;padding:56px 0 20px}
.res-h h2{margin:0;font-size:clamp(40px,7vw,112px);font-weight:900;letter-spacing:-.05em;line-height:1}
.res-h>span{font-size:13px;font-weight:500}
.grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:40px 16px}
.card{display:block;width:100%}
.card-t{aspect-ratio:4/3;border:1px solid #0b0b0b}
.card:hover .card-t{opacity:.72}
.card p{margin:10px 0 2px;font-size:16px;font-weight:700}
.card small{font-size:12px;color:#595959}
.empty{padding:64px 0;border-top:1px solid #0b0b0b;font-size:clamp(20px,3vw,40px);font-weight:700;letter-spacing:-.03em}
.ct{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px;padding:48px 0;border-bottom:1px solid #0b0b0b}
.ct h2{margin:0 0 20px;font-size:clamp(34px,5vw,72px);font-weight:900;letter-spacing:-.05em;line-height:1.05;white-space:pre-line}
.ct-side{font-size:15px;line-height:1.9}
.fld{display:block;margin-bottom:18px;font-size:12px;font-weight:700}
.fld input,.fld select,.fld textarea{display:block;width:100%;min-height:44px;margin-top:4px;padding:8px 10px;background:#fff;border:1px solid #0b0b0b;font-size:16px;font-weight:400}
.fld textarea{min-height:130px;resize:vertical}
.go{min-height:48px;padding:0 28px!important;background:#0b0b0b!important;color:#fff;font-size:15px;font-weight:700}
.go:hover{background:#3d3d3d!important}
.go2{min-height:48px;padding:0 20px!important;border:1px solid #0b0b0b!important;font-size:15px;font-weight:700;display:inline-flex;align-items:center;text-decoration:none}
.go2:hover{background:#efefef!important;color:#0b0b0b}
.msg{margin-top:12px;font-size:13px;font-weight:500}

.ft{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:24px;background:#0b0b0b;color:#fff;font-size:12px}
.ft button{min-height:44px;flex:none}
.ov{position:fixed;inset:0;z-index:200;display:flex;align-items:center;justify-content:center;padding:16px;background:rgba(0,0,0,.45)}
.dlg{width:min(560px,100%);max-height:calc(100vh - 32px);overflow:auto;background:#fff;border:1px solid #0b0b0b}
.dlg.big{width:min(880px,100%)}
.dlg-h{position:sticky;top:0;display:flex;align-items:center;justify-content:space-between;height:44px;padding:0 6px 0 14px;background:#fff;border-bottom:1px solid #0b0b0b;font-size:13px;font-weight:700;z-index:1}
.dlg-h button{min-width:44px;min-height:44px;text-align:center;font-size:18px}
.dlg-b{padding:20px}
.two{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.dt-img{aspect-ratio:16/10;border-bottom:1px solid #0b0b0b}
.dt-img img{object-fit:contain;background:#efefef}
.dt-t{margin:0 0 4px;font-size:clamp(26px,4vw,44px);font-weight:900;letter-spacing:-.04em}
.ar{display:grid;grid-template-columns:84px minmax(0,1fr) auto;gap:14px;align-items:center;padding:12px 0;border-top:1px solid #d4d4d4}
.ar-t{aspect-ratio:4/3;border:1px solid #0b0b0b;display:flex}
.ar-m{min-width:0}.ar-m strong{display:block;font-size:17px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ar-m small{font-size:12px;color:#595959}
.ar-b{display:flex;gap:6px}.ar-b .go2{min-height:44px;padding:0 14px!important;font-size:13px}
.paw{display:flex;align-items:center;justify-content:center;width:48px;height:48px;border:1px solid #0b0b0b!important;background:#fff}
.paw svg{fill:#fff}.paw.on svg{fill:#0b0b0b}
.st{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border:1px solid #0b0b0b;margin-bottom:12px}
.st>div{padding:14px;border-right:1px solid #0b0b0b}.st>div:last-child{border-right:0}
.st b{display:block;font-size:clamp(32px,5vw,56px);font-weight:900;letter-spacing:-.04em;line-height:1}.st small{font-size:12px}
.st7{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));margin-bottom:10px}
.st7>div{padding:8px 0;border-bottom:1px solid #d4d4d4;font-size:12px}.st7 b{display:block;font-size:18px;font-weight:700}
.acts{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}

@media(max-width:820px){
.st{grid-template-columns:repeat(2,minmax(0,1fr))}.ft{align-items:flex-start;font-size:11px}
.ar{grid-template-columns:64px minmax(0,1fr)}.ar-b{grid-column:1/-1}
.hd{padding:0 14px}.hd-nav button{padding:0 8px}
.bar{padding:0 10px}
.w-t{height:20px;font-size:9px;padding:0 6px;gap:3px}.w-t i{width:6px;height:6px}
.stage{--u:7px}.wg-pl{left:2%!important;--y:22!important;--wd:21!important}.fd{top:60%}.th-e{background:repeating-linear-gradient(#fff 0 12px,#c4c4c4 12px 13px)}
.browse{padding:64px 14px 80px}
.top button{padding:0 12px}
.row{grid-template-columns:repeat(var(--m,3),minmax(0,1fr))}
.row .cell{padding:12px}
.cell small{display:none}
.row.gr .cell small{display:inline}
.grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 10px}
.ct{grid-template-columns:minmax(0,1fr)}
.dock button,.dock a{width:52px;height:48px}
}
.ov[hidden],[hidden]{display:none!important}
.go:disabled{opacity:.5}
.note{margin-top:10px;font-size:12px;color:#595959}
.iq{padding:14px 0;border-top:1px solid #d4d4d4}.iq-h{display:flex;flex-wrap:wrap;gap:4px 12px;align-items:baseline;font-size:14px}.iq-h small{color:#595959}.iq p{margin:8px 0 10px;font-size:15px;line-height:1.7;white-space:pre-wrap}.iq .go2{min-height:44px;padding:0 14px!important;font-size:13px}
