/**
 * スクロールアニメーション用スタイル
 */

/* フェードイン */

.js-fade-in {
  opacity: 0;
  transition: opacity .7s ease-in-out;
}
.js-fade-in.is-active {
  opacity: 1;
}

/* 上から出現 */

.js-fade-up {
  opacity: 0;
  translate: 0 10px;
  transition: opacity .7s ease-in-out, translate .7s ease-in-out;
}
.js-fade-up.is-active {
  opacity: 1;
  translate: 0 0;
}

/* 画像 */

.js-scaleImg {
  overflow: hidden;
}
.js-scaleImg img {
  scale: 1;
  transition: scale 1.2s ease-in-out, opacity 1.2s ease-in-out, transform .7s ease;
  opacity: 0;
}
.js-scaleImg.is-active img {
  scale: 1.05;
  opacity: 1;
}

/* トップ：リード文 */

.js-top-lead-text.top-lead__text::after {
 height: 0;
 transition: height 1.1s linear;
 will-change: height;
}

.js-top-lead-text.is-active::after {
  height: 224px;
}

@media (max-width: 767px) {
  .js-top-lead-text.is-active::after {
    height: 127px;
  }
}

.js-top-lead-text span {
  transform: scale(0.99);
  opacity: 0;
  transition: opacity 1.1s ease-in, transform 1.1s ease-in;
  transform-origin: center;
  will-change: transform, opacity;
}
.js-top-lead-text.is-active span:nth-child(1) {
  opacity: 1;
  transition-delay: 0.3s;
  transform: scale(1);
}
.js-top-lead-text.is-active span:nth-child(2) {
  opacity: 1;
  transition-delay: 0.6s;
  transform: scale(1);
}

@media (max-width: 767px) {
  .js-top-lead-text.is-active.top-lead__text::after {
    transition-delay: .8s;
   }
  .js-top-lead-text.is-active span:nth-child(1) {
    transition-delay: 1.1s;
  }
  .js-top-lead-text.is-active span:nth-child(2) {
    transition-delay: 1.4s;
  }
}

/* FEATURE セクション */

.js-top-feature .top-feature__img-wrap {
  overflow: hidden;
}
.js-top-feature .top-feature__img-wrap img {
  scale: 1;
  transition: scale 1.1s ease-in-out, opacity 1.1s ease-in-out, transform .7s ease;
  opacity: 0;
}
.js-top-feature.is-active .top-feature__img-wrap img {
  scale: 1.05;
  opacity: 1;
}
@media (max-width: 767px) {
  .js-top-feature .top-feature__img-wrap img {
    transition-delay: 0.9s;
  }
}
.js-top-feature .top-feature__headline::before {
  width: 40px;
  opacity: 0;
  transition: width 1.1s ease-in-out, opacity 1.1s ease-in-out;
  will-change: width;
}

@media (max-width: 767px) {
  .js-top-feature .top-feature__headline::before {
    transition-delay: 0s;
  }
}


.js-top-feature.is-active .top-feature__headline::before {
  width: 135px;
  opacity: 1;
}

@media (max-width: 767px) {
  .js-top-feature.is-active .top-feature__headline::before {
    width: 90px;
    opacity: 1;
  }
}

.js-top-feature .top-feature__label {
  opacity: 0;
  transition: opacity 1.1s ease-in-out;
  will-change: opacity;
  transition-delay: 0.4s;
}

@media (max-width: 767px) {
  .js-top-feature .top-feature__label {
    transition-delay: 0.4s;
  }
}
.js-top-feature.is-active .top-feature__label {
  opacity: 1;
}

.js-top-feature .top-feature__text {
  opacity: 0;
  transition: opacity 1.1s ease-in-out;
  will-change: opacity;
  transition-delay: 0.6s;
}

@media (max-width: 767px) {
  .js-top-feature .top-feature__text {
    transition-delay: 0.6s;
  }
}
.js-top-feature.is-active .top-feature__text {
  opacity: 1;
}

.js-top-feature .top-feature__btn {
  opacity: 0;
  transition: opacity 1.1s ease-in-out;
  will-change: opacity;
  transition-delay: 0.9s;
}

@media (max-width: 767px) {
  .js-top-feature .top-feature__btn {
    transition-delay: 1.3s;
  }
}
.js-top-feature.is-active .top-feature__btn {
  opacity: 1;
}

/* 会社紹介セクション */

.js-top-company .top-company__img-wrap {
  overflow: hidden;
}
.js-top-company .top-company__img-wrap img {
  scale: 1;
  transition: scale 1.1s ease-in-out, opacity 1.1s ease-in-out, transform .7s ease;
  opacity: 0;
}
.js-top-company.is-active .top-company__img-wrap img {
  scale: 1.05;
  opacity: 1;
}
@media (max-width: 767px) {
  .js-top-company .top-company__img-wrap img {
    transition-delay: 0.9s;
  }
}
.js-top-company .top-company__headline::before {
  width: 40px;
  opacity: 0;
  transition: width 1.1s ease-in-out, opacity 1.1s ease-in-out;
  will-change: width;
}

@media (max-width: 767px) {
  .js-top-company .top-company__headline::before {
    transition-delay: 0s;
  }
}


.js-top-company.is-active .top-company__headline::before {
  width: 135px;
  opacity: 1;
}

@media (max-width: 767px) {
  .js-top-company.is-active .top-company__headline::before {
    width: 90px;
  }
}

.js-top-company .top-company__label {
  opacity: 0;
  transition: opacity 1.1s ease-in-out;
  will-change: opacity;
  transition-delay: 0.5s;
}

@media (max-width: 767px) {
  .js-top-company .top-company__label {
    transition-delay: 0.4s;
  }
}
.js-top-company.is-active .top-company__label {
  opacity: 1;
}

.js-top-company .top-company__text {
  opacity: 0;
  transition: opacity 1.1s ease-in-out;
  will-change: opacity;
  transition-delay: 0.8s;
}

@media (max-width: 767px) {
  .js-top-company .top-company__text {
    transition-delay: 0.6s;
  }
}
.js-top-company.is-active .top-company__text {
  opacity: 1;
}

.js-top-company .top-company__btn {
  opacity: 0;
  transition: opacity 1.1s ease-in-out;
  will-change: opacity;
  transition-delay: 1.1s;
}

@media (max-width: 767px) {
  .js-top-company .top-company__btn {
    transition-delay: 1.3s;
  }
}
.js-top-company.is-active .top-company__btn {
  opacity: 1;
}

/* メインビジュアル */

.js-mv .mv__img {
  scale: 1;
  opacity: 0;
  transition: scale 1.1s ease-in-out, opacity 1.1s ease-in-out;
}

.js-mv.is-active .mv__img {
  scale: 1.02;
  opacity: 1;
}