@charset "UTF-8";
/**
 * 変数
 */
/**
 * color
 * ---------------------------
 */
/**
 * コンテンツ幅
 * ---------------------------
 */
/**
 * font famiry
 * ---------------------------
 */
/*
invew style
---------------------------*/
/** 上から下へ */
.top_to_bottom {
  -webkit-transform: translate3d(0, -50px, 0);
          transform: translate3d(0, -50px, 0);
  opacity: 0;
}
.top_to_bottom::before, .top_to_bottom::after {
  -webkit-transform: translate3d(0, -50px, 0);
          transform: translate3d(0, -50px, 0);
  opacity: 0;
}

/** 下から上へ */
.bottom_to_top {
  -webkit-transform: translate3d(0, 50px, 0);
          transform: translate3d(0, 50px, 0);
  opacity: 0;
}
.bottom_to_top::before, .bottom_to_top::after {
  -webkit-transform: translate3d(0, 50px, 0);
          transform: translate3d(0, 50px, 0);
  opacity: 0;
}

/** 左から右へ */
.left_to_right {
  -webkit-transform: translate3d(-50px, 0, 0);
          transform: translate3d(-50px, 0, 0);
  opacity: 0;
}
.left_to_right::before, .left_to_right::after {
  -webkit-transform: translate3d(-50px, 0, 0);
          transform: translate3d(-50px, 0, 0);
  opacity: 0;
}

/** 右から左へ */
.right_to_left {
  -webkit-transform: translate3d(50px, 0, 0);
          transform: translate3d(50px, 0, 0);
  opacity: 0;
}
.right_to_left::before, .right_to_left::after {
  -webkit-transform: translate3d(50px, 0, 0);
          transform: translate3d(50px, 0, 0);
  opacity: 0;
}

/** フェードイン */
.fade {
  opacity: 0;
}
.fade::before, .fade::after {
  opacity: 0;
}
.fade.active {
  -webkit-transition: 0.8s ease-out 0.5s;
  transition: 0.8s ease-out 0.5s;
  overflow: hidden;
}
.fade.active.active::before, .fade.active.active::after {
  -webkit-transition: 0.8s ease-out 0.5s;
  transition: 0.8s ease-out 0.5s;
  overflow: hidden;
}

/** 表示後の動き */
.inviewAnimation.active,
.time_difference_animation.active {
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
  -webkit-transition: 0.5s ease-in-out 0.3s;
  transition: 0.5s ease-in-out 0.3s;
  opacity: 1;
}
.inviewAnimation.active.active::before, .inviewAnimation.active.active::after,
.time_difference_animation.active.active::before,
.time_difference_animation.active.active::after {
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
  -webkit-transition: 0.5s ease-in-out 0.3s;
  transition: 0.5s ease-in-out 0.3s;
  opacity: 1;
}

/* アニメーションスタートの遅延 */
.delay-time0-5 {
  -webkit-transition-delay: 0.5s !important;
          transition-delay: 0.5s !important;
}

.delay-time01 {
  -webkit-transition-delay: 1s !important;
          transition-delay: 1s !important;
}

.delay-time01-5 {
  -webkit-transition-delay: 1.5s !important;
          transition-delay: 1.5s !important;
}

.delay-time02 {
  -webkit-transition-delay: 2s !important;
          transition-delay: 2s !important;
}

.delay-time02-5 {
  -webkit-transition-delay: 2.5s !important;
          transition-delay: 2.5s !important;
}

.delay-time03 {
  -webkit-transition-delay: 3s !important;
          transition-delay: 3s !important;
}

.delay-time03-5 {
  -webkit-transition-delay: 3.5s !important;
          transition-delay: 3.5s !important;
}

.delay-time04 {
  -webkit-transition-delay: 4s !important;
          transition-delay: 4s !important;
}

.delay-time04-5 {
  -webkit-transition-delay: 4.5s !important;
          transition-delay: 4.5s !important;
}

.delay-time05 {
  -webkit-transition-delay: 5s !important;
          transition-delay: 5s !important;
}

.delay-time05-5 {
  -webkit-transition-delay: 5.5s !important;
          transition-delay: 5.5s !important;
}

