/*
Theme Name: TT25 LP Child
Template: twentytwentyfive
Description: Twenty Twenty-Five用の子テーマ。LP制作用カスタムCSS。色・フォントの定義はtheme.json側。
Version: 9.5.0
Author: Shinji
Requires at least: 6.7
*/

/* ============================================================
   0. 補助トークン(Figma Make実値ベース)
   ============================================================ */
:root {
  --lp-tracking-label: 0.18em;     /* DM Monoラベルの字間 */
  --lp-tracking-label-wide: 0.22em;/* ヒーロー上ラベルの字間 */
  --lp-tracking-heading: 0.06em;   /* 見出しの字間(h1) */
  --lp-tracking-heading-sub: 0.08em;/* セクション見出しの字間 */
  --lp-leading-hero: 1.55;         /* ヒーロー見出しの行間 */
  --lp-leading-heading: 1.65;      /* セクション見出しの行間 */
  --lp-leading-body: 2.15;         /* 本文の行間 */
}

/* ============================================================
   1. 共通ユーティリティ(「追加CSSクラス」に貼って使う)
   ============================================================ */

/* 「01 — 織地について」等のDM Monoラベル */
.lp-label {
  font-family: var(--wp--preset--font-family--lp-mono);
  font-size: 10px;
  letter-spacing: var(--lp-tracking-label);
  color: var(--wp--preset--color--lp-text-weak);
}

/* 全テキスト要素:折り返しの自動調整(balance/pretty)を無効化し、
   「行末まで詰めて折り返す」動作にサイト全体で統一 */
h1, h2, h3, h4, h5, h6,
p, li, summary, figcaption, td, th, dt, dd, blockquote, caption {
  text-wrap: wrap !important;
  text-wrap-style: auto !important;
}

/* 明朝の見出し */
.lp-heading {
  font-family: var(--wp--preset--font-family--lp-serif);
  font-weight: 500;
  letter-spacing: var(--lp-tracking-heading-sub);
  line-height: var(--lp-leading-heading);
}

/* 本文(行間広め・紺グレー) */
.lp-body {
  line-height: var(--lp-leading-body);
  font-size: 16px;
  /* Safariのtext-wrap: pretty(段落全体の折返し自動調整)を無効化し、
     行末まで詰めてから折り返す標準動作に固定する */
  text-wrap: wrap;
  text-wrap-style: auto;
}

/* 反転(紺背景)セクション内の色調整 */
.lp-section--invert .lp-label { color: rgba(255,255,255,.6); }
.lp-section--invert .lp-body { color: rgba(255,255,255,.8); }

/* ============================================================
   2. ファーストビュー(カバーブロックに lp-hero を付与)
   写真をルミノシティ合成で紺に馴染ませ、左→右のグラデを重ねる
   ============================================================ */
.lp-hero {
  min-height: clamp(720px, 90vh, 820px);
  background-color: var(--wp--preset--color--lp-main);
}

/* カバーブロックの背景画像をモノトーン合成 */
.lp-hero .wp-block-cover__image-background {
  opacity: .75 !important;
  mix-blend-mode: luminosity;
}

/* カバーブロックのオーバーレイをグラデーションに差し替え */
.lp-hero .wp-block-cover__background {
  background: linear-gradient(to right,
    rgba(41, 70, 50, .90) 0%,
    rgba(69, 106, 80, .62) 50%,
    rgba(119, 155, 117, .14) 100%) !important;
  opacity: 1 !important;
}

/* ヒーロー内はコンテンツ幅制限(720px)を解除して左揃えにする
   (入れ子の深さに関係なく効くよう、descendant指定+!importantで固定) */
.lp-hero .wp-block-cover__inner-container {
  width: 100%;
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
}
.lp-hero .wp-block-cover__inner-container :is(h1, h2, h3, p, .wp-block-buttons, .wp-block-group) {
  max-width: none;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* ヒーロー内タイポグラフィ */
.lp-hero .lp-label {
  font-size: 13px;
  color: rgba(255,255,255,.92);
  letter-spacing: var(--lp-tracking-label-wide);
}
.lp-hero .lp-heading {
  color: #ffffff;
  font-size: clamp(28px, 4.8vw, 62px);
  letter-spacing: var(--lp-tracking-heading);
  line-height: var(--lp-leading-hero);
  margin-top: clamp(16px, 2vw, 24px) !important;
}
.lp-hero .lp-body {
  color: rgba(255,255,255,.9);
  max-width: 36em !important;
  margin-top: clamp(20px, 2.5vw, 32px) !important;
}
.lp-hero .wp-block-buttons {
  margin-top: clamp(28px, 3vw, 40px) !important;
}

/* 白の角丸ボタン(ボタンブロックに lp-btn を付与) */
.lp-btn .wp-block-button__link {
  background-color: var(--wp--preset--color--lp-btn-bg);
  color: var(--wp--preset--color--lp-main);
  border-radius: 999px;
  padding: 1em 1.75em;
  font-size: 14px;
  font-weight: 500;
  transition: transform .3s;
}
.lp-btn .wp-block-button__link:hover { transform: translateY(-4px); }

/* CTAのボタン行:全ボタンを同じ幅に揃える(ボタン群ブロックに lp-btn-row) */
.lp-btn-row .wp-block-button { min-width: 280px; }
.lp-btn-row .wp-block-button__link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
}
@media (max-width: 781px) {
  .lp-btn-row { width: 100%; }
  .lp-btn-row .wp-block-button { min-width: 0; width: 100%; }
}

/* 電話ボタン(ボタンブロックに lp-btn--tel):アクセント色で最も目立たせる */
.lp-btn--tel .wp-block-button__link {
  background-color: var(--wp--preset--color--lp-accent);
  color: #ffffff;
  border-radius: 999px;
  padding: 1em 1.75em;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: .05em;
  box-shadow: 0 2px 10px rgba(0, 0, 0, .15);
  transition: transform .3s;
}
.lp-btn--tel .wp-block-button__link::before {
  content: "☎";
  margin-right: 10px;
  font-size: 15px;
}
.lp-btn--tel .wp-block-button__link:hover { transform: translateY(-4px); }

/* 枠線だけの白ボタン(電話番号用など) */
.lp-btn--outline .wp-block-button__link {
  background: transparent;
  color: #fff;
  border: 1px solid rgba(255,255,255,.6);
  border-radius: 999px;
  padding: 1em 1.75em;
  font-size: 14px;
}

/* 紺の枠線ボタン(明るい背景のセクション用「詳しく見る」) */
.lp-btn--line .wp-block-button__link {
  background: transparent;
  color: var(--wp--preset--color--lp-main);
  border: 1px solid var(--wp--preset--color--lp-main);
  border-radius: 999px;
  padding: .9em 1.75em;
  font-size: 14px;
  font-weight: 500;
  transition: background-color .3s, color .3s;
}
.lp-btn--line .wp-block-button__link:hover {
  background-color: var(--wp--preset--color--lp-main);
  color: #ffffff;
}

/* ============================================================
   3. 署名的モチーフ
   ============================================================ */

/* 非対称角丸(左上・右下だけ丸い)— 画像やカードを包むグループに付与 */
.lp-corner { border-radius: 100px 0 100px 0; overflow: hidden; }
.lp-corner--sm { border-radius: 80px 0 80px 0; overflow: hidden; }

