/* ======================================
CONCEPT PAGE（page-id-973）
最終・衝突なし・意図固定版【整理後】
====================================== */

/* ===============================
本文ブロック：中央寄せ復旧（クラスが無くても効く保険）
=============================== */

body.page-id-973 main#primary.site-main .entry-content {
  /* 本文の“読み幅”はここで決める（ブロック構造に依存しない） */
  max-width: 760px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 20px;
  padding-right: 20px;
  width: 100%;
}

/* 段落：左揃え・中央寄せ（読み幅内） */
body.page-id-973 main#primary.site-main .entry-content p {
  text-align: left;
  line-height: 2;
  font-size: 16px;
  margin: 0 0 14px; /* 次の見出しとの間をさらに詰める */
  color: #111;
}

/* 空の段落が“謎の余白”になるのを防ぐ（conceptのみ） */
body.page-id-973 main#primary.site-main .entry-content p:empty {
  display: none;
  margin: 0;
}

/* 見出し：中央・余白を詰める */
body.page-id-973 main#primary.site-main .entry-content h2,
body.page-id-973 main#primary.site-main .entry-content h3 {
  text-align: center;
  margin-top: 18px;
  margin-bottom: 10px;
}

/* 段落→見出しの“間”をさらに詰める */
body.page-id-973 main#primary.site-main .entry-content p + h2,
body.page-id-973 main#primary.site-main .entry-content p + h3 {
  margin-top: 10px;
}

/* Gutenbergの巨大スペーサーで“謎の空白”が出るのを防ぐ（conceptのみ） */
body.page-id-973 main#primary.site-main .entry-content .wp-block-spacer {
  height: 24px !important;
  margin: 0 !important;
}

/* スペーサー直後の見出しは詰める */
body.page-id-973 main#primary.site-main .entry-content .wp-block-spacer + h2,
body.page-id-973 main#primary.site-main .entry-content .wp-block-spacer + h3 {
  margin-top: 10px;
}

/* page-id が異なる本番対策：テンプレートclassでも同じ見出し詰め */
body[class*="page-template-page-concept"] main#primary.site-main .entry-content h2,
body[class*="page-template-page-concept"] main#primary.site-main .entry-content h3 {
  margin-top: 18px;
  margin-bottom: 10px;
}

body[class*="page-template-page-concept"] main#primary.site-main .entry-content p + h2,
body[class*="page-template-page-concept"] main#primary.site-main .entry-content p + h3,
body[class*="page-template-page-concept"] main#primary.site-main .entry-content .wp-block-spacer + h2,
body[class*="page-template-page-concept"] main#primary.site-main .entry-content .wp-block-spacer + h3 {
  margin-top: 10px;
}

/* ===============================
HEROは必ず全幅に戻す（本文幅に巻き込まれない）
=============================== */

body.page-id-973 .site-hero {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  max-width: none !important;
}

/* Gutenberg の alignfull/cover も全幅に復旧（念のため） */
body.page-id-973 main#primary.site-main .entry-content > .alignfull,
body.page-id-973 main#primary.site-main .entry-content > .wp-block-cover.alignfull,
body.page-id-973 main#primary.site-main .entry-content > .wp-block-group.alignfull {
  width: 100vw;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  max-width: none !important;
}

/* ===============================
SECTION：余白
=============================== */
body.page-id-973 .lp-section {
  padding: 64px 20px;
}

@media (max-width: 768px) {
  body.page-id-973 .lp-section {
    padding: 48px 20px;
  }
}

/* ===============================
見出し（常に中央）
=============================== */
body.page-id-973 .lp-section-title {
  text-align: center;
  font-size: 28px;
  line-height: 1.45;
  margin: 0 0 32px;
}

@media (max-width: 768px) {
  body.page-id-973 .lp-section-title {
    font-size: 22px;
    margin-bottom: 24px;
  }
}

/* ===============================
本文：左揃え＋中央寄せ（Aboutページ準拠）
=============================== */
body.page-id-973 .concept-body-text {
  max-width: 720px;
  margin: 0 auto 28px;
  font-size: 16px;
  line-height: 2;
  text-align: left;
  color: #111;
}

/* ===============================
【ここだけ】動画導入文を中央寄せ
※ 構造依存をやめ、クラス指定のみ
=============================== */
body.page-id-973 .concept-body-text.is-center {
  text-align: center;
  max-width: 640px;
  margin: 0 auto 40px;
  font-weight: 500;
}

/* ===============================
判断軸リスト（問いの見せ方）
=============================== */
body.page-id-973 .concept-points {
  max-width: 720px;
  margin: 40px auto;
  padding: 24px 28px;
  background: #f7f9fa;
  border-radius: 12px;
}

body.page-id-973 .concept-points ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

body.page-id-973 .concept-points li {
  position: relative;
  padding-left: 1.2em;
  margin-bottom: 14px;
  line-height: 1.9;
}

body.page-id-973 .concept-points li::before {
  content: "・";
  position: absolute;
  left: 0;
  color: #0099cc;
  font-weight: 600;
}

/* ======================================
CONCEPT：戻るボタン（横幅あり・共通準拠）
====================================== */
body.page-id-973 .lp-back {
  margin: 64px 0;
  text-align: center;
}

