@charset "UTF-8";
/*===================================================
アニメーション基本設定
====================================================*/
.anime-fadeIn,
.anime-fadeIn_js {
  -webkit-animation-duration: 1s;
          animation-duration: 1s;
  -webkit-animation-delay: 0.3s;
          animation-delay: 0.3s;
  -webkit-animation-timing-function: ease;
          animation-timing-function: ease;
  -webkit-transform-origin: center bottom;
          transform-origin: center bottom;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
}

.anime-fadeUp,
.anime-fadeUp_js {
  -webkit-animation-duration: 0.5s;
          animation-duration: 0.5s;
  -webkit-animation-delay: 1s;
          animation-delay: 1s;
  -webkit-animation-timing-function: ease;
          animation-timing-function: ease;
  -webkit-transform-origin: center bottom;
          transform-origin: center bottom;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
}

.anime-popUp,
.anime-popUp_js,
.anime-popUp2 {
  -webkit-animation-duration: 1s;
          animation-duration: 1s;
  -webkit-animation-delay: 0.3s;
          animation-delay: 0.3s;
  -webkit-animation-timing-function: ease;
          animation-timing-function: ease;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
}

.anime-jump {
  -webkit-animation-duration: 1s;
          animation-duration: 1s;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
  -webkit-transform-origin: center bottom;
          transform-origin: center bottom;
}

.anime-jumpIn,
.anime-jumpIn_js {
  -webkit-animation-duration: 0.5s;
          animation-duration: 0.5s;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
  -webkit-transform-origin: center bottom;
          transform-origin: center bottom;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
}

.anime-move01 {
  -webkit-animation-name: move01;
          animation-name: move01;
  -webkit-animation-duration: 1s;
          animation-duration: 1s;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
  -webkit-animation-timing-function: ease-in-out;
          animation-timing-function: ease-in-out;
  -webkit-transform-origin: center bottom;
          transform-origin: center bottom;
  -webkit-animation-direction: normal;
          animation-direction: normal;
  -webkit-animation-fill-mode: backwards;
          animation-fill-mode: backwards;
}

@-webkit-keyframes move01 {
  from {
    opacity: 0;
    -webkit-transform: translateY(0px);
            transform: translateY(0px);
  }
  to {
    opacity: 1;
    -webkit-transform: translateY(6px);
            transform: translateY(6px);
  }
}

@keyframes move01 {
  from {
    opacity: 0;
    -webkit-transform: translateY(0px);
            transform: translateY(0px);
  }
  to {
    opacity: 1;
    -webkit-transform: translateY(6px);
            transform: translateY(6px);
  }
}
.anime-second01_js.is-anime,
.anime-second02_js.is-anime,
.anime-second03_js.is-anime,
.anime-second04_js.is-anime {
  -webkit-animation-duration: 1s;
          animation-duration: 1s;
  -webkit-animation-timing-function: ease-out;
          animation-timing-function: ease-out;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
}

.anime-second01_js.is-anime {
  -webkit-animation-name: second01;
          animation-name: second01;
}

@-webkit-keyframes second01 {
  from {
    opacity: 0;
    -webkit-transform: translate(-6px, -2px) scale3d(1.5, 1.5, 2);
            transform: translate(-6px, -2px) scale3d(1.5, 1.5, 2);
  }
  to {
    opacity: 1;
    -webkit-transform: translate(0px, 0px) scale3d(1, 1, 1);
            transform: translate(0px, 0px) scale3d(1, 1, 1);
  }
}

@keyframes second01 {
  from {
    opacity: 0;
    -webkit-transform: translate(-6px, -2px) scale3d(1.5, 1.5, 2);
            transform: translate(-6px, -2px) scale3d(1.5, 1.5, 2);
  }
  to {
    opacity: 1;
    -webkit-transform: translate(0px, 0px) scale3d(1, 1, 1);
            transform: translate(0px, 0px) scale3d(1, 1, 1);
  }
}
.anime-second02_js.is-anime {
  -webkit-animation-name: second02;
          animation-name: second02;
}

