/* ============================================================
 * aj-inquiry.css — お問い合わせ／ココヘリ解約申請／解約の完了の3ページだけの見た目（No.115・`D-0098`）
 *
 *   なぜ別に持つか:
 *     ⑴ 現行の3ページは WordPress（Bootstrap 4.0.0-alpha.6＋テーマ `hitococo`）の見た目で、
 *        申込フォーム（Webflow 由来の `aj-common.css`）とは**別の見た目**＝`aj-common.css` の `.btn`・入力欄をそのまま使うと
 *        ピル形のボタン・黒枠の入力欄になり、現行と違って見える。⇒ **`.aj-inq` の中だけ**で現行の値に寄せる。
 *     ⑵ `aj-common.css` に足さない理由＝配信（CloudFront）で最長24時間古いものが出る（版の印が無い）＝
 *        足した分がしばらく効かない。新しいファイルなら初回は新しいものが出る。
 *     ⑶ MT のモジュールにしない理由＝束の展開（`scripts/aws/mt_release_remote.sh`）が共通ページ用に写すモジュールは
 *        `mod-measurement`・`mod-header` の2本だけ＝足すと再構築で Include が解決できない。アセットなら `assets/*` で届く。
 *
 *   値の出どころ（現行の実物）:
 *     `docs/reference/customer/forms/hitococo.com/wp/wp-content/themes/hitococo/common/css/style.css`（`.table_res`）・
 *     `simple_page.css`（`.simple_body`・見出し）・Bootstrap 4.0.0-alpha.6 の既定値（`.form-control`・`.btn`・`.badge`・`.card`）・
 *     MW WP Form の `css/style.css`（エラー文言＝`#B70000`・93%）・各ページ本文の `<style>`（高さ40px・電話の欄28%・備考の欄）。
 *   入力: なし（`mt/templates/pages/contact.mtml`・`cancel-cocoheli.mtml`・`cancel-thanks-cocoheli.mtml` が読む）。
 *   対: `aj-inquiry.js` が付け外しするクラス＝`is-confirm`・`has-error`・`aj-field-error`・`aj-inq__value`。
 * ============================================================ */
