.fadein {
  /* 最初は非表示 */
  opacity: 0;
  visibility: hidden;
  transition: opacity 1s, visibility 1s, transform 1s;
}
.fadein--05s{
  transition: opacity .5s, visibility .5s, transform .5s;
}

.fadein.fadein--right {
  transform: translateX(20px)!important;
}
.fadein.fadein--left {
  transform: translateX(-20px)!important;
}
.fadein.fadein--up {
  transform: translateY(20px)!important;
}
.fadein.fadein--down {
  transform: translateY(-20px)!important;
}

/* フェードイン時に入るクラス */
.fadein.is-fadein {
  opacity: 1;
  visibility: visible;
  transform: translateX(0)!important;
  transform: translateY(0)!important;
}