@keyframes fadeInLeft {
  from {
    opacity: 0;
    transform: translateX(-20%);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes fadeInRight {
  from {
    opacity: 0;
    transform: translateX(5%);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(20%);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.animateElement {
  -webkit-transform: translateZ(0);
  display: none;
  opacity: 0;
}

.anm_l {
  animation-name: fadeInLeft;
  animation-duration: 2s;
  display: block;
  opacity: 1;
}

.anm_r {
  animation-name: fadeInRight;
  animation-duration: 2s;
  display: block;
  opacity: 1;
}

.anm_f {
  animation-name: fadeIn;
  animation-duration: 2s;
  display: block;
  opacity: 1;
}

.anm_u {
  animation-name: fadeInUp; /* 下からフェードイン */
  animation-duration: 2s;
  display: block;
  opacity: 1;
}