@charset "UTF-8";
html body #page-wrap #page-header {
  position: fixed;
  z-index: 999;
  width: 100%;
}
html body #page-wrap .page-content .front {
  position: relative; /*h1の中央寄せ配置の起点とするためのrelative*/
  height: 100vh; /*高さを全画面にあわせる*/
}
html body #page-wrap .page-content .front .banner_area_smp {
  display: none;
}
html body #page-wrap .page-content .front .banner_area_pc img {
  width: 100%;
}
html body #page-wrap .page-content .front #video-area {
  position: fixed;
  z-index: -1; /*最背面に設定*/
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  overflow: hidden;
}
html body #page-wrap .page-content .front #video {
  /*天地中央配置*/
  position: absolute;
  z-index: -1;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  /*縦横幅指定*/
  width: 177.77777778vh; /* 16:9 の幅→16 ÷ 9＝ 177.77% */
  height: 56.25vw; /* 16:9の幅 → 9 ÷ 16 = 56.25% */
  min-height: 100%;
  min-width: 100%;
}
html body #page-wrap .page-content .main-content {
  background-color: transparent !important;
}
@media screen and (max-width: 767px) {
  html body .page-content .front .banner_area_pc {
    display: none;
  }
  html body .page-content .front .banner_area_smp {
    display: block !important;
  }
  html body .page-content .front .banner_area_smp img {
    width: 100%;
  }
}