/* 透かし文字(「織」)。グループに lp-watermark、
   カスタムHTMLで <span class="lp-watermark__char">織</span> */
.lp-watermark { position: relative; overflow: hidden; }
.lp-watermark__char {
  position: absolute;
  top: 40px;
  right: -0.05em;
  font-family: var(--wp--preset--font-family--lp-serif);
  font-size: clamp(180px, 22vw, 300px);
  line-height: 1;
  color: var(--wp--preset--color--lp-watermark);
  pointer-events: none;
  user-select: none;
  z-index: 0;
}
.lp-watermark > *:not(.lp-watermark__char) { position: relative; z-index: 1; }

/* アクセント色の項番(01, 02, 03 / 日付カテゴリ等) */
.lp-num {
  font-family: var(--wp--preset--font-family--lp-mono);
  font-size: 12px;
  color: var(--wp--preset--color--lp-accent);
}

/* ============================================================
   3.4 セクション内パーツ(「織地について」型レイアウト用)
   ============================================================ */

/* 左カラムの小さなセクション名(明朝・字間広め) */
.lp-section-title {
  font-family: var(--wp--preset--font-family--lp-serif);
  font-size: 20px;
  letter-spacing: .14em;
  color: var(--wp--preset--color--lp-text);
}

/* セクションの大見出し(h2に付与してデフォルトより大きく) */
.lp-heading-lg {
  font-size: clamp(30px, 3.4vw, 44px) !important;
  letter-spacing: var(--lp-tracking-heading-sub);
  line-height: 1.7;
}

/* 下線+丸囲み矢印のテキストリンク(段落ブロックに付与し、中のテキストにリンクを設定) */
.lp-link-arrow a {
  position: relative;
  display: inline-block;
  padding-right: 54px;   /* 丸矢印の居場所(40px)+間隔(14px) */
  padding-bottom: 8px;
  font-size: 15px;
  font-weight: 600;
  color: var(--wp--preset--color--lp-main);
  text-decoration: none;
  /* 下線はテキスト幅ぶんだけ描く(丸矢印の下には引かない) */
  background-image: linear-gradient(currentColor, currentColor);
  background-repeat: no-repeat;
  background-position: 0 100%;
  background-size: calc(100% - 54px) 1px;
  transition: opacity .3s;
}
/* 紺背景セクション内では白リンクに */
.lp-section--invert .lp-link-arrow a { color: #ffffff; }
.lp-section--invert .lp-link-arrow a:hover::after {
  background-color: #ffffff;
  color: var(--wp--preset--color--lp-main);
}
.lp-link-arrow a::after {
  content: "→";
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border: 1px solid currentColor;
  border-radius: 50%;
  font-size: 15px;
  transition: background-color .3s, color .3s;
}
.lp-link-arrow a:hover { opacity: .85; }
.lp-link-arrow a:hover::after {
  background-color: var(--wp--preset--color--lp-main);
  color: #ffffff;
}

/* ============================================================
   3.43 写真+重なりキャプション
   グループに lp-photo-wrap、中に画像(lp-corner系)+段落(キャプション)
   ============================================================ */
.lp-photo-wrap { position: relative; }

/* 紺キャプション:写真の左下角に密着(「空間・設備」用) */
.lp-photo-caption {
  position: absolute;
  left: 0;
  bottom: 0;
  margin: 0;
  background: var(--wp--preset--color--lp-main);
  color: #ffffff;
  font-size: 14px;
  line-height: 1.9;
  padding: 20px 28px;
}

/* 白キャプション:写真の右下角に密着(「織地について」用) */
.lp-photo-caption--white {
  left: auto;
  right: 0;
  background: rgba(255, 255, 255, .95);
  color: var(--wp--preset--color--lp-main);
  font-size: 12px;
  line-height: 1.8;
  padding: 12px 20px;
}

/* ============================================================
   3.45 「3つの特長」写真カード型3カラム
   カラムブロック(親)に lp-cards。各カラム内は
   グループ(lp-card-img)>画像+段落(lp-card-num)、
   グループ(lp-card-body)>H3+段落 の構成
   ============================================================ */
.lp-cards .wp-block-column {
  position: relative; /* バッジの逃げ場(グループのクラス漏れ時もカード右上に留まる) */
  background: #ffffff;
  box-shadow: 0 10px 24px rgba(69, 106, 80, .06);
  overflow: hidden;
}
/* カード内の余白・幅制限を全排除して写真を端まで密着させる */
.lp-cards .wp-block-column { padding: 0 !important; }
.lp-cards .wp-block-column > * { margin-top: 0 !important; margin-bottom: 0 !important; }
.lp-card-img {
  padding: 0 !important;
  margin: 0 !important;
  width: 100%;
}
.lp-card-img > * {
  margin: 0 !important;
  max-width: none !important;
}
.lp-card-img .wp-block-image,
.lp-card-img figure {
  margin: 0 !important;
  width: 100% !important;
  max-width: none !important;
}
.lp-card-img img {
  width: 100% !important;
  max-width: none !important;
  border-radius: 0;
}
.lp-card-img {
  position: relative;
  margin: 0;
  background: var(--wp--preset--color--lp-watermark);
}
.lp-card-img img {
  width: 100%;
  aspect-ratio: 1.45 / 1;
  object-fit: cover;
  display: block;
}
.lp-card-num {
  position: absolute;
  top: 0;
  right: 0;
  margin: 0;
  background: #ffffff;
  padding: 10px 16px;
  font-family: var(--wp--preset--font-family--lp-mono);
  font-size: 12px;
  color: var(--wp--preset--color--lp-accent);
}
.lp-card-body {
  padding: 28px 28px 32px;
}
.lp-card-body h3 { margin-top: 0; }
.lp-card-body .lp-body { font-size: 13px; line-height: 2.05; }

/* (旧アイコン型のCSSは互換のため残置) */
/* アイコン+項番の行(各カラム先頭のカスタムHTML用) */
.lp-feature-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 28px;
}
.lp-feature-icon {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--wp--preset--color--lp-main);
  box-shadow: 0 1px 4px rgba(69, 106, 80, .08);
}
.lp-feature-icon svg { width: 22px; height: 22px; }
.lp-feature-icon--teal { color: var(--wp--preset--color--lp-teal); }
.lp-feature-icon--orange { color: var(--wp--preset--color--lp-accent); }

/* スマホでは縦積み+横罫線に切り替え */
@media (max-width: 781px) {
  /* (旧features型の指定を撤廃済み) */
}

/* ============================================================
   3.5 ヘッダー(ヘッダーの最外グループに lp-header を付与)
   ============================================================ */
.lp-header {
  background: #ffffff;
  box-shadow: 0 2px 12px rgba(69, 106, 80, .06);
  border-bottom: 1px solid rgba(69, 106, 80, .1);
}

/* ナビリンクの質感 */
.lp-header .wp-block-navigation a {
  font-size: 13px;
  color: var(--wp--preset--color--lp-main);
  transition: opacity .3s;
}
.lp-header .wp-block-navigation a:hover {
  opacity: .65;
  text-decoration: none;
}

/* ヘッダー内のお問い合わせボタン */
.lp-header .wp-block-button__link {
  background-color: var(--wp--preset--color--lp-main);
  color: #ffffff;
  border-radius: 999px;
  padding: .8em 1.6em;
  font-size: 13px;
  box-shadow: 0 1px 3px rgba(0,0,0,.1);
}

