/*
 * 中古バス お問い合わせフォーム専用スタイル
 * 既存テーマ（hokto-style.min.css）の上に重ねる前提。すべて #u-bus-contact の中に限定する。
 * 色・余白・ブレークポイントは既存サイトに合わせている（769px以上がPC）。
 * 必須・任意の印（.must / .any）、表（table.type-border）、送信ボタン（input[type=submit]）はテーマのものをそのまま使う。
 */

/* Keep essential content visible before scrolling and without animation scripts. */
#u-bus-contact .fadeIn,
#u-bus-contact .fadeInUp,
#u-bus-contact .fadeView,
#u-bus-contact .fadeViewUp,
#u-bus-contact .fadeViewLeft,
#u-bus-contact .fadeViewRight {
  opacity: 1;
  transform: none;
  animation: none;
  transition: none;
}

/* ---------- 導入 ---------- */
#u-bus-contact .intro-area .text { line-height: 2; }
@media (min-width: 769px) {
  #u-bus-contact .intro-area .text { text-align: center; }
}
#u-bus-contact .cm-notes { margin-top: 1.25rem; }
#u-bus-contact .cm-notes li { position: relative; padding-left: 1.2em; font-size: .875rem; line-height: 1.8; }
#u-bus-contact .cm-notes li + li { margin-top: .4rem; }
#u-bus-contact .cm-notes li::before { content: "●"; position: absolute; left: 0; top: .15em; font-size: .6em; color: #00b555; }
@media (min-width: 769px) {
  #u-bus-contact .cm-notes li { font-size: 1rem; }
}

/* ---------- 電話（hokto.co.jp のお問い合わせページ #contact .tel-area と同じ見た目） ---------- */
#u-bus-contact .tel-area { padding-right: 1rem; padding-left: 1rem; }
#u-bus-contact .cm-tel { display: flex; flex-wrap: wrap; justify-content: center; border-radius: 1rem; border: solid 3px #eee; }
#u-bus-contact .cm-tel dt,
#u-bus-contact .cm-tel dd { font-weight: 700; }
#u-bus-contact .cm-tel dt small { display: block; font-size: .8125rem; font-weight: 500; color: #666; }
#u-bus-contact .cm-tel dd { font-size: 1.5rem; text-align: center; }
#u-bus-contact .cm-tel dd a { color: #00b555; }
@media (max-width: 768px) {
  #u-bus-contact .cm-tel { flex-direction: column; align-items: center; width: 100%; text-align: center; }
  #u-bus-contact .cm-tel dd { margin-bottom: 1rem; }
  #u-bus-contact .cm-tel dd:last-child { margin-bottom: 0; }
}
@media (min-width: 769px) {
  #u-bus-contact .cm-tel { align-items: flex-end; }
  #u-bus-contact .cm-tel dt { width: 45%; font-size: 1.125rem; margin-bottom: .2em; }
  #u-bus-contact .cm-tel dd { width: 30%; }
}
#u-bus-contact .cm-dept { margin-top: 1.25rem; text-align: center; font-size: .8125rem; line-height: 1.8; }
#u-bus-contact .cm-dept strong { display: block; font-size: 1rem; }
@media (min-width: 769px) {
  #u-bus-contact .cm-dept { font-size: .875rem; }
}

/* ---------- フォーム ---------- */
#u-bus-contact .mail-area th p { margin: 0; }
#u-bus-contact .mail-area td p { margin: 0; }
#u-bus-contact .cm-help { display: block; margin-top: .5em; font-size: .8125rem; line-height: 1.6; color: #666; }
#u-bus-contact .cm-short { max-width: 20em; }
#u-bus-contact .cm-radios { display: flex; flex-wrap: wrap; gap: .6rem 1.5rem; padding: .3em 0; }
#u-bus-contact .cm-radios label { display: inline-flex; align-items: center; gap: .45em; font-weight: 500; }
#u-bus-contact .cm-radios input { width: 1.2em; height: 1.2em; margin: 0; accent-color: #00b555; }
#u-bus-contact textarea { height: 12em; }
#u-bus-contact .cm-files { display: grid; gap: .75rem; }
#u-bus-contact .cm-files input[type=file] {
  display: block;
  width: 100%;
  padding: .45em .5em;
  font-size: .875rem;
  line-height: 1.5;
  color: #075858;
  background: #fff;
  border: solid 1px #ccc;
  border-radius: 5px;
}
#u-bus-contact .cm-files input[type=file]::file-selector-button {
  font: inherit;
  font-weight: 700;
  letter-spacing: .05em;
  color: #00b59d;
  background: #fff;
  border: solid 1px #00b59d;
  border-radius: 30px;
  padding: .3em 1em;
  margin-right: .75em;
  cursor: pointer;
}
@media (min-width: 769px) {
  #u-bus-contact .cm-files input[type=file]::file-selector-button:hover { color: #fff; background: #00b59d; }
}

