@charset "UTF-8";
/* ----------------------------------------------------
アニメーション
---------------------------------------------------- */
/* ---------- フェードアニメーション ----------*/
.an-fade-up {
  -webkit-transform: translateY(5rem);
          transform: translateY(5rem);
  opacity: 0;
  -webkit-transition: 0.4s ease-in-out;
  transition: 0.4s ease-in-out;
}
.an-fade-up.active {
  opacity: 1;
  -webkit-transform: translate(0);
          transform: translate(0);
}

.an-fade-down {
  -webkit-transform: translateY(-5rem);
          transform: translateY(-5rem);
  opacity: 0;
  -webkit-transition: 0.4s ease-in-out;
  transition: 0.4s ease-in-out;
}
.an-fade-down.active {
  opacity: 1;
  -webkit-transform: translate(0);
          transform: translate(0);
}

.an-fade-left {
  -webkit-transform: translateX(-3rem);
          transform: translateX(-3rem);
  opacity: 0;
  -webkit-transition: 0.4s ease-in-out;
  transition: 0.4s ease-in-out;
}
.an-fade-left.active {
  opacity: 1;
  -webkit-transform: translate(0);
          transform: translate(0);
}

.an-fade-right {
  -webkit-transform: translatex(3rem);
          transform: translatex(3rem);
  opacity: 0;
  -webkit-transition: 0.4s ease-in-out;
  transition: 0.4s ease-in-out;
}
.an-fade-right.active {
  opacity: 1;
  -webkit-transform: translate(0);
          transform: translate(0);
}

.an-fade {
  opacity: 0;
  -webkit-transition: 0.4s ease-in-out;
  transition: 0.4s ease-in-out;
}
.an-fade.active {
  opacity: 1;
}