@charset "utf-8";

body{ font-family: "Noto Sans JP", sans-serif; background-color:#FFF; color:#243; font-weight:500; }
.midashi { font-family: "Noto Serif JP", serif; }
.fade-left, .fade-right { opacity: 0; transition: opacity 1.25s ease-out, transform 1.25s ease-out; }
.fade-left { transform: translateX(-24px); }
.fade-right { transform: translateX(24px); }
.fade-left.visible, .fade-right.visible { opacity: 1; transform: translateX(0); }
@keyframes fadeUp { 0% { opacity: 0; transform: translateY(20px); } 100% { opacity: 1; transform: translateY(0); } }
.fade-up{ opacity: 0; }
.seq-fade.visible { animation: fadeUp 0.8s ease-out forwards; }
.scroll-wrap { width: 200%; display: flex; animation: scroll-left 240s linear infinite; }
@keyframes scroll-left { 0%   { transform: translateX(0); } 100% { transform: translateX(-100%); } }
.fade-up { opacity: 0; }
.fade-up.visible { animation: fadeUp .75s ease-out forwards; }
@keyframes fadeUp { from { opacity: 0; transform: translateY(8px); } to   { opacity: 1; transform: translateY(0); } }
.fade-blur { opacity: 0; filter: blur(8px); }
.fade-blur.visible { animation: fadeBlur 1.25s ease-out forwards; }
@keyframes fadeBlur { from { opacity: 0; filter: blur(8px); } to   { opacity: 1; filter: blur(0); } }