@charset "UTF-8";
/* -------------------------------------
index_common
------------------------------------- */
#index .blk {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
#index .ttl {
  width: 111.11vh;
  max-width: 84.75vw;
  max-height: 22.97vw;
  margin: 0 auto 4.44vh;
  position: relative;
  top: auto;
}
#index .ttl::before {
  content: "";
  /* width:231px; */
  width: 25.67vh;
  max-width: 19.58vw;
  /* height:168px; */
  height: 14.24vw;
  max-height: 18.6vh;
  background: url(../imgs/index/character_1.png) no-repeat center/contain;
  position: absolute;
  top: 56%;
  left: 12.8%;
  transform: translate(-50%, -100%);
  -webkit-transform: translate(-50%, -100%);
  -ms-transform: translate(-50%, -100%);
  -ms-transform: translate(-50%, -100%);
  -o-transform: translate(-50%, -100%);
}
#index .ttl::after {
  content: "";
  /* width:176px; */
  width: 19.56vh;
  max-width: 8.4vw;
  /* height:178px; */
  height: 15.08vw;
  max-height: 19.78vh;
  background: url(../imgs/index/character_2.png) no-repeat center/contain;
  position: absolute;
  top: 58%;
  right: 13.5%;
  transform: translate(50%, -100%);
  -webkit-transform: translate(50%, -100%);
  -ms-transform: translate(50%, -100%);
  -ms-transform: translate(50%, -100%);
  -o-transform: translate(50%, -100%);
}

/* -------------------------------------
question
------------------------------------- */
.question .bg_wh {
  width: 100vh;
}
.question .bg_wh::before {
  content: "";
  /* width: 212px; */
  width: 23.56vh;
  max-width: 17.97vw;
  height: 18.94vw;
  max-height: 24.83vh;
  background: url(../imgs/index/character_3.png) no-repeat center/contain;
  position: absolute;
  bottom: 0;
  left: 90%;
  transform: translateY(53%);
  -webkit-transform: translateY(53%);
  -ms-transform: translateY(53%);
  -ms-transform: translateY(53%);
  -o-transform: translateY(53%);
  /* right: 0;
  transform: translate(51%, 53%);
  -webkit-transform: translate(51%, 53%);
  -ms-transform: translate(51%, 53%);
  -ms-transform: translate(51%, 53%);
  -o-transform: translate(51%, 53%); */
}
.question .txtblk p {
  /* font-size: min(2.78vh, 2.12vw, 25px); */
  font-size: min(2.78vh, 25px);
  color: #006837;
  text-align: center;
}
.question .txtblk p span {
  display: inline-block;
}
.question .txtblk p .pc_br {
  display: block;
}

/* -------------------------------------
btn
------------------------------------- */

#index .btn_blk .btn {
  width: 78.75vw;
  max-width: 329px;
  height: 9.33vh;
  margin: 0 auto;
  cursor: pointer;
  position: relative;
  z-index: 3;
}
#index .btn_blk .btn img {
  filter: drop-shadow(1.44vh 1.44vh 3px rgba(0, 0, 0, 0.3));
}
@media screen and (max-width: 1200px) {
  .question .bg_wh::before {
    left: auto;
    right: 0;
  }
}
@media screen and (max-width: 640px) {
  /* -------------------------------------
	index_common
	------------------------------------- */
  #index .blk {
    max-width: 440px !important;
  }
  #index .ttl {
    width: 100% !important;
    max-width: initial;
  }

  #index .ttl::before,
  #index .ttl::after {
    content: none;
  }
  /* -------------------------------------
	question
	------------------------------------- */
  .question .bg_wh {
    width: 100%;
    max-width: 426px;
    margin-bottom: 18%;
  }
  .question .bg_wh::before {
    content: "";
    width: 37%;
    max-width: 190px;
    height: 31.41vw;
    max-height: initial;
  }
  .question .txtblk p {
    font-size: min(5.21vw, 25px);
  }

  /* -------------------------------------
	btn
	------------------------------------- */
  #index .btn_blk .btn {
    width: 78.13vw;
    height: auto;
  }
}