.fadein {
  opacity: 0;
  transition: 1s;
}
.fadein_on {
  opacity: 1.0;
}
.fadein_top {
  transform: translateY(-50%);
  transition: 1s;
  opacity: 0;
}
.fadein_top_on {
  transform: translateY(0);
  opacity: 1;
}
.fadein_bottom {
  transform: translateY(50%);
  transition: 1s;
  opacity: 0;
}
.fadein_bottom_on {
  transform: translateY(0);
  opacity: 1;
}
.fadein_left {
  transform: translateX(-50%);
  transition: 1s;
  opacity: 0;
}
.fadein_left_on {
  transform: translateX(0);
  opacity: 1;
}
.fadein_right {
  transform: translateX(50%);
  transition: 1s;
  opacity: 0;
}
.fadein_right_on {
  transform: translateX(0);
  opacity: 1;
}
.fadein_text {
  opacity: 0;
}
.fadein_text_on {
  opacity: 1;
}
.fadein_ul li {
  opacity: 0;
}
.fadein_zoom {
  transform: scale(0.8);
  transition: 0.5s;
  opacity: 0;
}
.fadein_zoom_on {
  transform: scale(1);
  opacity: 1;
}