@charset "UTF-8";
/* =============================================================
   page-blocks.css — 新規固定ページ用：標準ブロックを「叢生ページ(bite__crowding)」と同じ見た目にする
   対象: clean モード未登録の固定ページ（body.page.fs-mode-default）の本文と、ブロックエディターのプレビュー。
   数値は assets/css/pages/bite__crowding.css と kbody.css（本番の実測値）から転記。
   使い方: 見出し(h2/h3)・段落・カラム・画像・リスト(class: lp-check)・ボタン を普通に置くだけ。ページごとの CSS は不要。
   読み込み順: kpage.css の後（.entry-content h2 の記事用デザインを上書きするため）。
   ============================================================= */

/* ---------- 本文の箱（叢生: .lp-wrap max-width 1053px, 左右 15px） ---------- */
body.page.fs-mode-default .entry-content, body.page.fs-mode-default .kpage, body.page.fs-mode-default .page-content, body.page.fs-mode-default .fs-page-blocks {
  max-width: 1083px;
  margin-inline: auto;
  padding: 0 15px 75px;
  font-family: var(--fs-font-base);
  font-size: 16px;
  line-height: 1.9;
  color: #383838;
}
body.page.fs-mode-default .wrap-narrow { max-width: none; }
/* 箱が入れ子（.kpage > .entry-content など）のときは内側の余白を 0 に */
body.page.fs-mode-default :where(.entry-content, .kpage, .page-content, .fs-page-blocks) :where(.entry-content, .kpage, .page-content, .fs-page-blocks) { max-width: none; width: auto; padding: 0; }

/* ---------- 共通スコープ ---------- */
/* 各ルールの先頭にある「body.page.fs-mode-default :where(.entry-content, .kpage, .page-content, .fs-page-blocks)」がスコープ。
   :where() は詳細度 0 なので全体は (0,2,1) となり、kpage.css の .entry-content h2 (0,1,1) に勝つ。
   inc/page-blocks.php はこの文字列を取り除いた版をブロックエディターに渡す（編集画面でも同じ見た目にするため）。
   → スコープ文字列は一字一句変えないこと。 */
:root {
  --lp-ico-check: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round' d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E");
}

/* ---------- H2: 薄緑の枠付きボックス（叢生: .b12 + .kt-12） ---------- */
body.page.fs-mode-default :where(.entry-content, .kpage, .page-content, .fs-page-blocks) h2 {
  margin: 90px 1.4% 0;              /* セクション間: 前セクション padding-bottom 75px + 次 wrap margin-top 15px */
  padding: 15px 10px;
  background: #f7faee;
  border: 1px solid rgba(34, 172, 56, .8);
  border-radius: 0;
  box-shadow: none;
  font-family: var(--fs-font-serif);
  font-size: 28px;
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: -1.5px;
  color: #401f00;
  text-align: center;
}
body.page.fs-mode-default :where(.entry-content, .kpage, .page-content, .fs-page-blocks) h2:first-child { margin-top: 75px; }

/* ---------- H3: 緑文字 + 下線（叢生: .kt-7 + .lp-hr） ---------- */
body.page.fs-mode-default :where(.entry-content, .kpage, .page-content, .fs-page-blocks) h3 {
  margin: 30px 1.4% 0;
  padding: 0 0 17px;
  background: transparent;
  border: 0;
  border-bottom: 1px solid rgba(64, 31, 0, .7);
  font-family: var(--fs-font-base);
  font-size: 22px;
  font-weight: 400;
  line-height: 1.4;
  letter-spacing: -1.5px;
  color: #157a26;
  text-align: left;
}

/* ---------- 段落（叢生: .kt-6） ---------- */
body.page.fs-mode-default :where(.entry-content, .kpage, .page-content, .fs-page-blocks) p {
  margin: 15px 1.4% 0;
  font-size: 16px;
  line-height: 1.9;
  color: #383838;
}
body.page.fs-mode-default :where(.entry-content, .kpage, .page-content, .fs-page-blocks) p + p { margin-top: 0; }   /* 連続段落は詰める（叢生の .b17 等） */
body.page.fs-mode-default :where(.entry-content, .kpage, .page-content, .fs-page-blocks) h3 + p { margin-top: 12px; }
body.page.fs-mode-default :where(.entry-content, .kpage, .page-content, .fs-page-blocks) p a { color: inherit; text-decoration: underline; }

