/* ========================================
   フォーム関連
   input / select / textarea / button
======================================== */

/* フォーム共通 */
input,
textarea,
select,
button {
  font: inherit;
}

/* 入力系 */
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="password"],
input[type="date"],
select,
textarea {
  width: 100%;
  padding: 12px 16px;
  border: 1px solid var(--color_border);
  border-radius: var(--radius);
  background: #fff;
}

/* textarea */
textarea {
  min-height: 180px;
  resize: vertical;
}

/* フォーカス時 */
input:focus,
select:focus,
textarea:focus {
  outline: none;
  border-color: var(--color_brand);
  box-shadow: 0 0 0 3px rgba(0,91,172,.15);
}

/* ボタン */
button,
input[type="submit"] {
  cursor: pointer;
  border: none;
  background: var(--color_brand);
  color: #fff;
  padding: 14px 24px;
  border-radius: var(--radius);
}
/* ----------------------------------------
   お問い合わせフォーム（contact/ CSV自動生成フォーム）
   .form_contact / .frm_tbl / .required / .form_btn / .form_error
---------------------------------------- */
.form_contact {
  max-width: var(--container_sm);
  margin: 0 auto;
}

.form_contact .frm_tbl {
  width: 100%;
  border-collapse: collapse;
  margin: clamp(20px, 3.5vw, 30px) 0;
}

.frm_tbl th,
.frm_tbl td {
  padding: 16px;
  border-bottom: 1px solid var(--color_border_light);
  text-align: left;
  vertical-align: top;
  line-height: 1.6;
}

.frm_tbl th {
  width: 30%;
  background: var(--color_bg_gray);
  font-weight: 600;
}

.frm_tbl td p {
  margin: 6px 0 0;
  font-size: var(--fz_sm);
  color: var(--color_text_light);
}

/* 必須ラベル */
.required {
  display: inline-block;
  margin-left: 8px;
  padding: 2px 8px;
  font-size: var(--fz_xs);
  font-weight: 400;
  line-height: 1.4;
  color: #fff;
  background: #d33;
  border-radius: var(--radius_sm);
  vertical-align: middle;
}

/* 送信ボタン */
.form_btn {
  text-align: center;
  margin: clamp(20px, 3.5vw, 30px) 0 0;
}

.form_btn input[type="submit"] {
  min-width: min(320px, 100%);
  padding: 16px 32px;
  background: var(--color_btn);
  border-radius: var(--radius);
  transition: background var(--transition_base);
}

.form_btn input[type="submit"]:hover {
  background: var(--color_btn_hover);
}

/* エラーメッセージ枠 */
.form_error {
  max-width: var(--container_sm);
  margin: 0 auto clamp(20px, 3.5vw, 30px);
  padding: 1em 1.2em;
  color: #d33;
  background: #fdf3f3;
  border: 1px solid #d33;
  border-radius: var(--radius_sm);
}

.form_error p {
  margin: 0.2em 0;
}

/* SP：th/tdを縦積みに */
@media (max-width: 767px) {
  .frm_tbl th,
  .frm_tbl td {
    display: block;
    width: 100%;
  }

  .frm_tbl th {
    border-bottom: none;
    padding: 10px 12px;
  }

  .frm_tbl td {
    padding: 12px 0 16px;
  }
}

/* ----------------------------------------
   reCAPTCHA v3 バッジ（.grecaptcha-badgeは外部由来クラスのためハイフン許容）
   バッジ本体はz-index未指定のため、サイト側の固定UI（ページトップボタン等）の
   下に描画されて見えないことがある。明示的に前面へ出す。
   SPでは固定フッターボタンと重なるため上にずらす
---------------------------------------- */
.grecaptcha-badge {
  z-index: var(--z_pagetop);
}

@media (max-width: 767px) {
  .grecaptcha-badge {
    bottom: 90px !important;
  }
}

/* reCAPTCHA注記（バッジが視認できない環境向けのGoogle規定文言） */
.recaptcha_note {
  margin-top: 1em;
  font-size: var(--fz_xs);
  color: var(--color_text_light);
}

/* ----------------------------------------
   ハニーポット（スパム対策）
   contact フォームの name="contact_hp" を画面外に隠す。
   display:none だと一部botが除外してくるため位置ずらしで隠す
---------------------------------------- */
.hp_field {
  position: absolute !important;
  left: -9999px !important;
  top: auto !important;
  width: 1px;
  height: 1px;
  overflow: hidden;
}