@-webkit-keyframes second02 {
  from {
    opacity: 0;
    -webkit-transform: translate(6px, 2px) scale3d(1.5, 1.5, 1.5);
            transform: translate(6px, 2px) scale3d(1.5, 1.5, 1.5);
  }
  to {
    opacity: 1;
    -webkit-transform: translate(0px, 0px) scale3d(1, 1, 1);
            transform: translate(0px, 0px) scale3d(1, 1, 1);
  }
}

@keyframes second02 {
  from {
    opacity: 0;
    -webkit-transform: translate(6px, 2px) scale3d(1.5, 1.5, 1.5);
            transform: translate(6px, 2px) scale3d(1.5, 1.5, 1.5);
  }
  to {
    opacity: 1;
    -webkit-transform: translate(0px, 0px) scale3d(1, 1, 1);
            transform: translate(0px, 0px) scale3d(1, 1, 1);
  }
}
.anime-second03_js.is-anime {
  -webkit-animation-name: second03;
          animation-name: second03;
}

@-webkit-keyframes second03 {
  from {
    opacity: 0;
    -webkit-transform: translate(-100px, -2px) scale3d(1.5, 1.5, 1.5);
            transform: translate(-100px, -2px) scale3d(1.5, 1.5, 1.5);
  }
  to {
    opacity: 1;
    -webkit-transform: translate(0px, 0px) scale3d(1, 1, 1);
            transform: translate(0px, 0px) scale3d(1, 1, 1);
  }
}

@keyframes second03 {
  from {
    opacity: 0;
    -webkit-transform: translate(-100px, -2px) scale3d(1.5, 1.5, 1.5);
            transform: translate(-100px, -2px) scale3d(1.5, 1.5, 1.5);
  }
  to {
    opacity: 1;
    -webkit-transform: translate(0px, 0px) scale3d(1, 1, 1);
            transform: translate(0px, 0px) scale3d(1, 1, 1);
  }
}
.anime-second04_js.is-anime {
  -webkit-animation-name: second04;
          animation-name: second04;
}

@-webkit-keyframes second04 {
  from {
    opacity: 0;
    -webkit-transform: translate(60px, 10px) scale3d(1.5, 1.5, 2);
            transform: translate(60px, 10px) scale3d(1.5, 1.5, 2);
  }
  to {
    opacity: 1;
    -webkit-transform: translate(0px, 0px) scale3d(1, 1, 1);
            transform: translate(0px, 0px) scale3d(1, 1, 1);
  }
}

@keyframes second04 {
  from {
    opacity: 0;
    -webkit-transform: translate(60px, 10px) scale3d(1.5, 1.5, 2);
            transform: translate(60px, 10px) scale3d(1.5, 1.5, 2);
  }
  to {
    opacity: 1;
    -webkit-transform: translate(0px, 0px) scale3d(1, 1, 1);
            transform: translate(0px, 0px) scale3d(1, 1, 1);
  }
}
/*===================================================
アニメーションの個別設定
====================================================*/
.delay-05 {
  -webkit-animation-delay: 0.5s;
          animation-delay: 0.5s;
}

@media screen and (min-width: 768px) {
  .delay-05-pc {
    -webkit-animation-delay: 0.5s;
            animation-delay: 0.5s;
  }
}

.delay-10 {
  -webkit-animation-delay: 1s;
          animation-delay: 1s;
}

@media screen and (min-width: 768px) {
  .delay-10-pc {
    -webkit-animation-delay: 1s;
            animation-delay: 1s;
  }
}

.delay-15 {
  -webkit-animation-delay: 1.5s;
          animation-delay: 1.5s;
}

.delay-20 {
  -webkit-animation-delay: 2s;
          animation-delay: 2s;
}

.delay-25 {
  -webkit-animation-delay: 2.5s;
          animation-delay: 2.5s;
}