/* ---------- 2カラム（文章 + 画像）（叢生: .b14 行、.b15/.b18 列、.b19 画像） ---------- */
body.page.fs-mode-default :where(.entry-content, .kpage, .page-content, .fs-page-blocks) .wp-block-columns {
  display: flex;
  flex-wrap: nowrap;
  margin: 0;
  gap: 0;
  align-items: flex-start;
}
body.page.fs-mode-default :where(.entry-content, .kpage, .page-content, .fs-page-blocks) .wp-block-column { flex: 1 1 50%; min-width: 0; }
body.page.fs-mode-default :where(.entry-content, .kpage, .page-content, .fs-page-blocks) .wp-block-column p { margin-left: 2.85%; margin-right: 2.85%; }
body.page.fs-mode-default :where(.entry-content, .kpage, .page-content, .fs-page-blocks) .wp-block-column .wp-block-image {
  margin: 15px auto 15px;
  width: 75.4%;
}

/* ---------- 画像 ---------- */
body.page.fs-mode-default :where(.entry-content, .kpage, .page-content, .fs-page-blocks) .wp-block-image { margin: 15px 0 0; }
body.page.fs-mode-default :where(.entry-content, .kpage, .page-content, .fs-page-blocks) .wp-block-image img {
  display: block;
  width: 100%;
  height: auto;
  margin: 0;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}
body.page.fs-mode-default :where(.entry-content, .kpage, .page-content, .fs-page-blocks) .wp-block-image a:hover img { opacity: .85; }
/* 無料相談バナーなど幅いっぱいの画像 */
body.page.fs-mode-default :where(.entry-content, .kpage, .page-content, .fs-page-blocks) .wp-block-image.lp-banner { margin: 20px 0 0; width: 100%; }

/* ---------- チェックリスト（叢生: 緑チェック + .kt-13）。リストブロックに「追加 CSS クラス: lp-check」 ---------- */
body.page.fs-mode-default :where(.entry-content, .kpage, .page-content, .fs-page-blocks) ul.lp-check {
  list-style: none;
  margin: 15px 1.4% 0;
  padding: 0;
}
body.page.fs-mode-default :where(.entry-content, .kpage, .page-content, .fs-page-blocks) ul.lp-check li {
  list-style: none;
  position: relative;
  margin: 30px 0 0;
  padding-left: 7%;
  font-size: 16px;
  line-height: 1.9;
  color: #000;
  text-align: justify;
}
body.page.fs-mode-default :where(.entry-content, .kpage, .page-content, .fs-page-blocks) ul.lp-check li::before {
  content: "";
  position: absolute;
  left: 1.5%;
  top: 0;
  width: 32px;
  height: 32px;
  background: #22ac38;
  -webkit-mask: var(--lp-ico-check) center / contain no-repeat;
  mask: var(--lp-ico-check) center / contain no-repeat;
}

/* ---------- 通常の箇条書き（lp-check なし） ---------- */
body.page.fs-mode-default :where(.entry-content, .kpage, .page-content, .fs-page-blocks) ul:not(.lp-check),
body.page.fs-mode-default :where(.entry-content, .kpage, .page-content, .fs-page-blocks) ol {
  margin: 15px 1.4% 0;
  padding-left: 1.5em;
  font-size: 16px;
  line-height: 1.9;
  color: #383838;
}

/* ---------- ボタン（叢生: .lp-btn.kb-3、幅は .b108 = 中央 39.5%） ---------- */
body.page.fs-mode-default :where(.entry-content, .kpage, .page-content, .fs-page-blocks) .wp-block-buttons {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin: 15px 1.4% 0;
}
body.page.fs-mode-default :where(.entry-content, .kpage, .page-content, .fs-page-blocks) .wp-block-button { min-width: 39.5%; }
body.page.fs-mode-default :where(.entry-content, .kpage, .page-content, .fs-page-blocks) .wp-block-button__link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 100%;
  padding: 11px 26px;
  background: #157a26;
  color: #fff;
  border: 2px solid #157a26;
  border-radius: 0;
  font-family: var(--fs-font-base);
  font-size: 16px;
  font-weight: 400;
  line-height: 1.9;
  letter-spacing: 3px;
  white-space: nowrap;
  text-decoration: none;
  transition: opacity .2s;
}
body.page.fs-mode-default :where(.entry-content, .kpage, .page-content, .fs-page-blocks) .wp-block-button__link::after {
  content: "";
  flex: 0 0 auto;
  width: 16px;
  height: 16px;
  background: #fff;
  -webkit-mask: var(--fs-arrow-icon) center / contain no-repeat;
  mask: var(--fs-arrow-icon) center / contain no-repeat;
}
body.page.fs-mode-default :where(.entry-content, .kpage, .page-content, .fs-page-blocks) .wp-block-button__link:hover { opacity: .8; }

