/* generated from src/form.css by _design/tools/build_css.py — 編集は src/ 側で */
/* ==========================================================================
   資料請求・ご来場予約（XD：SP「資料請求」390×3194／「来場予約」390×3333）
   PC はデザインなし：PC3ページの寸法ルール（ラベル x200/y80）で、フォームは幅600の中央カラムにした
   確認画面・送信完了画面は XD にないため、入力画面の部品で制作部が作成
   2026-10-30 Contact Form 7 化：CF7 が入力欄を span.wpcf7-form-control-wrap で包み、
   ラジオ・チェックを span.wpcf7-list-item > label > input + span.wpcf7-list-item-label で出すため、その形に合わせた
   ========================================================================== */
.p-request .l-main, .p-reserve .l-main { background: var(--c-gray); }
.pg-form { padding-bottom: calc(91 * var(--u)); background: var(--c-gray); }
.pg-request .c-label__box :is(img, .c-chars):last-child { width: calc(81.93 * var(--u)); }
.pg-reserve .c-label__box :is(img, .c-chars):last-child { width: calc(99.55 * var(--u)); }
.pg-form .c-label { font-size: inherit; font-weight: 400; }

.fm-intro, .fm-must, .fm { width: calc(600 * var(--u)); margin-left: auto; margin-right: auto; }
.fm-intro { position: relative; top: calc(0.54 * var(--u)); margin-top: calc(65.5 * var(--u)); font-size: calc(15 * var(--u)); line-height: calc(28 * var(--u)); }
.pg-reserve .fm-intro { letter-spacing: -0.02em; }
.fm-must { position: relative; top: calc(0.4 * var(--u)); margin-top: calc(26.3 * var(--u)); font-size: calc(12 * var(--u)); line-height: calc(28 * var(--u)); letter-spacing: 0.03em; }
.pg-reserve .fm-must { margin-top: calc(28.3 * var(--u)); }

