@charset "UTF-8";
/* Put your LP-specific styles here */
/*------------------------------------------*/
/*common
/*------------------------------------------*/
body {
  max-width: 750px;
  margin: 0 auto;
  background: #2ff3c3;
}

img {
  width: 100%;
  height: auto;
  vertical-align: bottom;
}

.main {
  margin: 0 auto;
}

/*------------------------------------------*/
/*kv
/*------------------------------------------*/
#kv {
  position: relative;
}
#kv p {
  position: absolute;
  text-align: center;
  left: 0;
  right: 0;
  bottom: 3.1%;
  margin: auto;
}
#kv p a img {
  width: 684px;
}
@media (max-width: 750px) {
  #kv p a img {
    width: calc(684 * 100vw / 750);
  }
}

/*------------------------------------------*/
/*benefit
/*------------------------------------------*/
#benefit {
  position: relative;
}
#benefit p {
  position: absolute;
  text-align: center;
  left: 0;
  right: 0;
  bottom: 2.05%;
  margin: auto;
}
#benefit p a img {
  width: 678px;
}
@media (max-width: 750px) {
  #benefit p a img {
    width: calc(678 * 100vw / 750);
  }
}

/*------------------------------------------*/
/*FAQ
/*------------------------------------------*/
#faq {
  padding-top: 80px;
  padding-bottom: 80px;
  background: #2ff3c3;
  /* ＋／－アイコン */
  /* 展開時：縦棒を回転＆フェード＝「ー」になる */
  /* 質問テキスト */
}
@media (max-width: 750px) {
  #faq {
    padding-top: calc(80 * 100vw / 750);
    padding-bottom: calc(80 * 100vw / 750);
  }
}
#faq h2 {
  margin-bottom: 40px;
  text-align: center;
}
@media (max-width: 750px) {
  #faq h2 {
    margin-bottom: calc(40 * 100vw / 750);
  }
}
#faq h2 img {
  width: 317px;
}
@media (max-width: 750px) {
  #faq h2 img {
    width: calc(317 * 100vw / 750);
  }
}
#faq .qa {
  box-sizing: border-box;
  margin: auto;
  display: grid;
  gap: 20px;
}
@media (max-width: 750px) {
  #faq .qa {
    gap: calc(20 * 100vw / 750);
  }
}
#faq .qa-item {
  overflow: clip;
  width: 670px;
  box-sizing: border-box;
  margin: auto;
  background: #FFF7DE;
  border-radius: 20px;
  padding: 30px;
}
@media (max-width: 750px) {
  #faq .qa-item {
    width: calc(670 * 100vw / 750);
    border-radius: calc(20 * 100vw / 750);
    padding: calc(30 * 100vw / 750);
  }
}
#faq .qa-heading {
  margin: 0;
}
#faq .qa-toggle {
  all: unset;
  display: flex;
  align-items: center;
  gap: 0;
  width: 100%;
  cursor: pointer;
  padding: 0;
  justify-content: space-between;
}
#faq .qa-icon {
  position: relative;
  width: 22px;
  height: 22px;
  flex: 0 0 22px;
}
@media (max-width: 750px) {
  #faq .qa-icon {
    width: calc(22 * 100vw / 750);
    height: calc(22 * 100vw / 750);
    flex: 0 0 calc(22 * 100vw / 750);
  }
}
#faq .bar {
  position: absolute;
  left: 50%;
  top: 50%;
  background: #DC2E73;
  border-radius: 999px;
  transform: translate(-50%, -50%);
  transition: transform 0.28s cubic-bezier(0.2, 0.8, 0.2, 1), opacity 0.28s cubic-bezier(0.2, 0.8, 0.2, 1);
}
#faq .bar--h {
  width: 22px;
  height: 4px;
}
@media (max-width: 750px) {
  #faq .bar--h {
    width: calc(22 * 100vw / 750);
    height: calc(4 * 100vw / 750);
  }
}
#faq .bar--v {
  width: 4px;
  height: 22px;
}
@media (max-width: 750px) {
  #faq .bar--v {
    width: calc(4 * 100vw / 750);
    height: calc(22 * 100vw / 750);
  }
}
#faq .qa-toggle[aria-expanded=true] .bar--v {
  transform: translate(-50%, -50%) rotate(90deg);
  opacity: 0;
}
#faq .qa-q {
  font-size: 28px;
  font-weight: 500;
  line-height: 52px;
  padding-left: 70px;
  position: relative;
  width: 504px;
}
@media (max-width: 750px) {
  #faq .qa-q {
    width: calc(504 * 100vw / 750);
    font-size: calc(28 * 100vw / 750);
    line-height: calc(52 * 100vw / 750);
    padding-left: calc(70 * 100vw / 750);
  }
}
#faq .qa-q:before {
  content: "";
  position: absolute;
  display: inline-block;
  width: 56px;
  height: 39px;
  top: 4px;
  left: 0;
  background: url(../img/icon_q.png) no-repeat center/cover;
}
@media (max-width: 750px) {
  #faq .qa-q:before {
    width: calc(56 * 100vw / 750);
    height: calc(39 * 100vw / 750);
    top: calc(4 * 100vw / 750);
  }
}
#faq .qa-panel {
  overflow: hidden;
  height: 0;
  transition: height 0.3s 0s;
}
#faq .qa-a {
  font-size: 28px;
  font-weight: 500;
  line-height: 52px;
  padding-left: 70px;
  position: relative;
  padding-top: 30px;
  width: 504px;
}
@media (max-width: 750px) {
  #faq .qa-a {
    font-size: calc(28 * 100vw / 750);
    line-height: calc(52 * 100vw / 750);
    padding: calc(30 * 100vw / 750) 0 0 calc(70 * 100vw / 750);
    width: calc(504 * 100vw / 750);
  }
}
#faq .qa-a:before {
  content: "";
  position: absolute;
  display: inline-block;
  width: 52px;
  height: 38px;
  top: 34px;
  left: 0;
  background: url(../img/icon_a.png) no-repeat center/cover;
}
@media (max-width: 750px) {
  #faq .qa-a:before {
    width: calc(52 * 100vw / 750);
    height: calc(38 * 100vw / 750);
    top: calc(34 * 100vw / 750);
  }
}

