/* English form shares the Japanese input/confirmation presentation. */

/* MW WP Form compatibility for /ja/inquiry/contact/ coding markup. */
.mw_wp_form_confirm .j10ContactProgress--input,
.mw_wp_form_input .j10ContactProgress--confirm,
.mw_wp_form_confirm .formNotice,
.mw_wp_form_confirm .contactPolicy,
.mw_wp_form_confirm .contactForm__agreement,
.mw_wp_form_confirm .contactForm__note,
.mw_wp_form_confirm .contactForm__description {
  display: none;
}

.mw_wp_form_input .j10ContactProgress--input,
.mw_wp_form_confirm .j10ContactProgress--confirm {
  display: block;
}

.mw_wp_form_confirm .contactForm {
  margin-top: 40px;
}

.mw_wp_form_confirm .contactForm__body {
  line-height: 1.8;
}

.mw_wp_form_confirm .contactForm__itemLabel {
  display: none;
}

.mw_wp_form_confirm .contactForm__split {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 20px;
}

.contactForm__error:empty {
  display: none;
}

.contactForm__error .error {
  color: var(--color-caution);
}

.contactForm__body .mwform-select-field,
.contactForm__body .mwform-checkbox-field {
  width: 100%;
}

.contactForm__agreement .mwform-checkbox-field > label {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: .875rem;
  font-weight: 700;
  line-height: 1.5;
  cursor: pointer;
}

.contactForm__agreement .mwform-checkbox-field input[type="checkbox"] {
  align-self: center;
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
  background-color: var(--color-light);
  border: 2px solid #5f6266;
  border-radius: 2px;
  cursor: pointer;
}

.contactForm__agreement .mwform-checkbox-field input[type="checkbox"]:checked {
  background-color: #5f6266;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 9'%3E%3Cpath d='M1 4.5 4.5 8 11 1' fill='none' stroke='%23fff' stroke-width='2'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 12px 9px;
}


/* --------------------------------------------------
 * ボタン
 * -------------------------------------------------- */

/* 入力画面・確認画面共通：送信系ボタン */
.contactForm__submit input.j10ContactSubmit[type="submit"] {
  width: 240px;
  min-width: 0;
  min-height: 50px;
  padding: 10px 16px;
  color: var(--color-light);
  font-size: .875rem;
  line-height: 1.6;
  text-align: center;
  text-decoration: none;
  border: 1px solid;
  border-radius: 4px;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
}

/* 入力画面：入力内容を確認する */
.mw_wp_form_input .contactForm__submit input.j10ContactSubmit[type="submit"] {
  background: var(--color-dark);
  border-color: var(--color-dark);
}

/* 確認画面：送信する */
.mw_wp_form_confirm .contactForm__submit input.j10ContactSubmit[type="submit"] {
  background: var(--color-main);
  border-color: var(--color-main);
}


/* 確認画面：戻るボタン */
.mw_wp_form_confirm .contactForm__submit input.j10ContactBack[type="submit"] {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  width: 173px;
  height: 56px;
  min-width: 173px;
  min-height: 56px;
  padding: 0 24px;

  background: #fff;
  border: 1px solid #aaa;
  border-radius: 3px;

  color: #000;
  font-size: 16px;
  font-weight: 400;
  line-height: 1;
  text-align: center;

  appearance: none;
  -webkit-appearance: none;
  cursor: pointer;
}

.mw_wp_form_confirm .contactForm__submit input.j10ContactBack[type="submit"]:hover {
  background: #f7f7f7;
}


/* 確認画面のみ「戻る」「送信する」を横並び */
.mw_wp_form_confirm .contactForm__submit {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 20px;
}


@media screen and (min-width: 769px) {
  .mw_wp_form_confirm .contactForm {
    margin-top: 60px;
  }

  .contactForm__submit input.j10ContactSubmit[type="submit"] {
    width: 320px;
    min-height: 54px;
    padding: 14px 24px;
  }

  /* 戻るボタンはPCでも見本のサイズを維持 */
  .mw_wp_form_confirm .contactForm__submit input.j10ContactBack[type="submit"] {
    width: 173px;
    height: 56px;
    min-width: 173px;
    min-height: 56px;
    padding: 0 24px;
  }
}


/* Approved English completion copy. */
.j10-contact-en-complete-text { max-width: 960px; margin-right: auto; margin-left: auto; text-align: left; overflow-wrap: anywhere; }
.j10-contact-en-complete-text p + p { margin-top: 1em; }
