/* =====================================================================
   nwx-clinic.css — /clinic_marketing 追加分（現行の clinic/style.css を踏襲）
   色: 文字 #2f312d / 青 #2d7cc1 / 橙 #df6600 / 深緑 #185c49 / ピーチ #ffdebb / ライム #dbf2c9 / クリーム #feffeb
   スコープ: body.nwx-cm 配下と .nwx-cm-* のみ
   ===================================================================== */
body.nwx-cm {
  --cm-ink: #2f312d; --cm-blue: #2d7cc1; --cm-orange: #df6600; --cm-green: #185c49;
  --cm-peach: #ffdebb; --cm-lime: #dbf2c9; --cm-cream: #feffeb; --cm-line: #ece6dc; --cm-mute: #6b6f68;
  --cm-check: #ffe14d; --cm-ease: cubic-bezier(.2, .7, .1, 1);
  --cm-font: "M PLUS 1", "ヒラギノ角ゴシック", "Hiragino Sans", "Noto Sans JP", sans-serif;
}
.nwx-cm .nwx-check { display: inline-block; background: var(--cm-check); color: #3a3200; font-style: normal; font-weight: 700; font-size: 11.5px;
  line-height: 1.6; padding: 0 6px; border-radius: 3px; margin: 0 4px; vertical-align: .1em; letter-spacing: .04em; }
.nwx-cm .nwx-check::before { content: "["; } .nwx-cm .nwx-check::after { content: "]"; }