/* 低速環境・モーション配慮 */
@media (prefers-reduced-motion: reduce) {
  .qa-panel,
  .bar {
    transition: none;
  }
}
/*------------------------------------------*/
/*apply
/*------------------------------------------*/
#apply {
  background: #2ff3c3;
  padding: 0 40px 50px;
}
@media (max-width: 750px) {
  #apply {
    padding: 0 calc(40 * 100vw / 750) calc(50 * 100vw / 750);
  }
}
#apply h2 {
  text-align: center;
  margin-bottom: 30px;
}
@media (max-width: 750px) {
  #apply h2 {
    margin-bottom: calc(30 * 100vw / 750);
  }
}
#apply h2 img {
  width: 448px;
}
@media (max-width: 750px) {
  #apply h2 img {
    width: calc(448 * 100vw / 750);
  }
}
#apply .inner {
  background: #fff;
  border-radius: 40px;
  padding: 60px 40px 40px;
}
@media (max-width: 750px) {
  #apply .inner {
    border-radius: calc(40 * 100vw / 750);
    padding: calc(60 * 100vw / 750) calc(40 * 100vw / 750) calc(40 * 100vw / 750);
  }
}
#apply .inner form label {
  font-size: 30px;
  font-weight: 500;
}
@media (max-width: 750px) {
  #apply .inner form label {
    font-size: calc(30 * 100vw / 750);
  }
}
#apply .inner form input {
  width: 100%;
  border: 2px solid #707070;
  border-radius: 6px;
  font-size: 32px;
  box-sizing: border-box;
  padding: 18px 16px 14px 16px;
  margin: 10px 0 32px;
}
@media (max-width: 750px) {
  #apply .inner form input {
    border-width: calc(2 * 100vw / 750);
    border-radius: calc(6 * 100vw / 750);
    font-size: calc(32 * 100vw / 750);
    padding: calc(18 * 100vw / 750) calc(16 * 100vw / 750) calc(14 * 100vw / 750) calc(16 * 100vw / 750);
    margin: calc(10 * 100vw / 750) 0 calc(32 * 100vw / 750);
  }
}
#apply .inner form ::-moz-placeholder {
  color: #C6C6C6;
}
#apply .inner form ::placeholder {
  color: #C6C6C6;
}
#apply .inner form .select-wrap {
  position: relative;
}
#apply .inner form .select-wrap:after {
  content: "";
  position: absolute;
  display: inline-block;
  width: 16px;
  height: 16px;
  border-right: 4px solid #000;
  border-bottom: 4px solid #000;
  transform: rotate(45deg);
  right: 4%;
  top: 27%;
}
@media (max-width: 750px) {
  #apply .inner form .select-wrap:after {
    width: calc(16 * 100vw / 750);
    height: calc(16 * 100vw / 750);
    border-width: calc(4 * 100vw / 750);
  }
}
#apply .inner form select {
  width: 100%;
  border: 2px solid #707070;
  border-radius: 6px;
  font-size: 32px;
  box-sizing: border-box;
  padding: 16px;
  margin: 10px 0 32px;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}
