@charset "UTF-8"; @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400,500,700&display=swap'); body {
  font-family: "Noto Sans JP", sans-serif;
  color: #111111;
  font-weight: 700;
  background: #fff;
  line-height: 1.7;
  font-size: 24px;
}

img {
  display: block;
  width: 100%;
  height: auto;
}

p {
  display: flex;
}

a {
  transition: 0.3s;
}

a:hover {
  opacity: 0.7;
}

.pc-none {
  display: none;
}

.sp-none {
  display: block;
}

.wrapper {
  position: relative;
}

.js-fadeUp-Vertical, .js-fadeUp-Horizontal {
  opacity: 0;
  transition: opacity .8s, transform .8s;
}

.js-fadeUp-Vertical {
  transform: translateY(min(calc(60 / 1920 * 100vw), 60px));
}

.js-fadeUp-Horizontal {
  transform: translateX(max(calc(-60 / 1920 * 100vw), -60px));
}

.js-fadeUp-Vertical.is-inview, .js-fadeUp-Horizontal.is-inview {
  opacity: 1;
  transition-delay: 0;
}

.js-fadeUp-Vertical.is-inview {
  transform: translateY(0);
}

.js-fadeUp-Horizontal.is-inview {
  transform: translateX(0);
}

.fv__btn-container {
  background: #091a41;
  padding: 1.7% 0 1.5%;
}

.fv__btn-row {
  display: flex;
  justify-content: center;
  align-items: flex-end;
}

.fv__btn {
  position: relative;
  margin: 0 1.4% 0 0;
  width: 31%;
}

.fv__btn:last-of-type {
  margin: 0 0 0 0;
}

.fv__btn.is-info {
  width: 24%;
}

.fv__btn-txt {
  margin: 0 auto 2%;
  width: 43%;
  line-height: 0;
}

.animation__inner {
  position: relative;
  display: inline-block;
  transition: 300ms;
  border-radius: min(calc(16 / 1920 * 100vw), 16px);
  overflow: hidden;
  z-index: 0;
}

.animation__inner::after {
  content: "";
  position: absolute;
  left: 0;
  display: block;
  top: min(16vw, -120px);
  left: 0;
  width: min(calc(50 / 1920 * 100vw), 50px);
  height: 100%;
  background: #fff;
  transition: 300ms;
  animation: shine 3s ease-in-out infinite;
}

@keyframes shine {
  0% {
    transform: scale(0) rotate(45deg);
    opacity: 0;
  }
  80% {
    transform: scale(0) rotate(45deg);
    opacity: 0.5;
  }
  81% {
    transform: scale(4) rotate(45deg);
    opacity: 1;
  }
  100% {
    transform: scale(50) rotate(45deg);
    opacity: 0;
  }
}

.info__bg {
  background: url("../img/info_bg_pc.png") center bottom / cover;
  padding: 7.5% 0 6.2%;
}

.info__txt-01 {
  width: 23.6%;
  margin: 0 auto 5.1%;
}

.info__txt-02 {
  width: 27.9%;
  margin: 0 auto;
}

.info__ttl {
  width: 33.6%;
  margin: 0 auto 5.2%;
}

.point {
  background: #073190;
}

.point__inner {
  width: 48%;
  margin: 0 auto;
}

.point__box-btn-container {
  background: #0f2149;
  padding: 1.6% 0 3%;
}

.point__box-btn {
  width: 65%;
  margin: 0 auto;
}

.point__box-btn-txt {
  position: relative;
  top: -1.8vw;
  width: 38%;
  margin: 0 auto -3.7%;
}

.point__ttl-container {
  position: relative;
}

.point__ttl {
  position: absolute;
  top: 43%;
  left: 0;
  right: 0;
  margin: 0 auto;
  width: 43.9%;
}

.voice__bg {
  background: url("../img/voice_bg_pc.png") center / cover;
  padding: 0 0 6.1%;
}

