@charset "UTF-8";
/**
 * The following styles get applied both on the front of your site
 * and in the editor.
 *
 * Replace them with your own styles or remove the file completely.
 */
.opening_check {
  position: fixed;
  z-index: 200;
  bottom: 3em;
  right: 3em;
}

/**
 * The following styles get applied both on the front of your site
 * and in the editor.
 *
 * Replace them with your own styles or remove the file completely.
 */
:root {
  --custom-easing: cubic-bezier(.34, .1, .85, 1.04);
}

.wp-block-itmar-logo-anime {
  /*=============== 全ブロック共通 =================*/
  /*=============== 全ブロック共通 =================*/
  position: fixed !important;
  top: 0;
  left: 0;
  background: transparent;
  color: #ffffff;
  width: 100vw;
  height: 100vh;
  z-index: 50;
  /* Loading背景画面　*/
  /* Loading画像中央配置　*/
  /*画面遷移アニメーション*/
  /*=============== logo-animeブロック内の指定 =================*/
  /*アニメーション後に.doneというクラス名がで付与された時の指定*/
}
.wp-block-itmar-logo-anime #splash {
  /*fixedで全面に固定*/
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  z-index: 1000;
  text-align: center;
  display: none;
}
.wp-block-itmar-logo-anime #splash.disappear {
  opacity: 0;
}
.wp-block-itmar-logo-anime #splash_logo {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  transition: opacity 1s ease 0.8s;
}
.wp-block-itmar-logo-anime #splash_logo.disappear {
  opacity: 0;
}
.wp-block-itmar-logo-anime .fixbg {
  display: block;
  position: fixed;
  z-index: 990;
  width: 100%;
  height: 100vh;
  top: 0;
  left: 0;
  background-color: #fff;
  transition: opacity 1s ease 0.6s;
  opacity: 1;
  /*フェードアウト*/
  /*非表示*/
}
.wp-block-itmar-logo-anime .fixbg.disappear {
  opacity: 0;
}
.wp-block-itmar-logo-anime .fixbg.hide {
  display: none;
}
.wp-block-itmar-logo-anime .splashbg,
.wp-block-itmar-logo-anime .splashbg2 {
  display: none;
}
.wp-block-itmar-logo-anime .splashbg.appear,
.wp-block-itmar-logo-anime .splashbg2.appear {
  display: block;
  position: fixed;
  z-index: 999;
  width: 100%;
  height: 100vh;
  /*伸びる背景色の設定*/
  -webkit-animation-duration: 1.2s;
          animation-duration: 1.2s;
  -webkit-animation-timing-function: ease-in-out;
          animation-timing-function: ease-in-out;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
}
.wp-block-itmar-logo-anime .splashbg.appear.virtical_slide,
.wp-block-itmar-logo-anime .splashbg2.appear.virtical_slide {
  top: 0;
  left: 0;
  transform: scaleY(0);
  -webkit-animation-name: virtical_open;
          animation-name: virtical_open;
}
.wp-block-itmar-logo-anime .splashbg.appear.horizen_slide,
.wp-block-itmar-logo-anime .splashbg2.appear.horizen_slide {
  top: 0;
  left: 0;
  transform: scaleX(0);
  -webkit-animation-name: horizen_open;
          animation-name: horizen_open;
}
.wp-block-itmar-logo-anime .splashbg.appear.virtical_open,
.wp-block-itmar-logo-anime .splashbg2.appear.virtical_open {
  -webkit-animation-name: top_open;
          animation-name: top_open;
  -webkit-animation-duration: 1.4s;
          animation-duration: 1.4s;
  left: 0;
  bottom: 50%;
  transform: scaleY(1);
}
.wp-block-itmar-logo-anime .splashbg.appear.horizen_open,
.wp-block-itmar-logo-anime .splashbg2.appear.horizen_open {
  -webkit-animation-name: left_open;
          animation-name: left_open;
  -webkit-animation-duration: 1.8s;
          animation-duration: 1.8s;
  top: 0;
  right: 50%;
  transform: scaleX(1);
}
.wp-block-itmar-logo-anime .splashbg2.appear.virtical_open {
  -webkit-animation-name: bottom_open;
          animation-name: bottom_open;
  -webkit-animation-duration: 1.4s;
          animation-duration: 1.4s;
  left: 0;
  top: 50%;
  transform: scaleY(1);
}
.wp-block-itmar-logo-anime .splashbg2.appear.horizen_open {
  -webkit-animation-name: right_open;
          animation-name: right_open;
  -webkit-animation-duration: 1.4s;
          animation-duration: 1.4s;
  top: 0;
  left: 50%;
  transform: scaleX(1);
}
.wp-block-itmar-logo-anime .splashCirclebg {
  display: none;
  position: fixed;
  transform: scale(100);
  /*伸びる背景色の設定*/
  z-index: 999;
  /*丸のスタートの形状*/
  top: calc(50% - 1rem);
  /*50%から円の半径を引いた値*/
  left: calc(50% - 1rem);
  /*50%から円の半径を引いた値*/
  width: 2rem;
  height: 2rem;
}
.wp-block-itmar-logo-anime .splashCirclebg.appear {
  display: block;
  border-radius: 50%;
  -webkit-animation-name: scale_down;
          animation-name: scale_down;
  -webkit-animation-duration: 1s;
          animation-duration: 1s;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
}
@-webkit-keyframes scale_down {
  0% {
    /*丸のスタート位置と形状*/
    transform: scale(100);
  }
  100% {
    /*丸の終了位置と形状*/
    transform: scale(0);
    display: none;
    /*終了時は消える*/
  }
}
@keyframes scale_down {
  0% {
    /*丸のスタート位置と形状*/
    transform: scale(100);
  }
  100% {
    /*丸の終了位置と形状*/
    transform: scale(0);
    display: none;
    /*終了時は消える*/
  }
}
@-webkit-keyframes virtical_open {
  0% {
    transform-origin: top;
    transform: scaleY(0);
  }
  50% {
    transform-origin: top;
    transform: scaleY(1);
  }
  50.001% {
    transform-origin: bottom;
  }
  100% {
    transform-origin: bottom;
    transform: scaleY(0);
  }
}
@keyframes virtical_open {
  0% {
    transform-origin: top;
    transform: scaleY(0);
  }
  50% {
    transform-origin: top;
    transform: scaleY(1);
  }
  50.001% {
    transform-origin: bottom;
  }
  100% {
    transform-origin: bottom;
    transform: scaleY(0);
  }
}
@-webkit-keyframes horizen_open {
  0% {
    transform-origin: right;
    transform: scaleX(0);
  }
  50% {
    transform-origin: right;
    transform: scaleX(1);
  }
  50.001% {
    transform-origin: left;
  }
  100% {
    transform-origin: left;
    transform: scaleX(0);
  }
}
@keyframes horizen_open {
  0% {
    transform-origin: right;
    transform: scaleX(0);
  }
  50% {
    transform-origin: right;
    transform: scaleX(1);
  }
  50.001% {
    transform-origin: left;
  }
  100% {
    transform-origin: left;
    transform: scaleX(0);
  }
}
@-webkit-keyframes top_open {
  0% {
    transform-origin: top;
    transform: scaleY(1);
  }
  100% {
    transform-origin: top;
    transform: scaleY(0);
  }
}
@keyframes top_open {
  0% {
    transform-origin: top;
    transform: scaleY(1);
  }
  100% {
    transform-origin: top;
    transform: scaleY(0);
  }
}
@-webkit-keyframes bottom_open {
  0% {
    transform-origin: bottom;
    transform: scaleY(1);
  }
  100% {
    transform-origin: bottom;
    transform: scaleY(0);
  }
}
@keyframes bottom_open {
  0% {
    transform-origin: bottom;
    transform: scaleY(1);
  }
  100% {
    transform-origin: bottom;
    transform: scaleY(0);
  }
}
@-webkit-keyframes left_open {
  0% {
    transform-origin: left;
    transform: scaleX(1);
  }
  100% {
    transform-origin: left;
    transform: scaleX(0);
  }
}
@keyframes left_open {
  0% {
    transform-origin: left;
    transform: scaleX(1);
  }
  100% {
    transform-origin: left;
    transform: scaleX(0);
  }
}
@-webkit-keyframes right_open {
  0% {
    transform-origin: right;
    transform: scaleX(1);
  }
  100% {
    transform-origin: right;
    transform: scaleX(0);
  }
}
@keyframes right_open {
  0% {
    transform-origin: right;
    transform: scaleX(1);
  }
  100% {
    transform-origin: right;
    transform: scaleX(0);
  }
}
.wp-block-itmar-logo-anime #logo_anime path {
  fill-opacity: 0;
  /*fillは透過度0で見えない状態*/
  stroke-opacity: 1;
  /*strokeは透過度1で見える状態*/
  transition: fill-opacity 0.5s;
  /*カラーがつく際のアニメーション0.5秒で変化*/
}
.wp-block-itmar-logo-anime #logo_anime.done path {
  stroke-opacity: 0;
  /*透過度0で見えない状態*/
  fill-opacity: 1;
  /*透過1で見える状態*/
  stroke: none;
}
/*# sourceMappingURL=style.css.map */