@charset "UTF-8";
/* =========================================================
   芸森ワーサム WEDDING PHOTO ｜ お問い合わせフォーム（index.html #form）と完了ページ（thanks.html）
   wedding-lp.css のトークン・部品（slabel / note）をそのまま使う。
   ボタン状のチップ・黒ベタのバッジ・白い箱の入力欄は使わない
   ========================================================= */

/* ---------- LP内のフォームセクション（CTAの直後） ---------- */
.wfs{ padding:100px 0 120px; background:var(--bg); }
.wfs__head{ text-align:center; margin-bottom:28px; }
.wfs__en{
  font-family:var(--latin); font-size:15px; letter-spacing:.34em; text-transform:uppercase;
  color:var(--ink-mute); line-height:1.4;
}
.wfs__ttl{
  font-family:var(--serif); font-weight:500; font-size:clamp(22px,2.4vw,28px);
  letter-spacing:.2em; line-height:1.6; margin-top:12px;
}
/* 見出しの下に短い罫線（LPの slabel__rule と同じ線） */
.wfs__ttl::after{ content:""; display:block; width:1px; height:30px; background:var(--line); margin:22px auto 0; }
.wfs__body{ max-width:760px; margin:0 auto; }
.wfs__note{ text-align:center; margin-bottom:44px; font-size:15px; line-height:2.1; }
.wfs__note strong{ font-weight:500; color:var(--ink); }

/* ---------- 完了ページ ---------- */
.wfp{ padding:120px 0 150px; }
.wfp__in{ max-width:760px; }
.wfp__ttl{ margin:30px 0 22px; }
.wfp__body{ margin-top:40px; padding-top:30px; border-top:1px solid var(--ink); }
.wfp__body .wf__btn{ margin-top:40px; }