.delay-30 {
  -webkit-animation-delay: 3s;
          animation-delay: 3s;
}

.delay-40 {
  -webkit-animation-delay: 4s;
          animation-delay: 4s;
}

.duration-10 {
  -webkit-animation-duration: 1s;
          animation-duration: 1s;
}

.duration-15 {
  -webkit-animation-duration: 1.5s;
          animation-duration: 1.5s;
}

.duration-20 {
  -webkit-animation-duration: 2s;
          animation-duration: 2s;
}

/*===================================================
アニメーション名との紐付け（基本設定にまとめても可。トリガーはクラス名も併記。）
====================================================*/
.anime-second01_js,
.anime-second02_js,
.anime-second03_js,
.anime-second04_js,
.anime-fadeIn,
.anime-fadeIn_js,
.anime-fadeUp,
.anime-fadeUp_js,
.anime-popUp,
.anime-popUp_js,
.anime-popUp2,
.anime-jumpIn,
.anime-jumpIn_js {
  opacity: 0;
  z-index: 10;
}

.layer-12 {
  z-index: 12;
}

.layer-15 {
  z-index: 15;
}

.anime-fadeIn {
  -webkit-animation-name: fadeIn;
          animation-name: fadeIn;
}

.anime-fadeIn_js.is-anime {
  -webkit-animation-name: fadeIn;
          animation-name: fadeIn;
}

.anime-fadeUp {
  -webkit-animation-name: fadeUp;
          animation-name: fadeUp;
}

.anime-fadeUp_js.is-anime {
  -webkit-animation-name: fadeUp;
          animation-name: fadeUp;
}

.anime-popUp_js.is-anime {
  -webkit-animation-name: popUp3;
          animation-name: popUp3;
}

.anime-popUp {
  -webkit-animation-name: popUp3;
          animation-name: popUp3;
}

.anime-popUp2 {
  -webkit-animation-name: popUp2;
          animation-name: popUp2;
}

.anime-jump {
  -webkit-animation-name: jump;
          animation-name: jump;
}

.anime-jumpIn {
  -webkit-animation-name: jumpIn;
          animation-name: jumpIn;
}

.anime-jumpIn_js.is-anime {
  -webkit-animation-name: jumpIn2;
          animation-name: jumpIn2;
}

