:root{
  --paper:#FFFDF7;
  --ink:#111111;
  --ink-2:#4B4B4B;
  --red:#E8392E;
  --blue:#2C6BE0;
  --yellow:#FFD23F;
  --line:3px;
  --measure:64ch;
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--paper);color:var(--ink)}
body{font-family:"Zen Kaku Gothic New",system-ui,-apple-system,"Hiragino Sans","Yu Gothic",sans-serif;line-height:1.7;-webkit-font-smoothing:antialiased;overflow-x:hidden}
html[data-lang="en"] .ja{display:none !important}
html[data-lang="ja"] .en{display:none !important}
h1,h2,h3,.display{font-family:"Dela Gothic One","Zen Kaku Gothic New",sans-serif;font-weight:400;letter-spacing:0}
a{color:inherit}

/* halftone texture */
.dots{background-image:radial-gradient(var(--ink) 1.1px,transparent 1.2px);background-size:9px 9px;opacity:.14}
.dots.red{background-image:radial-gradient(var(--red) 1.3px,transparent 1.4px);opacity:.45}

.wrap{max-width:1180px;margin:0 auto;padding:0 clamp(18px,4vw,44px)}

/* header */
header.top{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 0;border-bottom:var(--line) solid var(--ink)}
.logo{display:flex;align-items:center;gap:12px;text-decoration:none}
.logo .mark{width:40px;height:40px;background:var(--red);color:var(--paper);display:grid;place-items:center;font-family:"Dela Gothic One",sans-serif;font-size:1.1rem;border:var(--line) solid var(--ink);box-shadow:4px 4px 0 var(--ink)}
.logo b{font-family:"Dela Gothic One",sans-serif;font-weight:400;font-size:1.15rem;line-height:1}
.logo small{display:block;font-family:"Zen Kaku Gothic New",sans-serif;font-size:.72rem;color:var(--ink-2);margin-top:3px}
nav.main{display:flex;gap:22px;align-items:center}
nav.main a{text-decoration:none;font-weight:700;font-size:.95rem}
nav.main a:hover{color:var(--red)}
.lang{display:inline-flex;border:var(--line) solid var(--ink);background:var(--paper)}
.lang button{appearance:none;border:0;background:transparent;font:inherit;font-weight:700;font-size:.85rem;padding:6px 12px;cursor:pointer;color:var(--ink)}
.lang button+button{border-left:var(--line) solid var(--ink)}
.lang button[aria-pressed="true"]{background:var(--ink);color:var(--paper)}
@media (max-width:760px){nav.main a:not(.keep){display:none}}

/* panels */
.panel{position:relative;border:var(--line) solid var(--ink);background:var(--paper);box-shadow:8px 8px 0 var(--ink)}
.sticker{position:absolute;display:inline-block;padding:6px 14px;font-family:"Dela Gothic One",sans-serif;font-size:.85rem;border:var(--line) solid var(--ink);background:var(--yellow);transform:rotate(-4deg);box-shadow:3px 3px 0 var(--ink);z-index:2;white-space:nowrap}
.sticker.red{background:var(--red);color:var(--paper)}
.sticker.blue{background:var(--blue);color:var(--paper)}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--red);color:var(--paper);text-decoration:none;padding:16px 26px;font-family:"Dela Gothic One",sans-serif;font-size:1rem;border:var(--line) solid var(--ink);box-shadow:5px 5px 0 var(--ink);cursor:pointer;transition:transform .08s,box-shadow .08s}
.btn:hover{transform:translate(2px,2px);box-shadow:3px 3px 0 var(--ink)}
.btn:active{transform:translate(5px,5px);box-shadow:0 0 0 var(--ink)}
.btn.ghost{background:var(--paper);color:var(--ink)}
.btn:focus-visible,.lang button:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid var(--blue);outline-offset:3px}

/* hero */
.hero{padding:clamp(40px,7vw,90px) 0 clamp(36px,6vw,72px);position:relative}
.hero .grid{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(28px,4vw,56px);align-items:center}
.hero h1{font-size:clamp(2.4rem,6.2vw,5rem);line-height:1.02;margin:0 0 22px;text-transform:uppercase}
html[data-lang="ja"] .hero h1{text-transform:none;line-height:1.18;font-size:clamp(2rem,5vw,3.9rem)}
.hero h1 .stroke{color:var(--paper);-webkit-text-stroke:2px var(--ink);text-stroke:2px var(--ink)}
.hero p.lede{font-size:1.12rem;color:var(--ink-2);margin:0 0 30px;max-width:var(--measure)}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap}
.hero .speed{position:absolute;inset:auto 0 0 0;height:180px;pointer-events:none;z-index:-1;
  background:repeating-linear-gradient(90deg,transparent 0 18px,rgba(17,17,17,.08) 18px 20px);mask-image:linear-gradient(to top,black,transparent)}

/* ticket panel in hero */
.ticket{padding:26px 26px 22px}
.ticket .dots{position:absolute;inset:0 0 auto auto;width:45%;height:55%;}
.ticket h3{margin:0 0 14px;font-size:1.05rem;position:relative}
.ticket dl{display:grid;grid-template-columns:auto 1fr;gap:10px 16px;margin:0;font-size:.95rem;position:relative}
.ticket dt{font-weight:700}
.ticket dd{margin:0;color:var(--ink-2)}
.ticket .bubble{margin-top:18px;position:relative;background:var(--ink);color:var(--paper);padding:12px 16px;font-weight:700;font-size:.95rem;border-radius:18px}
.ticket .bubble::after{content:"";position:absolute;left:26px;bottom:-10px;border:10px solid transparent;border-top-color:var(--ink);border-bottom:0}
@media (max-width:880px){.hero .grid{grid-template-columns:1fr}}

