/* ========================================================================= reveal.css — スクロール連動リビール（4ページ共通・安全版） ・JS が に .reveal-on を付与し、各要素に data-rvl を割り当てたときだけ発火 ・prefers-reduced-motion / JS 無効時は一切隠さない（全要素そのまま表示） ・演出は「不透明度＋わずかなせり上がり」のみ。clip/スライド/拡大は使わない （要素やはみ出しバッジを隠す・見切れさせる事故を避けるため） ========================================================================= */ @media (prefers-reduced-motion: no-preference){ /* ヒーローのちらつき防止：.reveal-on が付いた最初の描画から不透明度だけ落とす */ html.reveal-on .hero .hero-copy > *, html.reveal-on .hero .hero-visual{ opacity:0; } /* --- ベース：フェード＋せり上がり --- */ html.reveal-on [data-rvl]{ opacity:0; transform:translateY(18px); transition: opacity .7s cubic-bezier(.22,.61,.36,1), transform .7s cubic-bezier(.22,.61,.36,1); transition-delay:var(--rvl-d,0s); } html.reveal-on [data-rvl].is-in{ opacity:1; transform:none; } /* --- 見出しハイライト（.u）を左から引くように塗る --- */ html.reveal-on [data-rvl] .u{ background-size:0% 100%; background-repeat:no-repeat; transition:background-size .7s cubic-bezier(.22,.61,.36,1); transition-delay:calc(var(--rvl-d,0s) + .25s); } html.reveal-on [data-rvl].is-in .u{ background-size:100% 100%; } }