/* 1周年告知専用。共通テンプレートへ影響しないよう anniv 配下だけに適用。 */
.anniv { --anniv-pink:#ff4789; --anniv-yellow:#fffc91; --anniv-orange:#ff9c43; background:var(--anniv-pink); color:#fff; text-align:center; overflow:hidden; font-family:"Hiragino Maru Gothic ProN","Yu Gothic",Meiryo,sans-serif; line-height:1.65; }
.anniv *, .anniv *::before, .anniv *::after { box-sizing:border-box; }
.anniv img { display:block; max-width:100%; height:auto; }
.anniv h1, .anniv h2, .anniv h3, .anniv p { margin:0; padding:0; color:inherit; border:0; }
.anniv [hidden] { display:none !important; }
.anniv__inner { width:min(100%,720px); margin:0 auto; padding:24px 20px 0; }
.anniv .anniv__heading { width:100%; margin:0 auto; }
.anniv__scene { position:relative; width:100%; margin:24px auto 16px; padding-top:24px; }
.anniv__cake-group { width:66%; position:relative; margin:0 auto; transform-origin:50% 85%; }
.anniv__cake { width:100%; }
.anniv__flame { position:absolute; display:block; transform:translateX(-50%); }
.anniv__flame img { width:100%; transform-origin:50% 89%; animation:anniv-flame 1.1s ease-in-out infinite alternate; }
/* 1200 x 1396 のケーキ画像に対する芯の座標。炎の透明余白も含めて調整。 */
.anniv__flame--one { left:32%; bottom:95%; width:8%; }
.anniv__flame--two { left:53.2%; bottom:76.2%; width:6.4%; }
.anniv__flame--three { left:66.1%; bottom:77%; width:6.4%; }
.anniv__flame--two img { animation-delay:-.7s; animation-duration:.9s; }
.anniv__flame--three img { animation-delay:-1.2s; animation-duration:1.3s; }
.anniv__sparkle { position:absolute; width:7%; opacity:.9; }
.anniv__sparkle--one { top:27%; right:16%; }
.anniv__sparkle--two { top:43%; right:11%; width:4.5%; }
.anniv__sparkle--three { top:56%; left:12%; width:4.5%; }
.anniv__sparkle--four { top:68%; left:5%; }
.anniv--waiting .anniv__heading, .anniv--waiting .anniv__cake-group, .anniv--waiting .anniv__sparkle { opacity:0; }
.anniv--animate .anniv__heading { animation:anniv-pop 1.3s cubic-bezier(.2,.7,.3,1) both; transform-origin:50% 50%; }
.anniv--animate .anniv__cake-group { animation:anniv-pop 1.3s cubic-bezier(.2,.7,.3,1) 1.4s both; }
.anniv--animate .anniv__sparkle { animation:anniv-sparkle 3.8s ease-in-out infinite both; }
.anniv--animate .anniv__sparkle--one { animation-delay:2.7s; }
.anniv--animate .anniv__sparkle--two { animation-delay:3.05s; }
.anniv--animate .anniv__sparkle--three { animation-delay:3.35s; }
.anniv--animate .anniv__sparkle--four { animation-delay:3.65s; }
.anniv .anniv__message { width:100%; margin:12px auto 0; }
.anniv .anniv__intro { margin:26px auto 0; font-size:14px; line-height:1.9; }
.anniv__sp-break { display:none; }
.anniv__periods { position:relative; margin:46px auto 0; border:2px solid #fff; border-radius:18px; padding:28px 12px 20px; }
.anniv .anniv__period-title { position:absolute; left:50%; top:0; transform:translate(-50%,-50%); padding:2px 18px 4px; background:#fff; color:var(--anniv-pink); border-radius:40px; white-space:nowrap; font-size:23px; font-weight:900; }
.anniv__period + .anniv__period { border-top:1px solid #ffffff90; margin-top:18px; padding-top:18px; }
.anniv .anniv__period h3 { font-size:15px; font-weight:800; color:var(--anniv-yellow); line-height:1.55; }
.anniv .anniv__dates { display:flex; justify-content:center; align-items:center; gap:8px; margin-top:10px; font-size:24px; font-weight:800; line-height:1.35; font-variant-numeric:tabular-nums; }
.anniv__dates time { white-space:nowrap; }
.anniv__dates time span { display:block; font-size:13px; margin-top:3px; }
.anniv__until { font-size:20px; }
.anniv__countdown { margin:42px auto 0; padding-bottom:35px; }
.anniv .anniv__countdown h2 { font-size:18px; font-weight:800; margin-bottom:10px; }
.anniv__clock { display:flex; justify-content:center; align-items:center; gap:10px; }
.anniv__time { display:flex; align-items:flex-end; gap:3px; font-size:13px; font-weight:800; white-space:nowrap; }
.anniv__time > span:last-child { padding-bottom:5px; }
.anniv__digits { display:flex; padding:2px 3px; background:var(--anniv-yellow); border-radius:7px; min-height:43px; }
.anniv .anniv__digit { width:24px; height:auto; }
.anniv .anniv__status { font-size:17px; font-weight:700; white-space:pre-line; }
.anniv__social { background:var(--anniv-orange); position:relative; margin-top:130px; }
.anniv__gifts { position:relative; width:min(100%,800px); margin:0 auto; }
.anniv__gifts img { width:100%; transform:translateY(-80%); margin-bottom:-27.933%; }
.anniv__social::before { content:""; position:absolute; top:-17px; left:-10%; width:120%; height:45px; background:var(--anniv-orange); border-radius:50% 50% 0 0; }
.anniv__social-inner { position:relative; padding:10px 20px 32px; }
.anniv .anniv__social-inner p { font-size:15px; font-weight:700; }
.anniv__social-links { display:flex; justify-content:center; gap:26px; margin-top:20px; }
.anniv__social-links a { display:grid; place-items:center; width:48px; height:48px; border-radius:6px; color:#fff; }
.anniv__social-links svg { display:block; width:40px; height:40px; }
.anniv a:focus-visible { outline:3px solid #fff; outline-offset:5px; }
@keyframes anniv-pop { 0% { opacity:0; transform:translateY(22px) scale(.8); } 65% { opacity:1; transform:translateY(-5px) scale(1.035); } 82% { transform:translateY(1px) scale(.99); } 100% { opacity:1; transform:translateY(0) scale(1); } }
@keyframes anniv-flame { from { transform:rotate(-10deg) scale(.88,1.12); } to { transform:rotate(11deg) scale(1.1,.88); } }
@keyframes anniv-sparkle { 0%,100% { opacity:0; transform:scale(.65) rotate(-8deg); } 20% { opacity:1; transform:scale(1.12) rotate(4deg); } 40%,70% { opacity:.85; transform:scale(1); } 90% { opacity:0; transform:scale(.75); } }
@media (max-width:359px) { .anniv__inner { padding-inline:14px; } .anniv__clock { gap:6px; } .anniv .anniv__digit { width:21px; } .anniv__time { font-size:11px; } .anniv .anniv__period h3 { font-size:13px; } .anniv__sp-break { display:block; } }
@media (min-width:768px) { .anniv__inner { padding-top:40px; } .anniv__scene { margin-top:34px; padding-top:42px; } .anniv .anniv__intro { font-size:20px; margin-top:36px; } .anniv__periods { padding:36px 30px 26px; margin-top:56px; } .anniv .anniv__period h3 { font-size:21px; } .anniv .anniv__dates { font-size:34px; gap:22px; } .anniv__dates time span { display:inline; font-size:17px; } .anniv__countdown { margin-top:50px; padding-bottom:80px; } .anniv .anniv__countdown h2 { font-size:25px; } .anniv .anniv__digit { width:39px; } .anniv__digits { padding:3px 5px; } .anniv__clock { gap:18px; } .anniv__time { font-size:18px; gap:6px; } .anniv__social { margin-top:180px; } .anniv .anniv__social-inner p { font-size:21px; } .anniv__social-inner { padding-bottom:46px; } .anniv__social-links a { width:60px; height:60px; } .anniv__social-links img { width:52px; height:52px; } }
@media (min-width:1024px) { .anniv__inner { width:760px; } }
@media (prefers-reduced-motion:reduce) { .anniv .anniv__heading, .anniv .anniv__cake-group, .anniv .anniv__sparkle, .anniv .anniv__flame img { animation:none !important; opacity:1; } .anniv .anniv__sparkle { opacity:1; } }