:root{
  --ink:#172540;
  --muted:#4F5E78;
  --mist:#EAF4F3;
  --paper:#FFFFFF;
  --sash:#FFC83D;
  --sash-edge:#D7263D;
  --g:#1E9E57;   /* 1区 */
  --r:#E23B3B;   /* 2・4区 */
  --b:#1F7ED6;   /* 3・5区 */
  --river:#2E8FA3;
  --line:#CBD9DC;
  --display:"Mochiy Pop One","Hiragino Maru Gothic ProN","BIZ UDPGothic","Yu Gothic",sans-serif;
  --body:"Zen Maru Gothic","Hiragino Maru Gothic ProN","BIZ UDPGothic","Yu Gothic","Meiryo",sans-serif;
  color-scheme:light;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--mist);color:var(--ink);font-family:var(--body);font-size:1.0625rem;line-height:1.8;font-weight:500}
img{max-width:100%;height:auto;display:block}
a{color:var(--b)}
h1,h2,h3{line-height:1.35;margin:0}
p{margin:0}
:focus-visible{outline:3px solid var(--b);outline-offset:3px;border-radius:6px}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-999px;top:8px;background:var(--ink);color:#fff;padding:.5em 1em;border-radius:8px;z-index:100}
.skip:focus{left:8px}
.wrap{max-width:1080px;margin:0 auto;padding:0 20px}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.4em;min-height:48px;padding:.6em 1.3em;border-radius:999px;font-weight:700;text-decoration:none;font-size:1rem;line-height:1.3;transition:transform .15s}
.btn:active{transform:translateY(2px)}
.btn-ink{background:var(--ink);color:#fff;box-shadow:0 4px 0 #0A1325}
.btn-line{background:var(--paper);color:var(--ink);border:2.5px solid var(--ink)}

/* ---------- hero ---------- */
.hero{position:relative;overflow:hidden;background:linear-gradient(180deg,#D6EEF3 0%,#EEF7F2 70%);padding:40px 0 140px;text-align:center}
.hero-hills{position:absolute;left:0;bottom:0;width:100%;height:200px}
.hero-inner{position:relative;z-index:1;max-width:1080px;margin:0 auto;padding:0 20px}
.hero-org{font-weight:700;color:var(--muted);font-size:.95rem}

.sash-wrap{position:relative;margin:30px 0 38px}
.sash{
  position:relative;
  width:150vw;margin-left:calc(50% - 75vw);
  transform:rotate(-6deg);
  background:var(--sash);
  border-top:12px solid var(--sash-edge);
  border-bottom:12px solid var(--sash-edge);
  padding:18px 0 22px;
  box-shadow:0 10px 0 rgba(23,37,64,.12);
  animation:sash-in .9s cubic-bezier(.2,.8,.2,1) both;
}
.sash::before,.sash::after{content:"";position:absolute;left:0;right:0;border-top:2px dashed rgba(255,255,255,.9)}
.sash::before{top:7px}
.sash::after{bottom:7px}
.sash h1{font-family:var(--display);font-weight:400;display:flex;flex-direction:column;align-items:center;gap:2px}
.sash-no{font-size:clamp(1.1rem,3.2vw,1.8rem);color:var(--sash-edge);letter-spacing:.08em}
.sash-title{font-size:clamp(2rem,8.4vw,5.6rem);letter-spacing:.04em;white-space:nowrap;line-height:1.15}
@keyframes sash-in{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}

.hero-when{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:8px 28px;margin-top:12px}
.hero-date{font-family:var(--display);display:flex;align-items:baseline;gap:.35em}
.hero-date .y{font-size:1.05rem}
.hero-date .md{font-size:clamp(2.6rem,9vw,4.2rem);line-height:1}
.hero-date .md small{font-size:.45em;margin:0 .05em}
.hero-date .dow{display:inline-grid;place-items:center;width:2.1em;height:2.1em;border-radius:50%;background:var(--sash-edge);color:#fff;font-size:1.05rem;transform:translateY(-.3em)}
.hero-place{font-weight:700;text-align:left;line-height:1.6;font-size:1.1rem;border-left:4px solid var(--ink);padding-left:14px}

/* countdown as number cards */
.countdown{margin:30px auto 0}
.countdown-label{font-weight:700;margin-bottom:10px}
.bibs{display:flex;justify-content:center;gap:10px;flex-wrap:wrap}
.bib{position:relative;background:var(--paper);border:3px solid var(--ink);border-radius:10px;width:84px;padding:14px 4px 8px;display:flex;flex-direction:column;align-items:center}
.bib::before,.bib::after{content:"";position:absolute;top:6px;width:7px;height:7px;border-radius:50%;background:#9AA6B8}
.bib::before{left:7px}
.bib::after{right:7px}
.bib .n{font-family:var(--display);font-size:2.2rem;line-height:1.1;font-variant-numeric:tabular-nums}
.bib .u{font-size:.8rem;font-weight:700;color:var(--muted)}
.countdown.is-msg .bibs{display:none}
.countdown.is-msg .countdown-label{font-family:var(--display);font-weight:400;font-size:clamp(1.3rem,4.5vw,1.9rem);background:var(--paper);display:inline-block;padding:.4em 1em;border-radius:14px;border:3px solid var(--ink)}

.hero-links{display:flex;justify-content:center;flex-wrap:wrap;gap:12px;margin-top:30px}

/* ---------- sections ---------- */
.sec{padding:72px 0}
.h2{font-family:var(--display);font-weight:400;font-size:clamp(1.55rem,4.4vw,2.3rem);margin-bottom:28px;display:flex;align-items:center;gap:.5em}
.h2::before{content:"";flex:none;width:.42em;height:1.05em;border-radius:.21em;background:var(--sash);border:3px solid var(--ink);transform:rotate(18deg)}
.lead{margin:-12px 0 24px;color:var(--muted)}
.note{color:var(--muted);font-size:.95rem;margin-top:14px}

/* news stickers */
.news{background:var(--paper)}
.stickers{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:22px}
.sticker{border:3px solid var(--ink);border-radius:20px;padding:24px 24px 22px;position:relative;background:var(--paper)}
.sticker.s-green{box-shadow:8px 8px 0 var(--g);transform:rotate(-1deg)}
.sticker.s-blue{box-shadow:8px 8px 0 var(--b);transform:rotate(1deg)}
.sticker-big{font-family:var(--display);font-size:clamp(1.3rem,3.4vw,1.7rem);line-height:1.4;margin-bottom:12px}

/* timeline */
.timeline{list-style:none;margin:0;padding:0;max-width:720px;position:relative}
.timeline::before{content:"";position:absolute;left:52px;top:14px;bottom:14px;border-left:4px dotted var(--line)}
.timeline li{display:grid;grid-template-columns:106px 1fr;gap:16px;padding:12px 0;position:relative}
.timeline time{font-family:var(--display);font-size:1.15rem;background:var(--paper);border:3px solid var(--ink);border-radius:999px;text-align:center;align-self:start;padding:.25em 0;position:relative;z-index:1}
.timeline li.is-start time{background:var(--sash);border-color:var(--sash-edge)}
.timeline h3{font-size:1.2rem;font-weight:700}
.timeline p{color:var(--muted)}

/* course */
.course{background:var(--paper)}
.strip{display:flex;height:44px;border-radius:12px;overflow:hidden;border:3px solid var(--ink);margin-bottom:28px}
.strip-seg{display:grid;place-items:center;color:#fff;font-weight:700;font-size:.9rem;min-width:0}
.strip-seg+.strip-seg{border-left:3px solid var(--ink)}
.c1{background:var(--g)}.c2{background:var(--r)}.c3{background:var(--b)}

.course-grid{display:grid;grid-template-columns:200px 1fr;grid-template-areas:"legs map" "legs info";gap:20px 28px;align-items:start}
.legs{grid-area:legs;display:flex;flex-direction:column;gap:8px}
.leg{--c:var(--ink);display:flex;justify-content:space-between;align-items:center;gap:8px;font:inherit;font-weight:700;padding:.7em 1em;border-radius:14px;border:3px solid var(--ink);background:var(--paper);color:var(--ink);cursor:pointer;min-height:52px;text-align:left;transition:background .15s,color .15s}
.leg-no{font-family:var(--display);font-weight:400;font-size:1.15rem}
.leg-km{font-size:.95rem}
.leg::before{content:"";width:14px;height:14px;border-radius:50%;background:var(--c);flex:none;order:-1}
.leg-no{margin-right:auto}
.leg.is-on{background:var(--c);color:#fff}
.leg.is-on::before{background:#fff}
.leg[data-leg="all"].is-on{background:var(--ink)}

.map-card{grid-area:map;margin:0}
.map-card svg{width:100%;height:auto;display:block;border-radius:22px;border:3px solid var(--ink)}
.map-card figcaption{font-size:.85rem;color:var(--muted);margin-top:8px}
.landmark text{fill:var(--muted);font-family:var(--body);font-weight:700}
.st-name{font-family:var(--display);font-size:17px;fill:var(--ink)}
.st-sub{font-family:var(--body);font-weight:700;font-size:13px;fill:var(--muted)}
.route{transition:opacity .25s}
.route.is-dim{opacity:.12}
.route.is-hot path{stroke-width:9}

.leg-info{grid-area:info;background:var(--mist);border-radius:18px;padding:20px 22px}
.leg-info-km{font-family:var(--display);font-size:2.4rem;line-height:1}
.leg-info-km small{font-size:.5em;margin-left:.15em}
.leg-info h3{font-size:1.2rem;margin:8px 0 4px;font-weight:700}
.leg-info-note:empty{display:none}
.leg-info-note{margin-top:10px;display:inline-block;background:var(--sash);border-radius:8px;padding:.2em .7em;font-weight:700}

/* photos */
.photo-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:22px}
.photo{margin:0;background:var(--paper);border:3px solid var(--ink);border-radius:20px;overflow:hidden}
.photo a{display:block}
.photo img{width:100%;aspect-ratio:11/10;object-fit:cover}
.photo figcaption{padding:12px 16px;font-weight:700;font-size:.95rem;display:flex;gap:.5em;align-items:baseline}
.dot{flex:none;width:12px;height:12px;border-radius:50%;display:inline-block;transform:translateY(1px)}
.photo-more{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}

/* divisions */
.divisions{background:var(--paper)}
.div-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px}
.div-card{border:3px solid var(--ink);border-radius:20px;padding:22px;background:var(--paper)}
.div-card:nth-child(1){border-top-width:12px;border-top-color:var(--g)}
.div-card:nth-child(2){border-top-width:12px;border-top-color:var(--b)}
.div-card:nth-child(3){border-top-width:12px;border-top-color:var(--r)}
.div-card h3{font-family:var(--display);font-weight:400;font-size:1.4rem;margin-bottom:6px}
.div-card ul{margin:10px 0 0;padding-left:1.2em}
.div-card li{margin:.2em 0}

.team{margin-top:40px;background:var(--mist);border-radius:22px;padding:26px 24px}
.team h3{font-size:1.2rem;font-weight:700;margin-bottom:16px}
.team-row{display:flex;flex-wrap:wrap;gap:22px 40px;align-items:flex-end}
.team-group p{margin-top:8px}
.ppl{display:flex;gap:6px}
.p{--c:var(--ink);display:block;width:30px;height:46px;position:relative}
.p::before{content:"";position:absolute;left:8px;top:0;width:14px;height:14px;border-radius:50%;background:var(--c)}
.p::after{content:"";position:absolute;left:3px;top:17px;width:24px;height:29px;border-radius:12px 12px 6px 6px;background:var(--c)}
.p-coach{--c:var(--ink)}
.p-sub::before,.p-sub::after{background:transparent;border:3px dashed var(--muted)}
.p-sub::after{border-width:3px}

.awards{margin:32px 0 0;display:grid;gap:12px}
.awards div{display:grid;grid-template-columns:7em 1fr;gap:12px;padding-bottom:12px;border-bottom:2px dotted var(--line)}
.awards dt{font-weight:700}
.awards dd{margin:0}

/* entry */
.entry-status{font-weight:700;font-size:1.1rem;background:var(--paper);border:3px solid var(--ink);border-radius:16px;padding:14px 18px;margin-bottom:24px}
.entry-status.is-closed{background:#FFE9E9;border-color:var(--sash-edge)}
.entry-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:24px;align-items:start}
.entry-dl{margin:0;background:var(--paper);border-radius:20px;padding:10px 22px}
.entry-dl div{display:grid;grid-template-columns:5em 1fr;gap:12px;padding:12px 0;border-bottom:2px dotted var(--line)}
.entry-dl div:last-child{border-bottom:0}
.entry-dl dt{font-weight:700}
.entry-dl dd{margin:0;word-break:break-all}
.dl-card{background:var(--sash);border:3px solid var(--ink);border-radius:20px;padding:22px;display:flex;flex-direction:column;gap:12px}
.dl-card h3{font-family:var(--display);font-weight:400;font-size:1.3rem}

/* rules */
.rules{background:var(--paper)}
.rule-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
.rule-list li{background:var(--mist);border-radius:18px;padding:18px 20px}
.rule-list strong{display:block;font-size:1.1rem;margin-bottom:4px}
.faq{margin-top:28px;max-width:820px}
.faq details{border:3px solid var(--ink);border-radius:16px;margin-bottom:12px;background:var(--paper)}
.faq summary{cursor:pointer;font-weight:700;padding:14px 48px 14px 18px;list-style:none;position:relative;min-height:48px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:18px;top:50%;transform:translateY(-50%);font-family:var(--display);font-size:1.4rem}
.faq details[open] summary::after{content:"−"}
.faq details p{padding:0 18px 16px}

/* cheer */
.cheer{background:linear-gradient(180deg,var(--mist),#D6EEF3)}
.spots{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px}
.spot{background:var(--paper);border-radius:20px;padding:20px 22px;border:3px solid var(--ink)}
.spot h3{font-family:var(--display);font-weight:400;font-size:1.3rem;margin-bottom:4px}
.cheer-box{position:relative;margin-top:36px;text-align:center;padding:10px 0 20px}
.cheer-btn{font-family:var(--display);font-size:clamp(1.3rem,4vw,1.7rem);background:var(--sash);color:var(--ink);border:4px solid var(--ink);border-radius:999px;padding:.6em 1.6em;cursor:pointer;box-shadow:0 6px 0 var(--ink);transition:transform .08s,box-shadow .08s}
.cheer-btn:active{transform:translateY(5px);box-shadow:0 1px 0 var(--ink)}
.cheer-count{margin-top:14px;font-weight:700;min-height:1.8em}
.cheer-fx{position:absolute;inset:0;pointer-events:none;overflow:visible}
.fx{position:absolute;left:50%;top:30%;font-family:var(--display);font-size:1.2rem;white-space:nowrap;color:var(--ink);animation:fx 1.3s ease-out forwards}
@keyframes fx{from{opacity:1;transform:translate(-50%,0) scale(.8)}to{opacity:0;transform:translate(calc(-50% + var(--dx)),-140px) scale(1.15) rotate(var(--rot))}}

/* footer */
.foot{background:var(--ink);color:#fff;padding:48px 0 40px}
.foot a{color:#fff}
.foot-title{font-family:var(--display);font-size:1.3rem;margin-bottom:14px}
.foot-dl{margin:0 0 14px;display:grid;gap:4px}
.foot-dl div{display:flex;gap:1em}
.foot-dl dt{min-width:3em;opacity:.75}
.foot-dl dd{margin:0}
.foot-small{font-size:.85rem;opacity:.75}
.to-top{display:inline-block;margin-top:18px;font-weight:700}

/* ---------- responsive ---------- */
@media (max-width:820px){
  .course-grid{grid-template-columns:1fr;grid-template-areas:"legs" "map" "info"}
  .legs{flex-direction:row;flex-wrap:wrap}
  .leg{flex:1 1 calc(33.333% - 8px);flex-direction:column;align-items:flex-start;gap:0;padding:.5em .8em}
  .leg::before{position:absolute;opacity:0}
  .leg{position:relative;border-left-width:10px;border-left-color:var(--c)}
  .leg[data-leg="all"]{border-left-color:var(--ink)}
  .entry-grid{grid-template-columns:1fr}
}
@media (max-width:480px){
  body{font-size:1rem}
  .sec{padding:56px 0}
  .bib{width:70px}
  .bib .n{font-size:1.8rem}
  .hero{padding-bottom:120px}
  .hero-place{text-align:center;border-left:0;padding-left:0}
  .awards div,.entry-dl div{grid-template-columns:1fr;gap:2px}
  .strip-seg{font-size:.75rem}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .sash{animation:none}
  .fx{animation:none;display:none}
  *{transition:none!important}
}