@charset "UTF-8";
.form {
  &.done {
    padding-bottom: 100rem;
  }
}
.form__title--page {
  color: #7e318e;
  text-align: center;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  @media (min-width: 769px) { /* PC */
    padding-top: 54rem;
    font-size: 50rem;
    margin-bottom: 60rem;
  }
  @media (max-width: 768px) { /* SP */
    padding-top: 35rem;
    order: 2;
    font-size: 26.222rem;
    margin-bottom: 12.74rem;
  }
  &::after {
    content: "";
    display: block;
    flex-shrink: 0;
    background-color: #9b519a;
    margin-inline: auto;
    @media (min-width: 769px) { /* PC */
      width: 94rem;
      height: 8rem;
      margin-top: 41rem;
    }
    @media (max-width: 768px) { /* SP */
      width: 49.298rem;
      height: 4.196rem;
      margin-top: 21.26rem;
    }
  }
  span {
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    @media (min-width: 769px) { /* PC */
      font-size: 40rem;
    }
    @media (max-width: 768px) { /* SP */
      display: none;
    }
  }
}
.form__step {
  position: relative;
  margin-inline: auto;
  @media (min-width: 769px) { /* PC */
    width: 722rem;
    height: 95rem;
    flex-shrink: 0;
    margin-bottom: 100rem;
  }
  @media (max-width: 768px) { /* SP */
    order: 1;
    width: 340rem;
    height: 48rem;
    flex-shrink: 0;
    margin-top: 35rem;
    .form.done & {
      margin-bottom: 38rem;
    }
  }
  img {
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }
  .--labels {
    display: flex;
    height: 100%;
    justify-content: space-between;
    align-items: center;
    @media (min-width: 769px) { /* PC */
      padding: 0 60rem 0 110rem;
    }
    @media (max-width: 768px) { /* SP */
      padding: 0 15rem 0 45rem;
    }
    span {
      color: #9FA0A0;
      text-align: center;
      font-style: normal;
      font-weight: 900;
      line-height: normal;
      @media (min-width: 769px) { /* PC */
        font-size: 22rem;
      }
      @media (max-width: 768px) { /* SP */
        font-size: 16rem;
      }
      &.is-current {
        color: #000;
      }
      &:nth-of-type(1) {
      }
      &:nth-of-type(2) {
        @media (min-width: 769px) { /* PC */
          margin-left: 30rem;
        }
        @media (max-width: 768px) { /* SP */
          margin-left: 20rem;
        }
      }
      &:nth-of-type(3) {
      }
    }
  }
}
.form {
  @media (min-width: 769px) { /* PC */
    width: 975rem;
    margin-inline: auto;
  }
  @media (max-width: 768px) { /* SP */
  }
  dl {
    @media (min-width: 769px) { /* PC */
    }
    @media (max-width: 768px) { /* SP */
      width: 310rem;
      margin-inline: auto;
    }
  }
  dl > div {
    @media (min-width: 769px) { /* PC */
      display: grid;
      grid-template-columns: 314rem auto;
    }
    @media (max-width: 768px) { /* SP */
    }
  }
  /*
  dl > div:has(.wpcf7-validates-as-required) {
    dt {
      &::after {
        content: "[必須]";
        color: #FF0004;
        margin-left: 10rem;
      }
    }
  }
  */
  dt {
    /*
    display: flex;
    align-items: center;
    */
    color: #000;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    @media (min-width: 769px) { /* PC */
      font-size: 22rem;
    }
    @media (max-width: 768px) { /* SP */
      font-size: 16rem;
      margin-bottom: 10rem;
    }
    em {
      color: #FF0004;
      margin-left: 0rem;
    }
  }
  input[type="checkbox"] {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
    pointer-events: none;
  }
  label:has(input[type="checkbox"]) {
    display: flex;
    align-items: center;
    &::before {
      content: "";
      display: block;
      width: 19rem;
      height: 19rem;
      flex-shrink: 0;
      border: 1px solid #000;
      background: #fff;
      margin-right: 11rem;
    }
  }
  label:has(input[type="checkbox"]:checked) {
    &::before {
      background-image: url(../images/icons/checkbox-checked.svg);
      background-size: contain;
      background-repeat: no-repeat;
      background-position: center;
    }
  }
}
.form.input {
  @media (min-width: 769px) { /* PC */
    padding-bottom: 100rem;
  }
  @media (max-width: 768px) { /* SP */
    padding-bottom: 70.41rem;
  }
  dl {
    display: flex;
    flex-direction: column;
    @media (min-width: 769px) { /* PC */
      gap: 48rem 0;
    }
    @media (max-width: 768px) { /* SP */
      gap: 26rem 0;
    }
  }
  input[type="text"],
  input[type="email"],
  input[type="tel"],
  textarea,
  select
  {
    padding: 0 10rem;
    flex-shrink: 0;
    border: 1px solid #9fa0a0;
    background: #efefef;
    display: block;
    height: 32rem;
    @media (min-width: 769px) { /* PC */
      width: 661rem;
      font-size: 20rem;
    }
    @media (max-width: 768px) { /* SP */
      width: 310rem;
      font-size: 16rem;
    }
  }
  textarea {
    padding: 10rem;
    @media (min-width: 769px) { /* PC */
      height: 140rem;
    }
    @media (max-width: 768px) { /* SP */
      height: 86rem;
    }
  }
  select {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-image: url(../images/home/icon-chevron-down.svg);
    background-repeat: no-repeat;
    background-position: right 7rem center;
    background-size: 14rem 8rem;
    @media (min-width: 769px) { /* PC */
    }
    @media (max-width: 768px) { /* SP */
      padding-right: 20rem;
    }
  }
  .wpcf7-not-valid-tip {
    color: #FF0004;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    @media (min-width: 769px) { /* PC */
      font-size: 22rem;
    }
    @media (max-width: 768px) { /* SP */
      text-align: right;
      font-size: 16rem;
    }
  }
  .wpcf7-form-control-wrap {
  }
  .wpcf7-list-item {
    margin-left: 0;
  }
  .wpcf7-list-item-label {
    color: #000;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    @media (min-width: 769px) { /* PC */
      font-size: 22rem;
    }
    @media (max-width: 768px) { /* SP */
      font-size: 16rem;
    }
  }
  .wpcf7-checkbox {
    display: flex;
    flex-direction: column;
    @media (min-width: 769px) { /* PC */
    }
    @media (max-width: 768px) { /* SP */
      gap: 14rem;
    }
  }
  input[type="radio"] {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
    pointer-events: none;
  }
  label:has(input[type="radio"]) {
    display: flex;
    align-items: center;
    &::before {
      content: "";
      display: block;
      width: 23rem;
      height: 23rem;
      flex-shrink: 0;
      background-image: url(../images/icons/radio.svg);
      background-size: contain;
      background-repeat: no-repeat;
      margin-right: 11rem;
    }
  }
  label:has(input[type="radio"]:checked) {
    &::before {
      background-image: url(../images/icons/radio-checked.svg);
    }
  }
}
.form__button {
  all: unset;
  display: inline-block;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 98.68rem;
  flex-shrink: 0;
  background: url(../images/home/icon-caret-right-o.svg), linear-gradient(90deg, #80338F 6.22%, #C668A6 94.22%);
  background-repeat: no-repeat;
  color: #fff;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  text-align: center;
  margin-inline: auto;
  @media (min-width: 769px) { /* PC */
    width: 495rem;
    height: 89.646rem;
    font-size: 38.916rem;
    background-size: 25.335rem 25.335rem, 100%;
    background-position: right 27.53rem center, center;
    border-radius: 58.465rem;
    box-shadow: 3.898rem 7.795rem 0rem 0rem rgba(0, 0, 0, 0.25);
    transition: translate .15s ease, box-shadow 0.15s ease;
    @media (hover:hover) {
      &:hover {
        box-shadow: 0 0 0 0;
        translate: 3.898rem 7.795rem;
      }
    }
  }
  @media (max-width: 768px) { /* SP */
    width: 279.348rem;
    height: 50.591rem;
    font-size: 21.962rem;
    background-size: 14.297rem 14.297rem, 100%;
    background-position: right 15.56rem center, center;
    border-radius: 32.994rem;
    box-shadow: 2.2rem 4.399rem 0rem 0rem rgba(0, 0, 0, 0.25);
  }
}
.form__title--sub {
  color: #000;
  font-style: normal;
  line-height: normal;
  @media (min-width: 769px) { /* PC */
    font-size: 30rem;
    font-weight: 400;
    padding-top: 78rem;
    margin-bottom: 58rem;
  }
  @media (max-width: 768px) { /* SP */
    font-size: 18rem;
    font-weight: 500;
    width: 310rem;
    margin-inline: auto;
    padding-top: 46rem;
    margin-bottom: 18rem;
  }
}
.form__acceptance {
  padding-top: 53rem;
  display: flex;
  justify-content: center;
  align-items: flex-end;
  @media (min-width: 769px) { /* PC */
    margin-bottom: 78rem;
  }
  @media (max-width: 768px) { /* SP */
    margin-bottom: 34.71rem;
    .form.confirm & {
      margin-bottom: 70.71rem;
    }
  }
  em {
    color: #FF0004;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    @media (min-width: 769px) { /* PC */
      font-size: 22rem;
      margin-right: 10rem;
    }
    @media (max-width: 768px) { /* SP */
      font-size: 16rem;
      margin-right: 0rem;
    }
  }
  .wpcf7-list-item-label {
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    @media (min-width: 769px) { /* PC */
      font-size: 22rem;
    }
    @media (max-width: 768px) { /* SP */
      font-size: 16rem;
    }
    a {
      color: #7e318e;
      text-decoration: underline;
      text-underline-offset: 0.2em;
    }
  }
  .wpcf7-list-item {
    margin-left: 0;
  }
}
.wpcf7-radio {
  display: flex;
  align-items: center;
  gap: 36rem;
}
.form.confirm {
  @media (min-width: 769px) { /* PC */
    padding-bottom: 100rem;
  }
  @media (max-width: 768px) { /* SP */
    padding-bottom: 50rem;
  }
  dd {
    color: #626664;
    font-size: 16rem;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    word-break: break-word;
    overflow-wrap: break-word;
    white-space: pre-line;
  }
  dl > div {
    border-bottom: 1px solid #000;
    align-items: center;
    @media (min-width: 769px) { /* PC */
      padding: 23rem 0 29rem;
    }
    @media (max-width: 768px) { /* SP */
      padding: 13rem 0 10rem;
    }
    &:nth-of-type(1) {
      padding-top: 0;
    }
  }
  .form__button {
    @media (min-width: 769px) { /* PC */
      width: 425rem;
    }
    @media (max-width: 768px) { /* SP */
      width: 279.348rem;
      height: 50.591rem;
    }
  }
}
.confirm__lead {
  color: #000;
  text-align: center;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  margin-bottom: 64rem;
  @media (min-width: 769px) { /* PC */
    font-size: 22rem;
  }
  @media (max-width: 768px) { /* SP */
    font-size: 16rem;
  }
}
.wpcf7-previous {
  display: block !important;
  border-radius: 58.465rem;
  background-color: #626664;
  background-image: url(../images/icons/caret-right-o-gray.svg);
  @media (min-width: 769px) { /* PC */
    box-shadow: 3.898rem 7.795rem 0rem 0rem rgba(0, 0, 0, 0.25);
  }
  @media (max-width: 768px) { /* SP */
  }
}
.form__buttons {
  width: 100%;
  display: flex;
  align-items: center;
  margin-bottom: 30rem;
  @media (min-width: 769px) { /* PC */
    justify-content: center;
    gap: 46rem;
  }
  @media (max-width: 768px) { /* SP */
    flex-direction: column;
    gap: 18.41rem;
  }
  .wpcf7-spinner {
    position: absolute;
  }
}
.form.done {
  @media (min-width: 769px) { /* PC */
    padding-top: 96rem;
  }
  @media (max-width: 768px) { /* SP */
  }
}
.done__title {
  color: #7e318e;
  text-align: center;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  @media (min-width: 769px) { /* PC */
    font-size: 36rem;
    margin-bottom: 58rem;
  }
  @media (max-width: 768px) { /* SP */
    font-size: 26.222rem;
    margin-bottom: 9rem;
  }
}
.done__message {
  text-align: center;
  color: #000;
  text-align: center;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  @media (min-width: 769px) { /* PC */
    font-size: 22rem;
    margin-bottom: 78rem;
  }
  @media (max-width: 768px) { /* SP */
    font-size: 16rem;
    margin-bottom: 40rem;
  }
}
.done__button {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
  background: linear-gradient(90deg, #80338F 6.22%, #C668A6 94.22%);
  margin-inline: auto;
  color: #fff;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  @media (min-width: 769px) { /* PC */
    width: 495rem;
    height: 89.646rem;
    font-size: 38.916rem;
    border-radius: 58.465rem;
    box-shadow: 3.898rem 7.795rem 0rem 0rem rgba(0, 0, 0, 0.25);
    transition: translate .15s ease, box-shadow 0.15s ease;
    @media (hover:hover) {
      &:hover {
        box-shadow: 0 0 0 0;
        translate: 3.898rem 7.795rem;
      }
    }
  }
  @media (max-width: 768px) { /* SP */
    width: 279.348rem;
    height: 50.591rem;
    font-size: 21.962rem;
    border-radius: 32.994rem;
    box-shadow: 2.2rem 4.399rem 0rem 0rem rgba(0, 0, 0, 0.25);
  }
  img {
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto 0;
    @media (min-width: 769px) { /* PC */
      right: 41.53rem;
      width: 25.335rem;
      height: 25.335rem;
      flex-shrink: 0;
    }
    @media (max-width: 768px) { /* SP */
      width: 14.297rem;
      height: 14.297rem;
      flex-shrink: 0;
      right: 23rem;
    }
  }
}
.form__note {
  color: #000;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  padding-top: 9rem;
  @media (min-width: 769px) { /* PC */
    font-size: 16rem;
    margin-bottom: 48rem;
  }
  @media (max-width: 768px) { /* SP */
    width: 310rem;
    margin-inline: auto;
    font-size: 14rem;
    margin-bottom: 30rem;
  }
}
.confirm__note {
  width: 100%;
  padding-top: 12rem;
  @media (min-width: 769px) { /* PC */
    grid-column: span 2;
  }
  @media (max-width: 768px) { /* SP */
    color: #000;
    font-size: 16rem;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    letter-spacing: -0.04em;
  }
}
.form__header {
  @media (min-width: 769px) { /* PC */
  }
  @media (max-width: 768px) { /* SP */
    display: flex;
    flex-direction: column;
  }
}
.form__agree {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  @media (min-width: 769px) { /* PC */ 
    padding-top: 81rem;
    font-size: 22rem;
    margin-bottom: 83rem;
  }
  @media (max-width: 768px) { /* SP */
    padding-top: 29rem;
    font-size: 16rem;
    margin-bottom: 70.71rem;
  }
  &::before {
    order: 2;
  }
  em {
    color: #FF0004;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    @media (min-width: 769px) { /* PC */
      order: 1;
      font-size: 22rem;
      margin-right: 10rem;
    }
    @media (max-width: 768px) { /* SP */
      font-size: 16rem;
      margin-right: 0rem;
    }
  }
  .wpcf7-list-item-label {
    display: none;
  }
  .form__text--agree {
    order: 3;
  }
  .wpcf7-not-valid-tip {
    position: absolute;
    bottom: -50rem;
    white-space: nowrap;
    color: #ff0004;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    font-size: 0 !important;
    @media (min-width: 769px) { /* PC */
      left: 100rem;
    }
    @media (max-width: 768px) { /* SP */
      width: 100% !important;
      text-align: left !important;
      left: 0;
    }
    &::after {
      content: "送信するには同意が必要です。";
      display: block;
      @media (min-width: 769px) { /* PC */
        font-size: 22rem;
      }
      @media (max-width: 768px) { /* SP */
        font-size: 16rem;
        width: 310rem !important;
        text-align: left !important;
      }
    }
  }
  a {
    color: #7e318e;
    text-decoration: underline;
    text-underline-offset: 2rem;
  }
}
.wpcf7-response-output {
  color: #ff0004;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  border: none !important;
  outline: none;
  text-align: center;
  margin: 0 !important;
  @media (min-width: 769px) { /* PC */
    font-size: 22rem;
  }
  @media (max-width: 768px) { /* SP */
    font-size: 16rem;
  }
}
select + .wpcf7-not-valid-tip {
  font-size: 0 !important;
  &::after {
    content: "選択してください。";
    @media (min-width: 769px) { /* PC */
      font-size: 22rem;
    }
    @media (max-width: 768px) { /* SP */
      font-size: 16rem;
    }
  }
}