/* ---------- 表 ---------- */
.wf{ border-top:1px solid var(--ink); }
.wf__error{ padding:16px 0; border-bottom:1px solid var(--line-soft); font-size:13px; line-height:1.9; color:#a4342b; }

.wf__row{ padding:26px 0 28px; border-bottom:1px solid var(--line-soft); }
.wf__label{
  font-family:var(--serif); font-weight:500; font-size:16.5px; letter-spacing:.08em; line-height:1.8;
  display:block; margin-bottom:8px;
}
.wf__req{
  font-family:var(--sans); font-style:normal; font-weight:400;
  font-size:12px; letter-spacing:.14em; color:#a4342b; margin-left:10px; vertical-align:2px;
}
.wf__field{ min-width:0; }
.wf__hint{ font-size:13.5px; color:var(--ink-sub); margin-top:10px; line-height:1.9; letter-spacing:.03em; }
.wf__sub{ display:block; font-size:13px; letter-spacing:.12em; color:var(--ink-sub); }
.wf__pair{ display:grid; grid-template-columns:1fr 1fr; gap:28px; }

/* ---------- 入力欄：下線だけ ---------- */
.wf input[type="text"],
.wf input[type="email"],
.wf input[type="tel"],
.wf input[type="date"],
.wf select{
  width:100%; height:46px; padding:8px 2px;
  font-family:inherit; font-size:15px; line-height:1.6; color:var(--ink);
  background:transparent;
  border:0; border-bottom:1px solid var(--line); border-radius:0;
  transition:border-color .3s;
  -webkit-appearance:none; appearance:none;
}
.wf textarea{
  width:100%; min-height:180px; padding:12px 14px; margin-top:4px;
  font-family:inherit; font-size:15px; line-height:1.9; color:var(--ink);
  background:transparent; border:1px solid var(--line); border-radius:0;
  resize:vertical; transition:border-color .3s;
  -webkit-appearance:none; appearance:none;
}
.wf input:focus, .wf select:focus, .wf textarea:focus{ outline:none; border-color:var(--ink); }
.wf ::placeholder{ color:#bdb9ae; }
.wf input[type="date"]::-webkit-date-and-time-value{ text-align:left; }
.wf input[type="date"]::-webkit-calendar-picker-indicator{ opacity:.45; cursor:pointer; }
.wf input[type="date"].is-empty,
.wf select.is-empty{ color:#bdb9ae; }
.wf select option{ color:var(--ink); }
.wf select{
  padding-right:24px; color:var(--ink);
  background-image:linear-gradient(45deg,transparent 50%,var(--ink-mute) 50%),linear-gradient(135deg,var(--ink-mute) 50%,transparent 50%);
  background-position:calc(100% - 10px) 50%,calc(100% - 5px) 50%;
  background-size:5px 5px,5px 5px; background-repeat:no-repeat;
}
.wf__date{ max-width:220px; }

/* 第一〜第三希望：ラベル／日付／時間帯を1行に */
.wf__dates{ display:grid; gap:4px; }
.wf__dt{ display:grid; grid-template-columns:84px 1fr 1fr; align-items:center; gap:16px; }
.wf__dt .wf__date{ max-width:none; }

/* ---------- ラジオ・チェック：紙の申込書のような小さな枠 ---------- */
.wf__choices{ display:flex; flex-wrap:wrap; gap:12px 30px; padding-top:4px; }
.wf__choices--col{ display:grid; grid-template-columns:repeat(2,max-content); gap:12px 48px; }
.wf__check small{ white-space:nowrap; }
.wf__check{ display:inline-block; cursor:pointer; position:relative; }
.wf__check input{ position:absolute; opacity:0; width:1px; height:1px; }
.wf__check > span{
  display:inline-block; position:relative; padding-left:26px;
  font-size:15px; letter-spacing:.04em; line-height:1.8; color:var(--ink-sub);
  transition:color .25s;
}
.wf__check > span::before{
  content:""; position:absolute; left:0; top:.42em;
  width:14px; height:14px; border:1px solid var(--ink-mute); background:transparent;
  transition:border-color .25s;
}
.wf__check > span::after{
  content:""; position:absolute; left:4px; top:calc(.42em + 4px);
  width:6px; height:6px; background:var(--ink);
  opacity:0; transition:opacity .2s;
}
.wf__check input[type="radio"] + span::before,
.wf__check input[type="radio"] + span::after{ border-radius:50%; }
.wf__check input:checked + span{ color:var(--ink); }
.wf__check input:checked + span::before{ border-color:var(--ink); }
.wf__check input:checked + span::after{ opacity:1; }
.wf__check input:focus-visible + span::before{ outline:1px solid var(--ink); outline-offset:2px; }
.wf__check small{ font-size:12px; letter-spacing:.12em; color:var(--ink-mute); margin-left:10px; }
.wf__check--solo{ margin-top:16px; }

/* ---------- 送信 ---------- */
.wf__foot{ padding-top:40px; display:flex; flex-direction:column; align-items:center; gap:30px; }
.wf__accept a{ color:var(--ink); border-bottom:1px solid var(--line); }
.wf__btn{
  display:inline-block; min-width:300px; padding:19px 48px;
  font-family:inherit; font-size:13px; letter-spacing:.26em; line-height:1.6; text-align:center;
  color:var(--bg); background:var(--ink); border:1px solid var(--ink); border-radius:0;
  cursor:pointer; transition:background .35s, color .35s;
  -webkit-appearance:none; appearance:none;
}
.wf__btn:hover{ background:transparent; color:var(--ink); }
.wf__btn:disabled{ opacity:.5; cursor:default; }

/* ---------- エラー ---------- */
.wf .is-invalid{ border-color:#a4342b !important; }
.wf__choices.is-invalid .wf__check > span::before,
.wf__check.is-invalid > span::before{ border-color:#a4342b; }
.wf__msg{ font-size:13px; color:#a4342b; margin-top:8px; line-height:1.8; }
.wf .is-weekend{ border-color:#a4342b !important; }
.wf__weekend-msg{ font-size:13px; color:#a4342b; margin-top:10px; display:none; }
.wf__weekend-msg.is-on{ display:block; }

/* 人には見えないスパム対策欄 */
.wf__hp{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }

@media (max-width:767px){
  .wfs{ padding:72px 0 88px; }
  .wfs__en{ font-size:13.5px; }
  .wfs__note{ text-align:left; margin-bottom:30px; font-size:14.5px; }
  .wfs__note br{ display:none; }
  .wfp{ padding:72px 0 100px; }
  .wfp__ttl{ margin:24px 0 18px; }
  .wf__row{ padding:22px 0 24px; }
  .wf__pair{ grid-template-columns:1fr; gap:14px; }
  .wf__date{ max-width:none; }
  .wf__dt{ grid-template-columns:1fr 1fr; gap:0 14px; padding-top:8px; }
  .wf__dt .wf__sub{ grid-column:1 / -1; }
  .wf__choices{ gap:12px 24px; }
  .wf__choices--col{ grid-template-columns:1fr; }
  .wf__foot{ align-items:stretch; }
  .wf__btn{ min-width:0; width:100%; }
}