/* marquee */
.marquee{border-top:var(--line) solid var(--ink);border-bottom:var(--line) solid var(--ink);background:var(--ink);color:var(--paper);overflow:hidden;white-space:nowrap;padding:10px 0;font-family:"Dela Gothic One",sans-serif;font-size:.95rem}
.marquee span{display:inline-block;padding-right:48px}
.marquee .track{display:inline-block;animation:slide 40s linear infinite}
@keyframes slide{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.marquee .track{animation:none}}

/* sections */
section{padding:clamp(52px,7vw,96px) 0}
.sec-head{display:flex;align-items:flex-end;gap:18px;margin-bottom:34px;flex-wrap:wrap}
.sec-head h2{font-size:clamp(1.7rem,3.6vw,2.6rem);margin:0;line-height:1.1}
.sec-head p{margin:0;color:var(--ink-2);max-width:var(--measure)}

.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.step{padding:22px 20px 20px;position:relative}
.step .num{position:absolute;top:-16px;left:-10px;width:40px;height:40px;background:var(--red);color:var(--paper);border:var(--line) solid var(--ink);display:grid;place-items:center;font-family:"Dela Gothic One",sans-serif}
.step h3{margin:10px 0 8px;font-size:1.05rem}
.step p{margin:0;color:var(--ink-2);font-size:.95rem}
@media (max-width:900px){.steps{grid-template-columns:repeat(2,1fr)}}
@media (max-width:540px){.steps{grid-template-columns:1fr}}

.cats{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;list-style:none;margin:0;padding:0}
.cats li{padding:20px;display:flex;flex-direction:column;gap:6px}
.cats li .tag{font-family:"Dela Gothic One",sans-serif;font-size:.78rem;color:var(--red)}
.cats li strong{font-family:"Dela Gothic One",sans-serif;font-weight:400;font-size:1.1rem}
.cats li span{color:var(--ink-2);font-size:.93rem}
@media (max-width:900px){.cats{grid-template-columns:repeat(2,1fr)}}
@media (max-width:540px){.cats{grid-template-columns:1fr}}

.why{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,56px);align-items:start}
.why ul{margin:0;padding:0;list-style:none}
.why li{padding:16px 0 16px 30px;position:relative;border-bottom:2px dashed var(--ink)}
.why li::before{content:"";position:absolute;left:0;top:24px;width:14px;height:14px;background:var(--red);border:var(--line) solid var(--ink);transform:rotate(45deg)}
.why li strong{display:block;font-family:"Dela Gothic One",sans-serif;font-weight:400}
.why li span{color:var(--ink-2);font-size:.95rem}
.callout{padding:26px;background:var(--yellow)}
.callout h3{margin:0 0 10px;font-size:1.15rem}
.callout p{margin:0 0 10px;font-size:.97rem}
@media (max-width:880px){.why{grid-template-columns:1fr}}

/* form */
.formpanel{padding:clamp(22px,4vw,40px)}
form{display:grid;grid-template-columns:1fr 1fr;gap:18px 22px}
.field{display:flex;flex-direction:column;gap:6px}
.field.full{grid-column:1 / -1}
label{font-weight:700;font-size:.95rem}
label small{font-weight:400;color:var(--ink-2)}
input,textarea{font:inherit;padding:13px 14px;border:var(--line) solid var(--ink);background:#fff;color:var(--ink);width:100%;border-radius:0}
textarea{min-height:140px;resize:vertical}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form-foot{grid-column:1 / -1;display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.form-foot p{margin:0;color:var(--ink-2);font-size:.9rem}
.notice{grid-column:1 / -1;padding:14px 16px;border:var(--line) solid var(--ink);display:none;font-weight:700}
.notice.ok{display:block;background:#DDEBFF}
.notice.err{display:block;background:#FFDCD9}
@media (max-width:620px){form{grid-template-columns:1fr}.field.full{grid-column:auto}}

/* faq */
details{border-bottom:2px solid var(--ink)}
summary{cursor:pointer;padding:18px 0;font-weight:700;list-style:none;display:flex;justify-content:space-between;gap:16px}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";font-family:"Dela Gothic One",sans-serif;color:var(--red);flex:0 0 auto}
details[open] summary::after{content:"−"}
details p{margin:0 0 20px;color:var(--ink-2);max-width:var(--measure)}

/* footer */
footer{border-top:var(--line) solid var(--ink);background:var(--ink);color:var(--paper);padding:44px 0 56px;font-size:.92rem}
footer .cols{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:32px}
footer a{color:var(--paper)}
footer .legal a{display:block;margin-bottom:6px}
footer .muted{opacity:.7}
@media (max-width:720px){footer .cols{grid-template-columns:1fr}}

/* legal pages */
.legal-page{padding:clamp(36px,6vw,72px) 0 clamp(60px,8vw,110px)}
.legal-page h1{font-size:clamp(1.8rem,4vw,2.8rem);margin:0 0 10px;line-height:1.15}
.legal-page .updated{color:var(--ink-2);margin:0 0 36px}
.legal-page article{max-width:78ch}
.legal-page h2{font-size:1.2rem;margin:34px 0 10px;padding-left:14px;border-left:6px solid var(--red)}
.legal-page p,.legal-page li{color:#2A2A2A}
.legal-page table{border-collapse:collapse;width:100%;margin:10px 0 20px;font-size:.95rem}
.legal-page th,.legal-page td{border:2px solid var(--ink);padding:12px 14px;vertical-align:top;text-align:left}
.legal-page th{background:#F1EEE4;width:32%}
@media (max-width:600px){.legal-page th,.legal-page td{display:block;width:100%;border-top:0}.legal-page tr:first-child th{border-top:2px solid var(--ink)}}