@charset 'utf-8';

.fade-in {
  opacity: 0;
  transition-duration: 500ms;
  transition-property: opacity, transform;
}

.fade-in-up {
  transform: translate(0, 50px);
}

.fade-in-down {
  transform: translate(0, -50px);
}

.fade-in-left {
  transform: translate(-50px, 0);
}

.fade-in-right {
  transform: translate(50px, 0);
}

.scroll-in {
  opacity: 1;
  transform: translate(0, 0);
}

.scroll-in02 { opacity:0; }

.animebox-02.displayed{
  animation-delay: 0.3s;
}
.animebox-03.displayed{
  animation-delay: 0.6s;
}
.animebox-04.displayed{
  animation-delay: 0.9s;
}
.displayed{ opacity:0;
  animation: fadeUp 1s forwards;
}
@keyframes fadeUp{
  0%{opacity:0; transform: translateY(100px);}
100%{opacity:1; transform: translateY(0px);}
}