/* ============================================================
   3.9 スマホ対応:PC用の手動改行(Shift+Enter)をスマホでは無効化
   ============================================================ */
/* (v2.9でスマホの改行非表示ルールを撤廃:改行はPC/スマホ共通で有効。
   スマホだけ改行したい場合の <br class="lp-br-sp"> は引き続き利用可) */

/* スマホ専用改行: <br class="lp-br-sp"> はPCでは無効、スマホでのみ改行する */
.lp-br-sp { display: none; }
@media (max-width: 781px) {
  .lp-br-sp { display: inline !important; }
}

/* ============================================================
   3.55 こだわりコンテンツカード(カラムブロックに lp-coffee)
   左=写真(lp-coffee-img)+バッジ(lp-badge) / 右=テキスト
   ============================================================ */
.lp-coffee {
  background: var(--wp--preset--color--lp-btn-bg);
  border: 1px solid var(--wp--preset--color--lp-border);
  gap: 0 !important;
  overflow: hidden;
}
.lp-coffee .wp-block-column { margin: 0 !important; }
.lp-coffee-img {
  position: relative;
  height: 100%;
  margin: 0 !important;
}
.lp-coffee-img .wp-block-image,
.lp-coffee-img figure {
  margin: 0 !important;
  height: 100%;
  width: 100% !important;
  max-width: none !important;
}
.lp-coffee-img img {
  width: 100% !important;
  height: 100%;
  object-fit: cover;
  display: block;
}
.lp-badge {
  position: absolute;
  top: 0;
  left: 0;
  margin: 0 !important;
  background: #ffffff;
  font-family: var(--wp--preset--font-family--lp-mono);
  font-size: 11px;
  letter-spacing: .2em;
  color: var(--wp--preset--color--lp-main);
  padding: 14px 26px;
}
/* 右カラムのテキスト領域(カラム自体に余白を持たせる) */
.lp-coffee .wp-block-column:last-child {
  padding: clamp(32px, 4.5vw, 64px);
}
.lp-coffee .wp-block-column:last-child > * {
  margin-left: 0 !important;
  margin-right: 0 !important;
  max-width: none !important;
}
/* アクセント色の小ラベル */
.lp-label--accent { color: var(--wp--preset--color--lp-accent); }

@media (max-width: 781px) {
  .lp-coffee-img img { height: auto; aspect-ratio: 16 / 10; }
}

/* ============================================================
   3.6 ご利用までの流れ(リストブロックに lp-flow)
   ============================================================ */
ol.lp-flow {
  list-style: none;
  margin: 0;
  padding: 0;
  counter-reset: flow;
  border-top: 1px solid var(--wp--preset--color--lp-border);
  border-bottom: 1px solid var(--wp--preset--color--lp-border);
}
ol.lp-flow li {
  display: flex;
  align-items: center;
  gap: 20px;
  padding: 20px 4px;
  font-size: 15px;
  counter-increment: flow;
}
ol.lp-flow li + li { border-top: 1px solid var(--wp--preset--color--lp-border); }
ol.lp-flow li::before {
  content: "0" counter(flow);
  font-family: var(--wp--preset--font-family--lp-mono);
  font-size: 12px;
  color: var(--wp--preset--color--lp-accent);
  flex-shrink: 0;        /* 項番を圧縮させない */
  white-space: nowrap;   /* 「0」「3」の泣き別れを防ぐ */
}
/* 行末の「→」はクリック可能と誤認させるため不採用(2026-07判断) */

/* ============================================================
   3.65 小さなテキストリンク(下線+→、丸なし)(段落に lp-link-text)
   ============================================================ */
.lp-link-text a {
  font-size: 14px;
  font-weight: 500;
  color: var(--wp--preset--color--lp-main);
  text-decoration: underline;
  text-underline-offset: 8px;
  text-decoration-thickness: 1px;
  transition: opacity .3s;
}
.lp-link-text a::after { content: " →"; }
.lp-link-text a:hover { opacity: .7; }
.lp-section--invert .lp-link-text a { color: #ffffff; }

/* ============================================================
   3.7 お知らせリスト(各行=グループに lp-news-row)
   ============================================================ */
.lp-news-list {
  border-top: 1px solid rgba(69, 106, 80, .15);
  border-bottom: 1px solid rgba(69, 106, 80, .15);
}
.lp-news-row {
  display: flex;
  align-items: center;
  gap: 32px;
  padding: 20px 4px;
  text-decoration: none;
}
/* WPのレイアウト自動マージンを無効化(要素が散らばるのを防ぐ) */
.lp-news-row > * {
  margin: 0 !important;
  max-width: none !important;
}
.lp-news-list > * { margin: 0 !important; }
.lp-news-row + .lp-news-row { border-top: 1px solid rgba(69, 106, 80, .15); }
.lp-news-date, .lp-news-cat {
  font-family: var(--wp--preset--font-family--lp-mono);
  font-size: 10px;
  color: var(--wp--preset--color--lp-text-weak);
}
.lp-news-cat { color: var(--wp--preset--color--lp-accent); }
.lp-news-title { font-size: 14px; margin: 0; }
/* 行末の「→」は静的リストでは不採用(遷移は右上の「一覧へ」に一本化 / 2026-07判断) */
@media (max-width: 781px) {
  .lp-news-row { flex-wrap: wrap; gap: 8px 16px; }
  .lp-news-title { width: 100%; }
}

/* ============================================================
   3.75 お知らせ(クエリーループブロックに lp-news-loop)
   構成: 投稿日(lp-news-date)+カテゴリー(lp-news-cat)+タイトル(lp-news-title)
   ============================================================ */
.lp-news-loop .wp-block-post-template {
  list-style: none;
  margin: 0 !important;
  padding: 0;
  border-top: 1px solid rgba(69, 106, 80, .15);
}
.lp-news-loop .wp-block-post-template > li {
  display: flex;
  align-items: center;
  gap: 32px;
  margin: 0 !important;
  padding: 20px 4px;
  border-bottom: 1px solid rgba(69, 106, 80, .15);
}
.lp-news-loop .wp-block-post-template > li > * {
  margin: 0 !important;
  max-width: none !important;
}

/* 日付・カテゴリー */
.lp-news-loop .lp-news-date,
.lp-news-loop .lp-news-cat {
  flex-shrink: 0;
  font-family: var(--wp--preset--font-family--lp-mono);
  font-size: 11px;
  color: var(--wp--preset--color--lp-text-weak);
}
.lp-news-loop .lp-news-cat { color: var(--wp--preset--color--lp-accent); min-width: 5em; }
.lp-news-loop .lp-news-cat a { color: inherit; text-decoration: none; }

/* タイトル(リンク全体が押せる。右端に矢印) */
.lp-news-loop .lp-news-title {
  flex: 1;
  font-family: var(--wp--preset--font-family--lp-sans) !important;
  font-size: 15px !important;
  font-weight: 500;
  letter-spacing: 0 !important;
  line-height: 1.8;
}
.lp-news-loop .lp-news-title a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  color: var(--wp--preset--color--lp-text);
  text-decoration: none;
  transition: opacity .3s;
}
.lp-news-loop .lp-news-title a::after {
  content: "→";
  flex-shrink: 0;
  color: var(--wp--preset--color--lp-main);
}
.lp-news-loop .lp-news-title a:hover { opacity: .65; }

