@charset "utf-8";



/*animation
=======================*/
/*--1stview--*/
.fadein_1st {
  animation-name: fadein01;
  animation-duration: 6s;
}
@keyframes fadein01 {
  from {
    opacity: 0;
    transform: translateY(50px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.fadein_2nd {
  animation-name: fadein02;
  animation-duration: 8s;
}
@keyframes fadein02 {
  from {
    opacity: 0;
    transform: translateY(50px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.fadein_3rd {
    animation-name: fadein03;
    animation-duration: 8s;
}
@keyframes fadein03 {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}


/*--スクロールエフェクト用--*/
.fadein {
  opacity : 0;
  transform : translate(0, 100px);
  transition : all 1000ms;
}
.fadein.fadein_right {
  transform : translate(10px, 0);
}
.fadein.fadein_left {
  transform : translate(-10px, 0);
}
.fadein.scrollin,
.fadein.fadein_right.scrollin,
.fadein.fadein_left.scrollin {
  opacity : 1;
  transform : translate(0, 0);
}



/*========================

SP

========================*/
@media screen and (max-width: 768px) {



}