/* 夜tax 本体トップ 2026-10-26：通常サイト監査（Codex nighttax-main-site-audit-20261025-2125）の修正。top-audit.js と組
   LP で確定した規則（LP全体監査の修正_20261025 の d 版 lp-refresh.css）を土台に、本体（xwrite）の HTML に合わせて写したもの。
   ページ全体の規則（ヘッダー・ナビ・画像全体の縦横比・余白）は写さない。対象の部品の中だけに効かせる。
   フォームの見た目は、JS が新しいフォーム（連絡方法の選択あり）を確かめてから付ける .nt-enhanced の下だけ＝CF7 の設定を変える前は今の見た目のまま。 */

/* ---------- 共通 ---------- */
/* テーマは *{color:#47679f} で全要素を紺にしている＝色が子に引き継がれない。新しい部品の中だけ引き継ぐ */
:is(.nt-contact-intro,.nt-confirm,.nt-confirm-row,.nt-back-btn,.nt-table-note) *{color:inherit}
.sc-contact form.nt-enhanced .wpcf7-radio label *{color:inherit}
.nt-sr-only{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
/* 新しい部品だけ、既存の profile／book と同じシステムの角ゴシック（body 全体は変えない・Webfont は読まない） */
.nt-contact-intro,.sc-contact form.nt-enhanced,.nt-confirm,.nt-table-note{font-family:"Yu Gothic","YuGothic","Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,sans-serif}
.sc-contact form.nt-enhanced input,.sc-contact form.nt-enhanced textarea,.sc-contact form.nt-enhanced button{font-family:inherit}

/* ---------- 画像の読み込み（優先3） ---------- */
/* ファーストビュー：picture の1枚だけ（641px 以上は PC 画像・640px 以下は SP 画像）。width/height で縦横比を先に確保 */
.sc-banner.nt-fv picture{display:block}
.sc-banner.nt-fv picture img{display:block;width:100%;height:auto}
/* LINE 登録特典の案内（.new-sc）：内容はそのまま、幅に合う1枚だけを画面に近づいてから読む */
.new-sc.nt-line-perk picture{display:block}
.new-sc.nt-line-perk picture img{display:block;width:100%;height:auto}
/* 「LINE の相談」帯（.sc-advise）：上の不透明なグラデーションはそのまま、見えない下層の sun-bg.png だけ外す（テーマは linear-gradient(...),url(sun-bg.png)） */
.sc-advise{background:linear-gradient(to right,#ffe3ed,#f4ecfd)}

/* ---------- 資格カード v11（優先7） ---------- */
/* xwrite の共通 CSS は dialog{display:block}。閉じているプロフィールの窓は隠す（開いたら表示＝[open]） */
.nighttax-profile-component .nighttax-profile-dialog:not([open]){display:none}

/* ---------- 料金（優先2）：比較表の当事務所の範囲 ---------- */
.nt-table-note{max-width:880px;margin:14px auto 0;font-size:13px;line-height:1.7;color:#405d88;text-align:left}
.sc-table .pricing-table .row-2 span.nt-plan{display:block;margin-top:4px;font-size:12px;font-weight:700;line-height:1.5;color:#405d88}

/* ---------- 相談フォーム（優先1） ---------- */
.nt-contact-intro{text-align:center;margin:0 0 18px;color:#405d88}
.nt-contact-intro .nt-eyebrow{margin:0 0 8px;font-size:13px;font-weight:700;letter-spacing:.06em;color:#bd708e;line-height:1.5}
.nt-contact-title{margin:0 0 8px;color:#ed548b;font-size:24px;font-weight:900;line-height:1.45}
.nt-contact-title span{display:block}
.nt-contact-lead{margin:0;font-size:14px;line-height:1.75}
.nt-contact-intro .nt-flow{margin-top:12px}
@media (min-width:641px){
  .nt-contact-title{font-size:clamp(28px,3.4vw,36px)}
  .nt-contact-title span{display:inline-block}
  .nt-contact-intro{margin-bottom:28px}
}
/* 以下は新しいフォーム（連絡方法の選択あり）を JS が確かめてから付く .nt-enhanced の下だけ */
.sc-contact form.nt-enhanced{color:#405d88}
.sc-contact form.nt-enhanced .form-item p:first-child label{cursor:pointer}
/* 任意の欄は「必須」の印が無いので、印のぶんの字下げをしない */
.sc-contact form.nt-enhanced .form-item p:first-child:not(.required){padding-left:10px}
.sc-contact form.nt-enhanced .nt-optional{display:inline-block;margin-left:8px;font-size:12px;font-weight:500;color:#5d6f8c}
.sc-contact form.nt-enhanced .form-block input::placeholder,.sc-contact form.nt-enhanced textarea::placeholder{color:#7d8799}
.sc-contact form.nt-enhanced .form-block input,.sc-contact form.nt-enhanced textarea{font-size:16px;color:#2f3e58}
.sc-contact form.nt-enhanced .nt-hide{display:none!important}
.sc-contact form.nt-enhanced .nt-field-hint{display:block;margin:6px 0 0;font-size:13px;line-height:1.6;color:#5d6f8c}
/* 連絡方法：2つのボタン状の選択肢 */
.sc-contact form.nt-enhanced .wpcf7-radio{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.sc-contact form.nt-enhanced .wpcf7-radio .wpcf7-list-item{display:block;margin:0}
.sc-contact form.nt-enhanced .wpcf7-radio label{display:flex;align-items:center;justify-content:center;gap:8px;min-height:50px;padding:8px 10px;box-sizing:border-box;border:1px solid #c4c6cf;border-radius:10px;background:#fff;color:#5d6f8c;font-size:16px;font-weight:700;cursor:pointer}
.sc-contact form.nt-enhanced .wpcf7-radio .wpcf7-list-item-label::before,.sc-contact form.nt-enhanced .wpcf7-radio .wpcf7-list-item-label::after{content:none}
.sc-contact form.nt-enhanced .form-block .wpcf7-radio input[type="radio"]{width:18px;height:18px;margin:0;padding:0;border:0;background:none;accent-color:#c7336d;flex:0 0 auto}
.sc-contact form.nt-enhanced .wpcf7-radio label.nt-checked{border:2px solid #c7336d;background:#fff2f7;color:#b8305f}
.sc-contact form.nt-enhanced .wpcf7-radio label:focus-within{outline:3px solid #2f3e58;outline-offset:2px}
/* エラー */
.sc-contact form.nt-enhanced .wpcf7-not-valid-tip{margin-top:6px;font-size:13px;font-weight:700;line-height:1.5;color:#c4202f}
.sc-contact form.nt-enhanced [aria-invalid="true"]{border-color:#c4202f!important;background:#fff6f7!important}
/* 確認ボタン（入力中）と確認画面。テーマの送信ボタン（画像「入力内容を確認する」・value を隠す）は .nt-enhanced のときだけ文字のボタンにする */
.sc-contact form.nt-enhanced.nt-mode-edit .submit{display:none}
.sc-contact form.nt-enhanced.nt-mode-confirm .form-block,.sc-contact form.nt-enhanced.nt-mode-confirm .nt-confirm-row{display:none}
.nt-confirm-row{text-align:center;margin-top:8px}
.nt-confirm-btn,.sc-contact form.nt-enhanced .submit input.wpcf7-submit{display:block;width:100%;max-width:360px;min-height:54px;height:auto;margin:0 auto;padding:12px 16px;border:0;border-radius:999px;background:#c7336d;box-shadow:0 3px 0 #9e2353;color:#fff;font-size:17px;font-weight:800;letter-spacing:.04em;text-indent:0;cursor:pointer;font-family:inherit}
.nt-confirm-btn:focus-visible,.nt-back-btn:focus-visible,.sc-contact form.nt-enhanced .submit input.wpcf7-submit:focus-visible{outline:3px solid #2f3e58;outline-offset:3px}
.sc-contact form.nt-enhanced .submit input.wpcf7-submit:disabled,.nt-back-btn:disabled{opacity:.75;cursor:wait}
.nt-back-btn{display:block;width:100%;max-width:360px;min-height:48px;margin:12px auto 0;padding:10px 16px;border:1px solid #9aa3b5;border-radius:999px;background:#fff;color:#405d88;font-size:15px;font-weight:700;cursor:pointer;font-family:inherit}
.nt-contact-note{margin:10px 0 0;font-size:13px;line-height:1.6;color:#5d6f8c}
.nt-confirm{margin:0 0 18px;scroll-margin-top:8px}
.nt-confirm:focus{outline:none}
.nt-confirm-title{margin:0 0 6px;font-size:18px;font-weight:900;color:#c7336d;text-align:center}
.nt-confirm-lead{margin:0 0 14px;font-size:13px;line-height:1.7;text-align:center}
.nt-confirm-list{margin:0;border-top:1px solid #e6e1ea}
.nt-confirm-list div{padding:12px 4px;border-bottom:1px solid #e6e1ea}
.nt-confirm-list dt{margin:0 0 4px;font-size:13px;font-weight:700;color:#5d6f8c}
.nt-confirm-list dd{margin:0;font-size:16px;line-height:1.7;color:#2f3e58;white-space:pre-wrap;overflow-wrap:anywhere}
.sc-contact form.nt-enhanced.nt-mode-edit .nt-back-btn,.sc-contact form.nt-enhanced.nt-mode-edit .nt-confirm{display:none}
.sc-contact form.nt-enhanced .wpcf7-response-output{font-size:14px;line-height:1.7;border-radius:10px}
/* 送信の結果がまだ分からないときの案内（CF7 は送信中に .wpcf7-response-output を隠すので、別の場所に出す） */
.sc-contact form.nt-enhanced .nt-send-note{max-width:360px;margin:12px auto 0;padding:10px 14px;border-radius:10px;background:#fff6f7;border:1px solid #f0c3cf;color:#7a2346;font-size:14px;line-height:1.7}
.sc-contact form.nt-enhanced .nt-send-note[hidden]{display:none}
/* キーボードの位置が分かる表示（エラーの欄でも） */
.sc-contact form.nt-enhanced .form-block input:focus-visible,.sc-contact form.nt-enhanced textarea:focus-visible,.sc-contact form.nt-enhanced .form-block [aria-invalid="true"]:focus-visible{outline:3px solid #2f3e58;outline-offset:2px}
@media (max-width:640px){
  .sc-contact form.nt-enhanced .form-item{margin-bottom:14px}
  .sc-contact form.nt-enhanced .form-block input{height:50px}
}
@media (min-width:641px){
  .sc-contact form.nt-enhanced .form-item p:first-child{min-width:240px}
  .nt-confirm-list div{display:flex;gap:24px}
  .nt-confirm-list dt{flex:0 0 200px;margin:0}
}
/* スマホの固定ボタン：入力中でキーボードが出ているあいだだけ下げる（top-audit.js が .nt-cta-suppressed を付ける）。下げる量は固定 CTA の実際の高さ */
@media (max-width:640px){
  footer .wrap-contact.nt-cta-bar.nt-cta-suppressed{bottom:calc(-1 * var(--nt-fixed-cta-height,140px) - 8px)!important}
}

/* ---------- よくある質問（優先8） ---------- */
/* JS が動かないときは回答を見せる（html.nt-js は index.php の1行が付け、top-audit.js が動かなければ外す）／動くときは開いたものだけ */
html:not(.nt-js) .sc-qa .qa-answer{display:block}
.nt-faq-ready .sc-qa .qa-answer{display:none}
.nt-faq-ready .sc-qa .qa-answer.nt-open{display:block}
.sc-qa .qa-question[role="button"]:focus-visible{outline:3px solid #2f3e58;outline-offset:-3px}

/* ---------- 文字の読みやすさ（LP d 版と同じ。同じピンク系で濃くするだけ） ---------- */
/* お悩み解決の小見出し #F45189→#C7336D（背景 #F1F3FF で 2.98→4.61）／よくある質問の質問の背景 #F45189→#C7336D（白文字で 3.29→5.09） */
.sc-problem-inner .content-solve .wrap-solve-problems .group .item>div p:first-child{color:#C7336D}
.sc-qa .list-qa li{background:#C7336D;border-color:#C7336D}
/* 固定 CTA の「条件あり」#66738a→#5A6680（背景 #EDEDED で 4.09→4.92・11px の通常の文字）。同じ灰青のまま濃くするだけ。LP の component.css はそのまま */
html body footer .wrap-contact[data-nt-fixed-cta] .nt-fixed-cta__conditions{color:#5A6680}

/* ---------- タブレット（優先4） ---------- */
/* 641〜900px：「あなたのお悩みを解決します」の5項目を1列に（本文の列が 53px まで細くなっていた）。対象は .wrap-solve-problems の5項目だけ */
@media (min-width:641px) and (max-width:900px){
  .sc-problem-inner .content-solve .wrap-solve-problems{display:block}
  .sc-problem-inner .content-solve .wrap-solve-problems>.group{width:100%}
  .sc-problem-inner .content-solve .wrap-solve-problems>.group+.group{margin-top:24px}
  .sc-problem-inner .content-solve .wrap-solve-problems>.group>.item>img{width:120px;flex:0 0 120px;height:auto}
  .sc-problem-inner .content-solve .wrap-solve-problems>.group>.item>div{width:calc(100% - 120px);min-width:0;padding:16px}
}
/* 901〜1199px：2列のまま、説明が縮んで横へはみ出さないように */
@media (min-width:901px) and (max-width:1199px){
  .sc-problem-inner .content-solve .wrap-solve-problems>.group>.item>div{min-width:0}
}
/* 641〜1199px：「ご相談の流れ」は PC の画像5列だと画像の中の文字が小さすぎる。スマホと同じ「イラスト＋文字の説明」の縦並びにする
   （イラスト・文言はスマホ版のまま。640px 以下と 1200px 以上は変えない。テーマの .sp_display{display:none!important} に勝つよう、この部品の中だけ !important） */
@media (min-width:641px) and (max-width:1199px){
  .sc-process .process-list>ul{display:block;max-width:640px;margin:0 auto}
  .sc-process .process-list>ul>li{position:relative;display:flex;align-items:flex-start;gap:24px;width:100%;margin:0;padding:0 0 50px}
  .sc-process .process-list>ul>li:last-child{padding-bottom:0}
  .sc-process .process-list>ul>li:after{content:'';position:absolute;width:18px;height:28px;background:url(/wp-content/themes/xwrite/assets/images/process-icon.png) top left/100% 100% no-repeat;bottom:10px;left:51px}
  .sc-process .process-list>ul>li:last-child:after{display:none}
  .sc-process .process-list>ul>li>img.pc_display{display:none!important}
  .sc-process .process-list>ul>li>img.sp_display{display:block!important;width:120px;flex:0 0 120px;height:auto;margin:0}
  .sc-process .process-list>ul>li>div.sp_display{display:block!important;flex:1 1 auto;width:auto;min-width:0;text-align:left}
  .sc-process .process-list>ul>li>div.sp_display h3{font-size:18px;line-height:1.6;margin:0 0 8px}
  .sc-process .process-list>ul>li>div.sp_display p{font-size:16px;line-height:1.8;margin:0}
}