@charset "utf-8";

.slide-img {
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  overflow: hidden
}

/* ページ遷移 */
body::after {
  content: '';
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #fff;
  /* 背景カラー */
  z-index: 9999;
  /* 一番手前に */
  pointer-events: none;
  /* 他の要素にアクセス可能にするためにポインターイベントは無効に */
  opacity: 0;
  /* 初期値では非表示 */
  -webkit-transition: opacity 1s ease;
  /* アニメーション時間は 1秒 */
  -ms-transition: opacity 1s ease;
  -moz-transition: opacity 1s ease;
  transition: opacity 1s ease;
}


/*body要素に.fadeoutセレクタがある場合には、レイヤーが表示されるようにopacityを１に設定します。*/

body.fadeout::after {
  opacity: 1;
}



/* 背景スライド */
@-webkit-keyframes zoomUp {
  0% {
    -webkit-transform: scale(1) rotate(0.1deg);
    transform: scale(1) rotate(0.1deg);
  }

  100% {
    -webkit-transform: scale(1.3);
    transform: scale(1.3) rotate(0.1deg);
  }
}

@keyframes zoomUp {

  /*1.15倍させる指定*/
  0% {
    -webkit-transform: scale(1) rotate(0.1deg);
    transform: scale(1) rotate(0.1deg);
  }

  100% {
    -webkit-transform: scale(1.3) rotate(0.1deg);
    transform: scale(1.3) rotate(0.1deg);
  }
}

.swiper-slide-active .slide-img,
.swiper-slide-duplicate-active .slide-img,
.swiper-slide-prev .slide-img {
  /*12秒かけて拡大させる*/
  -webkit-animation: zoomUp 12s linear 0s;
  animation: zoomUp 12s linear 0s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

.slide-img {
  background-size: cover;
  background-position: center center;
  height: 100%;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  overflow: hidden;
  transform: rotate(0.0001deg);
}



/* テキストアニメーション */
.main__visual--content .content__logo img {
  opacity: 0;
  transform: scale(1.1) rotate(0.0001deg);
  transform-origin: 50% 50%;
}

.main__visual--content.animation-on .content__logo img {
  opacity: 1;
  transform: scale(1) rotate(0.0001deg);
  transition: 2s;
  transition-delay: .5s;
}



.main__visual--content .content__text span {
  display: inline-block;
  opacity: 0;
  transform: translateY(10px) rotate(0.0001deg);
}

.main__visual--content.animation-on .content__text span {
  opacity: 1;
  transform: translateY(0) rotate(0.0001deg);
  transition: 1s;
}


.main__visual--content.animation-on .content__text span:nth-child(1) {
  /*一文字ずつ遅延させる*/
  transition-delay: 0.1s;
}

.main__visual--content.animation-on .content__text span:nth-child(2) {
  transition-delay: 0.2s;
}

.main__visual--content.animation-on .content__text span:nth-child(3) {
  transition-delay: 0.3s;
}

.main__visual--content.animation-on .content__text span:nth-child(4) {
  transition-delay: 0.4s;
}

.main__visual--content.animation-on .content__text span:nth-child(5) {
  transition-delay: 0.5s;
}

.main__visual--content.animation-on .content__text span:nth-child(6) {
  transition-delay: 0.6s;
}

.main__visual--content.animation-on .content__text span:nth-child(7) {
  transition-delay: 0.7s;
}

.main__visual--content.animation-on .content__text span:nth-child(8) {
  transition-delay: 0.8s;
}

.main__visual--content.animation-on .content__text span:nth-child(9) {
  transition-delay: 0.9s;
}

.main__visual--content.animation-on .content__text span:nth-child(10) {
  transition-delay: 1.0s;
}

.main__visual--content.animation-on .content__text span:nth-child(11) {
  transition-delay: 1.1s;
}

.main__visual--content.animation-on .content__text span:nth-child(12) {
  transition-delay: 1.2s;
}

.main__visual--content.animation-on .content__text span:nth-child(13) {
  transition-delay: 1.3s;
}

.main__visual--content.animation-on .content__text span:nth-child(14) {
  transition-delay: 1.4s;
}

.main__visual--content.animation-on .content__text span:nth-child(15) {
  transition-delay: 1.5s;
}

.main__visual--content.animation-on .content__text span:nth-child(16) {
  transition-delay: 1.6s;
}





/* 各ページタイトル */
/* ページタイトル出現 */
.page-title {
  transform: translateY(30px);
  opacity: 0;
}

.page-title.animation-on {
  transform: translateY(0px);
  opacity: 1;
  transition: .6s;
  transition-delay: .6s;
}

/* ページタイトル下線 */
.page-title:after {
  transform-origin: 50% 50%;
  width: 0px !important;
}

.page-title.animation-on:after {
  width: 100px !important;
  transition: .3s;
  transition-delay: 1.2s;
}

/* TOP */
.top-contents.scroll-animation .title {
  transform: translateX(-100%);
  opacity: 0;
}

.top-contents.scroll-animation.animation-on .title {
  transform: translateX(0);
  opacity: 1;
  transition: .6s;
  transition-delay: .6s;
}

.top-contents.scroll-animation:nth-of-type(odd) .title {
  transform: translateX(100%);
  opacity: 0;
}

.top-contents.scroll-animation:nth-of-type(odd).animation-on .title {
  transform: translateX(0);
  opacity: 1;
  transition: .6s;
  transition-delay: .6s;
}

.top-contents.scroll-animation .title--content {
  transform: translateY(30px);
  opacity: 0;
}

.top-contents.scroll-animation.animation-on .title--content {
  transform: translateY(0);
  opacity: 1;
  transition: .6s;
  transition-delay: 1.2s;
}




/* COMPANY */
#catchCopy.scroll-animation {
  transform: translateY(30px);
  opacity: 0;
}

