/* ===== チャット風フォーム共通CSS ===== */

/* --- ベースフォームスタイル --- */
.fh-form{--navy:#002578;--field-bg:#f5f9fc;--field-border:#e0e6eb;--text:#585757;--label:#333333;padding:40px 0 0;color:var(--label);font-family:"Zen Kaku Gothic New","Noto Sans JP","Hiragino Kaku Gothic ProN","Hiragino Sans","Yu Gothic",sans-serif;font-size:16px;line-height:1.7;text-align:left;}
.fh-form *{box-sizing:border-box;}
.fh-form .field{margin-bottom:28px;}
.fh-form .field-label{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:500;color:var(--label);margin-bottom:8px;}
.fh-form .req{display:inline-block;background:var(--navy);color:#fff;font-size:11px;font-weight:700;line-height:1;padding:4px 8px;border-radius:4px;}
.fh-form .opt{display:inline-block;background:#9aa3b2;color:#fff;font-size:11px;font-weight:700;line-height:1;padding:4px 8px;border-radius:4px;}
.fh-form input[type=text],.fh-form input[type=email],.fh-form input[type=tel],.fh-form select{width:100%;height:64px;background:var(--field-bg);color:var(--text);border:2px solid var(--field-border);border-radius:10px;padding:12px;font-size:16px;font-family:inherit;outline:none;transition:border-color .15s;}
.fh-form input:focus,.fh-form select:focus{border-color:var(--navy);}
.fh-form .hint{font-size:13px;color:#888;margin-top:6px;}
.fh-form .err{display:none;color:#c0392b;font-size:13px;margin-top:6px;}
.fh-form .field.invalid .err{display:block;}
.fh-form .field.invalid input,.fh-form .field.invalid select{border-color:#c0392b;}
/* 入力中（フォーカス中）でも誤りが分かるよう、枠を赤のまま薄い赤地にする */
.fh-form.chat .field.invalid input,.fh-form.chat .field.invalid input:focus,
.fh-form.chat .field.invalid select,.fh-form.chat .field.invalid select:focus{
  border-color:#c0392b;background-color:#fdf3f2;box-shadow:0 0 0 3px rgba(192,57,43,.12);}
.fh-form .consent{display:flex;align-items:flex-start;gap:10px;font-size:14px;color:var(--label);}
.fh-form .consent input{width:20px;height:20px;margin-top:2px;flex-shrink:0;accent-color:var(--navy);}
.fh-form .consent a{color:var(--navy);}
.fh-form .fh-consent-note{background:var(--field-bg);border:2px solid var(--field-border);border-radius:10px;padding:18px 20px;font-size:14px;color:var(--text);text-align:center;margin:50px 0 0;}
.fh-form .fh-consent-note a{color:var(--navy);text-decoration:underline;}
.fh-form .hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden;}
.fh-form .submit-wrap{text-align:center;margin-top:40px;}
.fh-form button[type=submit]{background:var(--navy);color:#fff;border:none;border-radius:10px;padding:18px 40px;font-size:20px;font-weight:700;font-family:inherit;cursor:pointer;width:100%;max-width:654px;transition:opacity .15s;}
.fh-form button[type=submit]:hover{opacity:.9;}
.fh-form #source_other_field{display:none;}
@media(max-width:600px){.fh-form input,.fh-form select{height:56px;}}

/* --- チャット風UI --- */
.fh-form.chat{max-width:626px;margin-left:auto;margin-right:auto;}
.fh-form.chat .field{position:relative;padding-left:56px;}
.fh-form.chat .field::before{content:"";position:absolute;left:0;top:0;width:44px;height:44px;border-radius:50%;background:#eef2f7 url(/seminar/assets/advisor-sample.png) center/cover no-repeat;box-shadow:0 0 0 1px #e0e6eb;}
.fh-form.chat .field-note{display:table;background:#fff;border-radius:16px;box-shadow:0 1px 4px rgba(0,0,0,.08);padding:10px 16px;font-size:14px;color:var(--label);line-height:1.5;margin:-6px 0 14px;}
.fh-form.chat .field-note b{color:#e0600b;font-weight:700;}
/* 質問の前のひとこと（「あと3問です！」など）。質問の吹き出しの上に、同じ吹き出しの形で出す */
.fh-form.chat .field-lead{display:table;background:#fff;border-radius:4px 16px 16px 16px;box-shadow:0 1px 4px rgba(0,0,0,.08);padding:10px 16px;font-size:14px;font-weight:700;color:#e0600b;line-height:1.5;margin:0 0 10px;}
.fh-form.chat .field-lead + .field-label{border-top-left-radius:16px;}
/* 質問文が2行になっても「必須」を縦に割らない */
.fh-form.chat .field-label .req{white-space:nowrap;flex-shrink:0;}
.fh-form .field-note{font-size:13px;margin:0 0 8px;}
.fh-form.chat .field-label{display:inline-flex;align-items:center;gap:8px;background:#fff;border-radius:4px 16px 16px 16px;box-shadow:0 1px 4px rgba(0,0,0,.08);padding:12px 16px;font-size:15px;font-weight:700;color:var(--label);margin-bottom:14px;line-height:1.5;}
.fh-form.chat input[type=text],.fh-form.chat input[type=email],.fh-form.chat input[type=tel],.fh-form.chat select{background:#fff;border:2px solid #f6d3ab;border-radius:12px;}
.fh-form.chat input:focus,.fh-form.chat select:focus{border-color:#f2801f;}
.fh-form.chat #sei,.fh-form.chat #mei{width:213px;display:block;margin-left:auto;}
.fh-form.chat #birth{width:160px;display:block;margin-left:auto;}
.fh-form.chat #email{width:320px;display:block;margin-left:auto;}
.fh-form.chat .field:has(#birth) .hint{margin-left:100px;}
.fh-form.chat #tel{width:220px;display:block;margin-left:auto;}
.fh-form.chat #date,.fh-form.chat #assets,.fh-form.chat #source{width:70%;display:block;margin-left:auto;}
.fh-form.chat #other{width:320px;display:block;margin-left:auto;}
.fh-form.chat .hint{padding-left:2px;}
.fh-form.chat .chat-intro{position:relative;padding-left:56px;margin-bottom:28px;}
.fh-form.chat .chat-intro::before{content:"";position:absolute;left:0;top:0;width:44px;height:44px;border-radius:50%;background:#eef2f7 url(/seminar/assets/advisor-sample.png) center/cover no-repeat;box-shadow:0 0 0 1px #e0e6eb;}
.fh-form.chat .chat-intro .chat-bubble{display:table;background:#fff;border-radius:16px;box-shadow:0 1px 4px rgba(0,0,0,.08);padding:12px 16px;font-size:15px;color:var(--label);margin:0 0 10px;line-height:1.6;}
.fh-form.chat .chat-intro .chat-bubble:first-child{border-top-left-radius:4px;}
.fh-form.chat .chat-intro .chat-bubble:last-child{margin-bottom:0;}
/* 全部答え終わったときの吹き出し（はじめは隠す） */
.fh-form.chat .chat-done{display:none;position:relative;padding-left:56px;margin:0 0 8px;}
.fh-form.chat .chat-done.is-done{display:block;}
.fh-form.chat .chat-done::before{content:"";position:absolute;left:0;top:0;width:44px;height:44px;border-radius:50%;background:#eef2f7 url(/seminar/assets/advisor-sample.png) center/cover no-repeat;box-shadow:0 0 0 1px #e0e6eb;}
.fh-form.chat .chat-done .chat-bubble{display:table;background:#fff;border-radius:16px;box-shadow:0 1px 4px rgba(0,0,0,.08);padding:12px 16px;font-size:15px;color:var(--label);margin:0 0 10px;line-height:1.6;}
.fh-form.chat .chat-done .chat-bubble:first-child{border-top-left-radius:4px;font-weight:700;}
.fh-form.chat .chat-done .chat-bubble:last-child{margin-bottom:0;}
@media (prefers-reduced-motion: no-preference){.fh-form.chat .chat-done.is-done{animation:fhStepIn .6s cubic-bezier(.22,.68,0,1.2) both;}}
.fh-form.chat .chat-reply{display:flex;justify-content:flex-end;align-items:center;gap:8px;margin-top:14px;margin-left:-56px;}
.fh-form.chat .chat-reply .t{font-size:12px;color:#9aa3b2;}
.fh-form.chat .chat-reply .b{display:inline-block;max-width:80%;background:#f2801f;color:#fff;border-radius:16px 4px 16px 16px;padding:10px 16px;font-size:15px;font-weight:700;word-break:break-all;}
.fh-form.chat .field.locked,.fh-form.chat .fh-consent-note.locked,.fh-form.chat .submit-wrap.locked{display:none;}
@media (prefers-reduced-motion: no-preference){.fh-form.chat .step-in{animation:fhStepIn .6s cubic-bezier(.22,.68,0,1.2) both;}}
@keyframes fhStepIn{from{opacity:0;transform:translateY(32px);}to{opacity:1;transform:none;}}
/* 新しい質問が出たことに気づけるよう、吹き出しを一瞬だけ光らせる */
@media (prefers-reduced-motion: no-preference){
  .fh-form.chat .field.attn .field-label{animation:fhAttn 1.6s ease-out 1;}
  .chat-sticky__btn.ready{animation:fhReady 1.2s ease-out 2;}
}
@keyframes fhAttn{0%{box-shadow:0 0 0 0 rgba(242,128,31,.55);}60%{box-shadow:0 0 0 12px rgba(242,128,31,0);}100%{box-shadow:0 1px 4px rgba(0,0,0,.08);}}
@keyframes fhReady{0%,100%{transform:none;box-shadow:0 4px 12px rgba(242,128,31,.3);}50%{transform:translateY(-2px);box-shadow:0 8px 22px rgba(242,128,31,.55);}}

/* --- チャット風UI モバイル (690px) --- */
@media(max-width:690px){
  .fh-form.chat .field{padding-left:44px;}
  .fh-form.chat .field::before{width:36px;height:36px;}
  .fh-form.chat .chat-intro{padding-left:44px;}
  .fh-form.chat .chat-intro::before{width:36px;height:36px;}
  .fh-form.chat .chat-done{padding-left:44px;}
  .fh-form.chat .chat-done::before{width:36px;height:36px;}
  .fh-form.chat #sei,.fh-form.chat #mei{width:100%;}
  .fh-form.chat #birth{width:100%;}
  .fh-form.chat #email{width:100%;}
  .fh-form.chat #tel{width:100%;}
  .fh-form.chat #date,.fh-form.chat #assets,.fh-form.chat #source{width:100%;}
  .fh-form.chat #other{width:100%;}
  .fh-form.chat .field:has(#birth) .hint{margin-left:0;}
  .fh-form.chat .chat-reply{margin-left:-44px;}
}

/* --- Sticky送信ボタン --- */
.chat-sticky{position:sticky;bottom:0;z-index:20;margin:28px -30px 0;padding:16px 30px 16px;background:#fff;box-shadow:0 -4px 14px rgba(0,0,0,.08);display:flex;flex-direction:column;align-items:center;gap:10px;}
.chat-sticky__note{font-size:12px;color:#585757;text-align:center;line-height:1.6;margin:0;}
.chat-sticky__note a{color:#002578;text-decoration:underline;}
.chat-sticky__btn{display:flex;align-items:center;justify-content:center;gap:10px;width:min(560px,100%);background:#f2801f;color:#fff;font-weight:700;font-size:18px;font-family:inherit;text-decoration:none;border:none;cursor:pointer;padding:15px 20px;border-radius:12px;box-shadow:0 4px 12px rgba(242,128,31,.3);transition:transform .12s,opacity .15s;}
.chat-sticky__btn:hover{opacity:.92;transform:translateY(-1px);}
/* 入力が終わるまではグレー（押すと、まだの質問へ案内する）。全部答えたらオレンジに戻り、ふわっと光り続ける */
.chat-sticky__btn.is-waiting{background:#b8bdc3;box-shadow:none;}
.chat-sticky__btn.is-waiting .chat-sticky__badge{color:#8a9097;}
.chat-sticky__btn{transition:transform .12s,opacity .15s,background-color .4s,box-shadow .4s;}
@media (prefers-reduced-motion: no-preference){
  .chat-sticky__btn.is-ready{animation:fhGlow 2.2s ease-in-out infinite;}
}
@keyframes fhGlow{0%,100%{box-shadow:0 4px 12px rgba(242,128,31,.3);filter:brightness(1);}50%{box-shadow:0 0 0 6px rgba(242,128,31,.18),0 8px 24px rgba(242,128,31,.55);filter:brightness(1.07);}}
.chat-sticky__badge{background:#fff;color:#f2801f;font-size:12px;font-weight:700;padding:3px 9px;border-radius:999px;}
@media(max-width:640px){.chat-sticky{margin:28px -16px 0;padding:14px 16px;gap:8px;}.chat-sticky__btn{font-size:16px;padding:14px;}}
/* 同意文には個人情報の取り扱いの注記も入っている（2026-10-06）。画面の下に貼り付くので、スマホでは小さめの文字で
   入力欄を覆いすぎないようにする（隠さず全部見せる） */
@media(max-width:640px){.chat-sticky{padding-top:10px;padding-bottom:12px;gap:6px;}.chat-sticky__note{font-size:11px;line-height:1.45;letter-spacing:0;}}
/* 開催日程の「この日程で申し込む」ボタン（全LP共通） */
.sch-pick{display:inline-flex;align-items:center;gap:4px;background:#f2801f;color:#fff;font-family:inherit;font-size:13px;font-weight:700;line-height:1.4;text-decoration:none;border:none;border-radius:999px;padding:6px 14px;cursor:pointer;white-space:nowrap;transition:transform .12s,opacity .15s;}
.sch-pick:hover{opacity:.92;transform:translateY(-1px);}
.sch-pick:focus-visible{outline:2px solid #1a3164;outline-offset:2px;}
@media(max-width:640px){.sch-pick{font-size:12px;padding:5px 12px;}}
/* ===== 開催日程の行（全LP共通・_schedule_rows） =====
   見本は富裕層向け米ドル債（usfund-wealthy.css の旧 .uw-sched-list）。寸法はそのまま写し、色と数字のフォントだけ LP ごとに変数で変える。
     --sd-ink       文字の色            --sd-line     行の区切り線の色
     --sd-num-font  数字（年月日・時刻）のフォント
     --sd-dow-bg / --sd-dow-fg   曜日の丸
     --sd-pick-bg / --sd-pick-fg / --sd-pick-border  「この日程で申し込む」＝その LP の FV 直下の申込ボタンの背景色・文字色（2026-10-16 広告担当依頼） */
.sd-list{list-style:none;width:648px;max-width:100%;margin:0 auto;padding:0;color:var(--sd-ink,inherit);text-align:center;}
.sd-item{border-bottom:1px solid var(--sd-line,#e9e9e9);padding:24px 32px 23px;}
.sd-row{display:flex;align-items:center;justify-content:center;gap:32px;}
.sd-date{display:flex;align-items:center;gap:8px;font-weight:500;white-space:nowrap;}
.sd-ymd{display:flex;align-items:flex-end;gap:8px;}
.sd-g{display:flex;align-items:flex-end;gap:6px;}
.sd-num{font-family:var(--sd-num-font,inherit);font-size:40px;line-height:40px;font-variant-numeric:tabular-nums;}
/* 月・日の数字は見本で幅 44px の右寄せ枠 */
.sd-g + .sd-g .sd-num{min-width:44px;text-align:right;}
.sd-unit{font-size:20px;line-height:20px;padding-bottom:4px;}
.sd-dow{display:inline-flex;align-items:center;justify-content:center;flex:none;width:32px;height:32px;border-radius:50%;
  background:var(--sd-dow-bg,#a3906c);color:var(--sd-dow-fg,#fff);font-size:16px;line-height:16px;}
.sd-time{display:flex;align-items:center;gap:4px;font-family:var(--sd-num-font,inherit);font-weight:500;font-size:40px;line-height:40px;white-space:nowrap;font-variant-numeric:tabular-nums;}
.sd-list .sd-pick{display:block;width:max-content;margin:12px auto 0;padding:4px 24px;border-radius:30px;
  background:var(--sd-pick-bg,#f2801f) border-box;color:var(--sd-pick-fg,#fff);border:1px solid var(--sd-pick-border,transparent);
  font-size:15px;line-height:24px;font-weight:700;text-decoration:none;cursor:pointer;}
.sd-list .sd-pick:hover{opacity:.88;transform:none;}
/* 表の中（インフレ・不動産・家族信託の「日時」欄）。見本の PC の大きさだと欄からはみ出すので、PC でも小さめ（仮） */
.sd-list--compact .sd-item{padding:14px 0 13px;}
.sd-list--compact .sd-item:first-child{padding-top:4px;}
.sd-list--compact .sd-row{gap:12px;}
.sd-list--compact .sd-num,.sd-list--compact .sd-time{font-size:24px;line-height:28px;}
.sd-list--compact .sd-unit{font-size:14px;line-height:16px;padding-bottom:3px;}
.sd-list--compact .sd-g + .sd-g .sd-num{min-width:28px;}
.sd-list--compact .sd-dow{width:26px;height:26px;font-size:13px;line-height:13px;}
@media (max-width:820px){
  .sd-list{width:100%;}
  .sd-item,.sd-list--compact .sd-item{padding:16px 0 15px;}
  .sd-row,.sd-list--compact .sd-row{gap:6px;}
  .sd-date{gap:6px;}
  .sd-ymd{gap:4px;}
  .sd-g{gap:0;}
  .sd-num,.sd-list--compact .sd-num{font-size:16px;line-height:20.8px;}
  .sd-g + .sd-g .sd-num,.sd-list--compact .sd-g + .sd-g .sd-num{min-width:0;}
  .sd-unit,.sd-list--compact .sd-unit{font-size:12px;line-height:15.6px;padding-bottom:3px;}
  .sd-dow,.sd-list--compact .sd-dow{width:24px;height:24px;font-size:12px;line-height:12px;}
  .sd-time,.sd-list--compact .sd-time{gap:1px;font-size:16px;line-height:20.8px;}
}

/* 受付中の開催日が1件も無いときの案内（開催日の欄と申込フォームの位置に出す。全LP共通） */
.sem-no-date{background:#f7f6f3;border:1px solid #e0ded9;border-radius:6px;padding:20px 24px;text-align:center;
  font-size:15px;line-height:1.9;color:#40464f;}
.sem-no-date b{font-size:16px;color:#1d2433;}
@media (max-width:820px){.sem-no-date{padding:16px;font-size:14px;}}
/* 申込欄の注記（「うまく表示されない場合」の案内・勧誘の注意書き）。フォームの上に置く。個人情報の取り扱いは同意文（.chat-sticky__note）へ移した。
   スマホでは文字を小さくして、申込ボタンから来たときに最初の入力欄まで画面に入るようにする */
@media(max-width:640px){
  .sem-app-note,.sem-app-note p{font-size:11px !important;line-height:1.6 !important;}
  .sem-app-note > *{margin-bottom:16px !important;}
  /* 挨拶の吹き出しの上の余白を詰める（PC は 40px のまま） */
  .fh-form.chat{padding-top:16px;}
}