.voice__ttl-container {
  position: relative;
}

.voice__ttl {
  position: absolute;
  width: 24.7%;
  left: 30.1%;
  top: 31.1%;
}

.voice__img {
  position: absolute;
  z-index: 10;
  width: 14.9%;
  right: 28.1%;
  top: 12.4%;
}

.voice__inner {
  width: 56.4%;
  margin: 0 auto;
}

.voice__tab-btn-container {
  display: flex;
  align-items: flex-end;
  margin: 0 0 8.8%;
}

.voice__tab-btn {
  position: relative;
  color: #fff;
  font-size: min(calc(32 / 1920 * 100vw), 32px);
  background: #ff8642;
  width: 32%;
  margin: 0 2% 0 0;
  text-align: center;
  height: min(calc(104 / 1920 * 100vw), 104px);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.voice__tab-btn:last-of-type {
  margin: 0 0 0 0;
}

.voice__tab-btn:nth-of-type(2) {
  background: #5eca09;
}

.voice__tab-btn:nth-of-type(3) {
  background: #03b3d9;
}

.voice__tab-btn::after {
  display: none;
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  margin: 0 auto;
  bottom: -15%;
  width: 0;
  height: 0;
  border-style: solid;
  border-right: min(calc(13 / 1920 * 100vw), 13px) solid transparent;
  border-left: min(calc(13 / 1920 * 100vw), 13px) solid transparent;
  border-top: min(calc(19 / 1920 * 100vw), 19px) solid #ff8642;
  border-bottom: 0;
}

.voice__tab-btn.is-on::after, .voice__tab-btn:hover::after {
  display: block;
}

.voice__tab-btn:nth-of-type(2)::after {
  border-top-color: #5eca09;
}

.voice__tab-btn:nth-of-type(3)::after {
  border-top-color: #03b3d9;
}

.voice__tab-btn.is-on, .voice__tab-btn:hover {
  height: min(calc(120 / 1920 * 100vw), 120px);
  font-size: min(calc(40 / 1920 * 100vw), 40px);
}

.voice__tab-content {
  display: none;
  width: 100%;
  margin: 0 auto;
}

.voice__tab-content.is-on {
  display: block;
}

.message__ttl-container {
  position: relative;
}

.message__ttl {
  position: absolute;
  top: 24%;
  left: 21.9%;
  width: 29.2%;
}

.common__btn-container {
  background: #091a41;
  padding: 1.9% 0 1.3%;
}

.common__btn-txt {
  width: 14.7%;
  margin: 0 auto 0.8%;
}

.common__btn {
  width: 30.3%;
  margin: 0 auto;
}

.merit {
  padding: 8.5% 0 7.8%;
}

.merit__ttl {
  width: 35%;
  margin: 0 auto 2.3%;
}

.merit__table {
  width: 35%;
  margin: 0 auto;
}

.trial__ttl-container {
  position: relative;
}

.trial__ttl {
  position: absolute;
  top: 44%;
  left: 0;
  right: 0;
  margin: 0 auto;
  width: 26.9%;
}

.trial__txt-01-container {
  position: relative;
}

.trial__txt-01 {
  position: absolute;
  top: 9.8%;
  left: 0;
  right: 0;
  margin: 0 auto;
  width: 32.1%;
}

.flow {
  background: #f4f7ff;
  padding: 8.7% 0 0.4%;
}

.flow__ttl {
  width: 20.8%;
  margin: 0 auto 2.3%;
}

.about__movie-container {
  position: relative;
}

.about__movie {
  width: 30%;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin: 0 auto;
  aspect-ratio: 16 / 9;
}

.about__movie iframe {
  width: 100%;
  height: 100%;
}

.about__ttl-container {
  position: relative;
}

.about__ttl {
  position: absolute;
  top: 24.3%;
  left: 0;
  right: 0;
  margin: 0 auto;
  width: 28.9%;
}

.faq {
  padding: 6.4% 0 6.4%;
  background: #e5e5e5;
}

.faq__inner {
  width: 35%;
  margin: 0 auto;
}

.faq__ttl {
  width: 48%;
  margin: 0 auto 11.2%;
}

.faq__tab-btn-container {
  display: flex;
  align-items: center;
  margin: 0 0 5.8%;
}

.faq__tab-btn {
  position: relative;
  color: #04bde5;
  font-size: min(calc(24 / 1920 * 100vw), 24px);
  background: #fff;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 50%;
  padding: 1% 2%;
}

.faq__tab-btn.is-on, .faq__tab-btn:hover {
  background: #04bde5;
  color: #fff;
}

.faq__tab-btn::after {
  display: none;
  content: "";
  position: absolute;
  right: 0;
  left: 0;
  margin: 0 auto;
  bottom: -26%;
  width: 0;
  height: 0;
  border-style: solid;
  border-right: min(calc(8 / 1920 * 100vw), 8px) solid transparent;
  border-left: min(calc(8 / 1920 * 100vw), 8px) solid transparent;
  border-top: min(calc(15 / 1920 * 100vw), 15px) solid #04bde5;
  border-bottom: 0;
}

.faq__tab-btn.is-on::after, .faq__tab-btn:hover::after {
  display: block;
}

.faq__tab-content-container {
  display: none;
}

.faq__tab-content-container.is-on {
  display: block;
}

.faq__tab-content {
  margin: 0 0 2.2%;
}

.faq__tab-content:last-of-type {
  margin: 0 0 0 0;
}

.faq__tab-content-q {
  position: relative;
  cursor: pointer;
  display: block;
}

.faq__tab-content-a {
  display: none;
}

.faq__tab-content-a.is-on {
  display: block;
}

.faq__tab-content-icon {
  display: block;
  position: absolute;
  right: 5.9%;
  top: 50%;
  transform: translateY(-50%);
  width: 6%;
  line-height: 0;
}

.floating__btn-container {
  position: fixed;
  bottom: -20vw;
  left: 0;
  right: 0;
  background: #091a41;
  padding: 1% 0 0.6%;
  z-index: 999;
  transition: bottom 0.5s;
}

.floating__btn-container.is-shown {
  bottom: 0;
}

.floating__btn-txt {
  width: 21.5%;
  margin: 0 auto 0%;
}

.floating__btn {
  width: 38.8%;
  margin: 0 auto;
}

@media (max-width: 750px) {
  .pc-none {
      display: block;
  }

  .sp-none {
      display: none;
  }

  .fv__btn-container {
    padding: 4.8% 0 5.8%;
  }
  
  .fv__btn-row {
    display: block;
  }
  
  .fv__btn {
    margin: 0 auto 1.7%;
    width: 89%;
  }
    
  .fv__btn.is-info {
    width: 89%;
  }

  .fv__btn:last-of-type {
    margin: 0 auto;
  }
  
  .fv__btn-txt {
    width: 44%;
    margin: 0 auto 2.3%;
  }

  .info__bg {
    background: url("../img/info_bg_sp.png") center bottom / cover;
    padding: 10.5% 0 8.6%;
  }
  
  .info__txt-01 {
    width: 56.6%;
    margin: 0 auto 5.7%;
  }
  
  .info__txt-02 {
    width: 70.9%;
    margin: 0 auto;
  }
  
  .info__ttl {
    width: 67.6%;
    margin: 0 auto 8.9%;
  }
    
  .point__inner {
    width: 100%;
  }
  
  .point__ttl {
    top: 0vw;
    width: 100%;
    margin: 0 auto 0.2%;
  }
  
  .point__box-btn-container {
    padding: 0 0 0;
    background: none;
  }
  
  .point__box-btn {
    width: 80%;
  }
  
  .point__box-btn-txt {
    top: 0;
    width: 46%;
    margin: 0 auto 0;
  }

  .point__box-btn-lyt {
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
  }

  .point__ttl {
    top: 33%;
    width: 53.9%;
  }
  
  .voice__bg {
    background: url("../img/voice_bg_sp.png") center / cover;
    padding: 0 0 16.1%;
  }
  
  .voice__inner {
    width: 100%;
  }
  
  .voice__ttl {
    position: absolute;
    width: 62.5%;
    left: 5.1%;
    top: 24.5%;
  }

  .voice__img {
    position: absolute;
    width: 38.1%;
    right: 3%;
    top: 5.1%;
  }
  
  .voice__tab-btn-container {
    margin: 0 0 8.8%;
  }
  
  .voice__tab-btn {
    font-size: min(calc(32 / 750 * 100vw), 32px);
    width: 32%;
    margin: 0 2% 0 0;
    height: min(calc(104 / 750 * 100vw), 104px);
  }
  
  .voice__tab-btn::after {
    border-right: min(calc(13 / 750 * 100vw), 13px) solid transparent;
    border-left: min(calc(13 / 750 * 100vw), 13px) solid transparent;
    border-top: min(calc(19 / 750 * 100vw), 19px) solid #ff8642;
  }
  
  .voice__tab-btn.is-on, .voice__tab-btn:hover {
    height: min(calc(120 / 750 * 100vw), 120px);
    font-size: min(calc(36 / 750 * 100vw), 40px);
  }

  .voice__tab-content {
    width: 89.6%;
  }

  .message__ttl {
    top: 15.1%;
    left: 0;
    width: 94.4%;
  }
  
  .common__btn-container {
    padding: 4.3% 0 3.6%;
  }
  
  .common__btn-txt {
    width: 37%;
    margin: 0 auto 2%;
  }
  
  .common__btn {
    width: 77%;
  }
  
  .merit {
    padding: 10.9% 0 11.4%;
  }
  
  .merit__ttl {
    width: 90%;
    margin: 0 auto 5.4%;
  }
  
  .merit__table {
    width: 94.7%;
    margin: 0 0 0 auto;
    overflow-x: scroll;
    padding: 0 0 7.4%;
  }

  .merit__table-inner {
    width: 153vw;
    padding: 0 5.3% 0 0;
  }

  .trial__ttl {
    top: 39.8%;
    width: 66.9%;
  }

  .trial__txt-01 {
    top: 8.7%;
    width: 82.1%;
  }

  .flow {
    padding: 9.5% 0 0.4%;
  }
  
  .flow__ttl {
    width: 53.8%;
    margin: 0 auto 6.7%;
  }
    
  .about__movie {
    width: 90%;
  }

  .about__ttl {
    top: 26.4%;
    width: 91.9%;
  }
  
  .faq {
    padding: 8.2% 0 12.4%;
  }
  
  .faq__inner {
    width: 89%;
  }
  
  .faq__ttl {
    width: 48%;
    margin: 0 auto 10.1%;
  }
  
  .faq__tab-btn-container {
    margin: 0 0 5.8%;
  }
  
  .faq__tab-btn {
    font-size: min(calc(32 / 750 * 100vw), 32px);
    padding: 1.3% 2%;
  }

  .faq__tab-btn::after {
    border-right: min(calc(8 / 750 * 100vw), 8px) solid transparent;
    border-left: min(calc(8 / 750 * 100vw), 8px) solid transparent;
    border-top: min(calc(15 / 750 * 100vw), 15px) solid #04bde5;
    bottom: -21%;
  }
  
  .faq__tab-content {
    margin: 0 0 3.8%;
  }
  
  .faq__tab-content-icon {
    right: 5.4%;
    top: 51%;
    width: 7.2%;
  }

  .floating__btn-container {
    bottom: -40vw;
    padding: 4.9% 0;
  }
  
  .floating__btn-txt {
    width: 63.3%;
    margin: 0 auto 0.7%;
  }
  
  .floating__btn {
    width: 92.5%;
  }
}
