@charset "UTF-8";
/* =========================================================
   お問い合わせ
   フォームの行・ラベル・同意・送信は common.css の c-form
   ========================================================= */
.p-inquiry { padding: 120px 0; }

/* 本文・フォームは 920px。デザインどおり見出しより 12px 右（左 92px）に置く */
.p-inquiry__inner {
  max-width: 920px;
  margin: 0 auto;
}

@media (min-width: 1200px) {
  .p-inquiry__inner { margin-left: 92px; }
  .p-inquiry__target { margin-right: 24px; } /* 中心はページ中央（750px） */
}

/* 対象の案内（中央・太字 18px） */
.p-inquiry__target {
  margin-top: 65px;
  font-size: 1.125rem; /* 18px */
  font-weight: 700;
  line-height: 1.45;
  text-align: center;
}

.p-inquiry__lead {
  margin: 40px 0 0;
  font-size: 1rem; /* 16px */
  line-height: 1.45;
}

/* ---------------------------------------------------------
   フォーム（テーマの淡色地の箱。中は左右 60px）
--------------------------------------------------------- */
.p-inquiry-form { margin-top: 40px; }

.p-inquiry-form__box {
  margin-top: 40px;
  padding: 55px 60px 81px;
  background: var(--c-key-pale);
}

/* ラベルの margin-bottom 10px と相殺されるので、文字までの 15px をそのまま指定 */
.p-inquiry-form .c-form__radios {
  column-gap: 60px;
  margin-top: 15px;
}

/* ラジオの選択中はグレーの丸（デザインどおり。テーマ色にしない） */
.p-inquiry-form .c-check__input[type="radio"]:checked {
  border-color: #c1c1c1;
  box-shadow: inset 0 0 0 2px var(--c-white), inset 0 0 0 8px #606060;
}

.p-inquiry-form .c-actions { column-gap: 42px; }

/* 運営事務局の連絡先（c-office）。フォームの 60px 下 */
.p-inquiry .c-office { margin-top: 60px; }

/* inputの矢印も文字色に追従させ、hover時は --action-c を使う。 */
[data-cf7-inquiry] input.c-action,
[data-cf7-inquiry] input.c-action:hover,
[data-cf7-inquiry] input.c-action:focus-visible {
  background-image:
    linear-gradient(45deg, transparent calc(50% - 1.25px), currentColor calc(50% - 1.25px), currentColor calc(50% + 1.25px), transparent calc(50% + 1.25px)),
    linear-gradient(-45deg, transparent calc(50% - 1.25px), currentColor calc(50% - 1.25px), currentColor calc(50% + 1.25px), transparent calc(50% + 1.25px));
  background-repeat: no-repeat;
  background-size: 7px 7px;
  background-position: right 24px top calc(50% - 3px), right 24px top calc(50% + 3px);
}
@media (max-width: 767.98px) {
  [data-cf7-inquiry] input.c-action,
  [data-cf7-inquiry] input.c-action:hover,
  [data-cf7-inquiry] input.c-action:focus-visible {
    background-position: right 22px top calc(50% - 3px), right 22px top calc(50% + 3px);
  }

  .p-inquiry { padding: 48px 0 64px; }

  .p-inquiry__target {
    margin-top: 40px;
    font-size: 1rem;
    text-align: left;
  }

  .p-inquiry__lead {
    margin-top: 16px;
    font-size: .9375rem;
    line-height: 1.8;
  }

  .p-inquiry-form { margin-top: 24px; }
  .p-inquiry-form__box { margin-top: 16px; padding: 28px 16px 40px; }
  .p-inquiry-form .c-form__radios { column-gap: 28px; }
  .p-inquiry-form .c-actions { row-gap: 16px; }

  .p-inquiry .c-office { margin-top: 40px; }
}