#catchCopy.scroll-animation.animation-on {
  transform: translateY(0px);
  opacity: 1;
  transition: .6s;
  transition-delay: .6s;
}


/* SERVICE */

#leaseback.scroll-animation .services__text,
#consulting.scroll-animation .services__text {
  transform: translate(100px, -50%);
  opacity: 0;
}

#realEstate__purchase.scroll-animation .services__image,
#sale__agent.scroll-animation .services__image {
  transform: translateX(100px);
  opacity: 0;
}

#realEstate__purchase.scroll-animation.animation-on .services__image,
#leaseback.scroll-animation.animation-on .services__image,
#sale__agent.scroll-animation.animation-on .services__image,
#consulting.scroll-animation.animation-on .services__image {
  transform: translateX(0px);
  opacity: 1;
  transition: .6s;
  transition-delay: .6s;
}

#leaseback.scroll-animation .services__image,
#consulting.scroll-animation .services__image {
  transform: translateX(-100px);
  opacity: 0;
}

#realEstate__purchase.scroll-animation .services__text,
#sale__agent.scroll-animation .services__text {
  transform: translate(-100px, -50%);
  opacity: 0;
}

#realEstate__purchase.scroll-animation.animation-on .services__text,
#leaseback.scroll-animation.animation-on .services__text,
#sale__agent.scroll-animation.animation-on .services__text,
#consulting.scroll-animation.animation-on .services__text {
  transform: translate(0px, -50%);
  opacity: 1;
  transition: .6s;
  transition-delay: .6s;
}

@media screen and (max-width:640px) {

  #leaseback.scroll-animation .services__text,
  #consulting.scroll-animation .services__text {
    transform: translate(100px, 0);
    opacity: 0;
  }

  #realEstate__purchase.scroll-animation .services__text,
  #sale__agent.scroll-animation .services__text {
    transform: translate(-100px, 0);
    opacity: 0;
  }

  #leaseback.scroll-animation.animation-on .services__text,
  #realEstate__purchase.scroll-animation.animation-on .services__text,
  #sale__agent.scroll-animation.animation-on .services__text,
  #consulting.scroll-animation.animation-on .services__text {
    transform: translate(0px, 0);
    opacity: 1;
    transition: .6s;
    transition-delay: .6s;
  }


}


/* WORKS */
.works__article.scroll-animation:nth-child(odd) .works__article--text {
  transform: translate(-100px, -50%);
  opacity: 0;
}

.works__article.scroll-animation:nth-child(even) .works__article--image {
  transform: translateX(-100px);
  opacity: 0;
}

.works__article.scroll-animation.animation-on:nth-child(odd) .works__article--text {
  transform: translate(0px, -50%);
  opacity: 1;
  transition: .6s;
  transition-delay: .6s;
}

.works__article.scroll-animation.animation-on:nth-child(even) .works__article--image {
  transform: translateX(0px);
  opacity: 1;
  transition: .6s;
  transition-delay: .6s;
}

.works__article.scroll-animation:nth-child(even) .works__article--text {
  transform: translate(100px, -50%);
  opacity: 0;
}

.works__article.scroll-animation:nth-child(odd) .works__article--image {
  transform: translateX(100px);
  opacity: 0;
}

.works__article.scroll-animation.animation-on:nth-child(even) .works__article--text {
  transform: translate(0px, -50%);
  opacity: 1;
  transition: .6s;
  transition-delay: .6s;
}

.works__article.scroll-animation.animation-on:nth-child(odd) .works__article--image {
  transform: translateX(0px);
  opacity: 1;
  transition: .6s;
  transition-delay: .6s;
}


@media screen and (max-width:1024px) {
  .works__article.scroll-animation:nth-child(odd) .works__article--text {
    transform: translate(-100px, 0);
    opacity: 0;
  }

  .works__article.scroll-animation.animation-on:nth-child(odd) .works__article--text {
    transform: translate(0px, 0);
    opacity: 1;
    transition: .6s;
    transition-delay: .6s;
  }

  .works__article.scroll-animation:nth-child(even) .works__article--text {
    transform: translate(100px, 0);
    opacity: 0;
  }

  .works__article.scroll-animation.animation-on:nth-child(even) .works__article--text {
    transform: translate(0px, 0);
    opacity: 1;
    transition: .6s;
    transition-delay: .6s;
  }
}