.aj-inq { padding: 2rem 0; background: #fff; color: #292b2c; line-height: 1.5; }
/* ★`hidden` を確実に効かせる＝下の `.btn { display: inline-block }` が UA の `display: none` に勝ち、
   入力画面でも「修正する」が見えていた（2026-10-22 に画面で測って発覚） */
.aj-inq [hidden] { display: none !important; }
.aj-inq__container { max-width: 900px; margin: 0 auto; padding: 0 15px; }
.aj-inq a { color: #0275d8; }
.aj-inq h1, .aj-inq .aj-inq__h1 { font-size: 1.5rem; font-weight: 500; line-height: 1.1; padding-bottom: .7em; margin: 0 0 1.5rem; }
.aj-inq h2 { font-size: 1.2rem; font-weight: 500; line-height: 1.1; margin: 1em 0 1em; }
.aj-inq h3 { font-size: 1rem; font-weight: 500; line-height: 1.1; }
.aj-inq hr { border: 0; border-top: 1px solid rgba(0,0,0,.1); margin: 1rem 0; }
.aj-inq__lead { font-size: 1rem; font-weight: 500; line-height: 1.1; margin: 0 0 .5rem; }
.aj-inq ul { margin: 0 0 1rem; }
.aj-inq__alert { color: red; }
.aj-inq__faq { display: flex; flex-wrap: wrap; margin: 50px -15px 0; text-align: center; }
.aj-inq__faq a { flex: 0 0 100%; max-width: 100%; padding: 0 15px; }
.aj-inq__faq img { max-width: 100%; height: auto; }
.aj-inq__formwrap { margin: 0 0 3rem; padding-top: 1rem; }
/* 表（現行 .table.table-bordered.table_res） */
.aj-inq__table { width: 100%; max-width: 100%; margin-bottom: 1rem; border-collapse: collapse; table-layout: fixed; }
.aj-inq__table th, .aj-inq__table td { padding: .75rem; vertical-align: top; border: 1px solid #c8c8c8; text-align: left; }
.aj-inq__table th { background: #ddd; width: 30%; font-weight: bold; }
.aj-inq__table label { display: inline-block; margin-bottom: .5rem; }
.aj-inq__table p { margin: 0 0 1rem; }
.aj-inq__badge { display: inline-block; padding: .25em .4em; font-size: 75%; font-weight: bold; line-height: 1; color: #fff; text-align: center; white-space: nowrap; vertical-align: baseline; border-radius: .25rem; background-color: #d9534f; }
/* 入力欄（現行 .form-control＋ページの style の height:40px） */
.aj-inq__control { display: block; width: 100%; height: 40px; padding: .5rem .75rem; font-size: 1rem; line-height: 1.25; color: #464a4c; background-color: #fff; border: 1px solid rgba(0,0,0,.15); border-radius: .25rem; font-family: inherit; }
textarea.aj-inq__control { height: auto; }
.aj-inq__control--content { height: 325px; }
.aj-inq__control:focus { color: #464a4c; border-color: #5cb3fd; outline: 0; }
/* 電話（現行 MW WP Form の3分割＝.mwform-tel-field > .form-control { width: 28% }） */
.aj-inq__tel { display: inline-block; width: 100%; }
.aj-inq__tel .aj-inq__control { display: inline-block; width: 28%; vertical-align: middle; }
.aj-inq__devid { display: inline-block; width: auto; }
/* 解約の「備考」（現行 textarea[name="content"] { width: 200px; border: none }・右寄せ） */
.aj-inq__memo { display: flex; justify-content: flex-end; }
.aj-inq__memo .aj-inq__control { width: 200px; border: none; height: auto; }
/* ハニーポット＝画面では見えない（読み上げにも出さない） */
.aj-inq__hp { position: absolute !important; left: -9999px; top: auto; width: 1px; height: 1px; overflow: hidden; }
/* 確認画面＝入力欄を隠して値を出す（現行 MW WP Form の確認画面＝値の文字だけ） */
.aj-inq__value { white-space: pre-wrap; word-break: break-all; }
.aj-inq__form.is-confirm .aj-inq__control, .aj-inq__form.is-confirm .aj-inq__tel { display: none; }
/* エラー（現行 MW WP Form の .error） */
.aj-field-error { display: block; font-size: 93%; color: #B70000; margin: 0; }
.aj-inq__msg { color: #B70000; text-align: center; margin: 1rem 0; }
/* ボタン（現行 Bootstrap の .btn・.btn-primary・.btn-warning） */
.aj-inq .btn { display: inline-block; font-weight: normal; line-height: 1.25; text-align: center; white-space: nowrap; vertical-align: middle; cursor: pointer; border: 1px solid transparent; padding: .5rem 1rem; font-size: 1rem; border-radius: .25rem; margin: 0; font-family: inherit; text-decoration: none; }
.aj-inq .btn-primary { color: #fff; background-color: #0275d8; border-color: #0275d8; }
.aj-inq .btn-primary:hover { background-color: #025aa5; border-color: #01549b; }
.aj-inq .btn-warning { color: #fff; background-color: #f0ad4e; border-color: #f0ad4e; }
.aj-inq .btn-warning:hover { background-color: #ec971f; border-color: #eb9316; }
.aj-inq .btn[disabled] { opacity: .65; cursor: not-allowed; }
.aj-inq__actions { text-align: center; }
/* 連絡先の枠（現行 section.card > .card-block.pt-5.pb-0） */
.aj-inq__card { border: 1px solid rgba(0,0,0,.125); border-radius: .25rem; margin-bottom: 3rem; padding: 3rem 1.25rem 0; }
.aj-inq__card-row { display: flex; flex-wrap: wrap; justify-content: center; text-align: center; }
.aj-inq__card-col { flex: 0 0 100%; max-width: 100%; padding: 0 15px; margin-bottom: 4rem; }
.aj-inq__card h2 { font-size: 1rem; margin: 0 0 .5rem; }
.aj-inq__card .aj-inq__card-tel-h { margin-bottom: 0; }
.aj-inq__card-tel { font-size: 1.75rem; font-weight: 500; line-height: 1.1; margin: 0; }
.aj-inq__card-mail { font-size: 1.25rem; font-weight: 500; line-height: 1.1; margin: 0; }
/* 解約申請の注意（現行 .appeal_block_style） */
.aj-inq__appeal { width: 80%; margin: 0 auto; }
.aj-inq__appeal li { margin-bottom: 10px; }
.aj-inq__center { text-align: center; }
.aj-inq__done-h { color: #d9534f; margin: 1.5rem 0 !important; }
@media (min-width: 768px) {
  .aj-inq__faq a, .aj-inq__card-col { flex: 0 0 50%; max-width: 50%; }
}
@media (min-width: 992px) {
  .aj-inq { padding: 4rem 0; }
  .aj-inq h1, .aj-inq .aj-inq__h1 { text-align: center; }
  .aj-inq h2 { font-size: 1.4rem; margin: 2em 0 1em; }
  .aj-inq__card h2 { font-size: 1rem; margin: 0 0 .5rem; }
}
@media only screen and (max-width: 543px) {
  .aj-inq__table th, .aj-inq__table td { display: block; width: 100%; border: 0; }
  .aj-inq__table th { border-top: 1px solid #eceeef; }
  .aj-inq__table label { margin-bottom: 0; }
}