.fm { position: relative; }
.fm-hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.fm-notice { margin-top: calc(20 * var(--u)); padding: calc(10 * var(--u)) calc(14 * var(--u)); border: calc(1 * var(--u)) solid #c8102e; color: #c8102e; font-size: calc(13 * var(--u)); line-height: calc(22 * var(--u)); }

/* 項目 */
.fm-field { margin-top: calc(var(--fm-gap, 36.5) * var(--u)); }
.fm-field:first-of-type { margin-top: calc(25.7 * var(--u)); }
.fm-label { position: relative; top: calc(0.54 * var(--u)); display: block; font-size: calc(15 * var(--u)); line-height: calc(28 * var(--u)); letter-spacing: 0.03em; }
.fm-req { position: absolute; left: calc(var(--mx, 0) * var(--u)); top: calc(-2.9 * var(--u)); font-size: calc(10 * var(--u)); line-height: calc(28 * var(--u)); }
.fm-control { margin-top: calc(11.5 * var(--u)); }
.fm-input {
  display: block; width: 100%; height: calc(44 * var(--u)); padding: 0 calc(14 * var(--u));
  border: calc(1 * var(--u)) solid rgba(75, 68, 66, .5); border-radius: 0; background: transparent;
  font-family: var(--f-ja); font-size: calc(15 * var(--u)); letter-spacing: 0.03em; color: var(--c-text);
  -webkit-appearance: none; appearance: none;
}
.fm .wpcf7-form-control-wrap { display: block; }
.fm-input::placeholder { color: rgba(75, 68, 66, .5); opacity: 1; }
.fm-input:focus { outline: calc(2 * var(--u)) solid var(--c-accent); outline-offset: calc(-1 * var(--u)); }
.fm-field--pair .fm-control { display: grid; grid-template-columns: 1fr 1fr; column-gap: calc(10 * var(--u)); }

/* ご住所 */
.fm-zip { display: grid; grid-template-columns: calc(32 * var(--u)) 1fr calc(32 * var(--u)) 1fr; align-items: start; }
.fm-zip__mark, .fm-zip__dash { position: relative; top: calc(9.04 * var(--u)); font-size: calc(15 * var(--u)); line-height: calc(28 * var(--u)); letter-spacing: 0.03em; }
.fm-zip__dash { padding-left: calc(9 * var(--u)); }
.fm-field--address .wpcf7-form-control-wrap + .wpcf7-form-control-wrap { margin-top: calc(14 * var(--u)); }
.fm-zip + .wpcf7-form-control-wrap { margin-top: calc(15 * var(--u)); }

/* 複数行 */
.fm-textarea { height: calc(88 * var(--u)); padding-top: calc(7.5 * var(--u)); padding-bottom: calc(6.5 * var(--u)); line-height: calc(28 * var(--u)); resize: vertical; }
.fm-textarea--l { height: calc(176 * var(--u)); }

/* ラジオ・チェック（XD：線の箱の中に ◯ と文字） */
.fm-opts { display: grid; row-gap: calc(10 * var(--u)); }
.fm-opts--3 { grid-template-columns: 1fr calc(9 * var(--u)) 1fr calc(8 * var(--u)) 1fr; }
.fm-opts--3 .wpcf7-list-item:nth-child(3n+2) { grid-column: 3; }
.fm-opts--3 .wpcf7-list-item:nth-child(3n) { grid-column: 5; }
.fm-opts--2 { grid-template-columns: 1fr 1fr; column-gap: calc(10 * var(--u)); }
.fm-field--check .fm-opts--2 { column-gap: calc(12 * var(--u)); }
.fm-opts .wpcf7-list-item { position: relative; display: block; height: calc(32 * var(--u)); margin: 0; border: calc(1 * var(--u)) solid rgba(75, 68, 66, .5); }
.fm-opts .wpcf7-list-item > label { position: absolute; inset: 0; cursor: pointer; }
.fm-opts input {
  position: absolute; left: calc(14 * var(--u)); top: calc(8 * var(--u)); width: calc(15 * var(--u)); height: calc(15 * var(--u)); margin: 0;
  border: calc(1 * var(--u)) solid var(--c-text); border-radius: 50%; background: transparent; -webkit-appearance: none; appearance: none; cursor: pointer;
}
.fm-opts input:checked { background: radial-gradient(circle, var(--c-text) 0 calc(3.5 * var(--u)), transparent calc(3.6 * var(--u))); }
.fm-opts input:focus-visible { outline: calc(2 * var(--u)) solid var(--c-accent); outline-offset: calc(2 * var(--u)); }
.fm-opts .wpcf7-list-item-label { position: absolute; left: calc(37 * var(--u)); top: calc(1.2 * var(--u)); font-size: calc(12 * var(--u)); line-height: calc(28 * var(--u)); letter-spacing: 0.03em; white-space: nowrap; }

/* 日時 */
.fm-select { position: relative; width: calc((100% - calc(10 * var(--u))) / 2); height: calc(32 * var(--u)); margin-top: calc(10 * var(--u)); border: calc(1 * var(--u)) solid rgba(75, 68, 66, .5); }
.fm-select .wpcf7-form-control-wrap { height: 100%; }
.fm-select select {
  display: block; width: 100%; height: 100%; padding: 0 0 0 calc(17 * var(--u)); border: 0; background: transparent;
  font-family: var(--f-ja); font-size: calc(12 * var(--u)); letter-spacing: 0.03em; color: var(--c-text); -webkit-appearance: none; appearance: none; cursor: pointer;
}
.fm-select::after {
  content: ""; position: absolute; left: calc(143.8 * var(--u)); top: calc(12.2 * var(--u)); width: calc(14.67 * var(--u)); height: calc(7.84 * var(--u)); pointer-events: none;
  background: url(../svg/common/chevron-down.svg) no-repeat 0 0 / 100% 100%;
}
.fm-field--datetime input[type="date"] { line-height: calc(42 * var(--u)); }

/* 人数 */
.fm-field--people .fm-control { display: flex; align-items: flex-start; }
.fm-field--people .fm-input { width: calc(169 * var(--u)); }
.fm-unit { position: relative; top: calc(9.04 * var(--u)); margin-left: calc(11 * var(--u)); font-size: calc(15 * var(--u)); line-height: calc(28 * var(--u)); letter-spacing: 0.03em; }

.fm-error { margin-top: calc(6 * var(--u)); color: #c8102e; font-size: calc(12 * var(--u)); line-height: calc(20 * var(--u)); }
.fm-field.is-error .fm-input, .fm-field.is-error .wpcf7-list-item,
.fm .fm-input.wpcf7-not-valid, .fm .wpcf7-not-valid .wpcf7-list-item { border-color: #c8102e; }
.fm .wpcf7-not-valid-tip { display: block; margin-top: calc(6 * var(--u)); color: #c8102e; font-size: calc(12 * var(--u)); line-height: calc(20 * var(--u)); }
.fm-zip .wpcf7-not-valid-tip { white-space: nowrap; }

/* 同意 */
.fm-agree { margin-top: calc(55.3 * var(--u)); text-align: center; }
.fm-agree .wpcf7-list-item { margin: 0; }
.fm-agree label { position: relative; display: inline-block; padding-left: calc(25 * var(--u)); font-size: calc(13 * var(--u)); line-height: calc(28 * var(--u)); letter-spacing: 0.03em; cursor: pointer; }
.fm-agree label > span { position: relative; top: calc(0.47 * var(--u)); }
/* XD：「個人情報の取り扱い」に下線、チェック枠は「□」の文字（線が細く、文字色の約半分の濃さに見える）（2026-10-27 F4） */
.fm-agree .u-privacy { color: inherit; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 1px; }
a.u-privacy:hover { text-decoration: none; }
.fm-agree input {
  position: absolute; left: calc(1 * var(--u)); top: calc(9.7 * var(--u)); width: calc(13 * var(--u)); height: calc(12.5 * var(--u)); margin: 0;
  border: calc(1 * var(--u)) solid rgba(44, 35, 33, .53); border-radius: 0; background: transparent; -webkit-appearance: none; appearance: none; cursor: pointer;
}
.fm-agree input:checked::after {
  content: ""; position: absolute; left: calc(3.5 * var(--u)); top: calc(0.5 * var(--u)); width: calc(4 * var(--u)); height: calc(8 * var(--u));
  border: solid var(--c-text); border-width: 0 calc(1.5 * var(--u)) calc(1.5 * var(--u)) 0; transform: rotate(45deg);
}
.fm-agree input:focus-visible { outline: calc(2 * var(--u)) solid var(--c-accent); outline-offset: calc(2 * var(--u)); }

.fm-note { position: relative; top: calc(0.54 * var(--u)); width: calc(360 * var(--u)); margin-top: calc(54 * var(--u)); font-size: calc(15 * var(--u)); line-height: calc(28 * var(--u)); letter-spacing: -0.03em; }

/* ボタン（XD：180×39・角丸5・#4b4442 40%。同意にチェックが入ったら濃くする） */
.fm-actions { margin-top: calc(64.7 * var(--u)); text-align: center; } /* XD 63.7。小数の積み上がり（−1）を補正 */
.fm-note + .fm-actions { margin-top: calc(54.5 * var(--u)); } /* XD 53.5（同上 −1 補正） */
.fm-submit, .fm-back {
  display: inline-block; width: calc(180 * var(--u)); height: calc(39 * var(--u)); padding-top: calc(8 * var(--u)); border: 0; border-radius: calc(5 * var(--u));
  background: rgba(75, 68, 66, .396377); color: #e5e7e8; text-align: center; text-decoration: none;
  font-family: var(--f-ja); font-size: calc(15 * var(--u)); font-weight: 500; line-height: calc(22 * var(--u)); letter-spacing: 0.05em; cursor: pointer;
  transition: background-color .3s, opacity .3s;
}
.fm:has(.fm-agree input:checked) .fm-submit, .fm-submit.is-active { background: #4b4442; }
.fm-submit:hover, .fm-back:hover { opacity: .8; }
.fm-back { background: transparent; border: calc(1 * var(--u)) solid #4b4442; color: #4b4442; }
button.fm-submit, button.fm-back, input.fm-submit { padding: 0 0 calc(2 * var(--u)); } /* button は中身を上下中央に置くため、下だけ空けて XD の位置（上から7.5）に合わせる */
.fm-actions--confirm { position: relative; display: flex; justify-content: center; gap: calc(20 * var(--u)); margin-top: calc(50 * var(--u)); }
.fm-actions--confirm .wpcf7-spinner { position: absolute; left: 50%; top: 100%; margin: calc(12 * var(--u)) 0 0 -12px; }

/* CF7 のお知らせ（入力の不備・送信できなかった時など） */
.wpcf7 form.fm .wpcf7-response-output { margin: calc(30 * var(--u)) 0 0; padding: calc(10 * var(--u)) calc(14 * var(--u)); border: calc(1 * var(--u)) solid #c8102e; color: #c8102e; font-size: calc(13 * var(--u)); line-height: calc(22 * var(--u)); text-align: left; }
.wpcf7 form.fm.sent .wpcf7-response-output { border-color: rgba(75, 68, 66, .5); color: var(--c-text); }

/* 確認画面 */
.fm-lead { margin-top: calc(40 * var(--u)); font-size: calc(15 * var(--u)); line-height: calc(28 * var(--u)); }
.fm-confirm { margin-top: calc(20 * var(--u)); border-top: calc(1 * var(--u)) solid rgba(75, 68, 66, .5); }
.fm-confirm__row { display: flex; padding: calc(14 * var(--u)) 0; border-bottom: calc(1 * var(--u)) solid rgba(75, 68, 66, .5); font-size: calc(15 * var(--u)); line-height: calc(28 * var(--u)); }
.fm-confirm dt { flex: 0 0 calc(220 * var(--u)); font-size: calc(13 * var(--u)); }
.fm-confirm dd { flex: 1; margin: 0; word-break: break-all; }
.fm-empty { color: rgba(75, 68, 66, .6); }

/* 送信完了 */
.fm--done { margin-top: calc(60 * var(--u)); text-align: center; }
.fm-done__title { font-size: calc(18 * var(--u)); font-weight: 500; line-height: calc(30 * var(--u)); letter-spacing: 0.05em; }
.fm-done__text { margin-top: calc(20 * var(--u)); font-size: calc(15 * var(--u)); line-height: calc(28 * var(--u)); }
.fm--done .fm-actions { margin-top: calc(40 * var(--u)); }

/* ---------- TB ---------- */
@media (min-width: 768px) and (max-width: 1023px) {
  .pg-form .c-label { margin-left: 32px; }
}

/* ---------- SP（XD どおり） ---------- */
@media (max-width: 767px) {
  .fm-intro, .fm-must, .fm { width: auto; margin-left: calc(20 * var(--u)); margin-right: calc(20 * var(--u)); }
  .fm-intro { white-space: nowrap; }
  .fm-confirm__row { display: block; }
  .fm-confirm dt { font-weight: 500; }
  .fm-actions--confirm { gap: calc(10 * var(--u)); }
  .fm-actions--confirm :is(button, input) { width: calc(165 * var(--u)); }
}
