@charset "utf-8";
/* CSS Document */
/*----------------------------------------
アニメーション
プラグイン『inview.js』

●.inview と合わせて動かしたい対象に付ける
●繰り返す場合は .inview_re
----------------------------------------*/

/* フェードイン（ふわっと）：.fadeIn */


.fadeIn {
    opacity: 0;
    transition: 1.s;
  }
  
  .fadeIn.is-show {
    opacity: 1;
  }
  
  /* 下からフェードイン（ふわっと）：.fadeIn_up */
  
  .fadeIn_up {
    opacity: 0;
    transform: translate(0, 10%);
    transition: 1.5s;
    -webkit-transform: translate(0, 10%);
    -moz-transform: translate(0, 10%);
    -ms-transform: translate(0, 10%);
    -o-transform: translate(0, 10%);
  }
  
  .fadeIn_up.is-show {
    transform: translate(0, 0) !important;
    opacity: 1;
    -webkit-transform: translate(0, 0) !important;
    -moz-transform: translate(0, 0) !important;
    -ms-transform: translate(0, 0) !important;
    -o-transform: translate(0, 0) !important;
  }
  
  /* 左からフェードイン（ふわっと）：.fadeIn_left */
  
  .fadeIn_left {
    opacity: 0;
    transform: translate(-10%, 0);
    transition: 1.5s;
    -webkit-transform: translate(-10%, 0);
    -moz-transform: translate(-10%, 0);
    -ms-transform: translate(-10%, 0);
    -o-transform: translate(-10%, 0);
  }
  
  .fadeIn_left.is-show {
    transform: translate(0, 0) !important;
    opacity: 1;
    -webkit-transform: translate(0, 0) !important;
    -moz-transform: translate(0, 0) !important;
    -ms-transform: translate(0, 0) !important;
    -o-transform: translate(0, 0) !important;
  }
  
  
  /* 右からフェードイン（ふわっと）：.fadeIn_right */
  
  .fadeIn_right {
    opacity: 0;
    transform: translate(10%, 0);
    transition: 1.5s;
    -webkit-transform: translate(10%, 0);
    -moz-transform: translate(10%, 0);
    -ms-transform: translate(10%, 0);
    -o-transform: translate(10%, 0);
  }
  
  .fadeIn_right.is-show {
    transform: translate(0, 0) !important;
    opacity: 1;
    -webkit-transform: translate(0, 0) !important;
    -moz-transform: translate(0, 0) !important;
    -ms-transform: translate(0, 0) !important;
    -o-transform: translate(0, 0) !important;
  }
  
  
  /* 親要素につけてスクロールバー非表示 */
  
  .hidden {
    overflow: hidden;
  }
  
  .hidden-x {
    overflow-x: hidden;
  }
  
  /* 動きの調整 */
  
  /* かなり大きく動く */
  .fadeIn_up.move-XL {
    transform: translate(0, 50%);
    -webkit-transform: translate(0, 50%);
    -moz-transform: translate(0, 50%);
    -ms-transform: translate(0, 50%);
    -o-transform: translate(0, 50%);
  }
  
  .fadeIn_left.move-XL {
    transform: translate(-50%, 0);
    -webkit-transform: translate(-50%, 0);
    -moz-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    -o-transform: translate(-50%, 0);
  }
  
  .fadeIn_right.move-XL {
    transform: translate(50%, 0);
    -webkit-transform: translate(50%, 0);
    -moz-transform: translate(50%, 0);
    -ms-transform: translate(50%, 0);
    -o-transform: translate(50%, 0);
  }
  
  /* 大きく動く */
  
  .fadeIn_up.move-L {
    transform: translate(0, 30%);
    -webkit-transform: translate(0, 30%);
    -moz-transform: translate(0, 30%);
    -ms-transform: translate(0, 30%);
    -o-transform: translate(0, 30%);
  }
  
  .fadeIn_left.move-L {
    transform: translate(-30%, 0);
    -webkit-transform: translate(-30%, 0);
    -moz-transform: translate(-30%, 0);
    -ms-transform: translate(-30%, 0);
    -o-transform: translate(-30%, 0);
  }
  
  .fadeIn_right.move-L {
    transform: translate(30%, 0);
    -webkit-transform: translate(30%, 0);
    -moz-transform: translate(30%, 0);
    -ms-transform: translate(30%, 0);
    -o-transform: translate(30%, 0);
  }
  
  
  /* やや大きく動く */
  .fadeIn_up.move-M {
    transform: translate(0, 20%);
    -webkit-transform: translate(0, 20%);
    -moz-transform: translate(0, 20%);
    -ms-transform: translate(0, 20%);
    -o-transform: translate(0, 20%);
  }
  
  .fadeIn_left.move-M {
    transform: translate(-20%, 0);
    -webkit-transform: translate(-20%, 0);
    -moz-transform: translate(-20%, 0);
    -ms-transform: translate(-20%, 0);
    -o-transform: translate(-20%, 0);
  }
  
  .fadeIn_right.move-M {
    transform: translate(20%, 0);
    -webkit-transform: translate(20%, 0);
    -moz-transform: translate(20%, 0);
    -ms-transform: translate(20%, 0);
    -o-transform: translate(20%, 0);
  }
  
  
  /* 小さく動く */
  .fadeIn_up.move-S {
    transform: translate(0, 5%);
    -webkit-transform: translate(0, 5%);
    -moz-transform: translate(0, 5%);
    -ms-transform: translate(0, 5%);
    -o-transform: translate(0, 5%);
  }
  
  .fadeIn_left.move-S {
    transform: translate(-5%, 0);
    -webkit-transform: translate(-5%, 0);
    -moz-transform: translate(-5%, 0);
    -ms-transform: translate(-5%, 0);
    -o-transform: translate(-5%, 0);
  }
  
  .fadeIn_right.move-S {
    transform: translate(5%, 0);
    -webkit-transform: translate(5%, 0);
    -moz-transform: translate(5%, 0);
    -ms-transform: translate(5%, 0);
    -o-transform: translate(5%, 0);
  }
  
  
  /* 動きの速さ */
  
  /* 速く */
  .time-fast {
    transition: 1s;
    -webkit-transition: 1s;
    -moz-transition: 1s;
    -ms-transition: 1s;
    -o-transition: 1s;
  }
  
  /* やや速く */
  .time-fast-ltl {
    transition: 1.2s;
    -webkit-transition: 1.2s;
    -moz-transition: 1.2s;
    -ms-transition: 1.2s;
    -o-transition: 1.2s;
  }
  
  /* やや遅く */
  .time-slow-ltl {
    transition: 2s;
    -webkit-transition: 2s;
    -moz-transition: 2s;
    -ms-transition: 2s;
    -o-transition: 2s;
  }
  
  /* 遅く */
  .time-slow {
    transition: 2.5s;
    -webkit-transition: 2.5s;
    -moz-transition: 2.5s;
    -ms-transition: 2.5s;
    -o-transition: 2.5s;
  }
  
  /* 時間差で動く */
  
  .delay-item1{
    transition-delay: 0.3s;
  }
  
  .delay-item2 {
    transition-delay: 0.5s;
  }
  
  .delay-item3 {
    transition-delay: 0.8s;
  }
  
  .delay-item4 {
    transition-delay: 1s;
  }
  
  .delay-item5 {
    transition-delay: 1.2s;
  }
  
  .delay-item6 {
    transition-delay: 1.4s;
  }
  
  @media screen and (min-width:1000px) {
    .delay-item1--pc {
      transition-delay: 0.3s;
    }
  
    .delay-item2--pc {
      transition-delay: 0.5s;
    }
  
    .delay-item3--pc {
      transition-delay: 0.8s;
    }
  
    .delay-item4--pc {
      transition-delay: 1s;
    }
  
    .delay-item5--pc {
      transition-delay: 1.2s;
    }
  
    .delay-item6--pc {
      transition-delay: 1.4s;
    }
  }
  
  @media screen and (max-width:999px) {
    .delay-item1--sp {
      transition-delay: 0.3s;
    }
  
    .delay-item2--sp {
      transition-delay: 0.5s;
    }
  
    .delay-item3--sp {
      transition-delay: 0.8s;
    }
  
    .delay-item4--sp {
      transition-delay: 1s;
    }
  
    .delay-item5--sp {
      transition-delay: 1.2s;
    }
  
    .delay-item6--sp {
      transition-delay: 1.4s;
    }
  }
  



  /*========= タイピング ===============*/

.TextTyping span {
  display: none;
}

/*文字列後ろの線の設定*/
.TextTyping::after {
  content: "|";
  animation: typinganime .8s ease infinite;
}

@keyframes typinganime{
  from{opacity:0}
  to{opacity:1}
}

  /*========= チカチカさせる ===============*/

.animation--blink {
  animation: blink 0.7s linear infinite alternate;
}

@keyframes blink {
  0% {opacity: 0;}
  50% {opacity: 0;}
  51% {opacity: 1;}
  100%{opacity: 1;}
}

/*--------------------------------------*/

/*SP*/
@media screen and (max-width:999px){}
/*PC*/
@media screen and (min-width:1000px){}

/*--------------------------------------*/