:root{
  --pink:#F4A6CA; --pink-d:#E8559C; --pink-l:#FBE3EE;
  --blue:#3B6FC4; --sky:#7CC6EE; --sky-l:#DDF1FB;
  --green:#A9D25E; --green-l:#EAF4D5;
  --yellow:#F9E44C; --cream:#FFFCF5; --ink:#333; --white:#fff;
  --maru:"Zen Maru Gothic","M PLUS Rounded 1c","Hiragino Maru Gothic ProN",sans-serif;
  --round:"M PLUS Rounded 1c","Zen Maru Gothic",sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--maru);color:var(--ink);background:var(--cream);line-height:1.7;font-weight:500;}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
:focus{outline:none}
:focus-visible{outline:dotted 2px;outline-offset:2px}
.inner{max-width:1100px;margin:0 auto;padding:0 24px}
.ch{user-select:none;-webkit-user-drag:none}
.ch.click{cursor:pointer;pointer-events:auto}
.inline_block{display:inline-block}

/* ── keyframes ── */
@keyframes bob{0%,100%{transform:translateY(0) rotate(-4deg)}50%{transform:translateY(-12px) rotate(4deg)}}
@keyframes bob2{0%,100%{transform:translateY(0) rotate(3deg)}50%{transform:translateY(-8px) rotate(-3deg)}}
@keyframes pop{0%{transform:scale(0) rotate(-25deg);opacity:0}60%{transform:scale(1.18) rotate(6deg);opacity:1}80%{transform:scale(.94) rotate(-2deg)}100%{transform:scale(1) rotate(0);opacity:1}}
@keyframes up{0%{opacity:0;transform:translateY(40px)}100%{opacity:1;transform:translateY(0)}}
@keyframes twinkle{0%,100%{transform:scale(.6) rotate(0);opacity:.4}50%{transform:scale(1.2) rotate(30deg);opacity:1}}
@keyframes balloon{0%{transform:translateY(0) rotate(-3deg)}50%{transform:translateY(-26px) rotate(4deg)}100%{transform:translateY(0) rotate(-3deg)}}
@keyframes run{0%{left:-14%;transform:scaleX(1)}48%{left:104%;transform:scaleX(1)}50%{left:104%;transform:scaleX(-1)}98%{left:-14%;transform:scaleX(-1)}100%{left:-14%;transform:scaleX(1)}}
@keyframes runbob{0%,100%{margin-bottom:0}50%{margin-bottom:10px}}
@keyframes peekR{0%{transform:translateX(30%) rotate(18deg)}100%{transform:translateX(-10%) rotate(-6deg)}}
@keyframes marquee{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
@keyframes spin{0%{transform:rotate(0) scale(1)}50%{transform:rotate(360deg) scale(1.35)}100%{transform:rotate(720deg) scale(1)}}
@keyframes jump{0%,100%{transform:translateY(0) scaleY(1)}20%{transform:translateY(0) scaleY(.85)}50%{transform:translateY(-38px) scaleY(1.08)}}
@keyframes fw{0%{transform:scale(.1);opacity:0}30%{opacity:1}100%{transform:scale(1);opacity:0}}
@keyframes wobble{0%,100%{transform:rotate(-2deg)}50%{transform:rotate(2deg)}}
@keyframes confetti{0%{transform:translate(0,0) rotate(0);opacity:1}100%{transform:translate(var(--dx),var(--dy)) rotate(720deg);opacity:0}}
@keyframes sparkfade{0%{transform:scale(0) rotate(0);opacity:1}100%{transform:scale(1.4) rotate(90deg);opacity:0}}
@keyframes curtain{0%{transform:translateY(0)}100%{transform:translateY(-102%)}}
@keyframes opin{0%{transform:translateY(80px) scale(.6);opacity:0}70%{transform:translateY(-12px) scale(1.08);opacity:1}100%{transform:translateY(0) scale(1);opacity:1}}
@keyframes riderbob{0%,100%{transform:translateY(0) rotate(-6deg)}50%{transform:translateY(-8px) rotate(6deg)}}
@keyframes hop{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
@keyframes idle{0%,100%{transform:rotate(-2.5deg) translateY(0)}50%{transform:rotate(2.5deg) translateY(-6px)}}
@keyframes shake{0%,100%{transform:rotate(0)}25%{transform:rotate(-8deg) scale(1.08)}75%{transform:rotate(8deg) scale(1.08)}}

/* ── opening ── */
.opening{position:fixed;inset:0;z-index:999;background:#f5c0d7;display:flex;flex-direction:column;align-items:center;justify-content:center;animation:curtain .7s cubic-bezier(.7,0,.3,1) 1.9s forwards;pointer-events:none}
.opening::before{content:"";position:absolute;inset:0;background-image:radial-gradient(#fff 2px,transparent 2.4px);background-size:22px 22px;opacity:.25}
.opening .row{display:flex;gap:18px;align-items:flex-end;margin-top:30px}
.opening .row .illust{height:110px;width:auto;opacity:0;animation:opin .6s cubic-bezier(.2,1.4,.4,1) forwards,bob 1.6s ease-in-out .6s infinite;animation-delay:calc(var(--i)*.12s + .6s),calc(var(--i)*.12s + 1.2s)}
.opening .row .illust-01{--i:0}
.opening .row .illust-02{--i:1}
.opening .row .illust-03{--i:2}
.opening .row .illust-04{--i:3}
.opening .row .illust-05{--i:4}
.opening .lg{width:min(560px,74vw);opacity:0;animation:opin .7s cubic-bezier(.2,1.4,.4,1) .1s forwards;filter:drop-shadow(0 8px 0 rgba(0,0,0,.06))}
.opening .sub{margin-top:18px;background:var(--blue);color:#fff;font-family:var(--round);font-weight:900;font-size:clamp(16px,2.4vw,24px);padding:6px 26px;border-radius:999px;opacity:0;animation:opin .6s cubic-bezier(.2,1.4,.4,1) .9s forwards;box-shadow:0 5px 0 #2a54a0}
.opening .sub span{display:inline-grid;place-items:center;background:#fff;color:var(--blue);border-radius:50%;width:1.7em;height:1.7em;font-size:.6em;margin:0 .2em;vertical-align:middle}
body.opened .opening{display:none}

/* ── header ── */
.hd{background:#fff;border-bottom:1px solid #eee;position:sticky;top:0;z-index:50}
.hd .inner{display:flex;align-items:center;justify-content:space-between;height:60px}
.hd .logo img{height:34px;width:auto}
.hd nav{display:flex;gap:20px;font-size:14px;font-weight:700;white-space:nowrap}
.hd nav a{position:relative;padding:4px 0}
.hd nav a::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:3px;border-radius:3px;background:var(--pink);transform:scaleX(0);transition:.2s}
.hd nav a:hover::after{transform:scaleX(1)}
.hd .site{font-size:16px;font-weight:700;color:var(--pink-d);border:2px solid var(--pink-d);border-radius:999px;padding:4px 30px;transition:all .2s ease}
@media (hover:hover){
  .hd .site:hover{background-color:var(--pink-d);color:#fff}
}
.hd .mini{height:34px;width:auto;animation:hop 1.2s ease-in-out infinite}

/* ── scroll rider ── */
.rider{position:fixed;right:14px;top:80px;z-index:70;width:74px;pointer-events:none;transition:top .12s linear;filter:drop-shadow(0 6px 8px rgba(0,0,0,.15))}
.rider .bl{width:46px;height:56px;border-radius:50% 50% 48% 52% / 46% 46% 54% 54%;background:var(--yellow);margin:0 auto;position:relative;animation:riderbob 1.8s ease-in-out infinite}
.rider .bl::after{content:"";position:absolute;left:50%;top:100%;width:2px;height:26px;background:#c9a800;transform:translateX(-50%)}
.rider .bl::before{content:"";position:absolute;left:12px;top:10px;width:12px;height:18px;border-radius:50%;background:rgba(255,255,255,.55)}
.rider img{width:64px;margin:22px auto 0;animation:bob2 1.8s ease-in-out infinite}
.rider .pct{font-family:var(--round);font-weight:900;font-size:11px;text-align:center;color:var(--pink-d);background:#fff;border-radius:999px;margin-top:4px}

/* ── hero ── */
.hero{position:relative;background:#F4A6CA;overflow:hidden}
.hero img.kv{width:100%;height:auto}
.hero-h1{margin:0;line-height:0}
.hero .ov{position:absolute;inset:0;pointer-events:none}
.hero .bal{position:absolute;width:42px;height:52px;border-radius:50% 50% 48% 52% / 46% 46% 54% 54%;animation:balloon 3.4s ease-in-out infinite;box-shadow:inset -6px -8px 0 rgba(0,0,0,.06)}
.hero .bal::after{content:"";position:absolute;left:50%;top:100%;width:2px;height:40px;background:rgba(0,0,0,.25);transform:translateX(-50%)}
.hero .bal::before{content:"";position:absolute;left:9px;top:9px;width:10px;height:15px;border-radius:50%;background:rgba(255,255,255,.55)}
.hero .bal.y{background:var(--yellow)}
.hero .bal.b{background:var(--sky)}
.hero .bal.p{background:var(--pink-d)}
.hero .bal.g{background:var(--green)}
.hero .bal--01{left:6%;top:12%;animation-delay:0s}
.hero .bal--02{left:14%;top:56%;animation-delay:.8s}
.hero .bal--03{left:36%;top:22%;animation-delay:1.4s}
.hero .bal--04{left:45%;top:64%;animation-delay:.4s}
.hero .bal--05{left:75%;top:72%;animation-delay:1.1s}
.hero .bal--06{left:91%;top:13%;animation-delay:.2s}
.hero .sp-k{position:absolute;color:var(--yellow);font-size:30px;line-height:1;animation:twinkle 1.6s ease-in-out infinite;text-shadow:0 0 6px rgba(255,255,255,.8)}
.hero .sp-k--01{left:10%;top:34%}
.hero .sp-k--02{left:27%;top:8%;animation-delay:.5s}
.hero .sp-k--03{left:58%;top:12%;animation-delay:.9s}
.hero .sp-k--04{left:82%;top:48%;animation-delay:.3s}
.hero .sp-k--05{left:66%;top:84%;animation-delay:1.2s}
.hero .dog{position:absolute;bottom:2%;left:-14%;width:6.5vw;animation:run 18s linear infinite;pointer-events:auto}
.hero .dog img{animation:runbob .35s ease-in-out infinite}
.hero .peek{position:absolute;right:-2%;bottom:-6px;width:11.5vw;transform-origin:bottom right;animation:peekR 1.2s cubic-bezier(.2,1.4,.4,1) 2.6s both;pointer-events:auto}
.hero .peek2{position:absolute;left:44%;top:-10px;width:8vw;animation:bob 2.2s ease-in-out infinite;pointer-events:auto}

/* ── ticker ── */
.ticker{background:var(--blue);color:#fff;overflow:hidden;white-space:nowrap;font-family:var(--round);font-weight:900;font-size:15px;letter-spacing:.06em;border-top:4px solid var(--yellow);border-bottom:4px solid var(--yellow)}
.ticker .tr{display:inline-flex;gap:0;animation:marquee 22s linear infinite}
.ticker span{display:inline-flex;align-items:center;gap:14px;padding:10px 22px}
.ticker span img{height:30px;width:auto;animation:hop 1s ease-in-out infinite}
.ticker em{color:var(--yellow);font-style:normal}

/* ── lead ── */
.lead{position:relative;padding:80px 0 44px;text-align:center;overflow:hidden}
.lead .special{width:min(560px,86%);margin:0 auto 26px;animation:wobble 4s ease-in-out infinite}
.lead .period{display:inline-flex;align-items:center;gap:12px;background:var(--blue);color:#fff;font-family:var(--round);font-weight:900;font-size:clamp(20px,3vw,30px);padding:10px 30px;border-radius:999px;box-shadow:0 6px 0 #2a54a0;margin-bottom:26px}
.lead .period span{font-size:.55em;background:#fff;color:var(--blue);border-radius:50%;width:1.9em;height:1.9em;display:inline-grid;place-items:center}
.lead p{max-width:720px;margin:0 auto;font-size:16px;font-weight:700}
.lead .ch{position:absolute;width:150px}
.lead .ch.l{left:3%;top:40px}
.lead .ch.r{right:3%;bottom:10px}
.lead .ch.l2{left:12%;bottom:0;width:110px}
.lead .ch.r2{right:14%;top:30px;width:120px}
.spark{position:absolute;color:var(--yellow);font-size:34px;line-height:1;animation:twinkle 2s ease-in-out infinite}
.spark.s1{left:18%;top:30px}
.spark.s2{right:20%;top:70px;font-size:22px;animation-delay:.5s}
.spark.s3{left:24%;bottom:40px;font-size:20px;animation-delay:1s}
.spark.s4{right:30%;bottom:20px;font-size:26px;animation-delay:.3s}

/* ── date nav ── */
.evwrap{scroll-margin-top:60px;overflow:hidden}
.day{scroll-margin-top:190px}
#shop,#info{scroll-margin-top:70px}
.datenav{position:sticky;top:60px;z-index:40;background:rgba(255,252,245,.92);backdrop-filter:blur(6px);padding:30px 0 14px;border-top:3px dotted var(--pink);border-bottom:3px dotted var(--pink)}
.datenav ul{display:flex;gap:10px;justify-content:center;list-style:none;flex-wrap:wrap}
.datenav a{display:flex;flex-direction:column;align-items:center;justify-content:center;width:112px;height:64px;border-radius:18px;background:#fff;border:3px solid var(--sky);font-family:var(--round);font-weight:900;line-height:1.05;transition:.15s;position:relative}
.datenav a b{font-size:26px;letter-spacing:-.02em}
.datenav a b small{font-size:14px}
.datenav a span{font-size:11px;letter-spacing:.14em}
.datenav a:hover,.datenav a.on{background:var(--sky);color:#fff;transform:translateY(-3px) rotate(-2deg)}
.datenav li.p a{border-color:var(--pink)}
.datenav li.p a:hover,.datenav li.p a.on{background:var(--pink)}
.datenav li.g a{border-color:var(--green)}
.datenav li.g a:hover,.datenav li.g a.on{background:var(--green)}
.datenav a .mk{position:absolute;top:-22px;left:50%;transform:translateX(-50%);height:30px;width:auto;opacity:0;transition:.25s}
.datenav a.on .mk{opacity:1;animation:hop .8s ease-in-out infinite}

/* ── event section ── */
.events{padding:56px 0 40px;position:relative;overflow:hidden}
.sec-h{text-align:center;margin-bottom:44px}
.sec-h .en{display:inline-block;font-family:var(--round);font-weight:900;color:var(--pink-d);letter-spacing:.2em;font-size:13px;margin-bottom:6px}
.sec-h h2{font-size:clamp(26px,4vw,40px);font-weight:900;line-height:1.3}
.sec-h h2 .hl{background:linear-gradient(transparent 55%,var(--yellow) 55%);padding:0 .1em}
.sec-h h2 .c{display:inline-block}
.sec-h.in h2 .c{animation:pop .6s cubic-bezier(.2,1.4,.4,1) both;animation-delay:calc(var(--i)*.04s)}
.sec-h .note{font-size:13px;margin-top:10px;color:#666}

.day{position:relative;margin:0 auto 60px;padding:52px 7% 56px;border-radius:140px 220px 180px 240px / 220px 150px 240px 170px;background:#F588B5;color:#fff}
.day::before{content:"";position:absolute;inset:0;border-radius:inherit;background-image:radial-gradient(#fff 1.4px,transparent 1.6px);background-size:12px 12px;opacity:.25;mask:linear-gradient(120deg,#000 0 30%,transparent 55%);-webkit-mask:linear-gradient(120deg,#000 0 30%,transparent 55%);pointer-events:none;z-index:-1}
.day.blue{background:var(--sky);border-radius:230px 150px 240px 160px / 160px 230px 150px 240px}
.day.green{background:var(--green);border-radius:180px 240px 140px 220px / 240px 170px 220px 150px}
.day .dt{display:flex;align-items:flex-end;gap:6px;font-family:var(--round);font-weight:900;line-height:.9;margin:0 0 26px 12px;text-shadow:0 3px 0 rgba(0,0,0,.1)}
.day .dt .m{font-size:40px}
.day .dt .sl{font-size:52px;transform:translateY(4px)}
.day .dt .d{font-size:88px;letter-spacing:-.04em;display:inline-block}
.day.in .dt .d{animation:pop .7s cubic-bezier(.2,1.4,.4,1) both}
.day .dt .w{writing-mode:vertical-rl;font-size:15px;letter-spacing:.3em;margin-left:4px;padding-bottom:6px}
.day .dt .jp{font-size:34px;margin-left:2px;margin-bottom:10px;letter-spacing:-.02em}

.day .grid{display:grid;grid-template-columns:1fr 1fr;gap:26px 34px;align-items:start}
.day .grid.single{grid-template-columns:minmax(0,720px);justify-content:center}
.ev{display:flex;gap:18px;align-items:flex-start;opacity:0;transform:translateY(30px)}
.day.in .ev{animation:up .6s cubic-bezier(.2,1,.3,1) both;animation-delay:calc(var(--i)*.12s + .15s)}
.ev + .ev{margin-top:26px}
.ev .ph{flex:0 0 160px;width:160px;aspect-ratio:1;object-fit:cover;border-radius:22px;border:4px solid #fff;box-shadow:0 8px 20px rgba(0,0,0,.12);background:#fff;transition:.3s cubic-bezier(.2,1.4,.4,1)}
.day.in .ev .ph{animation:idle 3.2s ease-in-out infinite;animation-delay:calc(var(--i)*.4s + .8s)}
.ev .ph.tall{aspect-ratio:3/4}
.ev .tx{flex:1;min-width:0}
.ev .catch{display:inline-block;font-size:13px;font-weight:700;background:rgba(255,255,255,.2);border-radius:999px;padding:4px 12px;margin-bottom:6px;line-height:1.35}
.ev h3{font-size:clamp(15px,1.5vw,17px);font-weight:900;line-height:1.6;margin-bottom:8px;color:var(--pink-d);--shadow-width:2px;text-shadow:calc(-1 * var(--shadow-width)) calc(-1 * var(--shadow-width)) 0 #fff,0 calc(-1 * var(--shadow-width)) 0 #fff,var(--shadow-width) calc(-1 * var(--shadow-width)) 0 #fff,calc(-1 * var(--shadow-width))  0   0 #fff, var(--shadow-width)  0   0 #fff,calc(-1 * var(--shadow-width))  var(--shadow-width) 0 #fff,0 var(--shadow-width) 0 #fff,var(--shadow-width)  var(--shadow-width) 0 #fff;}
.ev h3 .ev_block{display:inline-block;line-height:1.6}
.ev.main h3{font-size:clamp(17px,1.9vw,22px);}
.day.blue .ev h3{color:var(--blue)}
.day.green .ev h3{color:#5d8c15}
.ev .meta{display:flex;flex-wrap:wrap;align-items:baseline;gap:.5em 1em;margin:0;padding:0;list-style:none;font-size:13px;font-weight:700;opacity:.95}
.ev .meta li{display:flex;align-items:flex-start}
.ev .meta__head{background:rgba(255,255,255,.2);border-radius:6px;padding:0 6px;margin-right:6px;flex-shrink:0;white-space:nowrap}
.ev .meta__content{min-width:0}
.ev .body{font-size:14px;margin:10px 0;}
.ev .cast{font-size:13px;margin-top:6px;font-weight:700}
.note .evlink{display:inline-block;margin:8px 0 0;padding:8px 18px;border-radius:999px;background:var(--pink-d);color:#fff;font-weight:900;font-size:13px;text-decoration:none;box-shadow: 0 4px 0 #b83a77;transition: .1s;}
.note .evlink:hover{transform: translateY(3px);box-shadow: none}
.note .evlink:focus-visible{outline-color:var(--ink)}
.ev .caution{font-size:11px;line-height:1.6;margin-top:8px;opacity:.9;background:rgba(255,255,255,.18);border-radius:10px;padding:8px 10px}
.ev.main{grid-column:1/-1;background:rgba(255,255,255,.18);border-radius:28px;padding:22px 24px}
.ev.main .ph{flex:0 0 250px;width:250px;aspect-ratio:2/3;object-position:top}
.ev.main h3{font-size:clamp(20px,2.4vw,28px)}
.ev.main .cast-ph{display:flex;gap:8px;margin-top:10px}
.ev.main .cast-ph img{width:78px;height:78px;object-fit:cover;object-position:top;border-radius:50%;border:3px solid #fff;background:#fff;transition:.25s}
.ev.main .cast-ph img{animation:hop 1.6s ease-in-out infinite}
.ev.main .cast-ph img:nth-child(2){animation-delay:.3s}
.ev.main .cast-ph img:nth-child(3){animation-delay:.6s}
.ev .tbd{opacity:.65}
.day .fl{position:absolute;width:120px;transition:.5s cubic-bezier(.2,1.4,.4,1);opacity:0;transform:scale(0)}
.day.in .fl{opacity:1;transform:scale(1);animation:bob 2.4s ease-in-out .6s infinite}
.day .fl.a{right:-18px;top:-30px}
.day .fl.b{left:-20px;bottom:-24px;width:100px}
.day .fl.c{right:20px;bottom:-30px;width:110px}
.day .fl.d{left:-30px;top:40px;width:110px}
/* peek from behind blob */
.day .pk{position:absolute;width:130px;z-index:-1;transition:.7s cubic-bezier(.2,1.3,.4,1) .2s;opacity:0}
.day .pk.l{left:-40px;top:40%;transform:translateX(60px) rotate(20deg)}
.day .pk.r{right:-60px;top:22%;transform:translateX(-60px) rotate(-20deg)}
.day.in .pk{opacity:1;transform:translateX(0) rotate(0)}
.day{isolation:isolate}
.day .pk{z-index:-1}
.day .bgpk{position:absolute;inset:0;z-index:-1}

/* ── parade ── */
.parade{position:relative;height:380px;overflow:hidden;border-top:6px solid var(--pink-d);border-bottom:6px solid var(--pink-d);
  background:
    radial-gradient(circle at 12% 62%, #fff 0 46px, transparent 47px),radial-gradient(circle at 18% 66%, #fff 0 60px, transparent 61px),radial-gradient(circle at 25% 63%, #fff 0 44px, transparent 45px),
    radial-gradient(circle at 62% 58%, #fff 0 40px, transparent 41px),radial-gradient(circle at 68% 62%, #fff 0 56px, transparent 57px),radial-gradient(circle at 75% 59%, #fff 0 42px, transparent 43px),
    radial-gradient(circle at 92% 66%, #fff 0 36px, transparent 37px),radial-gradient(circle at 97% 70%, #fff 0 48px, transparent 49px),
    linear-gradient(180deg,#BFE6F8 0%,#E4F5FD 70%,#EAF4D5 70%,#EAF4D5 100%)}
.parade .garland{position:absolute;left:0;right:0;top:0;height:78px;pointer-events:none;overflow:visible}
.parade .garland svg{width:100%;height:100%;display:block;overflow:visible}
.parade .road{position:absolute;left:0;right:0;bottom:0;height:56px;background:#6b6b6b;background-image:linear-gradient(90deg,#fff 0 36px,transparent 36px 72px);background-size:72px 7px;background-repeat:repeat-x;background-position:0 24px}
.parade .road::before{content:"";position:absolute;left:0;right:0;top:-14px;height:14px;background:repeating-linear-gradient(90deg,var(--yellow) 0 24px,#fff 24px 48px);border-top:3px solid #d9c400}
.parade .track{position:absolute;left:0;bottom:60px;display:flex;gap:44px;align-items:flex-end;will-change:transform;padding-left:60px}
.parade .track img{height:150px;width:auto;animation:bob 1.2s ease-in-out infinite;animation-delay:calc(var(--i)*.15s)}
.parade .lbl{position:absolute;left:50%;top:80px;transform:translateX(-50%);background:var(--pink-d);color:#fff;font-family:var(--round);font-weight:900;padding:8px 22px;border-radius:999px;font-size:17px;white-space:nowrap;z-index:2}
.parade .lbl::after{content:"";position:absolute;left:50%;bottom:-8px;transform:translateX(-50%);border:8px solid transparent;border-top-color:var(--pink-d);border-bottom:0}
.parade .flag{position:absolute;right:24px;bottom:76px;font-family:var(--round);font-weight:900;color:#fff;font-size:14px;background:var(--blue);border-radius:12px 12px 12px 0;padding:8px 16px;box-shadow:0 4px 0 #2a54a0;z-index:2}
.parade .flag::after{content:"";position:absolute;left:0;top:100%;width:4px;height:24px;background:#2a54a0}
.parade .pbal{position:absolute;width:34px;height:42px;border-radius:50% 50% 48% 52% / 46% 46% 54% 54%;animation:balloon 4s ease-in-out infinite;box-shadow:inset -5px -6px 0 rgba(0,0,0,.06)}
.parade .pbal::after{content:"";position:absolute;left:50%;top:100%;width:2px;height:34px;background:rgba(0,0,0,.2);transform:translateX(-50%)}
.parade .pbal.y{background:var(--yellow)}
.parade .pbal.b{background:var(--sky)}
.parade .pbal.p{background:var(--pink-d)}
.parade .pbal.g{background:var(--green)}
.parade .pbal--01{left:6%;top:24%}
.parade .pbal--02{left:30%;top:18%;animation-delay:1s}
.parade .pbal--03{left:52%;top:26%;animation-delay:.5s}
.parade .pbal--04{left:84%;top:20%;animation-delay:1.6s}
.parade .cft{position:absolute;width:10px;height:14px;border-radius:2px;animation:cft 5s linear infinite;opacity:.9}
.parade .cft--01{left:9%;background:var(--pink-d);animation-delay:0s}
.parade .cft--02{left:21%;background:var(--sky);animation-delay:1.2s}
.parade .cft--03{left:38%;background:var(--yellow);animation-delay:2.4s}
.parade .cft--04{left:47%;background:var(--green);animation-delay:.6s}
.parade .cft--05{left:63%;background:var(--pink-d);animation-delay:3.1s}
.parade .cft--06{left:71%;background:var(--blue);animation-delay:1.8s}
.parade .cft--07{left:88%;background:var(--yellow);animation-delay:4s}
.parade .cft--08{left:95%;background:var(--sky);animation-delay:2s}
@keyframes cft{0%{transform:translateY(-40px) rotate(0)}100%{transform:translateY(400px) rotate(720deg)}}

/* ── pre event ── */
.pre{background:var(--sky-l);padding:56px 0;position:relative;overflow:hidden}
.pre .box{display:grid;grid-template-columns:1fr 1.4fr;gap:32px;align-items:center;background:#fff;border-radius:36px;padding:34px 40px;border:4px dashed var(--sky);position:relative}
.pre .tag{display:inline-block;background:var(--blue);color:#fff;font-weight:900;border-radius:999px;padding:4px 16px;font-size:14px;margin-bottom:10px}
.pre h3{font-size:clamp(20px,2.6vw,28px);font-weight:900;line-height:1.4;margin-bottom:8px}
.pre p{font-size:14px}
.pre .dd{font-family:var(--round);font-weight:900;color:var(--blue);font-size:44px;line-height:1;text-align:center}
.pre .dd small{display:block;font-size:14px;color:var(--ink);margin-top:8px}
.pre .ch{position:absolute;width:110px;right:30px;bottom:-14px;animation:bob2 2s ease-in-out infinite}

/* ── shop ── */
.shop{padding:72px 0;position:relative;background:linear-gradient(180deg,var(--cream),var(--pink-l));overflow:hidden}
.shop .filter{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-bottom:34px}
.shop .filter button{font-family:inherit;font-weight:900;font-size:13px;border:2px solid var(--pink-d);color:var(--pink-d);background:#fff;border-radius:999px;padding:8px 18px;cursor:pointer;transition:.15s}
.shop .filter button:hover{transform:translateY(-2px) rotate(-2deg)}
.shop .filter button.on{background:var(--pink-d);color:#fff}
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.card{background:#fff;border-radius:22px;overflow:hidden;box-shadow:0 8px 24px rgba(232,85,156,.12);transition:.25s cubic-bezier(.2,1.4,.4,1);position:relative;opacity:0;transform:translateY(30px)}
.shop.in .card{animation:up .6s cubic-bezier(.2,1,.3,1) both;animation-delay:calc(var(--i)*.08s)}
.card:hover{transform:translateY(-8px) rotate(-1.5deg)}
.card .th{aspect-ratio:1;object-fit:cover;width:100%}
.card .bd{padding:14px 16px 18px}
.card .sh{font-size:11px;font-weight:900;color:#fff;background:var(--pink-d);border-radius:999px;padding:2px 10px;display:inline-block;margin-bottom:6px}
.card.b .sh{background:var(--blue)}
.card.g .sh{background:#6a9a1e}
.card h4{font-size:14px;font-weight:900;line-height:1.45;margin-bottom:6px}
.card .pr{font-size:12px;color:#666;font-weight:700}
.card .rib{position:absolute;left:10px;top:10px;background:var(--yellow);color:var(--ink);font-size:11px;font-weight:900;border-radius:8px;padding:3px 8px;box-shadow:0 2px 0 rgba(0,0,0,.1)}
.card .thw{position:relative;overflow:hidden}
.card .cc{position:absolute;left:14px;top:100%;width:66px;transform:translateY(0);transition:.45s cubic-bezier(.2,1.5,.4,1);z-index:1}
.card:hover .cc{transform:translateY(-92%) rotate(-6deg)}
.card .bd{position:relative;z-index:2;background:#fff}
.shop .more{display:block;width:fit-content;margin:36px auto 0;background:var(--pink-d);color:#fff;font-weight:900;padding:14px 40px;border-radius:999px;box-shadow:0 6px 0 #b83a77;transition:.15s}
.shop .more:hover{transform:translateY(3px);box-shadow:0 3px 0 #b83a77}
.dummy{font-size:12px;color:#999;text-align:center;margin-top:16px}

/* ── thanks (fireworks) ── */
.thanks{padding:90px 0 60px;text-align:center;position:relative;overflow:hidden;background:linear-gradient(180deg,var(--pink-l),#fff)}
.thanks .bubimg{width:280px;margin:0 auto 14px;animation:wobble 3s ease-in-out infinite}
.thanks h2{font-size:clamp(24px,3.6vw,36px);font-weight:900;margin-bottom:16px}
.thanks p{max-width:640px;margin:0 auto;font-size:15px;font-weight:700}
.thanks .nums{display:flex;justify-content:center;gap:34px;margin:26px auto 10px;flex-wrap:wrap}
.thanks .nums div{font-family:var(--round);font-weight:900;color:var(--pink-d);font-size:44px;line-height:1}
.thanks .nums div small{display:block;font-size:13px;color:var(--ink);margin-top:6px}
.thanks .chs{display:flex;justify-content:center;gap:24px;margin-top:30px;flex-wrap:wrap;align-items:flex-end}
.thanks .chs img{height:120px;width:auto}
.thanks.in .chs img{animation:jump 1.4s cubic-bezier(.3,0,.2,1) infinite;animation-delay:calc(var(--i)*.18s)}
.fwk{position:absolute;width:160px;height:160px;border-radius:50%;pointer-events:none;opacity:0;animation:fw 2.2s ease-out infinite;background:radial-gradient(circle,transparent 30%,var(--c) 31%,transparent 34%),repeating-conic-gradient(var(--c) 0 3deg,transparent 3deg 15deg)}
.fwk::after{content:"";position:absolute;inset:26%;border-radius:50%;background:radial-gradient(circle,#fff 0 18%,transparent 20%),repeating-conic-gradient(#fff 0 2deg,transparent 2deg 20deg);opacity:.8}
.fwk--01{--c:var(--pink-d);left:6%;top:8%;animation-delay:0s}
.fwk--02{--c:var(--sky);left:78%;top:4%;animation-delay:.7s;width:220px;height:220px}
.fwk--03{--c:var(--yellow);left:22%;top:50%;animation-delay:1.3s;width:120px;height:120px}
.fwk--04{--c:var(--green);left:86%;top:52%;animation-delay:1.8s}
.fwk--05{--c:var(--blue);left:48%;top:0%;animation-delay:.4s;width:110px;height:110px}

/* ── info ── */
.info{background:#fff;padding:64px 0;position:relative;overflow:hidden}
.info .wrap{display:grid;grid-template-columns:1.2fr 1fr;gap:40px;align-items:start}
.info h3{font-size:20px;font-weight:900;color:var(--pink-d);border-bottom:3px solid var(--pink);padding-bottom:6px;margin-bottom:16px}
.info table{width:100%;border-collapse:collapse;font-size:14px}
.info td{padding:8px 6px;border-bottom:1px dashed #ddd;vertical-align:top}
.info td:first-child{font-weight:900;width:46%}
.info td small{display:block;font-size:11px;color:#777}
.info .map{border-radius:20px;overflow:hidden;border:3px solid var(--green-l);position:relative}
.info .map img.ch{position:absolute;width:80px;left:52%;top:40%;animation:bob 2s ease-in-out infinite}
.info .addr{font-size:14px;margin-top:14px;font-weight:700}
.info .addr a{font-size:20px;font-family:var(--round);color:var(--blue);font-weight:900}
.info .addr small{display:block;font-size:11px;color:#777}
.info .chips{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}
.info .chips span{font-size:12px;font-weight:900;background:var(--green-l);color:#4f7f0f;border-radius:999px;padding:4px 12px}

/* ── footer ── */
.ft{background:var(--pink-d);color:#fff;padding:0 0 50px;text-align:center;font-size:12px;position:relative}
.ft .wall{display:flex;justify-content:center;gap:6px;align-items:flex-end;height:96px;overflow:hidden;background:var(--cream)}
.ft .wall .chara{height:86px;width:auto;transform:translateY(24px);animation:hop 1.6s ease-in-out infinite;animation-delay:calc(var(--i)*.13s)}
.ft .wall .chara--01{--i:0}
.ft .wall .chara--02{--i:1}
.ft .wall .chara--03{--i:2}
.ft .wall .chara--04{--i:3}
.ft .wall .chara--05{--i:4}
.ft .wall .chara--06{--i:5}
.ft .wall .chara--07{--i:6}
.ft .wall .chara--08{--i:7}
.ft .wall .chara--09{--i:8}
.ft .body{padding:36px 0 0}
.ft img.lg{height:56px;width:auto;margin:0 auto 14px;background:#fff;padding:8px 18px;border-radius:14px}
.ft__link{display:inline-block;transition:opacity .4s ease}
.ft__link:hover{opacity:.8}
.ft__block{display:inline-block}
.ft p{opacity:.9}
.ft .ft__copyright{margin-top:10px}
.fix{position:fixed;left:0;right:0;bottom:0;z-index:60;transform:translateY(120%);transition:transform .35s cubic-bezier(.2,1,.3,1);display:flex;justify-content:center;gap:10px;padding:10px 16px;background:rgba(255,255,255,.9);backdrop-filter:blur(8px);border-top:3px dotted var(--pink)}
.fix a{font-weight:900;font-size:14px;padding:10px 22px;border-radius:999px;background:var(--pink-d);color:#fff;box-shadow:0 4px 0 #b83a77;transition:.1s}
.fix a.b{background:var(--blue);box-shadow:0 4px 0 #2a54a0}
.fix a:hover{transform:translateY(3px);box-shadow:none}
body.showfix .fix{transform:none}

/* particles */
.cf{position:fixed;width:10px;height:14px;pointer-events:none;z-index:900;animation:confetti .9s ease-out forwards;border-radius:2px}
.sk{position:fixed;pointer-events:none;z-index:900;font-size:18px;color:var(--yellow);animation:sparkfade .7s ease-out forwards;text-shadow:0 0 4px #fff}
.spinning{animation:spin .8s cubic-bezier(.3,0,.2,1) !important}

/* ── responsive ── */
@media (max-width:1060px){
  .thanks .chs{max-width:600px;margin-inline:auto}
}
@media (max-width:900px){
  .day .grid{grid-template-columns:1fr}
  .cards{grid-template-columns:repeat(2,1fr)}
  .info .wrap{grid-template-columns:1fr}
  .pre .box{grid-template-columns:1fr}
  .hd nav{display:none}
  .rider{width:56px;right:8px}
  .rider img{width:48px}
  .rider .bl{width:36px;height:44px}
  .hide_sp{display:none}
}
@media (min-width:901px){
  .hide_pc{display:none}
}
@media (min-width:641px){
  .hide_more_sp{display:none}
}
@media (max-width:640px){
  .hd .site{font-size:12px;padding:6px 14px}
  .hero .dog{width:70px}
  .hero .peek{width:100px}
  .hero .peek2{width:70px;left:8%;top:6px}
  .hero .bal--02{left:21%;top:68%;}
  .hero .bal--04{left:45%;top:58%;}
  .lead{padding:48px 0 24px}
  .lead .ch{width:80px}
  .lead .ch.l{left:-6px;top:auto;bottom:0}
  .lead .ch.r{right:-6px;bottom:-10px}
  .lead .ch.l2,.lead .ch.r2{display:none}
  .datenav{top:60px}
  .day{scroll-margin-top:150px}
  .datenav ul{gap:6px;flex-wrap:nowrap;padding:0 10px}
  .datenav li{flex:1;min-width:0}
  .datenav a{width:100%;height:56px;border-radius:14px}
  .datenav a b{font-size:19px}
  .datenav a b small{font-size:11px}
  .datenav a span{font-size:9px}
  .datenav a .mk{display:none}
  .day{padding:34px 20px 36px;border-radius:60px 80px 70px 90px / 80px 60px 90px 70px !important;margin-bottom:40px}
  .day .dt{margin-left:4px}
  .day .dt .d{font-size:64px}
  .day .dt .m{font-size:30px}
  .day .dt .sl{font-size:38px}
  .ev{flex-direction:column;gap:12px}
  .ev .ph,.ev.main .ph{width:100%;flex-basis:auto;aspect-ratio:16/10;border-radius:18px}
  .ev .ph.banner{aspect-ratio:1;object-fit:contain;background:#fff}
  .ev.main{padding:16px}
  .ev h3, .ev.main h3{font-size:18px}
  .ev .meta{row-gap:5px}
  .ev .meta li{width:100%}
  .ev .meta__head{white-space:nowrap}
  .day .fl{display:none}
  .day .pk{width:80px}
  .day .pk.l{left:-24px;top:26%}
  .day .pk.r{right:-24px;top:9%}
  #d1003.day .pk.l{top:40%}
  #d1003.day .pk.r{top:18%}
  #d1012.day .pk.l{top:50%}
  #d1012.day .pk.r{top:18%}
  .parade{height:230px}
  .parade .garland{height:56px}
  .parade .track img{height:90px}
  .parade .lbl{font-size:12px;padding:5px 12px;top:56px}
  .parade .flag{font-size:11px;padding:5px 10px;bottom:60px}
  .parade .road{height:44px}
  .parade .track{bottom:48px;gap:24px}
  .pre .ch{width:70px;right:10px}
  .card{border-radius:15px;}
  .card .th{aspect-ratio:4/3}
  .thanks .chs{max-width:550px}
  .thanks .chs img{height:80px}
  .thanks .nums div{font-size:34px}
  .info td:first-child{width:60%}
  .ft .wall{height:64px}
  .ft .wall .chara{height:56px;transform:translateY(16px)}
  .ft{padding-bottom:80px}
  .fix{padding:8px 10px;gap:8px}
  .fix a{flex:1;text-align:center;font-size:13px;padding:11px 8px;white-space:nowrap}
  .rider{display:none}
  .opening .row .illust{height:64px}
  .opening .row{gap:8px}
}
@media (min-width:441px){
  .hide_more_ssp{display:none}
}
@media (max-width:440px){
  .thanks .chs img{height:65px}
  .thanks h2{font-size:21px}
}
@media (min-width:375px){
  .hide_more_sssp{display:none}
}
@media (max-width:374px){
  .day .dt{gap:3px}
  .day .dt .m{font-size:28px}
  .day .dt .sl{font-size:28px}
  .day.in .dt .d{font-size:50px}
  .day.in .dt .jp{font-size:28px}
  .thanks .chs img{height:54px}
  .thanks h2{font-size:18px}
}
@media (prefers-reduced-motion:reduce){
  *{animation:none !important;transition:none !important}
  .opening{display:none}
  .ev,.card,.day .fl,.day .pk{opacity:1;transform:none}
}

/* ── 3者同格（10/3メイン） ── */
.ev.main.trio{flex-direction:column;align-items:stretch;gap:14px}
.trio-ph{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.trio-ph figure{margin:0;text-align:center}
.trio-ph img{width:100%;aspect-ratio:1;object-fit:contain;background:#fff;border-radius:22px;border:4px solid #fff;box-shadow:0 8px 20px rgba(0,0,0,.12)}
.day.in .trio-ph img{animation:idle 3.2s ease-in-out infinite}
.day.in .trio-ph figure:nth-child(2) img{animation-delay:.4s}
.day.in .trio-ph figure:nth-child(3) img{animation-delay:.8s}
.trio-ph figcaption{font-size:13px;font-weight:900;margin-top:8px;line-height:1.3}
.ev.main.trio .cast{margin-top:4px}

/* ── shop tabs / cards ── */
[hidden]{display:none !important}
.cards{grid-template-columns:repeat(3,1fr)}
.card{cursor:default}
.card .rib.tmp{background:#eee;color:#888;z-index:2}
.card .pr{color:var(--pink-d);font-weight:900;font-size:13px}
.card.b .pr{color:var(--blue)}
.card.g .pr{color:#5d8c15}
.card .nt{font-size:11px;color:#777;line-height:1.55;margin-top:6px}
.card .th{aspect-ratio:16/10}

/* ── NEWS ── */
.news{padding:64px 0 72px;background:#fff;overflow:hidden}
.news-list{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.news-item{background:var(--cream);border-radius:22px;overflow:hidden;border:3px solid var(--pink-l);display:flex;flex-direction:column;opacity:0;transform:translateY(30px)}
.news-item.in{animation:up .6s cubic-bezier(.2,1,.3,1) both;animation-delay:calc(var(--i)*.1s)}
.news-item img,.news-item .ph{width:100%;aspect-ratio:16/9;object-fit:cover;background:#fff}
.news-item img.fit{object-fit:contain;padding:10px}
.news-item .ph{display:grid;place-items:center;font-weight:900;color:#bbb;font-size:13px;background:linear-gradient(135deg,var(--sky-l),var(--pink-l))}
.news-item .ph.pet{font-size:56px;color:var(--pink-d)}
.news-item .tx{padding:16px 18px 20px}
.news-item .tag{display:inline-block;font-size:11px;font-weight:900;color:#fff;background:var(--pink-d);border-radius:999px;padding:2px 10px;margin-right:8px;vertical-align:middle}
.news-item .tag.b{background:var(--blue)}
.news-item .dt{display:inline-block;font-family:var(--round);font-weight:900;color:var(--blue);font-size:15px;vertical-align:middle}
.news-item h3{font-size:16px;font-weight:900;line-height:1.4;margin:8px 0 6px}
.news-item p.body{font-size:13px;color:#555;line-height:1.7}
#news{scroll-margin-top:70px}


/* ── 学生インタビュー ── */
.interview{padding:80px 0 90px;background:linear-gradient(180deg,#fff,var(--sky-l));position:relative;overflow:hidden}
#interview{scroll-margin-top:70px}
.interview .sec-h h2{font-size:clamp(20px,3vw,32px)}
.iv-top{display:grid;grid-template-columns:minmax(0,380px) 1fr;gap:40px;align-items:center;margin-bottom:44px;opacity:0;transform:translateY(30px)}
.iv-top.in,.iv-qa.in{animation:up .7s cubic-bezier(.2,1,.3,1) both}
.iv-main{position:relative;margin:0}
.iv-main img:first-child{width:100%;border-radius:40px 60px 40px 60px / 60px 40px 60px 40px;border:6px solid #fff;box-shadow:0 14px 30px rgba(59,111,196,.18)}
.iv-ch{position:absolute;width:110px;right:-30px;bottom:-20px;animation:bob 2.4s ease-in-out infinite}
.iv-prof{display:flex;flex-direction:column;gap:2px;font-size:13px;font-weight:700;color:#555;margin-bottom:14px}
.iv-prof b{font-size:24px;font-family:var(--round);font-weight:900;color:var(--blue);margin-top:4px}
.iv-lead{font-size:15px;font-weight:700;line-height:1.9}
.iv-qa{display:grid;grid-template-columns:1fr 1fr;gap:22px 34px;align-items:start;opacity:0;transform:translateY(30px)}
.qa{background:#fff;border-radius:24px;padding:22px 26px;border:3px solid var(--sky-l)}
.qa .q{font-family:var(--round);font-weight:900;color:var(--blue);font-size:16px;line-height:1.5;margin-bottom:10px;padding-left:1.8em;position:relative}
.qa .q::before{content:"Q";position:absolute;left:0;top:0;width:1.4em;height:1.4em;border-radius:50%;background:var(--blue);color:#fff;font-size:13px;display:grid;place-items:center}
.qa .a{font-size:14px;line-height:1.9;font-weight:500}
.iv-sub{margin:0;grid-row:span 2}
.iv-sub img{width:100%;border-radius:28px;border:5px solid #fff;box-shadow:0 10px 24px rgba(59,111,196,.15)}

/* ── 画面外アニメ停止 ── */
.offscreen *{animation-play-state:paused !important}

@media (max-width:900px){
  .news-list{grid-template-columns:1fr}
  .iv-top{grid-template-columns:1fr;gap:26px}
  .iv-main{max-width:320px;margin:0 auto}
  .iv-qa{grid-template-columns:1fr}
  .iv-sub{grid-row:auto}
}
@media (max-width:640px){
  .cards{grid-template-columns:1fr}
  .trio-ph{gap:8px}
  .trio-ph img{border-width:3px;border-radius:14px}
  .trio-ph figcaption{font-size:11px}
  .interview{padding:50px 0 56px}
  .qa{padding:16px 18px}
  .iv-ch{width:80px;right:-10px}
  .datenav{padding:22px 0 10px}
  .day{scroll-margin-top:170px}
  .ft{padding-bottom:30px}
}
@media (max-width:440px){
  .interview .sec-h h2{font-size: 19px}
}


/* 動きを減らす設定（Windowsのアニメーション効果オフ等）でも表示する：定義順の後ろに置く必要あり */
@media (prefers-reduced-motion:reduce){
  .news-item,.iv-top,.iv-qa{opacity:1;transform:none}
}

/* 2026-09-14 追加（中野）：ショップ画像の表示バリエーション／ペット可カードの文言 */
.card .th.fit{object-fit:contain;background:#fff}
.card .th.logo{object-fit:contain;background:#fff}
.card .th.logo.dark{background:#231815}
.news-item p.body .shops{display:block;margin-top:4px;font-size:15px;font-weight:900;color:var(--blue)}
.news-item p.note{font-size:11px;color:#777;line-height:1.6;margin-top:8px}

/* WAON POINT 10倍バナー（ショップとNEW OPENの間） */
.waon{padding:56px 0 8px;background:#fff}
.waon__banner{display:block;max-width:1000px;margin:0 auto;border-radius:18px;overflow:hidden;box-shadow:0 6px 0 rgba(0,0,0,.12);transition:.15s}
.waon__banner:hover{transform:translateY(3px);box-shadow:0 3px 0 rgba(0,0,0,.12)}
.waon__banner img{display:block;width:100%;height:auto}
@media (max-width:640px){.waon{padding:40px 0 6px}.waon__banner{max-width:420px}}

/* ===== 終了表示（10/8 追加イメージ） ===== */
/* 日付ナビ */
.datenav a .endtag {
  position: absolute;
  right: -8px;
  top: -10px;
  font-style: normal;
  font-family: var(--round);
  font-weight: 900;
  font-size: 11px;
  letter-spacing: 0.08em;
  line-height: 1;
  color: #fff;
  background: var(--pink-d);
  border: 2px solid #fff;
  border-radius: 999px;
  padding: 4px 8px;
  transform: rotate(8deg);
  box-shadow: 0 2px 0 rgba(0, 0, 0, 0.12);
}

/* スタンプ */
.day__end {
  position: absolute;
  z-index: 3;
  top: 34px;
  right: 9%;
  margin: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 170px;
  height: 170px;
  border-radius: 50%;
  background: #fff;
  color: var(--pink-d);
  border: 5px solid var(--pink-d);
  box-shadow:
    0 0 0 6px #fff,
    0 10px 24px rgba(0, 0, 0, 0.18);
  font-family: var(--round);
  font-weight: 900;
  font-size: 26px;
  line-height: 1.15;
  letter-spacing: 0.02em;
  text-align: center;
  white-space: nowrap;
  transform: rotate(-10deg);
  opacity: 0;
  transform: rotate(-10deg) scale(1.8);
}
.day__end span {
  font-size: 12px;
  letter-spacing: 0.12em;
  margin-bottom: 6px;
  color: #555;
}
.day.blue .day__end {
  color: var(--blue);
  border-color: var(--blue);
}
.day.in .day__end {
  animation: endstamp 0.55s cubic-bezier(0.2, 1.5, 0.4, 1) 0.2s forwards;
}
@keyframes endstamp {
  0% {
    opacity: 0;
    transform: rotate(-10deg) scale(1.8);
  }
  100% {
    opacity: 1;
    transform: rotate(-10deg) scale(1);
  }
}

@media (max-width: 640px) {
  .day__end {
    top: 18px;
    right: 16px;
    width: 112px;
    height: 112px;
    font-size: 15px;
    letter-spacing: 0;
    border-width: 4px;
    box-shadow:
      0 0 0 4px #fff,
      0 6px 16px rgba(0, 0, 0, 0.18);
  }
  .day__end span {
    font-size: 9px;
    margin-bottom: 3px;
    letter-spacing: 0.06em;
  }
  .datenav a .endtag {
    font-size: 9px;
    padding: 3px 5px;
    right: -4px;
    top: -9px;
  }
}