@charset "utf-8";

/* ---------------------------------------------------
 * base
/* ---------------------------------------------------*/

html {
  font-size: 62.5%; /*適宜変更お願いします*/
  width: 100%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

body {
  text-align: center;
  font-size: 10px;
  font-family: "Noto Sans JP", YuGothic, "Yu Gothic", "ヒラギノ角ゴシック",
    "Hiragino Sans", sans-serif;
  color: #000000;
  line-height: 1.75;
  width: 100%;
  background-color: #fff;
  font-weight: 400; /*適宜変更お願いします*/
  font-feature-settings: "palt" 1; /*自動カーニング*/
}

img {
  max-width: 100%;
  height: auto;
}

a {
  color: #fff;
}

a:hover {
  /*opacity: 0.8;*/
  text-decoration: none;
}

p {
  text-align: justify;
  hanging-punctuation: allow-end; /*文字のぶら下げ*/
}

#footer {
  text-align: center;
  font-size: 1.2em;
  padding: 1em;
}
#footer a {
  color: #000000;
}

/* ---------------------------------------------------
 * common（PC　min-width: 1023px）
/* ---------------------------------------------------*/
.wrap {
  width: 2000px;
  max-width: 100%;
}
#wrap0 {
  overflow: hidden;
}

#container {
  max-width: 1100px;
  margin-left: auto;
  margin-right: auto;
  position: relative;
}

/*背景画像を指定*/
section#section-01 {
  background: url(../img_pc/section_01.webp) no-repeat top center;
}
section#section-02 {
  background: url(../img_pc/section_02.webp) no-repeat top center;
}
section#section-03 {
  background: url(../img_pc/section_03.webp) no-repeat top center;
}
section#section-04 {
  background: url(../img_pc/section_04.webp) no-repeat top center;
}
section#section-05 {
  background: url(../img_pc/section_05.webp) no-repeat top center;
}
section#section-06 {
  background: url(../img_pc/section_06.webp) no-repeat top center;
}
section#section-07 {
  background: url(../img_pc/section_07.webp) no-repeat top center;
}
section#section-08 {
  background: url(../img_pc/section_08.webp) no-repeat top center;
}
section#section-09 {
  background: url(../img_pc/section_09.webp) no-repeat top center;
}
section#section-10 {
  background: url(../img_pc/section_10.webp) no-repeat top center;
}

/*背景画像を指定*/
section#section-11 {
  background: url(../img_pc/section_11.webp) no-repeat top center;
}
section#section-12 {
  background: url(../img_pc/section_12.webp) no-repeat top center;
}
section#section-13 {
  background: url(../img_pc/section_13.webp) no-repeat top center;
}
section#section-14 {
  background: url(../img_pc/section_14.webp) no-repeat top center;
}
section#section-15 {
  background: url(../img_pc/section_15.webp) no-repeat top center;
}
section#section-16 {
  background: url(../img_pc/section_16.webp) no-repeat top center;
}
section#section-17 {
  background: url(../img_pc/section_17.webp) no-repeat top center;
}
section#section-18 {
  background: url(../img_pc/section_18.webp) no-repeat top center;
}
section#section-19 {
  background: url(../img_pc/section_19.webp) no-repeat top center;
}
section#section-20 {
  background: url(../img_pc/section_20.webp) no-repeat top center;
}

/*背景画像を指定*/
section#section-21 {
  background: url(../img_pc/section_21.webp) no-repeat top center;
}
section#section-22 {
  background: url(../img_pc/section_22.webp) no-repeat top center;
}
section#section-23 {
  background: url(../img_pc/section_23.webp) no-repeat top center;
}
section#section-24 {
  background: url(../img_pc/section_24.webp) no-repeat top center;
}
section#section-25 {
  background: url(../img_pc/section_25.webp) no-repeat top center;
}
section#section-26 {
  background: url(../img_pc/section_26.webp) no-repeat top center;
}
section#section-27 {
  background: url(../img_pc/section_27.webp) no-repeat top center;
}
section#section-28 {
  background: url(../img_pc/section_28.webp) no-repeat top center;
}
section#section-29 {
  background: url(../img_pc/section_29.webp) no-repeat top center;
}
section#section-30 {
  background: url(../img_pc/section_30.webp) no-repeat top center;
}

/*背景画像を指定*/
section#section-31 {
  background: url(../img_pc/section_31.webp) no-repeat top center;
}
section#section-32 {
  background: url(../img_pc/section_32.webp) no-repeat top center;
}
section#section-33 {
  background: url(../img_pc/section_33.webp) no-repeat top center;
}
section#section-34 {
  background: url(../img_pc/section_34.webp) no-repeat top center;
}
section#section-35 {
  background: url(../img_pc/section_35) no-repeat top center;
  height: ;
}
section#section-36 {
  background: url(../img_pc/section_36) no-repeat top center;
  height: ;
}
section#section-237 {
  background: url(../img_pc/section_37) no-repeat top center;
  height: ;
}
section#section-38 {
  background: url(../img_pc/section_38) no-repeat top center;
  height: ;
}
section#section-39 {
  background: url(../img_pc/section_39) no-repeat top center;
  height: ;
}
section#section-40 {
  background: url(../img_pc/section_40) no-repeat top center;
  height: ;
}

