@charset "UTF-8";
/* ------------------------------------------------------
アニメーション用CSS
------------------------------------------------------ */
.sa { opacity: 0; transition: transform 1.5s ease, opacity 1.5s ease, background-color 1s ease, border 1s ease, color 1s ease; }
.sa.show { opacity: 1; transform: none; }
.sa.left { opacity: 1; }
.blur { opacity: 0; filter: blur(50px); transition: filter 1.5s ease; }
.blur.show { opacity: 1; filter: blur(0); transform: none; }
.sa--lr { transform: translate(-50px, 0); }
.sa--rl { transform: translate(50px, 0); }
.sa--up { transform: translate(0, 30px); }
.sa--down { transform: translate(0, -30px); }
.sa--scaleUp { transform: translate(0, 30px) scale(0.9); }
.sa--scaleDown { transform: scale(1.1); }
.sa--rotateL { transform: rotate(180deg); }
.sa--rotateR { transform: rotate(-180deg); }

.delay500ms{ transition-delay: 500ms;}

.delay300ms{ transition-delay: 300ms;}
.delay600ms{ transition-delay: 600ms;}
.delay900ms{ transition-delay: 900ms;}
.delay1200ms{ transition-delay: 1200ms;}

@media screen and (max-width: 600px) {
.sa--rl.sp--scaleup { transform: translate(0, 30px) scale(0.9);}
.sa.show { transform: none;}
}