/* 記事がないとき */
.lp-news-loop .wp-block-query-no-results {
  padding: 32px 4px;
  font-size: 14px;
  color: var(--wp--preset--color--lp-text-weak);
  border-bottom: 1px solid rgba(69, 106, 80, .15);
}

@media (max-width: 781px) {
  .lp-news-loop .wp-block-post-template > li {
    flex-wrap: wrap;
    gap: 8px 16px;
    padding: 18px 4px;
  }
  .lp-news-loop .lp-news-title { flex: 0 0 100%; }
}

/* ============================================================
   3.78 記事ページ(個別投稿テンプレート)
   ============================================================ */
/* 記事ヘッダー */
.lp-article-head {
  text-align: center;
  /* インラインの余白指定を上書きして詰める */
  padding-top: clamp(44px, 4.5vw, 64px) !important;
  padding-bottom: clamp(44px, 4.5vw, 64px) !important;
}
/* テンプレート内セクション間の自動すきまを除去(ヘッダー直下の隙間対策) */
main.wp-block-group > * {
  margin-block-start: 0 !important;
  margin-block-end: 0 !important;
}
/* サイト最上位(ヘッダー/メイン/フッター)の自動すきまも除去 */
.wp-site-blocks > * {
  margin-block-start: 0 !important;
  margin-block-end: 0 !important;
}
.lp-article-meta {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 20px;
  margin-bottom: 18px !important;
}
.lp-article-meta > * { margin: 0 !important; }
.lp-article-meta .lp-news-date,
.lp-article-meta .lp-news-cat {
  font-family: var(--wp--preset--font-family--lp-mono);
  font-size: 12px;
  color: var(--wp--preset--color--lp-text-weak);
}
.lp-article-meta .lp-news-cat { color: var(--wp--preset--color--lp-accent); }
.lp-article-meta .lp-news-cat a { color: inherit; text-decoration: none; }
.lp-article-title {
  font-size: clamp(24px, 2.8vw, 36px) !important;
  line-height: 1.75;
  letter-spacing: .05em;
}

/* 本文 */
.lp-article-body {
  font-size: 16px;
  line-height: 2.15;
}
.lp-article-body p { margin: 0 0 1.9em; }
.lp-article-body p:last-child { margin-bottom: 0; }
.lp-article-body h2 {
  font-size: clamp(20px, 2.2vw, 26px) !important;
  margin: 2.4em 0 .9em;
  padding-bottom: .5em;
  border-bottom: 1px solid var(--wp--preset--color--lp-border);
}
.lp-article-body h3 {
  font-size: clamp(18px, 1.9vw, 21px) !important;
  margin: 2em 0 .8em;
}
.lp-article-body ul,
.lp-article-body ol { margin: 0 0 1.9em; padding-left: 1.4em; }
.lp-article-body li { margin-bottom: .6em; line-height: 2; }
.lp-article-body img { border-radius: 8px; }
.lp-article-body a {
  color: var(--wp--preset--color--lp-main);
  text-decoration: underline;
  text-underline-offset: 4px;
}

/* 一覧へ戻る */
.lp-article-back { text-align: center; }

/* ページ送り(クエリーループのページネーションに lp-pagination) */
.lp-pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  margin-top: 48px !important;
}
.lp-pagination .wp-block-query-pagination-numbers,
.lp-pagination .wp-block-query-pagination-previous,
.lp-pagination .wp-block-query-pagination-next { margin: 0 !important; }
.lp-pagination a,
.lp-pagination .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 42px;
  height: 42px;
  padding: 0 12px;
  border: 1px solid var(--wp--preset--color--lp-border);
  border-radius: 6px;
  font-family: var(--wp--preset--font-family--lp-mono);
  font-size: 13px;
  color: var(--wp--preset--color--lp-main);
  text-decoration: none;
  transition: background-color .25s, color .25s;
}
.lp-pagination a:hover {
  background: var(--wp--preset--color--lp-main);
  color: #ffffff;
  border-color: var(--wp--preset--color--lp-main);
}
.lp-pagination .page-numbers.current {
  background: var(--wp--preset--color--lp-main);
  color: #ffffff;
  border-color: var(--wp--preset--color--lp-main);
}
.lp-pagination .page-numbers.dots {
  border: none;
  min-width: 0;
  padding: 0 4px;
}

/* ============================================================
   3.8 事業所概要(テーブルブロックに lp-overview / 見出しグループに lp-accent-bar)
   ============================================================ */
.lp-accent-bar {
  border-left: 4px solid var(--wp--preset--color--lp-accent);
  padding-left: 20px;
}
.lp-accent-bar > * {
  margin-left: 0 !important;
  margin-right: 0 !important;
}
.lp-accent-bar .lp-label { color: var(--wp--preset--color--lp-accent); }

.lp-overview table {
  border-collapse: separate;
  border-spacing: 0;
  width: 100%;
  font-size: 14px;
  background: #ffffff;
  border: 1px solid rgba(69, 106, 80, .15);
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 16px 40px rgba(69, 106, 80, .07);
}
.lp-overview th,
.lp-overview td {
  border: none;
  border-top: 1px solid rgba(69, 106, 80, .12);
  padding: 28px 32px;
  vertical-align: top;
  line-height: 2.05;
  text-align: left;
}
/* セル内の項目名(太字にした部分)をミニ見出し化して値の頭を揃える */
.lp-overview td strong,
.lp-overview td b {
  color: var(--wp--preset--color--lp-main);
  font-weight: 600;
  display: inline-block;
  min-width: 7.5em;
  vertical-align: top;
}

/* 表内のテキストリンク(料金詳細など。→は文中に手入力) */
.lp-overview a {
  color: var(--wp--preset--color--lp-main);
  font-weight: 500;
  text-decoration: underline;
  text-underline-offset: 8px;
  text-decoration-thickness: 1px;
  transition: opacity .3s;
}
.lp-overview a:hover { opacity: .7; }
.lp-overview tr:first-child th,
.lp-overview tr:first-child td { border-top: none; }
.lp-overview th,
.lp-overview td:first-child:not(:last-child) {
  background: #f3f7f1;
  color: var(--wp--preset--color--lp-main);
  font-weight: 500;
  width: 24%;
  min-width: 130px;
}
.lp-overview td:not(:first-child) { color: var(--wp--preset--color--lp-text-weak); }

/* 事業所概要の表:スマホでは縦積み(見出しセル→内容の順) */
@media (max-width: 781px) {
  /* 表の全階層をブロック化し、幅・折り返しを強制的に画面内へ収める */
  .lp-overview,
  .lp-overview table,
  .lp-overview tbody,
  .lp-overview tr,
  .lp-overview th,
  .lp-overview td {
    display: block;
    width: auto !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }
  .lp-overview { overflow: hidden; }
  .lp-overview th,
  .lp-overview td {
    overflow-wrap: anywhere;
    word-break: break-word;
  }
  .lp-overview tr { display: block; }
  .lp-overview th,
  .lp-overview td {
    display: block;
    width: 100% !important;
    min-width: 0 !important;
    padding: 16px 20px;
  }
  .lp-overview td:not(:first-child) { border-top: none; padding-top: 4px; padding-bottom: 24px; }
}

/* ============================================================
   3.85 表示切り替え・並び替えユーティリティ
   ============================================================ */
