@charset "utf-8";

/*========= レイアウトのためのCSS ===============*/





/*==================================================
スタート時は要素自体を透過0にするためのopacity:0;を指定する
===================================*/

.box3p{
	opacity: 0;


}

/*==================================================
ふわっ
===================================*/

.fadeUp01 {
animation-name:fadeUpAnime;
animation-duration:0.5s;
animation-fill-mode:forwards;
opacity: 0;
}
@keyframes fadeUpAnime{
  from {
    opacity: 0;
	transform: translateY(80px);
  }

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

}


.fadeUp02 {
animation-name:fadeUpAnime2;
animation-duration:0.5s;
animation-fill-mode:forwards;
opacity: 0;
}
@keyframes fadeUpAnime2{
  from {
    opacity: 0;
	transform: translateY(80px) rotate(-12deg);
  }

  to {
    opacity: 1;
	transform: translateY(0) rotate(-12deg);
  }
}

.fadeUp03 {
animation-name:fadeUpAnime3;
animation-duration:0.5s;
animation-fill-mode:forwards;
opacity: 0;
}
@keyframes fadeUpAnime3{
  from {
    opacity: 0;
	transform: translateY(80px) rotate(12deg);
  }

  to {
    opacity: 1;
	transform: translateY(0) rotate(12deg);
  }
}

/* アニメーションスタートの遅延時間を決めるCSS*/

.delay-time002{
animation-delay: 0.3s;
}

.delay-time004{
animation-delay: 0.6s;
}