@media (max-width: 750px) {
  #apply .inner form select {
    border-width: calc(2 * 100vw / 750);
    border-radius: calc(6 * 100vw / 750);
    font-size: calc(32 * 100vw / 750);
    padding: calc(16 * 100vw / 750);
    margin: calc(10 * 100vw / 750) 0 calc(32 * 100vw / 750);
  }
}
#apply .inner form .policy {
  text-align: center;
  display: block;
  margin: auto;
}
#apply .inner form .policy span {
  margin: 0;
}
#apply .inner form input[type=checkbox] {
  transform: scale(2.5);
  margin: 0px 20px 6px 0;
}
@media (max-width: 750px) {
  #apply .inner form input[type=checkbox] {
    margin: 0 calc(20 * 100vw / 750) calc(6 * 100vw / 750) 0;
    transform: scale(1.5);
  }
}
#apply .inner form .pp-link {
  text-align: center;
  margin: 3px 0 50px;
  font-size: 30px;
}
@media (max-width: 750px) {
  #apply .inner form .pp-link {
    margin: calc(3 * 100vw / 750) 0 calc(50 * 100vw / 750);
    font-size: calc(30 * 100vw / 750);
  }
}
#apply .inner form .wpcf7-submit {
  text-indent: 9999px;
  border: none;
  background: url(../img/btn_submit.png) no-repeat center/cover;
  width: 598px;
  height: 128px;
  margin: auto;
}
@media (max-width: 750px) {
  #apply .inner form .wpcf7-submit {
    text-indent: calc(9999 * 100vw / 750);
    width: calc(598 * 100vw / 750);
    height: calc(128 * 100vw / 750);
  }
}
#apply .inner form .wpcf7-spinner {
  margin: 0 auto;
  display: block;
}
#apply .inner form .wpcf7-response-output {
  margin-top: 0;
  font-size: 20px;
  padding-bottom: 8px;
}
@media (max-width: 750px) {
  #apply .inner form .wpcf7-response-output {
    font-size: calc(21 * 100vw / 750);
    padding-bottom: calc(8 * 100vw / 750);
  }
}

/*------------------------------------------*/
/*footer
/*------------------------------------------*/
footer {
  position: relative;
  text-align: center;
  background: #2ff3c3;
}
footer .copyright {
  padding: 24px 0 60px;
  text-align: center;
  font-size: 20px;
}
@media (max-width: 750px) {
  footer .copyright {
    padding: calc(24 * 100vw / 750) 0 calc(60 * 100vw / 750);
    font-size: calc(20 * 100vw / 750);
  }
}

/*------------------------------------------*/
/*page_top_button
/*------------------------------------------*/
#page-top {
  position: fixed;
  bottom: 10px;
  right: calc(50% - 365px);
  font-size: 70%;
  font-weight: 800;
  z-index: 2;
}
@media (max-width: 750px) {
  #page-top {
    bottom: calc(10 * 100vw / 750);
    right: calc(10 * 100vw / 750);
  }
}

#page-top a {
  background: #fff;
  opacity: 0.5;
  text-decoration: none;
  color: #333;
  width: 80px;
  padding: 20px 0;
  text-align: center;
  display: block;
  border: solid 1px #777;
  border-radius: 5px;
}/*# sourceMappingURL=app.css.map */