/* ---- FV：h1 は本番の見た目のまま（サブタイトルとキャッチを包むだけ） ---- */
.nwx-cm .nwx-cm-h1 { display: contents; }
.nwx-cm .nwx-cm-h1 > span { display: block; }
.nwx-cm .nwx-cm-h1 > .kv-ttl { line-height: 1.5; }
/* ---- FV：成果（動画の枠を置き換え） ---- */
.nwx-cm .nwx-cm-fvproofsec { position: relative; z-index: 2; padding: 40px 20px 48px; font-family: var(--cm-font); color: var(--cm-ink); }
.nwx-cm .nwx-cm-fvproof { width: min(920px, 100%); margin: 0 auto; padding: 30px 36px 22px; background: #fff; border-radius: 20px; box-shadow: 2px 2px 15px 0 rgba(0, 0, 0, .08); }
.nwx-cm .nwx-cm-fvproof__label { margin: 0 0 14px; text-align: center; font-family: var(--cm-font); font-weight: 700; font-size: 15px; letter-spacing: .12em; color: var(--cm-green); }
.nwx-cm .nwx-cm-fvproof__label::before, .nwx-cm .nwx-cm-fvproof__label::after { content: ""; display: inline-block; width: 28px; height: 1px; background: currentColor; vertical-align: middle; margin: 0 12px; opacity: .5; }
.nwx-cm .nwx-cm-fvproof__list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.nwx-cm .nwx-cm-fvproof__list li + li { border-left: 1px solid var(--cm-line); }
.nwx-cm .nwx-cm-fvproof__list a { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 8px 12px 10px; text-decoration: none; color: var(--cm-ink);
  border-radius: 14px; transition: background .3s; }
.nwx-cm .nwx-cm-fvproof__list a:hover { background: var(--cm-cream); }
.nwx-cm .nwx-cm-fvproof__num { font-family: var(--cm-font); font-weight: 800; font-size: clamp(34px, 3.4vw, 48px); line-height: 1.1; color: var(--cm-orange); letter-spacing: .01em; }
.nwx-cm .nwx-cm-fvproof__num small { font-size: .45em; margin: 0 2px; }
.nwx-cm .nwx-cm-fvproof__txt { font-size: 14px; font-weight: 700; line-height: 1.6; text-align: center; }
.nwx-cm .nwx-cm-fvproof__txt small { font-size: 11.5px; font-weight: 400; color: var(--cm-mute); }
.nwx-cm .nwx-cm-fvproof__note { margin: 12px 0 0; font-size: 11px; line-height: 1.6; color: var(--cm-mute); text-align: center; }
@media (max-width: 768px) {
  .nwx-cm .nwx-cm-fvproofsec { padding: 24px 15px 32px; }
  .nwx-cm .nwx-cm-fvproof { padding: 18px 14px 12px; max-width: 360px; border-radius: 10px; }
  .nwx-cm .nwx-cm-fvproof__list { grid-template-columns: minmax(0, 1fr); }
  .nwx-cm .nwx-cm-fvproof__list li + li { border-left: 0; border-top: 1px solid var(--cm-line); }
  .nwx-cm .nwx-cm-fvproof__list a { flex-direction: row; justify-content: flex-start; gap: 14px; padding: 10px 6px; }
  .nwx-cm .nwx-cm-fvproof__num { font-size: 28px; min-width: 5.2em; text-align: left; }
  .nwx-cm .nwx-cm-fvproof__txt { text-align: left; font-size: 13px; }
}

/* ---- 成果事例：ゴリラクリニック（現行カードを流用） ---- */
.nwx-cm .nwx-cm-gorilla { margin-top: 40px; overflow: hidden; }
.nwx-cm .nwx-cm-gorilla__fig { flex: 0 0 350px; margin: 0; border-radius: 16px; overflow: hidden; background: #f4f4f4; }
.nwx-cm .nwx-cm-gorilla__fig img { width: 100%; height: 100%; object-fit: cover; display: block; }
.nwx-cm .nwx-cm-gorilla .sec02-mainFlexTxtWrap { flex: 1; }
@media (max-width: 768px) { .nwx-cm .nwx-cm-gorilla__fig { flex: none; width: 100%; max-width: none !important; } }
.nwx-cm .nwx-cm-more { margin: 18px 0 0; text-align: right; }
.nwx-cm .nwx-cm-more a { font-weight: 700; color: var(--cm-blue); text-decoration: none; border-bottom: 1px solid currentColor; padding-bottom: 2px; }
.nwx-cm .nwx-cm-more a::after { content: " →"; }
.nwx-cm .nwx-cm-note { font-size: 12px; line-height: 1.8; color: var(--cm-mute); margin: 16px 0 0; }
.nwx-cm .nwx-cm-note--center { text-align: center; }

/* ---- 追加セクション共通（現行の配色・M PLUS 1 を踏襲、余白広め・8pxグリッド） ---- */
.nwx-cm .nwx-cm-sec { position: relative; padding: 96px 24px 0; font-family: var(--cm-font); color: var(--cm-ink); }
.nwx-cm .sec04 + .nwx-cm-sec { margin-top: -80px; }
.nwx-cm .nwx-cm-inner { max-width: 1040px; margin: 0 auto; }
.nwx-cm .nwx-cm-split { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: 40px 64px; align-items: start; }
.nwx-cm .nwx-cm-sec .sec-ttl { text-align: left !important; font-size: 30px !important; line-height: 1.5; margin: 0 0 24px; }
.nwx-cm .nwx-cm-faq .sec-ttl { text-align: center !important; }
.nwx-cm .nwx-cm-lede { margin: 0; font-size: 16px; line-height: 2; color: #55594f; }
.nwx-cm .nwx-cm-foot { margin: 40px 0 0; font-size: 13px; line-height: 1.8; color: var(--cm-mute); }
.nwx-cm .nwx-cm-foot a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }

/* 取りこぼし → 対策 */
.nwx-cm .nwx-cm-rows { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--cm-ink); }
.nwx-cm .nwx-cm-row { display: flex; flex-direction: column; gap: 8px; padding: 24px 0; border-bottom: 1px solid var(--cm-line); }
.nwx-cm .nwx-cm-row__issue { font-size: 18px; font-weight: 700; line-height: 1.6; }
.nwx-cm .nwx-cm-row__do { font-size: 15px; color: var(--cm-green); }
.nwx-cm .nwx-cm-row__do::before { content: "→ "; color: var(--cm-orange); }

/* 料金 */
.nwx-cm .nwx-cm-plist { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--cm-ink); }
.nwx-cm .nwx-cm-plist a { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 24px; align-items: baseline; padding: 24px 0; border-bottom: 1px solid var(--cm-line); color: var(--cm-ink); text-decoration: none; }
.nwx-cm .nwx-cm-plist__name { font-size: 16px; }
.nwx-cm .nwx-cm-plist a:hover .nwx-cm-plist__name { color: var(--cm-blue); }
.nwx-cm .nwx-cm-plist__price { font-size: 22px; font-weight: 700; color: var(--cm-orange); white-space: nowrap; text-align: right; }
.nwx-cm .nwx-cm-plist__meta { grid-column: 1 / -1; font-size: 13px; color: var(--cm-mute); }