body.page-id-973 .lp-back a {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  min-width: 320px;
  height: 64px;
  padding: 0 48px;

  background: #fff;
  color: #0099cc;
  border: 2px solid #0099cc;
  border-radius: 999px;

  font-size: 16px;
  font-weight: 600;
  text-decoration: none;

  transition: background .2s ease, color .2s ease;
}

body.page-id-973 .lp-back a:hover {
  background: #0099cc;
  color: #fff;
}

/* SP */
@media (max-width: 768px) {
  body.page-id-973 .lp-back a {
    min-width: 100%;
    max-width: 320px;
  }
}
/* ======================================
CONCEPT HERO（site-hero 専用・復旧）
====================================== */

body.page-id-973 .site-hero {
  position: relative;
  width: 100%;
  min-height: 420px;

  display: flex;
  align-items: center;
  justify-content: center;

  background-size: cover;
  background-position: center;
}

/* 黒オーバーレイ */
body.page-id-973 .site-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.45);
}

/* 中身 */
body.page-id-973 .site-hero-inner {
  position: relative;
  z-index: 1;
  text-align: center;
  padding: 0 24px;
}

/* キッカー */
body.page-id-973 .site-hero-kicker {
  color: rgba(255,255,255,.85);
  font-size: 13px;
  letter-spacing: .2em;
  margin-bottom: 12px;
}

/* タイトル */
body.page-id-973 .site-hero-title {
  color: #fff;
  font-size: 36px;
  line-height: 1.4;
  font-weight: 700;
}

/* SP */
@media (max-width: 768px) {
  body.page-id-973 .site-hero {
    min-height: 280px;
  }

  body.page-id-973 .site-hero-title {
    font-size: 26px;
  }
}

/* ======================================
CONCEPT：HERO直下の余白を他固定ページに揃える（PC/SP）
目的：「HERO画像 → 最初の見出し」の間隔差を解消
前提：`.site-hero` は `.entry-content` 内に並ぶため、`entry-content > .site-hero + *` を基準にする
====================================== */

/* HERO直下の“余計な margin”をリセット */
body.page-id-973 main#primary.site-main .entry-content > .site-hero {
  margin-bottom: 0 !important;
}

/* HERO直後ブロック：余白を統一（PC基準） */
body.page-id-973 main#primary.site-main .entry-content > .site-hero + * {
  margin-top: 0 !important;
  padding-top: 32px !important; /* 料金/制作の流れに合わせてさらに詰める */
}

/* ただの見出し/段落が直後に来る場合は padding より margin で */
body.page-id-973 main#primary.site-main .entry-content > .site-hero + :where(h2,h3,p,ul,ol,dl,figure,blockquote) {
  padding-top: 0 !important;
  margin-top: 32px !important;
}

/* SP：料金ページ基準に寄せて少し詰める */
@media (max-width: 768px) {
  body.page-id-973 main#primary.site-main .entry-content > .site-hero + * {
    padding-top: 28px !important;
  }

  body.page-id-973 main#primary.site-main .entry-content > .site-hero + :where(h2,h3,p,ul,ol,dl,figure,blockquote) {
    margin-top: 28px !important;
  }
}

/* ======================================
CONCEPT（最終保険）
本番環境で page-id が異なるケースがあるため、テンプレートclassでも同じ余白統一を適用する
====================================== */

body[class*="page-template-page-concept"] main#primary.site-main .entry-content > :is(.site-hero, .fixed-page-hero) {
  margin-bottom: 0 !important;
}

/* PC */
body[class*="page-template-page-concept"] main#primary.site-main .entry-content > :is(.site-hero, .fixed-page-hero) + * {
  margin-top: 0 !important;
  padding-top: 32px !important;
}

body[class*="page-template-page-concept"] main#primary.site-main .entry-content > :is(.site-hero, .fixed-page-hero) + :where(h2,h3,p,ul,ol,dl,figure,blockquote) {
  padding-top: 0 !important;
  margin-top: 32px !important;
}

/* SP */
@media (max-width: 768px) {
  body[class*="page-template-page-concept"] main#primary.site-main .entry-content > :is(.site-hero, .fixed-page-hero) + * {
    padding-top: 28px !important;
  }

  body[class*="page-template-page-concept"] main#primary.site-main .entry-content > :is(.site-hero, .fixed-page-hero) + :where(h2,h3,p,ul,ol,dl,figure,blockquote) {
    margin-top: 28px !important;
  }
}

/* Gutenberg Spacer が大きすぎて「HERO→見出し」の間隔がズレるケースの止血（Conceptのみ） */
body[class*="page-template-page-concept"] main#primary.site-main .entry-content .wp-block-spacer {
  height: 16px !important;
  margin: 0 !important;
}

@media (max-width: 768px) {
  body[class*="page-template-page-concept"] main#primary.site-main .entry-content .wp-block-spacer {
    height: 12px !important;
  }
}
/* ======================================
FIXED PAGE HERO：kickerサイズ完全統一
料金・コンセプト・About 共通
====================================== */

/* 小さい英字（kicker）はすべて同じ見た目にする */
.fixed-page-hero-kicker,
.site-hero-kicker {
  font-size: 14px;
  letter-spacing: 0.2em;
  margin-bottom: 16px;
  line-height: 1.4;
  color: #fff;
}

/* SP */
@media (max-width: 768px) {
  .fixed-page-hero-kicker,
  .site-hero-kicker {
    font-size: 12px;
    margin-bottom: 12px;
  }
}

