:root {
	--navy:#09264b;
	--deep:#061c39;
	--yellow:#ffdf08;
	--muted:#64748b;
	--paper:#f5f7fa;
	--container:1100px;
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:100px; -webkit-text-size-adjust:100%; }
body { margin:0; background:#fff; color:var(--navy); font-family:-apple-system,BlinkMacSystemFont,'Apple SD Gothic Neo','Noto Sans KR','Malgun Gothic',sans-serif; word-break:keep-all; line-height:1.65; }
a { color:inherit; text-decoration:none; }
button { font:inherit; cursor:pointer; }
img { display:block; max-width:100%; height:auto; }
h1,h2,h3,p,figure { margin:0; }
a,button,summary { -webkit-tap-highlight-color:transparent; }
a:focus-visible,button:focus-visible,summary:focus-visible { outline:3px solid #2875ed; outline-offset:5px; }
.container { width:calc(100% - 80px); max-width:var(--container); margin:0 auto; }
.skip-link { position:fixed; top:-80px; left:20px; z-index:100; padding:10px 20px; background:var(--yellow); color:var(--navy); }
.skip-link:focus { top:10px; }
.site-header { position:sticky; top:0; z-index:20; background:rgba(9,38,75,.97); color:#fff; border-bottom:1px solid rgba(255,255,255,.12); }
.header-inner { display:flex; align-items:center; justify-content:space-between; gap:24px; min-height:82px; }
.brand { display:inline-flex; align-items:center; gap:10px; font-size:24px; font-weight:850; letter-spacing:-1px; white-space:nowrap; }
.brand img { width:38px; height:38px; padding:3px; object-fit:contain; border-radius:9px; background:#fff; }
.brand-highlight { color:var(--yellow); }
.main-nav { display:flex; gap:34px; margin-left:auto; margin-right:34px; font-size:14px; font-weight:650; color:#d7e1ed; }
.main-nav a:hover { color:var(--yellow); }
.header-login { display:flex; align-items:center; gap:26px; border:1px solid #64758e; border-radius:8px; padding:9px 17px; font-size:14px; }
.header-login:hover { background:#ffffff12; }
.hero { overflow:hidden; background:var(--navy); color:#fff; }
.hero-inner { display:grid; grid-template-columns:.9fr 1.1fr; align-items:center; gap:38px; padding-top:86px; padding-bottom:70px; }
.eyebrow { display:flex; align-items:center; gap:9px; margin-bottom:22px; font-size:12px; font-weight:800; letter-spacing:2px; }
.hero .eyebrow { color:#d9e4f4; letter-spacing:.8px; }
.eyebrow>span { width:7px; height:7px; border-radius:50%; background:var(--yellow); }
.hero h1 { font-size:clamp(40px,4.2vw,61px); font-weight:850; line-height:1.21; letter-spacing:-2.7px; }
.hero h1 em { color:var(--yellow); font-style:normal; }
.hero-description { margin-top:25px; color:#c4d2e5; font-size:17px; line-height:1.8; }
.hero-actions { display:flex; flex-wrap:wrap; align-items:center; gap:20px; margin-top:32px; }
.button { display:inline-flex; align-items:center; justify-content:center; gap:25px; min-height:55px; padding:15px 23px; border-radius:9px; font-size:15px; font-weight:750; transition:transform .15s,box-shadow .15s; }
.button:hover { transform:translateY(-2px); box-shadow:0 8px 25px #0002; }
.button-yellow { background:var(--yellow); color:var(--deep); }
.button-navy { background:var(--navy); color:#fff; }
.text-link { display:inline-flex; align-items:center; gap:12px; font-size:14px; font-weight:700; }
.text-link:hover { text-decoration:underline; text-underline-offset:5px; }
.store-note { margin-top:18px; color:#a8bad2; font-size:12px; }
.mobile-break { display:none; }
.hero-visual { overflow:hidden; border:1px solid #ffffff1a; border-radius:22px; background:#0d2849; box-shadow:0 30px 75px #0003; transform:rotate(-2deg); }
.hero-visual>img { width:100%; height:auto; }
.hero-visual figcaption { display:flex; justify-content:space-between; gap:10px; padding:15px 18px; border-top:1px solid #ffffff14; font-size:12px; color:#d7e3f3; }
.hero-visual figcaption span { color:#acbfd5; font-size:10px; }
.journey { display:flex; align-items:center; justify-content:space-around; gap:15px; padding:26px 0; border-top:1px solid #ffffff26; color:#e2e9f2; font-size:14px; }
.journey span { display:flex; align-items:center; gap:13px; }
.journey b { color:var(--yellow); font-size:12px; }
.journey i { font-style:normal; color:#6e849e; }
.section { padding:100px 0; }
.section-heading { margin-bottom:48px; }
.section-heading .eyebrow { color:var(--muted); }
h2 { font-size:clamp(29px,3.1vw,43px); font-weight:800; line-height:1.35; letter-spacing:-1.7px; }
.section-heading>p:last-child { margin-top:20px; font-size:16px; color:var(--muted); }
.feature-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }
.feature-card { display:flex; flex-direction:column; overflow:hidden; border:1px solid #e6ebf2; border-radius:20px; background:var(--paper); }
.feature-copy { padding:30px 27px 24px; }
.step-tag { display:inline-block; margin-bottom:17px; font-size:12px; font-weight:800; }
.feature-copy h3 { font-size:25px; line-height:1.45; letter-spacing:-1px; }
.feature-copy p { margin-top:14px; color:#5c6c81; font-size:14px; line-height:1.9; }
.feature-yellow { border-color:var(--yellow); background:var(--yellow); }
.feature-yellow .feature-copy p { color:#384c58; }
.screen-preview { margin:0 22px; margin-top:auto; padding:20px 17px 24px; min-height:297px; border:5px solid var(--navy); border-bottom:0; border-radius:24px 24px 0 0; background:#fff; box-shadow:0 6px 25px #09264b12; font-size:12px; }
.screen-head { display:flex; align-items:center; gap:8px; margin-bottom:18px; font-size:15px; }
.screen-head small { margin-left:auto; font-size:10px; color:#718096; font-weight:400; }
.mock-field { position:relative; padding:10px 13px; margin-bottom:9px; border:1px solid #e1e7ee; border-radius:7px; }
.mock-field span,.mock-columns span { display:block; color:#67758a; font-size:10px; }
.mock-field b,.mock-columns b { font-weight:650; font-size:11px; }
.mock-field i { position:absolute; right:12px; top:18px; font-style:normal; }
.mock-columns { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.mock-columns>div { padding:9px 12px; background:#f3f6fa; border-radius:7px; }
.mock-button { padding:10px; margin-top:11px; border-radius:7px; background:var(--navy); color:#fff; text-align:center; font-size:11px; }
.mock-search { display:flex; justify-content:space-between; padding:10px; border:1px solid #d9e1eb; border-radius:8px; color:#6a7788; font-size:10px; }
.order-example { margin-top:13px; padding:15px 13px; border-radius:9px; background:var(--navy); color:#fff; }
.order-example>small { display:inline-block; padding:2px 6px; border-radius:3px; background:#fff; color:var(--navy); font-size:9px; }
.order-example>strong { display:block; margin-top:10px; font-size:12px; }
.order-example>strong span { margin:0 5px; color:var(--yellow); }
.order-example>p { margin:6px 0 14px; font-size:10px; color:#bed0e6; }
.order-example>div { display:flex; align-items:center; justify-content:space-between; gap:5px; font-size:10px; color:var(--yellow); }
.order-example>div b { border-radius:5px; padding:5px 8px; background:var(--yellow); color:var(--navy); }
.connection-label { margin-top:14px; font-size:10px; text-align:center; }
.connection-label span { color:#15844c; margin-right:5px; }
.progress-track { display:flex; align-items:center; justify-content:space-between; margin:24px 0; }
.progress-track span { display:flex; flex-direction:column; align-items:center; gap:7px; font-size:10px; }
.progress-track i { color:#a3b2c4; font-style:normal; }
.contact-example { display:grid; grid-template-columns:1fr auto; padding:12px; background:var(--navy); color:#fff; border-radius:7px; }
.contact-example strong { font-size:11px; }
.contact-example span { grid-column:1; font-size:10px; color:#d2def0; }
.contact-example img { grid-column:2; grid-row:1/3; align-self:center; }
.photo-example { display:flex; gap:8px; margin-top:14px; }
.photo-example span { flex:1; padding:17px 0; border:1px dashed #bdcbdc; border-radius:6px; text-align:center; font-size:10px; }
.section-footnote { margin-top:20px; color:var(--muted); font-size:12px; text-align:right; }
.audience { background:var(--paper); }
.audience-inner { display:grid; grid-template-columns:1fr 1fr; gap:80px; }
.audience .eyebrow { color:var(--muted); }
.audience h2 { font-size:34px; }
.audience-list article+article { border-top:1px solid #dce3ec; margin-top:28px; padding-top:28px; }
.audience-list article>span { font-size:11px; font-weight:750; padding:5px 9px; background:#e1e8f1; border-radius:5px; }
.audience-list h3 { margin:12px 0 10px; font-size:19px; letter-spacing:-.5px; }
.audience-list p { color:#596d85; font-size:14px; }
.coupon-section { position:relative; overflow:hidden; background:var(--navy); color:#fff; }
.coupon-section::before { content:''; position:absolute; width:480px; height:480px; right:-270px; top:-260px; border:75px solid #ffffff05; border-radius:50%; pointer-events:none; }
.coupon-inner { display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:90px; }
.coupon-copy .eyebrow { color:var(--yellow); }
.coupon-copy>p:not(.eyebrow) { margin-top:22px; color:#c5d4e7; font-size:16px; }
.coupon-steps { list-style:none; padding:0; margin:30px 0; }
.coupon-steps li { display:flex; align-items:center; gap:12px; margin-bottom:15px; font-size:14px; }
.coupon-steps b { display:grid; place-items:center; flex-shrink:0; width:26px; height:26px; background:#ffffff15; color:var(--yellow); border-radius:50%; font-size:12px; }
.coupon-copy .text-link { color:var(--yellow); }
.coupon-ticket { position:relative; z-index:1; padding:28px 32px; border-top:7px solid var(--yellow); border-radius:16px; background:#fff; color:var(--navy); box-shadow:0 20px 50px #0002; transform:rotate(2deg); }
.ticket-top { display:flex; justify-content:space-between; align-items:center; gap:10px; font-weight:800; }
.ticket-top small { font-size:9px; letter-spacing:1.4px; color:#69798f; }
.ticket-benefit { padding:17px 0 24px; text-align:center; }
.ticket-benefit>strong { font-size:83px; font-weight:850; line-height:1.3; letter-spacing:-4px; }
.ticket-benefit>strong>span { font-size:30px; margin-left:5px; letter-spacing:-1px; }
.ticket-benefit h3 { font-size:22px; }
.ticket-benefit p { margin-top:8px; color:#64748b; font-size:13px; }
.ticket-benefit p b { color:var(--navy); }
.ticket-code { position:relative; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:10px; padding-top:24px; border-top:2px dashed #dce3ed; }
.ticket-code>span { width:100%; color:#64748b; font-size:11px; }
.ticket-code>strong { font-size:27px; letter-spacing:1px; font-variant-numeric:tabular-nums; }
.copy-button { padding:8px 13px; border:0; border-radius:6px; color:var(--navy); background:var(--yellow); font-size:13px; font-weight:750; }
.copy-result { min-height:24px; padding-top:4px; font-size:11px; color:#28644c; }
.coupon-conditions { margin-top:13px; color:#66748a; font-size:11px; line-height:1.8; }
.coupon-conditions p+p { margin-top:5px; }
.ticket-benefit>.ticket-waiting { display:block; padding:30px 0; font-size:30px; letter-spacing:-1px; }
.ticket-benefit>.mile-benefit { font-size:50px; letter-spacing:-2px; }
.guide-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:40px; margin-bottom:80px; }
.guide-grid article { border-top:2px solid var(--navy); padding-top:22px; }
.guide-grid article>span { color:#697b92; font-size:12px; }
.guide-grid h3 { margin:14px 0 10px; font-size:21px; letter-spacing:-.7px; }
.guide-grid p { color:#64748b; font-size:14px; }
.faq { max-width:900px; margin:auto; }
.faq>h3 { margin-bottom:22px; font-size:25px; }
.faq details { padding:20px 0; border-bottom:1px solid #e0e6ee; }
.faq summary { display:flex; justify-content:space-between; gap:20px; cursor:pointer; list-style:none; font-size:16px; font-weight:650; }
.faq summary::-webkit-details-marker { display:none; }
.faq summary::after { content:'+'; color:#77889e; font-size:21px; line-height:1.2; }
.faq details[open] summary::after { content:'−'; }
.faq details p { padding-top:15px; max-width:800px; color:#607087; font-size:14px; line-height:1.9; }
.download-section { padding:80px 0; text-align:center; background:var(--yellow); }
.download-symbol { margin:0 auto 18px; object-fit:contain; }
.download-section .eyebrow { justify-content:center; margin-bottom:16px; font-size:10px; }
.download-section h2 { font-size:40px; }
.store-buttons { display:flex; justify-content:center; gap:14px; margin-top:30px; }
.store-buttons .button { gap:20px; min-width:233px; text-align:left; font-size:21px; }
.store-buttons small { display:block; font-size:10px; font-weight:500; }
.play-symbol { font-size:24px; color:var(--yellow); }
.store-pending { display:flex; align-items:center; justify-content:center; gap:35px; padding:13px 25px; min-width:220px; border:1px solid #09264b40; border-radius:9px; font-size:21px; font-weight:750; text-align:left; background:#ffffff26; }
.store-pending b { background:#09264b0e; padding:4px 9px; border-radius:5px; font-size:11px; }
.download-web { margin-top:25px; font-size:13px; }
.download-web a { font-weight:750; text-decoration:underline; text-underline-offset:4px; margin-left:8px; }
.site-footer { background:var(--deep); color:#b9c6d8; padding:50px 0 35px; }
.footer-top { display:flex; justify-content:space-between; align-items:center; gap:25px; margin-bottom:24px; }
.footer-top .brand { color:#fff; font-size:21px; }
.footer-top nav { display:flex; flex-wrap:wrap; gap:22px; font-size:12px; }
.footer-description { max-width:960px; font-size:11px; line-height:1.9; }
.company-info { margin-top:20px; font-size:11px; line-height:1.9; }
.copyright { margin-top:24px; font-size:10px; color:#93a4bc; }
.mobile-actions { display:none; }
@media (max-width:1000px) {
	.container { width:calc(100% - 48px); }
	.hero-inner { gap:25px; padding:60px 0; }
	.hero h1 { font-size:47px; }
	.hero-actions { gap:14px; }
	.feature-grid { gap:12px; }
	.feature-copy { padding:25px 18px; }
	.feature-copy h3 { font-size:21px; }
	.screen-preview { margin:0 12px; padding:18px 11px; margin-top:auto; }
	.screen-head { font-size:13px; }
	.screen-head img { width:24px; }
	.coupon-inner { gap:40px; }
	.coupon-ticket { padding:24px; }
	.audience-inner { gap:40px; }
}
@media (max-width:760px) {
	.container { width:calc(100% - 40px); }
	.header-inner { min-height:68px; gap:12px; }
	.brand { font-size:21px; gap:7px; }
	.brand img { width:31px; height:31px; }
	.main-nav { display:none; }
	.header-login { font-size:12px; gap:13px; padding:7px 12px; }
	.hero-inner { grid-template-columns:1fr; gap:40px; padding:48px 0 32px; }
	.hero h1 { font-size:clamp(40px,10.6vw,62px); letter-spacing:-2px; }
	.eyebrow { font-size:10px; margin-bottom:20px; }
	.hero-description { font-size:15px; margin-top:20px; }
	.hero-actions { gap:20px; margin-top:26px; }
	.button { font-size:14px; padding:14px 18px; min-height:52px; gap:18px; }
	.hero-visual { transform:none; border-radius:16px; }
	.hero-visual figcaption { font-size:10px; padding:12px; }
	.hero-visual figcaption span { font-size:9px; }
	.journey { gap:6px; font-size:10px; padding:20px 0; }
	.journey span { flex-direction:column; gap:3px; text-align:center; }
	.journey b { font-size:11px; }
	.section { padding:65px 0; }
	.section-heading { margin-bottom:30px; }
	h2 { font-size:30px; letter-spacing:-1.3px; }
	.section-heading>p:last-child { font-size:14px; margin-top:16px; }
	.feature-grid { grid-template-columns:1fr; gap:22px; }
	.feature-copy { padding:27px 26px 24px; }
	.feature-copy h3 { font-size:25px; }
	.feature-copy p { font-size:14px; max-width:400px; }
	.screen-preview { width:calc(100% - 60px); max-width:330px; min-height:287px; margin:0 auto; padding:20px; }
	.screen-head { font-size:15px; }
	.section-footnote { text-align:left; font-size:10px; }
	.audience-inner { grid-template-columns:1fr; gap:32px; }
	.audience h2 { font-size:28px; }
	.audience-list h3 { font-size:18px; }
	.coupon-inner { grid-template-columns:1fr; gap:35px; }
	.coupon-copy>p:not(.eyebrow) { font-size:14px; }
	.coupon-steps li { font-size:12px; }
	.coupon-ticket { width:100%; max-width:450px; margin:0 auto; transform:none; padding:25px; }
	.ticket-benefit>strong { font-size:78px; }
	.ticket-code>strong { font-size:25px; }
	.guide-grid { grid-template-columns:1fr; gap:25px; margin-bottom:50px; }
	.guide-grid article { padding-top:15px; }
	.guide-grid h3 { margin-top:8px; font-size:20px; }
	.faq>h3 { font-size:22px; }
	.faq summary { font-size:14px; gap:15px; }
	.faq details p { font-size:13px; }
	.download-section { padding:60px 0; }
	.download-section h2 { font-size:30px; }
	.store-buttons { flex-direction:column; align-items:stretch; max-width:320px; margin:25px auto 0; }
	.store-buttons .button,.store-pending { min-width:0; width:100%; }
	.store-pending { justify-content:space-between; padding:14px 30px; font-size:20px; }
	.download-web { font-size:12px; }
	.download-web a { display:block; margin:8px 0 0; }
	.site-footer { padding:38px 0 calc(105px + env(safe-area-inset-bottom)); }
	.footer-top { flex-direction:column; align-items:flex-start; gap:18px; }
	.footer-top nav { gap:16px; font-size:11px; }
	.mobile-actions { position:fixed; bottom:0; left:0; right:0; z-index:30; display:grid; grid-template-columns:1fr 1.7fr; gap:10px; padding:10px 16px calc(10px + env(safe-area-inset-bottom)); background:#fff; border-top:1px solid #e0e6ee; box-shadow:0 -4px 20px #09264b0a; }
	.mobile-actions a { display:flex; justify-content:center; align-items:center; min-height:44px; border:1px solid #d5deea; border-radius:7px; font-size:12px; font-weight:750; }
	.mobile-actions .mobile-install { border-color:var(--yellow); background:var(--yellow); }
}
@media (max-width:360px) {
	.container { width:calc(100% - 32px); }
	.hero h1 { font-size:38px; }
	.hero-actions { align-items:flex-start; flex-direction:column; gap:17px; }
	.ticket-code>strong { font-size:21px; letter-spacing:.5px; }
	.coupon-ticket { padding:20px; }
	.copy-button { padding:7px 10px; }
	.screen-preview { width:calc(100% - 32px); }
	.hero-visual figcaption span { display:none; }
}
@media (prefers-reduced-motion:reduce) {
	html { scroll-behavior:auto; }
	.button { transition:none; }
}
