*{box-sizing:border-box}body{margin:0;background:#f5f6f8;color:#17202a;font-family:"Noto Sans KR","Apple SD Gothic Neo","Malgun Gothic",sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit}.portal-header{height:86px;padding:0 max(4%,calc((100% - 1320px)/2));display:flex;align-items:center;justify-content:space-between;gap:20px;background:#fff;border-bottom:1px solid #e9ebef}.portal-header img{display:block;width:224px;height:auto}.portal-header>span{font-size:13px;color:#66717e;border-left:1px solid #dde1e6;padding-left:22px}.portal-intro{text-align:center;color:white;padding:64px 20px 82px;background:radial-gradient(ellipse at 80% 0%,#542236 0%,transparent 55%),radial-gradient(ellipse at 10% 100%,#222c45 0%,transparent 55%),#10131c}.portal-kicker{font-size:10px;font-weight:700;letter-spacing:2px;display:inline-flex;align-items:center;gap:9px;color:#f8ccd9;border:1px solid #ffffff26;border-radius:30px;padding:10px 15px;background:#ffffff07}.portal-kicker i{width:6px;height:6px;border-radius:50%;background:#f36c9b}.portal-intro h1{font-size:clamp(28px,3.4vw,44px);letter-spacing:-1.8px;margin:24px 0 19px;line-height:1.3}.portal-intro p{font-size:14px;line-height:1.9;color:#c2c5d0;margin:0}.mobile-break{display:none}.transport-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;max-width:1280px;margin:24px auto 0;padding:0 24px;position:relative}.transport-card{position:relative;display:flex;align-items:flex-end;min-width:0;height:416px;border:0;border-radius:15px;overflow:hidden;text-decoration:none;text-align:left;font:inherit;padding:0;color:white;background:#242a32;isolation:isolate;box-shadow:0 12px 30px #111b2e12}.transport-card>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .5s;z-index:-2}.card-shade{position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,#080d1820 0%,#080d1833 28%,#080d18ed 100%)}.transport-content{display:flex;flex-direction:column;align-items:flex-start;width:100%;padding:30px}.availability{display:inline-flex;padding:6px 10px;border-radius:5px;border:1px solid #ffffff35;color:#e5e7eb;background:#ffffff17;font-size:11px;font-weight:700;margin-bottom:48px}.availability.available{background:#d70051;border-color:#d70051;color:#fff}.transport-en{font-size:11px;letter-spacing:3px;font-weight:700;color:#e1cbd3;margin-bottom:8px}.transport-name{font-size:34px;font-weight:800;letter-spacing:-1px;line-height:1.2;margin:0 0 13px}.transport-desc{font-size:12px;line-height:1.8;color:#e0e3e9}.transport-action{margin-top:26px;padding-top:17px;border-top:1px solid #ffffff30;display:flex;justify-content:space-between;align-items:center;width:100%;font-size:13px;font-weight:700}.transport-action>span{font-size:23px;line-height:1}.rail{outline:2px solid #d70051;outline-offset:0;transition:transform .25s,box-shadow .25s}.rail:hover{transform:translateY(-5px);box-shadow:0 16px 38px #d7005124}.rail:hover>img{transform:scale(1.05)}.rail:focus-visible{outline:4px solid #d70051;outline-offset:5px}.unavailable{cursor:not-allowed;opacity:.65}.unavailable>img{filter:grayscale(.85) blur(2.5px);transform:scale(1.04)}.portal-guide{display:flex;justify-content:center;align-items:center;gap:8px;font-size:12px;color:#77808b;margin:27px 20px 46px;line-height:1.7}.guide-dot{width:6px;height:6px;border-radius:50%;background:#d70051;flex:none}footer{background:#2d2d2d;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:26px max(4%,calc((100% - 1240px)/2))}footer img{width:205px}footer p{font-size:10px;color:#bfc4c9;line-height:1.7}@media(max-width:760px){.portal-header{height:70px;padding:0 20px}.portal-header img{width:180px}.portal-header>span{font-size:11px;padding-left:12px}.portal-intro{padding:40px 20px 61px}.portal-kicker{font-size:8px;letter-spacing:1.2px}.portal-intro h1{letter-spacing:-1.2px}.portal-intro p{font-size:12px}.transport-grid{gap:12px;padding:0 16px;grid-template-columns:1fr;max-width:560px;margin-top:16px}.transport-card{height:220px;border-radius:12px}.transport-content{padding:24px}.availability{position:absolute;right:20px;top:20px;margin:0}.transport-name{font-size:29px;margin-bottom:6px}.transport-action{margin-top:15px;padding-top:11px;font-size:12px}.transport-en{font-size:9px;margin-bottom:6px}.transport-desc{font-size:11px}.transport-card>img{object-position:center 48%}.portal-guide{font-size:10px;margin:23px 16px 31px}footer{flex-direction:column;align-items:flex-start;padding:25px 22px;gap:8px}footer img{width:185px}footer p{margin:8px 0}}@media(prefers-reduced-motion:reduce){.rail,.transport-card>img{transition:none}.rail:hover{transform:none}}.transport-action .nav-arrow{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;flex:none;color:#fff;border:1px solid #ffffff80;border-radius:50%;background:#ffffff1c;transition:background .2s,border-color .2s}
.transport-action .nav-arrow svg{width:17px;height:17px}
.rail:hover .nav-arrow,.rail:focus-visible .nav-arrow{background:#d70051;border-color:#d70051}
@media(prefers-reduced-motion:reduce){.transport-action .nav-arrow{transition:none}}
@keyframes portal-content-reveal{from{opacity:.62;filter:blur(1.5px);transform:translateX(-12px)}to{opacity:1;filter:blur(0);transform:translateX(0)}}
.portal-intro>*,.portal-guide{animation:portal-content-reveal .85s cubic-bezier(.22,1,.36,1) backwards}
.portal-intro h1{animation-delay:.08s}.portal-intro p{animation-delay:.16s}.portal-guide{animation-delay:.22s}
@keyframes transport-image-reveal{from{opacity:.68;transform:scale(1.08) translateX(-1%)}to{opacity:1;transform:scale(var(--image-rest,1)) translateX(0)}}
@keyframes transport-copy-reveal{from{opacity:.58;transform:translateX(-10px)}to{opacity:1;transform:translateX(0)}}
@keyframes transport-line-reveal{from{opacity:.5;transform:scaleX(.35)}to{opacity:1;transform:scaleX(1)}}
.transport-action{position:relative;border-top:0}
.transport-action::before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:#ffffff30;transform-origin:left}
.transport-card.is-revealed .transport-action::before{animation:transport-line-reveal .9s cubic-bezier(.22,1,.36,1) .28s backwards}
.transport-card.unavailable{--image-rest:1.04}
.transport-card.is-revealed>img{animation:transport-image-reveal 1.5s cubic-bezier(.22,1,.36,1) backwards}
.transport-card.is-revealed .transport-content>*{animation:transport-copy-reveal .65s cubic-bezier(.22,1,.36,1) backwards}
.transport-card.is-revealed .availability{animation-delay:.1s}
.transport-card.is-revealed .transport-en{animation-delay:.16s}
.transport-card.is-revealed .transport-name{animation-delay:.23s}
.transport-card.is-revealed .transport-desc{animation-delay:.3s}
.transport-card.is-revealed .transport-action{animation-delay:.37s}

