@charset "utf-8";
/* 「ドバイ特集 全ページ」PCSP共通CSS アニメーション設定 */
/*------------------------------------------------*/
/*MV*/
.mv__catch.js-scroll-animation {
  opacity: 0;
  transition: opacity 2s linear;
  transition-delay: 1s;
}
.mv__catch.js-scroll-animation:is(.is-animation-active, .is-first-view) {
  opacity: 1;
}
.mv__name.js-scroll-animation .mv__name--text, .mv__name.js-scroll-animation::after {
  opacity: 0;
}
.mv__name.js-scroll-animation .mv__name--text {
  transform: translateY(.5em);
  transition: opacity 1s linear 2.5s, transform 2s ease 2s;
}
.mv__name.js-scroll-animation::after {
  transition: opacity 2s linear 2s;
}
.mv__name.js-scroll-animation:is(.is-animation-active, .is-first-view) .mv__name--text, .mv__name.js-scroll-animation:is(.is-animation-active, .is-first-view)::after {
  opacity: 1;
}
.mv__name.js-scroll-animation:is(.is-animation-active, .is-first-view) .mv__name--text {
  transform: translateY(0);
}
.mv__lead.js-scroll-animation {
  opacity: 0;
  transform: translateY(.5em);
  transition: opacity 1s linear, transform 1s ease;
}
#pageApp.is-top .mv__lead.js-scroll-animation.is-first-view,
#pageApp:not(.is-top) .mv__lead.js-scroll-animation {
  transition-delay: 4s;
}
#pageApp.is-top .mv__lead + .mv__lead.is-image.js-scroll-animation.is-first-view,
#pageApp:not(.is-top) .mv__lead + .mv__lead.is-image.js-scroll-animation {
  transition-delay: 5s;
}
.mv__lead.js-scroll-animation:is(.is-animation-active, .is-first-view) {
  opacity: 1;
  transform: translateY(0);
}
.mv__scroll.js-scroll-animation {
  opacity: 0;
  transition: opacity 1.5s linear;
}
.mv__scroll.js-scroll-animation:is(.is-animation-active, .is-first-view) .mv__scroll--border::after {
  animation: name-down 1.2s linear infinite;
  animation-delay: 1.5s;
}
.mv__scroll.js-scroll-animation.is-first-view {
  transition-delay: 6.5s;
}
.mv__scroll.js-scroll-animation.is-first-view .mv__scroll--border::after {
  animation-delay: 8s;
}
.mv__scroll.js-scroll-animation:is(.is-animation-active, .is-first-view) {
  opacity: 1;
}
/*下層：MV内ナビ・セクションナビ*/
.mv__navi.js-scroll-animation,
.section__navi.js-scroll-animation {
  opacity: 0;
  transition: opacity 1.5s linear;
}
.mv__navi.js-scroll-animation {
  transition-delay: 5s;
}
.mv__navi.js-scroll-animation:is(.is-animation-active, .is-first-view),
.section__navi.js-scroll-animation.is-animation-active {
  opacity: 1;
}
/*TOP：ドバイで何する！？*/
.facility__detail.js-scroll-animation .section__title {
  opacity: 0;
  transform: translateY(1em);
  transition: opacity .5s linear, transform .5s ease;
}
.facility__detail.js-scroll-animation.is-animation-active .section__title {
  opacity: 1;
  transform: translateY(0);
}
.facility__detail.js-scroll-animation .facility__list--item {
  opacity: 0;
  transform: translateX(-1em);
  transition: opacity 1s linear, transform 1.5s ease-out;
  transition-delay: .5s;
}
.facility__detail.js-scroll-animation .facility__list--item:nth-child(2) {
  transform: translateX(-1.5em);
}
.facility__detail.js-scroll-animation .facility__list--item:nth-child(3) {
  transform: translateX(-2em);
}
.facility__detail.js-scroll-animation.is-animation-active .facility__list--item {
  opacity: 1;
  transform: translateX(0);
}
/*下層：block__detail*/
#spot .section__block.js-scroll-animation::before, 
.section__block.js-scroll-animation .block__detail:not([data-kazari=""])::after, 
.section__block.js-scroll-animation .block__images, 
.block__texts.js-scroll-animation,
:is(#standard-spot,#hotel) .section__block.js-scroll-animation {
  opacity: 0;
  transition: opacity 1s ease, transform .9s ease;
  transition-delay: 0s;
}


/*#spot .section__block.js-scroll-animation.is-first-view::before, 
.section__block.js-scroll-animation.is-first-view .block__detail:not([data-kazari=""])::after, 
.section__block.js-scroll-animation.is-first-view .block__images,
#standard-spot .section__block.js-scroll-animation.is-first-view,
#hotel .section__navi.js-scroll-animation.is-first-view {
  transition-delay: 30s;
}
#spot .section__block.js-scroll-animation:not(.is-first-view)::before, 
.section__block.js-scroll-animation:not(.is-first-view) .block__detail:not([data-kazari=""])::after, 
.section__block.js-scroll-animation:not(.is-first-view) .block__images,
#standard-spot .section__block.js-scroll-animation:not(.is-first-view),
#hotel .section__navi.js-scroll-animation:not(.is-first-view) {
  transition-delay: 0s !important;
}*/
.is-pc #spot .section__block.js-scroll-animation::before {
  transform: translateX(-10%);
}
 .section__block.js-scroll-animation .block__detail:not([data-kazari=""])::after {
  transform: translateX(-.5em);
}
.section__block.js-scroll-animation .block__images {
  transform: translateX(1em);
}
.is-sp #spot .section__block.js-scroll-animation::before {
  transform: translateY(3em);
}
.block__texts.js-scroll-animation,
:is(#standard-spot,#hotel) .section__block.js-scroll-animation {
  transform: translateY(1em);
}
#spot .section__block.js-scroll-animation.is-animation-active::before,
.section__block.js-scroll-animation.is-animation-active .block__detail:not([data-kazari=""])::after,
.section__block.js-scroll-animation.is-animation-active .block__images,
.block__texts.js-scroll-animation.is-animation-active,
:is(#standard-spot,#hotel) .section__block.js-scroll-animation.is-animation-active {
  opacity: 1;
  transform: translate(0);
}


/*------------------------------------------------*/
@keyframes name-down {
  0% {
    top: 0;
  }
  100% {
    top: 100%;
  }
}
/**/