/* スマホでは非表示(織地についての写真など) */
@media (max-width: 781px) {
  .lp-pc-only { display: none !important; }
  /* カラムの並びをスマホで反転(空間・設備:写真を先に) */
  .lp-sp-reverse { display: flex !important; flex-direction: column-reverse !important; }
}
/* PCでは非表示(スマホ専用画像など)。lp-pc-onlyと対で使う */
@media (min-width: 782px) {
  .lp-sp-only { display: none !important; }
}

/* スマホ用トリミング:付与した画像をスマホでは指定比率で切り抜き表示
   (PCの表示には影響しない) */
@media (max-width: 781px) {
  .lp-crop-sp-43 img { aspect-ratio: 4 / 3 !important; object-fit: cover; }
  .lp-crop-sp-11 img { aspect-ratio: 1 / 1 !important; object-fit: cover; }
  .lp-crop-sp-169 img { aspect-ratio: 16 / 9 !important; object-fit: cover; }
}

/* 中サイズの非対称角丸(織地についての写真用) */
.lp-corner--md { border-radius: 56px 0 56px 0; overflow: hidden; }

/* ============================================================
   3.9 フッター(フッターの最外グループに lp-footer を付与)
   構成: 上段=ロゴ / 電話+お問い合わせボタン
         区切り線
         下段=ナビ / コピーライト
   ============================================================ */
.lp-footer {
  background: #ffffff;
  border-top: 1px solid rgba(69, 106, 80, .1);
  padding: clamp(40px, 5vw, 64px) 0 clamp(28px, 3vw, 40px);
}

/* 横並び行は必ず折り返し可にする(モバイルで潰れない) */
.lp-footer .wp-block-group.is-layout-flex,
.lp-footer .wp-block-columns {
  flex-wrap: wrap;
  gap: 20px 32px;
  align-items: center;
}

/* ロゴ */
.lp-footer .wp-block-site-logo img { max-width: 160px; height: auto; }

/* 電話番号 */
.lp-footer .lp-tel { margin: 0 !important; }
.lp-footer .lp-tel a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: var(--wp--preset--font-family--lp-mono);
  font-size: 19px;
  font-weight: 500;
  letter-spacing: .04em;
  color: var(--wp--preset--color--lp-main);
  text-decoration: none;
  transition: opacity .3s;
}
.lp-footer .lp-tel a::before { content: "☎"; font-size: 15px; }
.lp-footer .lp-tel a:hover { opacity: .7; }

/* お問い合わせボタン */
.lp-footer .wp-block-button__link {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background-color: var(--wp--preset--color--lp-main);
  color: #ffffff;
  border-radius: 999px;
  padding: .85em 1.8em;
  font-size: 14px;
  font-weight: 500;
  transition: transform .3s;
}
.lp-footer .wp-block-button__link::after { content: "→"; font-size: 13px; }
.lp-footer .wp-block-button__link:hover { transform: translateY(-3px); }

/* 区切り線 */
.lp-footer .wp-block-separator {
  border: none;
  border-top: 1px solid rgba(69, 106, 80, .12);
  opacity: 1;
  margin: clamp(28px, 3.5vw, 44px) 0;
  width: 100%;
  max-width: none;
}

/* ナビゲーション */
.lp-footer .wp-block-navigation {
  gap: 8px 28px;
  flex-wrap: wrap;
}
.lp-footer .wp-block-navigation a {
  font-size: 13px;
  color: var(--wp--preset--color--lp-text-weak);
  text-decoration: none;
  transition: color .3s;
}
.lp-footer .wp-block-navigation a:hover { color: var(--wp--preset--color--lp-main); }

/* コピーライト */
.lp-footer .lp-copyright {
  margin: 0 !important;
  font-size: 12px;
  color: var(--wp--preset--color--lp-text-weak);
}

/* --- モバイル:全要素を中央軸に揃える --- */
@media (max-width: 781px) {
  .lp-footer { text-align: center; }

  .lp-footer .wp-block-group.is-layout-flex,
  .lp-footer .wp-block-columns {
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 18px;
  }
  .lp-footer .wp-block-column { width: 100%; }

  /* ロゴを中央に */
  .lp-footer .wp-block-site-logo {
    margin-left: auto !important;
    margin-right: auto !important;
  }
  .lp-footer .wp-block-site-logo img { max-width: 132px; }

  /* 電話番号を大きく中央に */
  .lp-footer .lp-tel { text-align: center; }
  .lp-footer .lp-tel a { font-size: 22px; }

  /* ボタンは全幅 */
  .lp-footer .wp-block-buttons,
  .lp-footer .wp-block-button,
  .lp-footer .wp-block-buttons > .wp-block-button {
    width: 100% !important;
    max-width: none !important;
    justify-content: center;
  }
  .lp-footer .wp-block-button__link {
    width: 100% !important;
    justify-content: center;
    padding: 1.05em 1.5em;
  }

  /* 区切り線 */
  .lp-footer .wp-block-separator { margin: 28px 0; }

  /* ナビは中央寄せで均等に折り返す */
  .lp-footer .wp-block-navigation,
  .lp-footer .wp-block-navigation__container {
    justify-content: center;
    gap: 14px 18px;
  }
  .lp-footer .wp-block-navigation a { font-size: 13.5px; }

  .lp-footer .lp-copyright {
    width: 100%;
    text-align: center;
    margin-top: 8px !important;
  }
}

/* ============================================================
   3.95 下層ページ用パーツ(aboutページ〜)
   ============================================================ */

/* 下層ページの低いヒーロー(カバーブロックに lp-hero lp-hero--sub を併記)
   トップと違い、全要素をセンター揃えにする */
.lp-hero--sub {
  min-height: clamp(480px, 62vh, 570px);
}
.lp-hero--sub .lp-heading {
  font-size: clamp(34px, 4.4vw, 62px);
}
.lp-hero--sub .wp-block-cover__inner-container {
  text-align: center;
}
.lp-hero--sub .wp-block-cover__inner-container :is(h1, h2, h3, p, .wp-block-buttons) {
  margin-left: auto !important;
  margin-right: auto !important;
}

/* 中サイズの明朝ステートメント(OUR THOUGHTSの主文など。H2に付与) */
.lp-statement {
  font-size: clamp(22px, 2.5vw, 32px) !important;
  line-height: 1.85;
  letter-spacing: .07em;
}

/* 織り糸の背景ライン(セクショングループに lp-weave) */
.lp-weave {
  position: relative;
  background-image:
    linear-gradient(rgba(69,106,80,.14), rgba(69,106,80,.14)),
    linear-gradient(rgba(69,106,80,.10), rgba(69,106,80,.10)),
    linear-gradient(rgba(69,106,80,.14), rgba(69,106,80,.14)),
    linear-gradient(rgba(69,106,80,.10), rgba(69,106,80,.10)),
    linear-gradient(rgba(69,106,80,.12), rgba(69,106,80,.12));
  background-repeat: no-repeat;
  background-size: 1px 100%, 1px 100%, 1px 100%, 100% 1px, 100% 1px;
  background-position: 4% 0, 7% 0, 96% 0, 0 8%, 0 94%;
}

/* 織りセクション用:透かし文字と糸モチーフ */
.lp-weave { overflow: hidden; }
.lp-weave .lp-watermark__char {
  color: rgba(69, 106, 80, .07);
  top: auto;
  bottom: -0.06em;
  right: 3%;
  font-size: clamp(160px, 18vw, 260px);
}