/*背景画像を指定*/
section#section-41 {
  background: url(../img_pc/section_41) no-repeat top center;
  height: ;
}
section#section-42 {
  background: url(../img_pc/section_42) no-repeat top center;
  height: ;
}
section#section-43 {
  background: url(../img_pc/section_43) no-repeat top center;
  height: ;
}
section#section-44 {
  background: url(../img_pc/section_44) no-repeat top center;
  height: ;
}
section#section-45 {
  background: url(../img_pc/section_45) no-repeat top center;
  height: ;
}
section#section-46 {
  background: url(../img_pc/section_46) no-repeat top center;
  height: ;
}
section#section-47 {
  background: url(../img_pc/section_47) no-repeat top center;
  height: ;
}
section#section-48 {
  background: url(../img_pc/section_48) no-repeat top center;
  height: ;
}
section#section-49 {
  background: url(../img_pc/section_49) no-repeat top center;
  height: ;
}
section#section-50 {
  background: url(../img_pc/section_50) no-repeat top center;
  height: ;
}

.-pc {
  display: block;
}

.-sp {
  display: none;
}

*,
*::before,
*::after {
  -webkit-box-sizing: inherit;
  box-sizing: inherit; /*親要素のbox-sizingを継承*/
}

.video {
  position: absolute;
  z-index: 9999;
  width: 82.5%;
  top: 2.6%;
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  /* aspect-ratio: 16 / 9 !important; */
  padding-top:  46.25%;
}

.video iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.btn-play {
  display: block;
  position: absolute;
  width: clamp(50px, 13.3vw, 100px);
  height: clamp(50px, 13.3vw, 100px);
  top: 50%;
  left: 50%;
  margin: 0;
  transform: translate(-50%, -50%);
  -webkit-transform: translate3d(-50%, -50%, 0);
  background-color: #ccc;
  border-radius: 50%;
  transition: background-color cubic-bezier(0.215, 0.61, 0.355, 1) 0.4s;
  cursor: pointer;
  z-index: 10;
}

.btn-play::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 55%;
  transform: translate(-50%, -50%);
  border-style: solid;
  border-color: transparent transparent transparent #ffffff;
  font-size: clamp(16px, 4.2vw, 28px);
  border-width: 1em 0 1em 1.5em;
}

.btn-play::after {
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 60%;
  height: 60%;
  border-radius: 50%;
  transition: opacity linear 0.4s;
  content: "";
}

.btn-play.-active {
  background-color: #f13408;
}

.btn-play.-active::after {
  animation: pulseMotion 1.4s linear infinite;
}

@keyframes pulseMotion {
  0% {
    transform: translate(-50%, -50%) scale(1, 1);
    background-color: rgba(250, 150, 125, 0.4);
  }

  100% {
    transform: translate(-50%, -50%) scale(6.5, 6.5);
    background-color: rgba(250, 150, 125, 0);
  }
}


/*----------------------------------------*/

/*-----------------スマホサイズ-----------------------*/

@media screen and (max-width: 600px) {
.side {
  position: fixed;
  position: fixed;
  right: 0;
  bottom: 0px;
  z-index: 9999999;
}

.side a img:hover {
  opacity: 0.8;
}
  .-pc {
    display: none;
  }
  .-sp {
    display: block;
  }
  body {
    font-size: 4.2vw;
  }
  .wrap {
    max-width: 100%;
    width: 100%;
  }
  .btn_box01,
  .btn_box02,
  .btn_box03,
  .btn_box04,
  .btn_box05,
  .btn_box06,
  .btn_box07 {
    width: 90% !important; /*ボタン画像の幅*/
    height: 55% !important; /*ボタン画像の高さ*/
  }
  .btn_box03 {
    height:  45% !important; /*ボタン画像の高さ*/
  }
  .btn_box02 {
    top: 18% !important;
  }
  .btn_box06 {
    top: 63% !important; /*上下の位置揃え*/
    height: 60% !important;
  }
  #footer {
    text-align: center;
    font-size: 0.8em;
    padding: 1em;
    margin-bottom: 150px;
  }
  #footer a {
    color: #000000;
  }
  .btn_box06:before,
  .btn_box06:after {
    height: 40% !important;
  }
  section#section-01,
  section#section-02,
  section#section-03,
  section#section-04,
  section#section-05,
  section#section-06,
  section#section-07,
  section#section-08,
  section#section-09,
  section#section-10,
  section#section-11,
  section#section-12,
  section#section-13,
  section#section-14,
  section#section-15,
  section#section-16,
  section#section-17,
  section#section-18,
  section#section-19,
  section#section-20,
  section#section-21,
  section#section-22,
  section#section-23,
  section#section-24,
  section#section-25,
  section#section-26,
  section#section-27,
  section#section-28,
  section#section-29,
  section#section-30,
  section#section-31,
  section#section-32,
  section#section-33,
  section#section-34 {
    background: none !important;
  }
  .video {
    width: 87%;
    top: 3%;
    left: 50%;
    padding-top:  49%;
  }
}