/* ---------- 個人情報の取扱い ---------- */
#u-bus-contact .cm-privacy { padding: 1.25rem 1rem 1.5rem; }
@media (min-width: 769px) {
  #u-bus-contact .cm-privacy { padding: 2rem 2.5rem 2.25rem; }
}
#u-bus-contact .cm-privacy .third-title { margin-bottom: .75em; }
#u-bus-contact .cm-privacy li { position: relative; padding-left: 1.2em; font-size: .875rem; line-height: 1.8; }
#u-bus-contact .cm-privacy li + li { margin-top: .3rem; }
#u-bus-contact .cm-privacy li::before { content: "●"; position: absolute; left: 0; top: .15em; font-size: .6em; color: #00b555; }
#u-bus-contact .cm-agree { margin-top: 1.25rem; text-align: center; font-weight: 700; }
#u-bus-contact .cm-agree label { display: inline-flex; align-items: center; gap: .5em; }
#u-bus-contact .cm-agree input { width: 1.2em; height: 1.2em; margin: 0; accent-color: #00b555; }

/* ---------- エラー・送信 ---------- */
#u-bus-contact .cm-error {
  margin-top: 1.5rem;
  padding: .9rem 1.25rem;
  font-size: .875rem;
  font-weight: 700;
  line-height: 1.6;
  color: #fff;
  background: #c42b0c;
  border-radius: .5rem;
}
#u-bus-contact .cm-error[hidden] { display: none; }
#u-bus-contact .cm-submit input[type=submit] { margin-top: 2rem; }
#u-bus-contact .cm-submit input[type=submit]:disabled { opacity: .5; cursor: default; }
#u-bus-contact .cm-submit-note { margin-top: 1rem; font-size: .8125rem; line-height: 1.6; color: #666; }

/* ---------- U-BUSへ戻る ---------- */
#u-bus-contact .cm-back { display: flex; justify-content: center; }
#u-bus-contact .cm-back .btn-arrow-circle { width: 100%; max-width: 440px; height: 4rem; }

/* ---------- 社内確認用（北ポ）だけに出るもの ---------- */
#u-bus-contact .cm-portal-note {
  margin-bottom: 1.5rem;
  padding: .9rem 1.25rem;
  font-size: .875rem;
  font-weight: 700;
  line-height: 1.6;
  color: #c42b0c;
  background: #fdeee9;
  border: solid 1px #c42b0c;
  border-radius: .5rem;
}
#u-bus-contact .cm-review { margin-top: 2rem; padding: 1.25rem 1rem 1.5rem; border: solid 3px #eee; border-radius: 1rem; }
#u-bus-contact .cm-review[hidden] { display: none; }
#u-bus-contact .cm-review .third-title { margin-bottom: .75em; }
#u-bus-contact .cm-review dl { display: grid; grid-template-columns: 11em 1fr; gap: .5em 1em; margin-top: 1rem; font-size: .875rem; }
#u-bus-contact .cm-review dt { font-weight: 700; color: #00b59d; }
#u-bus-contact .cm-review dd { white-space: pre-wrap; word-break: break-all; }
@media (max-width: 768px) {
  #u-bus-contact .cm-review dl { grid-template-columns: 1fr; gap: .15em; }
  #u-bus-contact .cm-review dd { margin-bottom: .6em; }
}
@media (min-width: 769px) {
  #u-bus-contact .cm-review { padding: 2rem 2.5rem; }
}