/* 糸の交差モチーフ(カスタムHTMLで
   <div class="lp-thread-motif"><span></span><span></span><span></span><span></span></div>) */
.lp-thread-motif {
  position: relative;
  width: 140px;
  height: 140px;
  margin-top: 48px;
}
.lp-thread-motif span { position: absolute; display: block; }
.lp-thread-motif span:nth-child(1) {
  left: 50%; top: 0; width: 2px; height: 100%;
  background: var(--wp--preset--color--lp-accent);
}
.lp-thread-motif span:nth-child(2) {
  top: 50%; left: 0; height: 2px; width: 100%;
  background: var(--wp--preset--color--lp-main);
}
.lp-thread-motif span:nth-child(3) {
  left: 28%; top: 0; width: 2px; height: 100%;
  background: rgba(69, 106, 80, .55);
}
.lp-thread-motif span:nth-child(4) {
  top: 28%; left: 0; height: 2px; width: 100%;
  background: rgba(183, 122, 56, .65);
}

/* 字間を広げた静かなステートメント(見出しに併記) */
.lp-tracking-wide {
  letter-spacing: .12em !important;
}

/* 2カラム小見出しの上の区切り線(カラムブロックに lp-divide-top を付与) */
.lp-divide-top {
  border-top: 1px solid rgba(69,106,80,.22);
  padding-top: 32px;
  margin-top: 16px !important;
}

/* 反転セクションの2×2相談リスト(番号付きリストに lp-consult) */
ol.lp-consult {
  list-style: none;
  margin: 0 !important;          /* WPの自動中央寄せを無効化して見出しと左端を揃える */
  max-width: none !important;
  padding: 0;
  counter-reset: consult;
  display: grid;
  grid-template-columns: 1fr 1fr;
  border-top: 1px solid rgba(255,255,255,.25);
  border-bottom: 1px solid rgba(255,255,255,.25);
}
ol.lp-consult li { margin: 0 !important; } /* 項目間の余計なマージンを除去 */
ol.lp-consult li {
  display: flex;
  gap: 18px;
  padding: 24px 32px;
  font-size: 15px;
  line-height: 1.9;
  counter-increment: consult;
}
ol.lp-consult li:nth-child(odd) {
  border-right: 1px solid rgba(255,255,255,.2);
  padding-left: 0;
}
ol.lp-consult li::before {
  content: "0" counter(consult);
  font-family: var(--wp--preset--font-family--lp-mono);
  font-size: 12px;
  padding-top: 4px;
  color: var(--wp--preset--color--lp-gold);
  flex-shrink: 0;
  white-space: nowrap;
}
@media (max-width: 781px) {
  ol.lp-consult { grid-template-columns: 1fr; }
  ol.lp-consult li,
  ol.lp-consult li:nth-child(odd) {
    border-right: none;
    border-bottom: 1px solid rgba(255,255,255,.2);
    padding: 18px 4px;
  }
  ol.lp-consult li:last-child { border-bottom: none; }
}

/* 金の縦線付きの補足(反転セクション内の段落に lp-note) */
.lp-note {
  border-left: 2px solid var(--wp--preset--color--lp-gold);
  padding-left: 20px;
  font-size: 14px;
  line-height: 2;
}

/* 注釈(※〜)用の小さな文字 */
.lp-fine {
  font-size: 12px;
  color: var(--wp--preset--color--lp-text-weak);
}

/* Googleマップ埋め込み(グループに lp-map、中にカスタムHTMLでiframe) */
.lp-map iframe {
  display: block;
  width: 100%;
  min-height: 340px;
  border: 0;
  filter: grayscale(.2);
}

/* ============================================================
   3.99 セクション間の自動すきまを除去
   (ページ直下に並ぶセクション同士を密着させ、下地の露出を防ぐ。
    セクション内部の段落間隔には影響しない)
   ============================================================ */
.entry-content > *,
.wp-block-post-content > * {
  margin-block-start: 0 !important;
  margin-block-end: 0 !important;
}

/* ============================================================
   3.96 サービス紹介の定義リスト(リストブロックに lp-deflist)
   各項目: <strong>項目名</strong> + Shift+Enter改行 + 説明文
   ============================================================ */
ul.lp-deflist {
  list-style: none;
  margin: 0 !important;
  max-width: none !important;
  padding: 0;
}
ul.lp-deflist li {
  position: relative;
  margin: 0 0 14px !important;
  padding: 0 0 0 22px;
  font-size: 14px;
  line-height: 1.9;
  color: var(--wp--preset--color--lp-text-weak);
}
/* 項目名(ブロック化済み)の直後のbrは二重改行になるため無効化 */
ul.lp-deflist li strong + br { display: none; }
ul.lp-deflist li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 14px;
  width: 8px;
  height: 8px;
  background: var(--wp--preset--color--lp-accent);
}
ul.lp-deflist li strong {
  display: block;
  margin-bottom: 2px;
  font-size: 15px;
  font-weight: 600;
  color: var(--wp--preset--color--lp-text);
}

/* ============================================================
   3.97 1日の流れタイムライン(番号付きリストに lp-timeline)
   各項目: <strong>9:30</strong> タイトル + Shift+Enter改行 + 説明文
   ============================================================ */
ol.lp-timeline {
  list-style: none;
  margin: 0 !important;
  max-width: none !important;
  padding: 0 0 0 8px;
  border-left: 1px solid var(--wp--preset--color--lp-border);
}
ol.lp-timeline li {
  position: relative;
  margin: 0 !important;
  padding: 0 0 36px 28px;
  font-size: 14px;
  line-height: 2;
  color: var(--wp--preset--color--lp-text-weak);
}
ol.lp-timeline li:last-child { padding-bottom: 4px; }
ol.lp-timeline li::before {
  content: "";
  position: absolute;
  left: -13px;
  top: 10px;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--wp--preset--color--lp-main);
  border: 2px solid var(--wp--preset--color--lp-bg);
}
ol.lp-timeline li strong + br { display: none; }
ol.lp-timeline li strong {
  display: block;
  font-size: 16px;
  font-weight: 600;
  color: var(--wp--preset--color--lp-text);
}
ol.lp-timeline li strong .lp-time,
ol.lp-timeline li strong:first-line { }
/* 時刻部分(強調内の先頭)はDM Mono・アクセント色に */
ol.lp-timeline li b,
ol.lp-timeline li strong em {
  font-family: var(--wp--preset--font-family--lp-mono);
  font-style: normal;
  font-size: 13px;
  color: var(--wp--preset--color--lp-accent);
  margin-right: 12px;
}

/* ============================================================
   3.98 料金カード(料金の全要素を束ねるグループに lp-price-card)
   ============================================================ */
.lp-price-card {
  background: #ffffff;
  border: 1px solid rgba(69, 106, 80, .12);
  border-radius: 12px;
  box-shadow: 0 16px 40px rgba(69, 106, 80, .06);
  padding: clamp(28px, 4vw, 56px);
}
/* カード内の表は「表 in 表」に見えないよう装飾を軽くする */
.lp-price-card .lp-overview {
  box-shadow: none;
  border: 1px solid rgba(69, 106, 80, .14);
  border-radius: 8px;
}
.lp-price-card h3 {
  margin-top: 8px;
  padding-bottom: 10px;
  border-bottom: 2px solid var(--wp--preset--color--lp-main);
  display: inline-block;
}
@media (max-width: 781px) {
  .lp-price-card { padding: 20px 16px; }
}