/*===================================================
keyframes
・fadeIn・
・jumpジャンプ

====================================================*/
@-webkit-keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-webkit-keyframes fadeUp {
  from {
    opacity: 0;
    -webkit-transform: translateY(10px);
            transform: translateY(10px);
  }
  to {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
@keyframes fadeUp {
  from {
    opacity: 0;
    -webkit-transform: translateY(10px);
            transform: translateY(10px);
  }
  to {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
@-webkit-keyframes popUp {
  from {
    opacity: 0;
    -webkit-transform: scale(0);
            transform: scale(0);
  }
  to {
    opacity: 1;
    -webkit-transform: scale(1.1);
            transform: scale(1.1);
  }
}
@keyframes popUp {
  from {
    opacity: 0;
    -webkit-transform: scale(0);
            transform: scale(0);
  }
  to {
    opacity: 1;
    -webkit-transform: scale(1.1);
            transform: scale(1.1);
  }
}
@-webkit-keyframes popUp2 {
  0% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
            transform: scale3d(0.3, 0.3, 0.3);
  }
  20% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
            transform: scale3d(1.1, 1.1, 1.1);
  }
  40% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9);
            transform: scale3d(0.9, 0.9, 0.9);
  }
  60% {
    opacity: 1;
    -webkit-transform: scale3d(1.03, 1.03, 1.03);
            transform: scale3d(1.03, 1.03, 1.03);
  }
  80% {
    -webkit-transform: scale3d(0.97, 0.97, 0.97);
            transform: scale3d(0.97, 0.97, 0.97);
  }
  100% {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }
}
@keyframes popUp2 {
  0% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
            transform: scale3d(0.3, 0.3, 0.3);
  }
  20% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
            transform: scale3d(1.1, 1.1, 1.1);
  }
  40% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9);
            transform: scale3d(0.9, 0.9, 0.9);
  }
  60% {
    opacity: 1;
    -webkit-transform: scale3d(1.03, 1.03, 1.03);
            transform: scale3d(1.03, 1.03, 1.03);
  }
  80% {
    -webkit-transform: scale3d(0.97, 0.97, 0.97);
            transform: scale3d(0.97, 0.97, 0.97);
  }
  100% {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }
}
@-webkit-keyframes popUp3 {
  0% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
            transform: scale3d(0.3, 0.3, 0.3);
  }
  30% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
            transform: scale3d(1.1, 1.1, 1.1);
  }
  60% {
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }
  100% {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }
}
@keyframes popUp3 {
  0% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
            transform: scale3d(0.3, 0.3, 0.3);
  }
  30% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
            transform: scale3d(1.1, 1.1, 1.1);
  }
  60% {
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }
  100% {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }
}
@-webkit-keyframes jump {
  0% {
    -webkit-transform: translate(0%, 0%);
            transform: translate(0%, 0%);
  }
  30% {
    -webkit-transform: translate(0%, 0%);
            transform: translate(0%, 0%);
  }
  40% {
    -webkit-transform: translate(0%, 0%);
            transform: translate(0%, 0%);
  }
  50% {
    -webkit-transform: translate(0%, -70%);
            transform: translate(0%, -70%);
  }
  60% {
    -webkit-transform: translate(0%, -120%);
            transform: translate(0%, -120%);
  }
  100% {
    -webkit-transform: translate(0%, 0%);
            transform: translate(0%, 0%);
  }
}
@keyframes jump {
  0% {
    -webkit-transform: translate(0%, 0%);
            transform: translate(0%, 0%);
  }
  30% {
    -webkit-transform: translate(0%, 0%);
            transform: translate(0%, 0%);
  }
  40% {
    -webkit-transform: translate(0%, 0%);
            transform: translate(0%, 0%);
  }
  50% {
    -webkit-transform: translate(0%, -70%);
            transform: translate(0%, -70%);
  }
  60% {
    -webkit-transform: translate(0%, -120%);
            transform: translate(0%, -120%);
  }
  100% {
    -webkit-transform: translate(0%, 0%);
            transform: translate(0%, 0%);
  }
}
@-webkit-keyframes jumpIn {
  0% {
    -webkit-transform: translate(0%, 0%);
            transform: translate(0%, 0%);
  }
  10% {
    opacity: 1;
    -webkit-transform: translate(0%, 1px);
            transform: translate(0%, 1px);
  }
  20% {
    opacity: 1;
    -webkit-transform: translate(0%, -5px);
            transform: translate(0%, -5px);
  }
  40% {
    opacity: 1;
    -webkit-transform: translate(0%, -18px);
            transform: translate(0%, -18px);
  }
  50% {
    opacity: 1;
    -webkit-transform: translate(0%, -20px);
            transform: translate(0%, -20px);
  }
  60% {
    opacity: 1;
    -webkit-transform: translate(0%, -18px);
            transform: translate(0%, -18px);
  }
  70% {
    opacity: 1;
    -webkit-transform: translate(0%, -1px);
            transform: translate(0%, -1px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translate(0%, 0%);
            transform: translate(0%, 0%);
  }
}
@keyframes jumpIn {
  0% {
    -webkit-transform: translate(0%, 0%);
            transform: translate(0%, 0%);
  }
  10% {
    opacity: 1;
    -webkit-transform: translate(0%, 1px);
            transform: translate(0%, 1px);
  }
  20% {
    opacity: 1;
    -webkit-transform: translate(0%, -5px);
            transform: translate(0%, -5px);
  }
  40% {
    opacity: 1;
    -webkit-transform: translate(0%, -18px);
            transform: translate(0%, -18px);
  }
  50% {
    opacity: 1;
    -webkit-transform: translate(0%, -20px);
            transform: translate(0%, -20px);
  }
  60% {
    opacity: 1;
    -webkit-transform: translate(0%, -18px);
            transform: translate(0%, -18px);
  }
  70% {
    opacity: 1;
    -webkit-transform: translate(0%, -1px);
            transform: translate(0%, -1px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translate(0%, 0%);
            transform: translate(0%, 0%);
  }
}
@-webkit-keyframes jumpIn2 {
  0% {
    -webkit-transform: translate(0%, 0%);
            transform: translate(0%, 0%);
  }
  10% {
    opacity: 1;
    -webkit-transform: translate(0%, 0.5px);
            transform: translate(0%, 0.5px);
  }
  20% {
    opacity: 1;
    -webkit-transform: translate(0%, -2px);
            transform: translate(0%, -2px);
  }
  40% {
    opacity: 1;
    -webkit-transform: translate(0%, -12px);
            transform: translate(0%, -12px);
  }
  50% {
    opacity: 1;
    -webkit-transform: translate(0%, -14px);
            transform: translate(0%, -14px);
  }
  60% {
    opacity: 1;
    -webkit-transform: translate(0%, -12px);
            transform: translate(0%, -12px);
  }
  70% {
    opacity: 1;
    -webkit-transform: translate(0%, -0.5px);
            transform: translate(0%, -0.5px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translate(0%, 0%);
            transform: translate(0%, 0%);
  }
}
@keyframes jumpIn2 {
  0% {
    -webkit-transform: translate(0%, 0%);
            transform: translate(0%, 0%);
  }
  10% {
    opacity: 1;
    -webkit-transform: translate(0%, 0.5px);
            transform: translate(0%, 0.5px);
  }
  20% {
    opacity: 1;
    -webkit-transform: translate(0%, -2px);
            transform: translate(0%, -2px);
  }
  40% {
    opacity: 1;
    -webkit-transform: translate(0%, -12px);
            transform: translate(0%, -12px);
  }
  50% {
    opacity: 1;
    -webkit-transform: translate(0%, -14px);
            transform: translate(0%, -14px);
  }
  60% {
    opacity: 1;
    -webkit-transform: translate(0%, -12px);
            transform: translate(0%, -12px);
  }
  70% {
    opacity: 1;
    -webkit-transform: translate(0%, -0.5px);
            transform: translate(0%, -0.5px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translate(0%, 0%);
            transform: translate(0%, 0%);
  }
}
@-webkit-keyframes jump3 {
  0% {
    -webkit-transform: translate(0%, 0%);
            transform: translate(0%, 0%);
  }
  30% {
    -webkit-transform: translate(0%, 0%);
            transform: translate(0%, 0%);
  }
  40% {
    -webkit-transform: translate(0%, 0%);
            transform: translate(0%, 0%);
  }
  50% {
    -webkit-transform: translate(0%, -70%);
            transform: translate(0%, -70%);
  }
  60% {
    -webkit-transform: translate(0%, -120%);
            transform: translate(0%, -120%);
  }
  100% {
    -webkit-transform: translate(0%, 0%);
            transform: translate(0%, 0%);
  }
}
@keyframes jump3 {
  0% {
    -webkit-transform: translate(0%, 0%);
            transform: translate(0%, 0%);
  }
  30% {
    -webkit-transform: translate(0%, 0%);
            transform: translate(0%, 0%);
  }
  40% {
    -webkit-transform: translate(0%, 0%);
            transform: translate(0%, 0%);
  }
  50% {
    -webkit-transform: translate(0%, -70%);
            transform: translate(0%, -70%);
  }
  60% {
    -webkit-transform: translate(0%, -120%);
            transform: translate(0%, -120%);
  }
  100% {
    -webkit-transform: translate(0%, 0%);
            transform: translate(0%, 0%);
  }
}