@charset "utf-8";
/* CSS Document */

.fadeInUpTrigger,
.fadeInDownTrigger,
.fadeInUpTriggerOnce,
.fadeInLeftTrigger,
.fadeInRightTrigger,
.fadeLeftTrigger,
.fadeRightTrigger,
.blurTrigger
{
    opacity:0;
}

.animate__fadeInUp {
    background-color: #000833;
    animation-duration: 0.2s;
}

.blur{
	animation-name:blurAnime;
	animation-duration:1.02s;
	animation-fill-mode:forwards;
}
@keyframes blurAnime{
  from {
	filter: blur(10px);
	transform: scale(1/*.02*/);
	opacity: 0;
  }

  to {
	filter: blur(0);
	transform: scale(1);
	opacity: 1;
  }
}


/* 左から */
.fadeLeft {
animation-name:fadeLeftAnime;
animation-duration:1s;
animation-fill-mode:forwards;
}
@keyframes fadeLeftAnime{
  from {
    opacity: 0;
	transform: translateX(-100px);
  }

  to {
    opacity: 1;
	transform: translateX(0);
  }
}

.delay-time05,
.delay-time1,
.delay-time12,
.delay-time15,
.delay-time2,
.delay-time25 { animation-delay: 0s; }

.delay-timeSP05,
.delay-timeSP1,
.delay-timeSP12,
.delay-timeSP15,
.delay-timeSP2,
.delay-timeSP25 { background-color: #000833; }

.delay-timeSP05 { animation-delay: 0.5s; }
.delay-timeSP1 { animation-delay: 1s; }
.delay-timeSP12 { animation-delay: 1.2s; }
.delay-timeSP15 { animation-delay: 1.5s; }
.delay-timeSP2 { animation-delay: 2s; }
.delay-timeSP25 { animation-delay: 2.5s; }

/************************************ Below is the Tablet/PC Style ************************************/
@media screen and (min-width: 768px){ 
	/* アニメーションスタートの遅延時間を決めるCSS*/
	.delay-time05 { animation-delay: 0.5s; }
	.delay-time1 { animation-delay: 1s; }
	.delay-time12 { animation-delay: 1.2s; }
	.delay-time15 { animation-delay: 1.5s; }
	.delay-time2 { animation-delay: 2s; }
	.delay-time25 { animation-delay: 2.5s; }

	/* アニメーション自体が変化する時間を決めるCSS*/
	.change-time05 { animation-duration: 0.5s; }
	.change-time1 { animation-duration: 1s; }
	.change-time15 { animation-duration: 1.5s; }
	.change-time2 { animation-duration: 2s; }
	.change-time25 { animation-duration: 2.5s; }

}