/* ============================================================
   3.99b FAQアコーディオン(Q&A群を包むグループに lp-faq、
   中身は標準の「詳細」ブロック)
   ============================================================ */
.lp-faq .wp-block-details {
  margin: 0 !important;
  max-width: none !important;
  border-top: 1px solid var(--wp--preset--color--lp-border);
}
.lp-faq .wp-block-details:last-child {
  border-bottom: 1px solid var(--wp--preset--color--lp-border);
}
.lp-faq summary {
  list-style: none;
  display: flex;
  align-items: flex-start;
  gap: 16px;
  position: relative;
  padding: 22px 44px 22px 0;
  cursor: pointer;
  font-size: 15px;
  font-weight: 600;
  color: var(--wp--preset--color--lp-text);
  line-height: 1.8;
}
.lp-faq summary::-webkit-details-marker { display: none; }
/* フォーカス枠は完全に非表示 */
.lp-faq summary:focus,
.lp-faq summary:focus-visible,
.lp-faq .wp-block-details:focus,
.lp-faq .wp-block-details:focus-visible {
  outline: none;
}
/* Qバッジ */
.lp-faq summary::before {
  content: "Q";
  flex-shrink: 0;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: var(--wp--preset--color--lp-main);
  color: #ffffff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--wp--preset--font-family--lp-mono);
  font-size: 12px;
  font-weight: 400;
  margin-top: 1px;
}
/* 開閉の山形矢印 */
.lp-faq summary::after {
  content: "";
  position: absolute;
  right: 12px;
  top: 30px;
  width: 8px;
  height: 8px;
  border-right: 1.5px solid var(--wp--preset--color--lp-main);
  border-bottom: 1.5px solid var(--wp--preset--color--lp-main);
  transform: rotate(45deg);
  transition: transform .25s;
}
.lp-faq .wp-block-details[open] summary::after {
  transform: rotate(-135deg);
  top: 34px;
}
/* 回答 */
.lp-faq .wp-block-details > p {
  margin: 0 0 22px !important;
  max-width: none !important;
  position: relative;
  background: #f3f7f1;
  border-radius: 6px;
  padding: 18px 22px 18px 60px;
  font-size: 14px;
  line-height: 2;
  color: var(--wp--preset--color--lp-text-weak);
}
.lp-faq .wp-block-details > p::before {
  content: "A";
  position: absolute;
  left: 18px;
  top: 16px;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  border: 1px solid var(--wp--preset--color--lp-main);
  color: var(--wp--preset--color--lp-main);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--wp--preset--font-family--lp-mono);
  font-size: 12px;
}
/* 回答が複数段落の場合、Aバッジは先頭のみ */
.lp-faq .wp-block-details > p ~ p::before { content: none; }
.lp-faq .wp-block-details > p ~ p { padding-left: 22px; }

/* ============================================================
   3.99c お問い合わせフォーム(フォームを包むグループに lp-form)
   プラグイン非依存:入力欄の見た目をサイトのデザインに合わせる
   ============================================================ */
.lp-form {
  background: #ffffff;
  border: 1px solid rgba(69, 106, 80, .12);
  border-radius: 12px;
  box-shadow: 0 16px 40px rgba(69, 106, 80, .06);
  padding: clamp(24px, 4vw, 56px);
}

/* 入力欄 */
.lp-form input[type="text"],
.lp-form input[type="email"],
.lp-form input[type="tel"],
.lp-form input[type="url"],
.lp-form input[type="number"],
.lp-form input[type="date"],
.lp-form select,
.lp-form textarea {
  width: 100%;
  box-sizing: border-box;
  padding: 14px 16px;
  font-size: 16px; /* 16px未満はスマホで自動ズームするため下げない */
  font-family: inherit;
  line-height: 1.7;
  color: var(--wp--preset--color--lp-text);
  background: #fbfcf8;
  border: 1px solid var(--wp--preset--color--lp-border);
  border-radius: 6px;
  transition: border-color .25s, background-color .25s;
}
.lp-form textarea { min-height: 180px; resize: vertical; }
.lp-form input:focus,
.lp-form select:focus,
.lp-form textarea:focus {
  outline: none;
  border-color: var(--wp--preset--color--lp-main);
  background: #ffffff;
}
.lp-form ::placeholder { color: #a8b3a9; }

/* 項目名 */
.lp-form label,
.lp-form .lp-form-label {
  display: block;
  margin-bottom: 8px;
  font-size: 14px;
  font-weight: 600;
  color: var(--wp--preset--color--lp-text);
}
/* 必須バッジ:<span class="lp-required">必須</span> */
.lp-required {
  display: inline-block;
  margin-left: 8px;
  padding: 2px 8px;
  border-radius: 3px;
  background: var(--wp--preset--color--lp-accent);
  color: #ffffff;
  font-size: 11px;
  font-weight: 500;
  vertical-align: 2px;
}
.lp-optional {
  display: inline-block;
  margin-left: 8px;
  padding: 2px 8px;
  border-radius: 3px;
  background: #eef2ec;
  color: var(--wp--preset--color--lp-text-weak);
  font-size: 11px;
  vertical-align: 2px;
}

/* 各項目の間隔 */
.lp-form .smf-item,
.lp-form .lp-form-row { margin-bottom: 28px; }

/* ラジオ・チェックボックス */
.lp-form input[type="radio"],
.lp-form input[type="checkbox"] {
  width: 18px;
  height: 18px;
  margin-right: 8px;
  accent-color: var(--wp--preset--color--lp-main);
  vertical-align: -3px;
}

/* 送信・確認ボタン */
.lp-form button[type="submit"],
.lp-form input[type="submit"],
.lp-form .smf-action button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 240px;
  padding: 1.05em 2.2em;
  background: var(--wp--preset--color--lp-main);
  color: #ffffff;
  border: none;
  border-radius: 999px;
  font-size: 15px;
  font-weight: 600;
  font-family: inherit;
  cursor: pointer;
  transition: transform .3s, opacity .3s;
}
.lp-form button[type="submit"]:hover,
.lp-form input[type="submit"]:hover,
.lp-form .smf-action button:hover { transform: translateY(-3px); }
/* 「戻る」など副次ボタンは控えめに */
.lp-form .smf-action button[data-action="back"],
.lp-form button.lp-btn-sub {
  background: transparent;
  color: var(--wp--preset--color--lp-text-weak);
  border: 1px solid var(--wp--preset--color--lp-border);
  min-width: 160px;
}

/* エラー表示 */
.lp-form .smf-error-messages,
.lp-form .lp-form-error {
  color: #b4442e;
  font-size: 13px;
  margin-top: 6px;
}

@media (max-width: 781px) {
  .lp-form { padding: 20px 16px; }
  .lp-form button[type="submit"],
  .lp-form input[type="submit"],
  .lp-form .smf-action button { width: 100%; min-width: 0; }
}

/* --- Snow Monkey Forms(実際の出力構造に合わせた指定) ---
   構造: .smf-item > .smf-item__col--label > .smf-item__label > .smf-item__label__text
                   > .smf-item__col--controls > .smf-item__controls > .smf-placeholder > 各control
   ------------------------------------------------------------------ */