/* ---------- 区切り線ブロック（必要なら） ---------- */
body.page.fs-mode-default :where(.entry-content, .kpage, .page-content, .fs-page-blocks) hr.wp-block-separator {
  margin: 17px 1.4% 0;
  border: 0;
  border-top: 1px solid rgba(64, 31, 0, .7);
  opacity: 1;
}

/* ---------- スマホ（叢生の @media (max-width:767px) の値） ---------- */
@media (max-width: 767px) {
  body.page.fs-mode-default .entry-content, body.page.fs-mode-default .kpage, body.page.fs-mode-default .page-content, body.page.fs-mode-default .fs-page-blocks { padding: 0 5% 25px; }
  body.page.fs-mode-default :where(.entry-content, .kpage, .page-content, .fs-page-blocks) :where(.entry-content, .kpage, .page-content, .fs-page-blocks) { max-width: none; width: auto; padding: 0; }
  body.page.fs-mode-default :where(.entry-content, .kpage, .page-content, .fs-page-blocks) h2 {
    margin: 50px 0 0;
    padding: 20px 10px;
    font-size: 24px;
    line-height: 1.4;
    letter-spacing: 2px;
  }
  body.page.fs-mode-default :where(.entry-content, .kpage, .page-content, .fs-page-blocks) h2:first-child { margin-top: 25px; }
  body.page.fs-mode-default :where(.entry-content, .kpage, .page-content, .fs-page-blocks) h3 {
    margin: 30px 0 0;
    font-size: 20px;
    line-height: 1.3;
    letter-spacing: -0.5px;
  }
  body.page.fs-mode-default :where(.entry-content, .kpage, .page-content, .fs-page-blocks) p {
    margin: 20px 0 0;
    font-size: 15px;
    line-height: 1.6;
  }
  body.page.fs-mode-default :where(.entry-content, .kpage, .page-content, .fs-page-blocks) .wp-block-column p { margin-left: 3%; margin-right: 3%; }
  body.page.fs-mode-default :where(.entry-content, .kpage, .page-content, .fs-page-blocks) .wp-block-column .wp-block-image { width: 80%; margin: 20px auto; }
  body.page.fs-mode-default :where(.entry-content, .kpage, .page-content, .fs-page-blocks) ul.lp-check li {
    margin-top: 20px;
    padding-left: 36px;
    font-size: 15px;
    line-height: 1.6;
  }
  body.page.fs-mode-default :where(.entry-content, .kpage, .page-content, .fs-page-blocks) ul.lp-check li::before { left: 0; width: 24px; height: 24px; }
  body.page.fs-mode-default :where(.entry-content, .kpage, .page-content, .fs-page-blocks) .wp-block-buttons { margin: 20px 0 0; }
  body.page.fs-mode-default :where(.entry-content, .kpage, .page-content, .fs-page-blocks) .wp-block-button { min-width: 0; width: 95%; }
  body.page.fs-mode-default :where(.entry-content, .kpage, .page-content, .fs-page-blocks) .wp-block-button__link { white-space: normal; }
  body.page.fs-mode-default :where(.entry-content, .kpage, .page-content, .fs-page-blocks) .wp-block-columns { flex-wrap: wrap; }
  body.page.fs-mode-default :where(.entry-content, .kpage, .page-content, .fs-page-blocks) .wp-block-column { flex-basis: 100%; }
  body.page.fs-mode-default :where(.entry-content, .kpage, .page-content, .fs-page-blocks) .wp-block-button__link { font-size: 15px; letter-spacing: normal; }
}