/* AI検索対策（/llmo-clinic への相互リンク） */
.nwx-cm .nwx-cm-ai__card { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 16px 48px; align-items: center; text-decoration: none; color: var(--cm-ink);
  padding: 48px; border-radius: 24px; background: #f3f8f1; transition: background .3s; }
.nwx-cm .nwx-cm-ai__card:hover { background: #eaf3e6; }
.nwx-cm .nwx-cm-ai__kicker { display: block; font-size: 14px; color: var(--cm-green); margin-bottom: 8px; }
.nwx-cm .nwx-cm-ai__ttl { display: block; font-size: 22px; font-weight: 700; line-height: 1.5; margin-bottom: 8px; }
.nwx-cm .nwx-cm-ai__txt { display: block; font-size: 15px; line-height: 1.9; color: #55594f; }
.nwx-cm .nwx-cm-ai__go { white-space: nowrap; font-size: 15px; color: var(--cm-blue); border-bottom: 1px solid currentColor; padding-bottom: 4px; }
.nwx-cm .nwx-cm-ai__go::after { content: " →"; }

/* FAQ */
.nwx-cm .nwx-cm-faq { padding-bottom: 160px; }
.nwx-cm .nwx-cm-faq__list { margin: 44px 0 0; display: flex; flex-direction: column; gap: 12px; }
.nwx-cm .nwx-cm-faq__item { background: #fff; border-radius: 20px; box-shadow: 2px 2px 15px 0 rgba(0, 0, 0, .06); overflow: hidden; }
.nwx-cm .nwx-cm-faq__item summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 16px; padding: 20px 56px 20px 24px; font-weight: 800; font-size: 16px; line-height: 1.6; position: relative; }
.nwx-cm .nwx-cm-faq__item summary::-webkit-details-marker { display: none; }
.nwx-cm .nwx-cm-faq__item summary::after { content: "+"; position: absolute; right: 24px; top: 50%; transform: translateY(-50%); font-family: "Oswald", sans-serif; font-size: 26px; color: var(--cm-blue); transition: transform .3s; }
.nwx-cm .nwx-cm-faq__item[open] summary::after { transform: translateY(-50%) rotate(45deg); }
.nwx-cm .nwx-cm-faq__q, .nwx-cm .nwx-cm-faq__aa { flex: 0 0 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; font-family: "Oswald", sans-serif; font-size: 17px; }
.nwx-cm .nwx-cm-faq__q { background: var(--cm-blue); color: #fff; }
.nwx-cm .nwx-cm-faq__aa { background: var(--cm-peach); color: var(--cm-orange); }
.nwx-cm .nwx-cm-faq__a { display: flex; gap: 16px; padding: 0 24px 22px; }
.nwx-cm .nwx-cm-faq__a p { margin: 4px 0 0; font-size: 15px; line-height: 1.95; }
.nwx-cm .nwx-cm-faq__a a { color: var(--cm-blue); text-decoration: underline; text-underline-offset: 3px; }
.nwx-cm .nwx-cm-faq__cta { display: flex; justify-content: center; margin-top: 30px; }

@media (max-width: 768px) {
  .nwx-cm .nwx-cm-sec { padding: 64px 20px 0; }
  .nwx-cm .sec04 + .nwx-cm-sec { margin-top: -40px; }
  .nwx-cm .nwx-cm-split { grid-template-columns: minmax(0, 1fr); gap: 32px; }
  .nwx-cm .nwx-cm-sec .sec-ttl { font-size: 24px !important; margin-bottom: 16px; }
  .nwx-cm .nwx-cm-lede, .nwx-cm .nwx-cm-ai__txt, .nwx-cm .nwx-cm-faq__a p { font-size: 15px; }
  .nwx-cm .nwx-cm-row__issue { font-size: 16px; }
  .nwx-cm .nwx-cm-plist__price { font-size: 19px; }
  .nwx-cm .nwx-cm-ai__card { grid-template-columns: minmax(0, 1fr); padding: 32px 24px; border-radius: 20px; }
  .nwx-cm .nwx-cm-ai__ttl { font-size: 19px; }
  .nwx-cm .nwx-cm-faq__item summary { font-size: 15px; padding: 16px 44px 16px 16px; gap: 12px; }
  .nwx-cm .nwx-cm-faq__item summary::after { right: 16px; }
  .nwx-cm .nwx-cm-faq__q, .nwx-cm .nwx-cm-faq__aa { flex-basis: 32px; height: 32px; font-size: 15px; }
  .nwx-cm .nwx-cm-faq__a { padding: 0 16px 16px; gap: 12px; }
}

/* ---- 動き（JS有効時のみ・reduced-motionで停止） ---- */
.nwx-js .nwx-cm .nwx-rv { opacity: 0; transform: translate3d(0, 24px, 0); transition: opacity .9s var(--cm-ease), transform .9s var(--cm-ease); }
.nwx-js .nwx-cm .nwx-rv.is-in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  .nwx-cm *, .nwx-cm *::before, .nwx-cm *::after { transition: none !important; }
  .nwx-js .nwx-cm .nwx-rv { opacity: 1; transform: none; }
}
/* LCP保護: FVの見出しは登場アニメーションなしで即表示 */
.nwx-cm .internal_heroArea h1, .nwx-cm .internal_heroArea h1 * { animation: none !important; opacity: 1 !important; transform: none !important; }

/* ---- 日本語の折り返し：文節単位（ビルド時に BudouX で <wbr> を挿入）＋泣き別れ防止 ---- */
.nwx-cm .nwx-cm-sec, .nwx-cm .nwx-cm-fvproof, .nwx-cm .nwx-cm-gorilla { word-break: keep-all; overflow-wrap: anywhere; line-break: strict; }
.nwx-cm .nwx-cm-sec .sec-ttl, .nwx-cm .nwx-cm-gorilla .sec02-mainFlexTtl, .nwx-cm .nwx-cm-faq__item summary { text-wrap: balance; }
.nwx-cm .nwx-cm-sec p, .nwx-cm .nwx-cm-gorilla p { text-wrap: pretty; }