/* フォームを包むプラグインのラッパーも同じ幅に広げる */
:has(> .smf-form) {
  max-width: 900px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* フォーム全体を白いカードに(.smf-form と .lp-form は同一要素) */
.smf-form {
  background: #ffffff !important;
  border: 1px solid rgba(69, 106, 80, .12) !important;
  border-radius: 12px !important;
  box-shadow: 0 16px 40px rgba(69, 106, 80, .06) !important;
  padding: clamp(24px, 4vw, 56px) !important;
  max-width: 900px !important;   /* 親のコンテンツ幅(720px)より広げる */
  width: 100%;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* 1項目=ラベル左・入力右の2列 */
.smf-item {
  display: grid !important;
  grid-template-columns: 220px 1fr;
  gap: 12px 28px;
  align-items: start;
  margin: 0 !important;
  padding: 18px 0 !important;
}
.smf-item:first-child { padding-top: 0 !important; }
.smf-item__col { min-width: 0; width: auto !important; }

/* ラベル */
.smf-item__label {
  margin: 0 !important;
  padding-top: 15px;
}
.smf-item__label__text {
  font-size: 15.5px;
  font-weight: 700;
  color: var(--wp--preset--color--lp-text);
  line-height: 1.7;
}
/* 必須バッジ(プラグインは data-validations で必須を表すため、CSSで付与) */
.smf-item:has([data-validations*="required"]) .smf-item__label__text::after {
  content: "必須";
  display: inline-block;
  margin-left: 10px;
  padding: 3px 10px;
  border-radius: 3px;
  background: var(--wp--preset--color--lp-accent);
  color: #ffffff;
  font-size: 12px;
  font-weight: 600;
  vertical-align: 2px;
}

/* 入力欄は必ず全幅(placeholderを縮ませない) */
.smf-item__controls,
.smf-placeholder,
.smf-text-control,
.smf-textarea-control,
.smf-select-control { width: 100%; }

.smf-text-control__control,
.smf-textarea-control__control,
.smf-select-control__control,
.smf-form input[type="text"],
.smf-form input[type="email"],
.smf-form input[type="tel"],
.smf-form textarea,
.smf-form select {
  width: 100% !important;
  box-sizing: border-box;
  padding: 15px 16px !important;
  font-size: 16px !important;
  font-family: inherit;
  line-height: 1.7;
  color: var(--wp--preset--color--lp-text);
  background: #f7f9f6 !important;
  border: 1px solid #dde5db !important;
  border-radius: 6px !important;
  transition: border-color .25s, background-color .25s;
}
.smf-textarea-control__control { min-height: 180px !important; resize: vertical; }
.smf-text-control__control:focus,
.smf-textarea-control__control:focus,
.smf-select-control__control:focus {
  outline: none;
  border-color: var(--wp--preset--color--lp-main) !important;
  background: #ffffff !important;
}

/* ラジオ・チェックボックスは選択肢を横並びのボタン状に */
.smf-radio-buttons-control__control,
.smf-checkboxes-control__control {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.smf-label { margin: 0 !important; }
.smf-label > label {
  display: inline-flex;
  align-items: center;
  padding: 12px 16px;
  border: 1px solid #dde5db;
  border-radius: 6px;
  background: #f7f9f6;
  cursor: pointer;
  transition: border-color .2s, background-color .2s;
}
.smf-label > label:hover {
  border-color: var(--wp--preset--color--lp-main);
  background: #ffffff;
}
.smf-radio-button-control,
.smf-checkbox-control {
  display: inline-flex;
  align-items: center;
}
.smf-radio-button-control__control,
.smf-checkbox-control__control {
  width: 19px !important;
  height: 19px !important;
  margin: 0 9px 0 0 !important;
  accent-color: var(--wp--preset--color--lp-main);
  flex-shrink: 0;
}
.smf-radio-button-control__label,
.smf-checkbox-control__label {
  font-size: 15px;
  line-height: 1.6;
  color: var(--wp--preset--color--lp-text);
}

/* 送信・確認ボタン */
.smf-action {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 16px;
  margin-top: 36px !important;
  padding-top: 32px;
  border-top: 1px solid rgba(69, 106, 80, .12);
}
.smf-action button,
.smf-button-control__control {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  min-width: 260px;
  padding: 1.05em 2.2em !important;
  background: var(--wp--preset--color--lp-main) !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 999px !important;
  font-size: 15px !important;
  font-weight: 600;
  font-family: inherit;
  cursor: pointer;
  transition: transform .3s;
}
.smf-action button:hover,
.smf-button-control__control:hover { transform: translateY(-3px); }
.smf-action button[data-action="back"] {
  background: transparent !important;
  color: var(--wp--preset--color--lp-text-weak) !important;
  border: 1px solid var(--wp--preset--color--lp-border) !important;
  min-width: 160px;
}
/* ボタンを包む span(幅指定を通すため) */
.smf-button-control { display: inline-flex; }
/* 送信中インジケータ */
.smf-sending:not(:empty) { margin-left: 10px; }

/* エラー・完了 */
.smf-error-messages { color: #b4442e; font-size: 13px; margin-top: 6px; }
.smf-complete-content { text-align: center; font-size: 16px; line-height: 2.1; padding: 24px 0; }

@media (max-width: 781px) {
  .smf-form { padding: 20px 16px !important; }
  .smf-item {
    grid-template-columns: 1fr;
    gap: 10px;
    padding: 16px 0 !important;
  }
  .smf-item__label { padding-top: 0; }
  .smf-action { flex-direction: column; align-items: stretch; }
  .smf-button-control { display: block; width: 100%; }
  .smf-action button,
  .smf-button-control__control { width: 100%; min-width: 0; }
  .smf-label > label { padding: 11px 14px; }
  .smf-radio-button-control__label,
  .smf-checkbox-control__label { font-size: 14.5px; }
}

/* --- お急ぎの方向け電話バナー(グループに lp-tel-banner) --- */
.lp-tel-banner {
  background: #ffffff;
  border: 1px solid var(--wp--preset--color--lp-accent);
  border-radius: 12px;
  padding: clamp(24px, 3vw, 36px);
  text-align: center;
  max-width: 900px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
.lp-tel-banner .lp-tel-lg {
  margin: 10px 0 4px !important;
  font-family: var(--wp--preset--font-family--lp-mono);
  font-size: clamp(26px, 3vw, 34px);
  font-weight: 500;
  letter-spacing: .03em;
}
.lp-tel-banner .lp-tel-lg a {
  color: var(--wp--preset--color--lp-accent);
  text-decoration: none;
}

/* 電話・フォームの2択カード(グループに lp-contact-card) */
.lp-contact-card {
  background: #ffffff;
  border: 1px solid rgba(69, 106, 80, .12);
  border-radius: 12px;
  box-shadow: 0 12px 32px rgba(69, 106, 80, .05);
  padding: clamp(28px, 3.5vw, 44px);
  height: 100%;
  text-align: center;
}
.lp-contact-card .lp-tel-lg {
  margin: 12px 0 4px !important;
  font-family: var(--wp--preset--font-family--lp-mono);
  font-size: clamp(26px, 3vw, 34px);
  font-weight: 500;
  letter-spacing: .03em;
}
.lp-contact-card .lp-tel-lg a {
  color: var(--wp--preset--color--lp-main);
  text-decoration: none;
}

/* ============================================================
   4. 案件固有の調整(このLP専用の微調整はこの下に追記)
   ============================================================ */