/* --------------------------------------------------
  common
-------------------------------------------------- */
/* --------------------------------------------------
  mv
-------------------------------------------------- */
@media screen and (min-width: 1024px) {
  .mv {
    height: 210px;
    padding: 3em 0 2em;
  }
}

/* --------------------------------------------------
  contact
-------------------------------------------------- */
.contact {
  padding-top: 0;
  position: relative;
  z-index: 2;
  background: #232286;
}
@media screen and (min-width: 640px) {
  .contact {
    padding: 0 0 105px;
  }
}
.contact::before {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  left: 0;
  top: -60px;
  background: url(../img/common/mv_bg.png) no-repeat center top/133%;
  z-index: -1;
}
@media screen and (min-width: 640px) {
  .contact::before {
    top: -320px;
    background-position: center top 200px;
    height: calc(100% + 320px);
  }
}
.contact-container {
  background: #fff;
  border-radius: 30px;
  box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1);
  padding: 20px;
}
@media screen and (min-width: 640px) {
  .contact-container {
    padding: 54px 9.6%;
  }
}
.contact-inner {
  max-width: 624px;
  width: 100%;
  margin: 0 auto;
}
.contact-lead {
  text-align: center;
  font-size: 1.5rem;
  line-height: 1.77;
  margin-bottom: 16px;
}
@media screen and (min-width: 640px) {
  .contact-lead {
    font-size: 1.8rem;
    margin-bottom: 24px;
  }
}
.contact-note {
  text-align: right;
  font-size: 1.2rem;
  color: #707070;
}
@media screen and (min-width: 640px) {
  .contact-note {
    font-size: 1.4rem;
  }
}
.contact-note span {
  color: #fa0046;
}
@media screen and (min-width: 640px) {
  .contact-form {
    margin-top: 15px;
  }
}
.contact .form-item {
  margin-bottom: 10px;
}
@media screen and (min-width: 640px) {
  .contact .form-item {
    margin-bottom: 20px;
  }
}
@media screen and (min-width: 1024px) {
  .contact .form-item > p {
    display: flex;
    justify-content: space-between;
  }
}
.contact .form-item > p > span {
  width: 100%;
}
@media screen and (min-width: 1024px) {
  .contact .form-item > p > span {
    max-width: 470px;
  }
}
.contact .form-item label {
  font-size: 1.4rem;
  font-weight: 300;
  margin-bottom: 3px;
  display: block;
}
@media screen and (min-width: 640px) {
  .contact .form-item label {
    font-size: 1.6rem;
    margin-bottom: 5px;
  }
}
@media screen and (min-width: 1024px) {
  .contact .form-item label {
    margin: 0;
  }
}
.contact .form-item label span {
  color: #fa0046;
}
.contact .form-item input,
.contact .form-item textarea {
  border: 1px solid #ddd;
  background: #f3f7fb;
  width: 100%;
  padding: 5px;
}
.contact .form-item textarea {
  height: 130px;
}
.contact .form-check {
  display: flex;
  justify-content: center;
  margin-top: 20px;
}
@media screen and (min-width: 640px) {
  .contact .form-check {
    margin-top: 30px;
  }
}
.contact .form-check > p {
  font-size: 1.2rem;
  font-weight: 300;
  margin-right: 10px;
}
@media screen and (min-width: 640px) {
  .contact .form-check > p {
    font-size: 1.6rem;
    margin-right: 18px;
  }
}
.contact .form-check > p > a {
  display: inline;
  text-decoration: underline;
}
.contact .form-check input[type=checkbox] {
  width: 16px;
  height: 16px;
  border: 1px solid #ddd;
  background: #f3f7fb;
}
@media screen and (min-width: 640px) {
  .contact .form-check input[type=checkbox] {
    width: 20px;
    height: 20px;
  }
}
.contact .form-btn > p {
  max-width: 280px;
  width: 100%;
  height: 70px;
  margin: 15px auto 0;
  position: relative;
  text-align: center;
}
@media screen and (min-width: 640px) {
  .contact .form-btn > p {
    max-width: 352px;
    height: 80px;
    margin: 30px auto 0;
  }
}
.contact .form-btn > p::after {
  position: absolute;
  content: "";
  right: 16px;
  top: 10px;
  width: 50px;
  height: 50px;
  background: #fff url(../img/common/icn_arrow_navy.svg) no-repeat center center/16px;
  border-radius: 50%;
  border: 2px solid rgba(35, 34, 134, 0.12);
  pointer-events: none;
}
@media screen and (min-width: 640px) {
  .contact .form-btn > p::after {
    top: 12px;
    width: 56px;
    height: 56px;
  }
}
.contact .form-btn > p input {
  width: 100%;
  height: 100%;
  background: #232286;
  color: #fff;
  font-size: 2rem;
  border-radius: 40px;
  display: block;
  padding: 10px 40px;
  text-align: left;
}
@media screen and (min-width: 640px) {
  .contact .form-btn > p input {
    font-size: 2.2rem;
    padding: 10px 50px;
  }
}
.contact .form-btn > p .wpcf7-spinner {
  margin: 10px 24px;
}

.wpcf7 form.invalid .wpcf7-response-output, .wpcf7 form.unaccepted .wpcf7-response-output, .wpcf7 form.payment-required .wpcf7-response-output {
  border: none;
  color: #fa0046;
  text-align: center;
}

.wpcf7 .red {
  color: #fa0046;
}

.wpcf7-not-valid-tip {
  color: #fa0046;
}

.wpcf7 .wpcf7-submit:disabled {
  background-color: #bbb;
}

.form__turnstile {
  text-align: center;
  margin: 30px auto 5px;
}/*# sourceMappingURL=contact.css.map */