/*----------------------------------------*/

/*   光るボタン1    */

.btn_box01 {
  position: absolute;
  width: 865px; /*ボタン画像の幅*/
  height: 210px; /*ボタン画像の高さ*/
  margin: 0 auto;
  transition: 0.2s;
  z-index: 1000;
  top: 15%; /*上下の位置揃え*/
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
}

.btn_box01:before,
.btn_box01:after {
  content: "";
  position: absolute;
  z-index: -10;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  border-radius: 120px;
  box-shadow: 0 0 50px rgb(0, 207, 0) inset; /*光の色*/
  animation: anime 2s ease-out infinite;
}

.btn_box01:after {
  animation-delay: 0.4s;
}

.btn_box02 {
  position: absolute;
  width: 865px; /*ボタン画像の幅*/
  height: 210px; /*ボタン画像の高さ*/
  margin: 0 auto;
  transition: 0.2s;
  z-index: 1000;
  top: 22%; /*上下の位置揃え*/
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
}

.btn_box02:before,
.btn_box02:after {
  content: "";
  position: absolute;
  z-index: -10;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  border-radius: 120px;
  box-shadow: 0 0 50px rgb(0, 207, 0) inset; /*光の色*/
  animation: anime 2s ease-out infinite;
}

.btn_box02:after {
  animation-delay: 0.4s;
}

.btn_box03 {
  position: absolute;
  width: 865px; /*ボタン画像の幅*/
  height: 210px; /*ボタン画像の高さ*/
  margin: 0 auto;
  transition: 0.2s;
  z-index: 1000;
  top: 18%; /*上下の位置揃え*/
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
}

.btn_box03:before,
.btn_box03:after {
  content: "";
  position: absolute;
  z-index: -10;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  border-radius: 120px;
  box-shadow: 0 0 50px rgb(0, 207, 0) inset; /*光の色*/
  animation: anime 2s ease-out infinite;
}

.btn_box03:after {
  animation-delay: 0.4s;
}

.btn_box04 {
  position: absolute;
  width: 865px; /*ボタン画像の幅*/
  height: 210px; /*ボタン画像の高さ*/
  margin: 0 auto;
  transition: 0.2s;
  z-index: 1000;
  top: 22%; /*上下の位置揃え*/
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
}

.btn_box04:before,
.btn_box04:after {
  content: "";
  position: absolute;
  z-index: -10;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  border-radius: 120px;
  box-shadow: 0 0 50px rgb(0, 207, 0) inset; /*光の色*/
  animation: anime 2s ease-out infinite;
}

.btn_box04:after {
  animation-delay: 0.4s;
}
.btn_box05 {
  position: absolute;
  width: 865px; /*ボタン画像の幅*/
  height: ; /*ボタン画像の高さ*/
  margin: 0 auto;
  transition: 0.2s;
  z-index: 1000;
  top: 18%; /*上下の位置揃え*/
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
}

.btn_box05:before,
.btn_box05:after {
  content: "";
  position: absolute;
  z-index: -10;
  width: 100%;
  height: 40%;
  top: 0;
  left: 0;
  border-radius: 120px;
  box-shadow: 0 0 50px rgb(0, 207, 0) inset; /*光の色*/
  animation: anime 2s ease-out infinite;
}

.btn_box05:after {
  animation-delay: 0.4s;
}

/*   光るボタン1 ここまで   */

.btn_box06 {
  position: absolute;
  width: 865px; /*ボタン画像の幅*/
  height: ; /*ボタン画像の高さ*/
  margin: 0 auto;
  transition: 0.2s;
  z-index: 1000;
  top: 18%; /*上下の位置揃え*/
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
}

.btn_box06:before,
.btn_box06:after {
  content: "";
  position: absolute;
  z-index: -10;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  border-radius: 120px;
  box-shadow: 0 0 50px rgb(0, 207, 0) inset; /*光の色*/
  animation: anime 2s ease-out infinite;
}

.btn_box06:after {
  animation-delay: 0.4s;
}

.btn_box07 {
  position: absolute;
  width: 865px; /*ボタン画像の幅*/
  height: 210px; /*ボタン画像の高さ*/
  margin: 0 auto;
  transition: 0.2s;
  z-index: 1000;
  top: 15%; /*上下の位置揃え*/
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
}

.btn_box07:before,
.btn_box07:after {
  content: "";
  position: absolute;
  z-index: -10;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  border-radius: 120px;
  box-shadow: 0 0 50px rgb(0, 207, 0) inset; /*光の色*/
  animation: anime 2s ease-out infinite;
}

.btn_box07:after {
  animation-delay: 0.4s;
}

/*アニメーション*/
@keyframes anime {
  0% {
    transform: scale(0.95);
    opacity: 1;
  }

  90% {
    opacity: 0.1;
  }

  to {
    transform: scale(1.2, 1.2);
    opacity: 0;
  }
}