:root{--navy:#22304A;--cream:#F7EFE2;--red:#B9493A;--gold:#E3B866;--ink:#22304A}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:"Hiragino Sans","Hiragino Kaku Gothic ProN","Noto Sans JP","Yu Gothic",sans-serif;font-weight:300;color:var(--ink);
  background:radial-gradient(ellipse at 50% 0%,#33456a 0%,var(--navy) 55%,#18213a 100%) fixed;line-height:1.8;-webkit-font-smoothing:antialiased}
h1,h2,h3{word-break:auto-phrase;text-wrap:balance;line-break:strict}
.vh{position:absolute;left:0;top:0;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);margin:-1px;border:0;padding:0}
#snow{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:5}
.head{position:fixed;top:0;left:0;right:0;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:10px 20px;color:var(--cream);background:rgba(34,48,74,.88);backdrop-filter:blur(6px);
  transform:translateY(-100%);transition:transform .35s}
.head.show{transform:none}
.logo{color:var(--cream);text-decoration:none;font-size:17px;letter-spacing:.12em;line-height:1.3;display:flex;flex-direction:column}
.logo-sub{font-size:11px;letter-spacing:.08em;opacity:.8}
.count{font-size:13px;letter-spacing:.06em;color:var(--gold)}
.lp{position:relative;z-index:2;max-width:560px;margin:0 auto;background:var(--cream);box-shadow:0 0 80px rgba(0,0,0,.35)}
.part{position:relative;line-height:0}
.part img{display:block;width:100%;height:auto}
.hit{position:absolute;left:var(--x);top:var(--y);width:var(--w);height:var(--h);border-radius:999px;
  font-size:0;color:transparent;outline-offset:4px}
.hit:hover{box-shadow:0 0 0 3px rgba(227,184,102,.7),0 0 30px rgba(227,184,102,.55)}
.hit:focus-visible{outline:3px solid var(--gold)}
.fv .hit{animation:glow 2.6s ease-in-out infinite}
@keyframes glow{0%,100%{box-shadow:0 0 0 0 rgba(227,184,102,0)}50%{box-shadow:0 0 0 4px rgba(227,184,102,.55),0 0 28px rgba(227,184,102,.5)}}
.part img{opacity:1;transition:opacity .8s,transform .8s}
.js .part:not(.fv) img{opacity:0;transform:translateY(24px)}
.js .part.in img{opacity:1;transform:none}
.foot{position:relative;z-index:2;max-width:560px;margin:0 auto;padding:28px 20px 120px;text-align:center;
  color:var(--cream);font-size:12px;line-height:1.9;opacity:.85}
.sticky{position:fixed;z-index:20;left:50%;bottom:0;width:min(560px,100%);transform:translate(-50%,110%);transition:transform .4s;
  padding:10px 16px calc(12px + env(safe-area-inset-bottom));background:rgba(247,239,226,.96);
  box-shadow:0 -6px 24px rgba(0,0,0,.18);text-align:center;border-radius:18px 18px 0 0}
.sticky.show{transform:translate(-50%,0)}
.sticky-note{font-size:13px;line-height:1.5;margin-bottom:6px;color:var(--navy);letter-spacing:.05em}
.sticky-note b{color:var(--red);font-size:18px;font-weight:400;margin:0 2px}
.sticky-btn{display:flex;align-items:center;justify-content:center;gap:8px;min-height:52px;border-radius:999px;background:var(--red);
  color:var(--cream);text-decoration:none;font-size:17px;letter-spacing:.08em;font-weight:400;box-shadow:0 4px 14px rgba(185,73,58,.35)}
.sticky-btn:active{transform:scale(.98)}
.motion{position:fixed;z-index:21;right:12px;bottom:12px;min-height:44px;padding:0 14px;border-radius:999px;border:1px solid rgba(247,239,226,.6);
  background:rgba(34,48,74,.8);color:var(--cream);font:inherit;font-size:12px;cursor:pointer}
body.sticky-on .motion{bottom:132px}
.modal{margin:auto;border:0;border-radius:20px;padding:32px 24px 24px;max-width:min(400px,90vw);background:var(--cream);color:var(--navy);text-align:center;line-height:1.9}
.modal::backdrop{background:rgba(24,33,58,.7)}
.modal-bell{font-size:40px;line-height:1;animation:ring 1s ease-in-out 2}
@keyframes ring{0%,100%{transform:rotate(0)}25%{transform:rotate(18deg)}75%{transform:rotate(-18deg)}}
.modal h2{font-size:19px;font-weight:400;margin:12px 0}
.modal p{font-size:15px}
.modal-close{margin-top:18px;min-height:44px;min-width:140px;border-radius:999px;border:1px solid var(--navy);background:none;color:var(--navy);font:inherit;font-size:15px;cursor:pointer}
@media (min-width:900px){.head{padding:12px 40px}.motion{right:24px;bottom:24px}body.sticky-on .motion{bottom:140px}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .js .part:not(.fv) img{opacity:1;transform:none}}
/* 調整：スマホでは見出しバーを1行に、雪ボタンは右上へ */
.head{background:rgba(34,48,74,.95);padding-right:120px}
.motion{top:10px;bottom:auto!important;right:10px;min-height:40px;font-size:12px}
@media (max-width:640px){.logo-sub,.count{display:none}.logo{font-size:16px;padding:6px 0}.head{padding:8px 16px;padding-right:118px}}
@media (min-width:900px){.motion{top:14px;right:24px}.head{padding-right:150px}}