@charset "utf-8";

.loading {
  background-color: rgba(var(--white-rgb), 1);
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 99;
  transition: background-color .6s ease, height .5s ease .2s, z-index .1s linear .8s;
}
.loading.is-show {
  background-color: rgba(var(--white-rgb), 0);
  height: 0;
  z-index: -99;
}

/* * */

[class*="-inner"].in-view {
  translate: 0 37px;
  opacity: 0;
  transition: opacity .7s ease .5s, translate .6s ease .4s;
}
[class*="-inner"].in-view.is-show {
  translate: 0 0;
  opacity: 1;
}

/* * */

#id-mainvisual .header-inner.in-view .heading-inner .catchcopy-img {
  translate: 0 23px;
  opacity: 0;
}
#id-mainvisual .header-inner.in-view .heading-inner .catchcopy-img {
  transition: opacity .7s ease .4s, translate .6s ease .5s;
}
#id-mainvisual .header-inner.in-view.is-show .heading-inner .catchcopy-img {
  translate: 0 0;
  opacity: 1;
}

/* * */
#id-mainvisual .article-body .box-inner.in-view .icon-circle {
  translate: 0 23px;
  opacity: 0;
}
#id-mainvisual .article-body .box-inner.in-view .icon-1st {
  transition: opacity 1.2s ease .5s, translate 1s ease .5s;
}
#id-mainvisual .article-body .box-inner.in-view .icon-2nd {
  transition: opacity 1.2s ease 1.0s, translate 1s ease 1.0s;
}
#id-mainvisual .article-body .box-inner.in-view .icon-3rd {
  transition: opacity 1.2s ease 1.5s, translate 1s ease 1.5s;
}
#id-mainvisual .article-body .box-inner.in-view.is-show .icon-circle {
  translate: 0 0;
  opacity: 1;
}