.delay-time06 {
  -webkit-transition-delay: 6s !important;
          transition-delay: 6s !important;
}

/* SP（width:768px未満）時に動きが変わるアニメーション */
@media (max-width: 768px) {
  /** 上から下へ */
  .sp_top_to_bottom {
    -webkit-transform: translate3d(0, -50px, 0);
            transform: translate3d(0, -50px, 0);
    opacity: 0;
  }
  .sp_top_to_bottom::before, .sp_top_to_bottom::after {
    -webkit-transform: translate3d(0, -50px, 0);
            transform: translate3d(0, -50px, 0);
    opacity: 0;
  }
  .sp_top_to_bottom.active {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
    -webkit-transition: 0.5s ease-in-out 0.3s;
    transition: 0.5s ease-in-out 0.3s;
    opacity: 1;
  }
  .sp_top_to_bottom.active.active::before, .sp_top_to_bottom.active.active::after {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
    -webkit-transition: 0.5s ease-in-out 0.3s;
    transition: 0.5s ease-in-out 0.3s;
    opacity: 1;
  }
  /** 下から上へ */
  .sp_bottom_to_top {
    -webkit-transform: translate3d(0, 50px, 0);
            transform: translate3d(0, 50px, 0);
    opacity: 0;
  }
  .sp_bottom_to_top::before, .sp_bottom_to_top::after {
    -webkit-transform: translate3d(0, 50px, 0);
            transform: translate3d(0, 50px, 0);
    opacity: 0;
  }
  .sp_bottom_to_top.active {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
    -webkit-transition: 0.5s ease-in-out 0.3s;
    transition: 0.5s ease-in-out 0.3s;
    opacity: 1;
  }
  .sp_bottom_to_top.active.active::before, .sp_bottom_to_top.active.active::after {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
    -webkit-transition: 0.5s ease-in-out 0.3s;
    transition: 0.5s ease-in-out 0.3s;
    opacity: 1;
  }
  /** 左から右へ */
  .sp_left_to_right {
    -webkit-transform: translate3d(-50px, 0, 0);
            transform: translate3d(-50px, 0, 0);
    opacity: 0;
  }
  .sp_left_to_right::before, .sp_left_to_right::after {
    -webkit-transform: translate3d(-50px, 0, 0);
            transform: translate3d(-50px, 0, 0);
    opacity: 0;
  }
  .sp_left_to_right.active {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
    -webkit-transition: 0.5s ease-in-out 0.3s;
    transition: 0.5s ease-in-out 0.3s;
    opacity: 1;
  }
  .sp_left_to_right.active.active::before, .sp_left_to_right.active.active::after {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
    -webkit-transition: 0.5s ease-in-out 0.3s;
    transition: 0.5s ease-in-out 0.3s;
    opacity: 1;
  }
  /** 右から左へ */
  .sp_right_to_left {
    -webkit-transform: translate3d(50px, 0, 0);
            transform: translate3d(50px, 0, 0);
    opacity: 0;
  }
  .sp_right_to_left::before, .sp_right_to_left::after {
    -webkit-transform: translate3d(50px, 0, 0);
            transform: translate3d(50px, 0, 0);
    opacity: 0;
  }
  .sp_right_to_left.active {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
    -webkit-transition: 0.5s ease-in-out 0.3s;
    transition: 0.5s ease-in-out 0.3s;
    opacity: 1;
  }
  .sp_right_to_left.active.active::before, .sp_right_to_left.active.active::after {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
    -webkit-transition: 0.5s ease-in-out 0.3s;
    transition: 0.5s ease-in-out 0.3s;
    opacity: 1;
  }
  /** フェードイン */
  .sp_fade {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
    opacity: 0;
  }
  .sp_fade::before, .sp_fade::after {
    opacity: 0;
  }
  .sp_fade.active {
    -webkit-transition: 0.8s ease-out 0.5s;
    transition: 0.8s ease-out 0.5s;
    opacity: 1;
    overflow: hidden;
  }
  .sp_fade.active.active::before, .sp_fade.active.active::after {
    -webkit-transition: 0.8s ease-out 0.5s;
    transition: 0.8s ease-out 0.5s;
    opacity: 1;
    overflow: hidden;
  }
}/*# sourceMappingURL=inview.css.map */