@charset "utf-8";

/* ============================================================
   下層ページ共通テンプレート
   ・トップページ（2026top）のデザイントークンを踏襲
   ・色 / フォント / 角丸 / blur-inアニメを共通化
   ============================================================ */

/* reset（最小限） */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
h1, h2, h3, h4, h5, h6 { font-size: inherit; font-weight: inherit; }
img { max-width: 100%; height: auto; vertical-align: middle; }
ol, ul { list-style: none; }
a { text-decoration: none; color: inherit; }
table { border-collapse: collapse; border-spacing: 0; }

/* ------------------------------------------------------------
   design tokens（トップと共通）
------------------------------------------------------------ */
:root {
  --green: #43b47c;
  --green_dark: #2f7d3e;
  --green_accent: #2c7a2e;
  --green_pale: #dff3e8;
  --mint: #e9f8f0;
  --mint_deep: #b5e2cb;
  --cream: #f5efe4;
  --ink: #101010;
  --bg: #e4f3e8;
  --font_jp: "Zen Kaku Gothic New", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "游ゴシック", "YuGothic", "Noto Sans JP", "Meiryo", sans-serif;
  --font_a: "Zen Old Mincho", "Hiragino Mincho ProN", "游明朝", "Yu Mincho", "HGS明朝E", "Meiryo", serif;
  --font_g: "Gilda Display", serif;
  --font_j: "Jost", var(--font_jp);
}

.font_a { font-family: var(--font_j); }
.font_j { font-family: var(--font_j); }
.font_j { font-family: var(--font_j); }

/* ------------------------------------------------------------
   base（フォントサイズはトップ同様に可変 → 1500px相当で固定）
------------------------------------------------------------ */
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }

/* 慣性スクロール（Lenis）用。Lenisが有効な間はCSSスムースを切ってLenisに委ねる */
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-smooth [data-lenis-prevent] { overscroll-behavior: contain; }
.lenis.lenis-stopped { overflow: hidden; }
body {
  font-family: var(--font_jp);
  font-size: 20px;
  line-height: 1.9;
  color: var(--ink);
  background: var(--bg);
  overflow-x: hidden;
}

/* 1300px以下は幅に追従（トップの挙動に合わせる） */
@media screen and (max-width: 1300px) {
  body { font-size: 1.53846154dvw; }
}
/* 768px以下はSP */
@media screen and (max-width: 768px) {
  body { font-size: 2.60416667vw; line-height: 1.9; }
}

/* 表示切替ユーティリティ */
.md_show, .md_showin { display: none; }
@media screen and (max-width: 768px) {
  .md_hide { display: none; }
  .md_show { display: block; }
  .md_showin { display: inline; }
}

/* blur-in（トップの .inview.ivo と同じ演出） */
.inview { transition: opacity 1s ease, filter 1s ease, transform 1s ease; }
.ivo { opacity: 0; filter: blur(12px); transform: translateY(1em); }
.ivo.in-view { opacity: 1; filter: blur(0); transform: none; }

/* ============================================================
   header（トップFVのヘッダーデザイン）
============================================================ */
:root { --lh_green: #4cba85; }

/* 濃い緑の帯（ヘッダー）。この上に薄い緑の本文がかぶさる
   ※z-indexは付けない（付けるとヘッダー内のSPドロワーが本文の下に隠れる）。
     本文の重なりはDOM順＋#lower_mainのz-indexで担保 */
#lower_header {
  position: relative;
}

.lh_band {
  position: relative;
  background: var(--lh_green);
  border-radius: 0; /* 下辺まっすぐ。境目は本文側の角丸でつくる */
  padding: 1.6em 2em 5.4em; /* ナビ下に緑の余白を確保 */
  min-height: 15.5em;
  overflow: hidden;
}

/* 両サイドのイラスト（帯からはみ出て見切れる想定） */
.lh_woman, .lh_man {
  position: absolute;
  width: auto;
  z-index: 1;
  pointer-events: none;
}
/* 女性：頭〜太ももの縦長素材。上端基準で頭を上に、腰下を帯下端でクリップ */
.lh_woman { left: -0.5em; top: 0.8em; height: 27em; }
/* 男性：頭〜組んだ手の素材。手が境目（薄い緑の上端）より上に来るよう調整 */
.lh_man   { right: 0; bottom: 3em; height: 15.5em; }

/* 右上：連絡先 */
.lh_contact {
  position: absolute;
  top: 1.2em;
  right: 6.5em;
  z-index: 3;
  text-align: right;
}
.lh_pill {
  display: inline-flex;
  align-items: center;
  gap: 1.1em;
  background: #fff;
  border-radius: 2.4em;
  padding: 0.7em 1.6em;
  box-shadow: 0 0.4em 1em rgba(0, 0, 0, 0.08);
}
.lh_pill a {
  display: inline-flex;
  align-items: center;
  gap: 0.5em;
  color: var(--ink);
  font-weight: 700;
  letter-spacing: .04em;
  transition: color .3s ease;
}
.lh_pill a:hover { color: var(--lh_green); }
.lh_tel { font-family: var(--font_j); font-size: 1.15em; }
.lh_tel svg, .lh_mail svg { color: var(--lh_green); flex: none; }
.lh_mail { font-size: 0.95em; }
.lh_pill_div { width: 1px; height: 1.6em; background: #dcdcdc; }
.lh_hours {
  margin-top: 0.8em;
  font-size: 0.8em;
  letter-spacing: .04em;
  color: #fff;
}

/* 中央：ロゴ＋ナビ */
.lh_inner {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  gap: 3em;
  width: min(60em, 100%);
  margin: 0 auto;
  padding-left: 6.5em;
  padding-top: 5.8em;
}

/* 白いアーチ台座＋ロゴ
   形状：上部は直角（帯上端に密着）・両サイド直線・下部は半円のU字 */
.lh_logo {
  flex: none;
  align-self: flex-start; /* 上端基準：margin-topが素直に効く */
  display: grid;
  place-items: start center;
  padding-top: 2em;     /* ロゴ上側にも余白 */
  width: 12.5em;
  height: 11.4em;       /* 上端は帯上端に密着、ロゴ下に余白を確保 */
  margin-top: -7.4em;   /* 上端を帯上端(y0)に引っ付ける */
  margin-bottom: -2em;
  background: #fff;
  border: 1px solid #000; /* 0.5ptくらいの黒枠 */
  border-top: 0;          /* 画面上端と接する上辺は黒線を出さない */
  /* U字は正円の半円（つぶさない） */
  border-radius: 0 0 6.25em 6.25em / 0 0 6.25em 6.25em;
  line-height: 0;
}
.lh_logo img { width: 8.4em; height: auto; }

/* グローバルナビ（2列） */
.lh_nav { flex: 1; line-height: 1.3; }
.lh_nav ul {
  display: grid;
  grid-template-columns: max-content max-content;
  grid-auto-flow: column;
  grid-template-rows: repeat(3, auto);
  column-gap: 2em;
  row-gap: 0.6em;
  width: max-content;
}
.lh_nav a {
  display: inline-block;
  color: #fff;
  font-size: 1.05em;
  font-weight: 500;
  line-height: 1.3;
  letter-spacing: .06em;
  padding-bottom: 0.15em;
  background-image: linear-gradient(#fff, #fff);
  background-repeat: no-repeat;
  background-position: left bottom;
  background-size: 0 1px;
  transition: background-size .3s ease;
}
.lh_nav a:hover { background-size: 100% 1px; }

/* SPバー / ドロワー（PCでは非表示） */
.lh_sp_bar { display: none; }
.lower_hamburger { display: none; }
.lower_gnav { display: none; }

/* ============================================================
   page hero
============================================================ */
/* 薄い緑の本文エリア：上角を丸めた角丸長方形として濃い緑ヘッダーにかぶさる
   ※Rは重なり量と揃える（Rが重なりより大きいと角が本文背景に埋もれる） */
#lower_main {
  position: relative;
  z-index: 5;
  background: var(--bg);
  border-radius: 2.6em 2.6em 0 0;
  margin-top: -2.6em;
  overflow: hidden; /* 子要素の背景を角丸でクリップし、両端のRを見せる */
}

/* 左端の縦書きコピー */
.side_catch {
  position: absolute;
  top: 2.6em;
  left: 1.2em;
  z-index: 5;
  line-height: 0;
}
.side_catch img { width: 1em; height: auto; }

.page_hero {
  padding: 4.6em 2em 2.4em;
  text-align: center;
  background:
    radial-gradient(120% 90% at 50% -20%, var(--mint) 0%, rgba(233, 248, 240, 0) 60%),
    var(--bg);
}
.page_hero_inner {
  width: min(52em, 100%);
  margin: 0 auto;
}
.page_hero_en {
  font-size: 1.05em;
  letter-spacing: .28em;
  color: var(--green_accent);
  margin-bottom: 0.6em;
}
.page_hero_title {
  font-size: 2.4em;
  font-weight: 700;
  line-height: 1.55;
  letter-spacing: .06em;
  margin-bottom: 0.7em;
}
.page_hero_lead {
  font-size: 1em;
  line-height: 2;
  color: #333;
}

/* パンくず */
.breadcrumb {
  width: min(60em, 100%);
  margin: 2.6em auto 0;
  padding: 0 2em;
}
.breadcrumb ul {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4em 0.9em;
  font-size: 0.78em;
  color: #6a7d6c;
}
.breadcrumb li { position: relative; }
.breadcrumb li:not(:last-child)::after {
  content: "›";
  margin-left: 0.9em;
  color: #9db3a0;
}
.breadcrumb a { color: var(--green_accent); }
.breadcrumb a:hover { text-decoration: underline; }

/* ============================================================
   article
============================================================ */
.article_wrap { padding: 2.4em 2em 5em; }
.article_body {
  width: min(56em, 100%);
  margin: 0 auto;
  background: #fff;
  border-radius: 2em;
  padding: 4em 4.4em;
  box-shadow: 0 1.4em 3em rgba(44, 122, 46, 0.06);
  overflow-wrap: break-word;   /* 長い英単語・URLで文字がはみ出さない */
  word-break: break-word;
}
@media screen and (max-width: 768px) {
  /* スマホは本文を約1.5倍に（見出しとの比率を保つためコンテナごと拡大） */
  .article_body { font-size: 1.5em; padding: 1.8em 1.3em; border-radius: 1em; }
}

/* 目次 */
.toc {
  background: var(--cream);
  border-radius: 1.2em;
  padding: 1.8em 2.2em;
  margin-bottom: 3em;
}
.toc_title {
  font-size: 1.2em;
  font-weight: 700;
  letter-spacing: .08em;
  margin-bottom: 0.9em;
  display: flex;
  align-items: baseline;
  gap: 0.7em;
}
.toc_title .font_j {
  font-size: 0.7em;
  letter-spacing: .2em;
  color: var(--green_accent);
}
.toc ol { counter-reset: toc; }
.toc li { counter-increment: toc; }
.toc li + li { margin-top: 0.6em; }
.toc a {
  display: flex;
  gap: 0.7em;
  font-size: 0.95em;
  line-height: 1.6;
  color: #333;
  transition: color .3s ease;
}
.toc a::before {
  content: counter(toc, decimal-leading-zero);
  font-family: var(--font_j);
  color: var(--green_accent);
  flex: none;
}
.toc a:hover { color: var(--green_accent); }

/* リード */
.wp_lead {
  font-size: 1.05em;
  line-height: 2.1;
  margin-bottom: 2.6em;
}
.wp_lead strong { color: var(--green_accent); font-weight: 700; }

/* 本文段落 */
.article_body p { line-height: 2; margin-bottom: 1.6em; }
.article_body p:last-child { margin-bottom: 0; }

/* エディタ由来で <pre> になっている段落対策。
   pre は既定で white-space:pre（折り返さない）ため長い行が画面外へはみ出す。
   改行は保持しつつ必ず折り返し、フォントも本文と同じにする */
.article_body pre {
  white-space: pre-wrap !important;
  overflow-wrap: break-word;
  word-break: break-word;
  font-family: inherit;
  font-size: inherit;
  line-height: 2;
  margin: 0 0 1.6em;
  padding: 0;
  background: none;
  border: 0;
}

/* h2（大見出し） */
.wp_h2 {
  font-family: var(--font_jp);
  font-size: 1.55em;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: .04em;
  margin: 2.4em 0 1em;
  padding-bottom: 0.5em;
  border-bottom: 2px solid var(--mint_deep);
  display: flex;
  align-items: baseline;
  gap: 0.6em;
}
.wp_h2:first-child { margin-top: 0; }
.wp_h2 .font_j {
  font-size: 0.9em;
  color: var(--green_accent);
  letter-spacing: .1em;
}

/* h3（中見出し） */
.wp_h3 {
  font-size: 1.25em;
  font-weight: 700;
  line-height: 1.6;
  margin: 2em 0 0.9em;
  padding-left: 0.9em;
  border-left: 4px solid var(--green);
}

/* 箇条書き */
.wp_list, .wp_olist { margin: 0 0 1.8em; padding-left: 0.2em; }
.wp_list li, .wp_olist li {
  position: relative;
  padding-left: 1.8em;
  line-height: 1.9;
  margin-bottom: 0.7em;
}
.wp_list li::before {
  content: "";
  position: absolute;
  left: 0.2em;
  top: 0.7em;
  width: 0.55em;
  height: 0.55em;
  border-radius: 50%;
  background: var(--green);
}
.wp_olist { counter-reset: olist; }
.wp_olist li { counter-increment: olist; }
.wp_olist li::before {
  content: counter(olist);
  position: absolute;
  left: 0;
  top: 0.15em;
  width: 1.4em;
  height: 1.4em;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--green_accent);
  color: #fff;
  font-family: var(--font_j);
  font-size: 0.75em;
  line-height: 1;
}
.wp_olist li { padding-left: 2.2em; }

/* 図版 */
.wp_figure { margin: 2.2em 0; }
.wp_figure_ph {
  display: grid;
  place-items: center;
  aspect-ratio: 16 / 9;
  border-radius: 1em;
  background:
    repeating-linear-gradient(-45deg, var(--mint) 0 1.4em, #e2f2ea 1.4em 2.8em);
  color: #7fa78c;
  font-size: 0.95em;
  letter-spacing: .1em;
}
.wp_figure figcaption {
  margin-top: 0.8em;
  font-size: 0.82em;
  color: #6a7d6c;
  text-align: center;
}

/* ポイントボックス */
.wp_point {
  background: var(--mint);
  border: 1px solid var(--mint_deep);
  border-radius: 1.2em;
  padding: 1.8em 2.2em 1.6em;
  margin: 2.2em 0;
}
.wp_point_label {
  display: inline-block;
  font-family: var(--font_j);
  font-size: 0.8em;
  letter-spacing: .2em;
  color: #fff;
  background: var(--green_accent);
  border-radius: 2em;
  padding: 0.25em 1.2em;
  margin-bottom: 0.9em !important;
}
.wp_point p:last-child { margin-bottom: 0; }

/* 表 */
.wp_table_wrap { overflow-x: auto; margin: 2em 0; }
.wp_table {
  width: 100%;
  font-size: 0.95em;
  border: 1px solid var(--mint_deep);
  border-radius: 0.8em;
  overflow: hidden;
}
.wp_table th, .wp_table td {
  padding: 1em 1.2em;
  text-align: left;
  line-height: 1.7;
  border-bottom: 1px solid var(--mint_deep);
}
.wp_table thead th {
  background: var(--green_accent);
  color: #fff;
  font-weight: 500;
  letter-spacing: .05em;
}
.wp_table tbody th, .wp_table tbody td { border-right: 1px solid #eef4ef; }
.wp_table tbody tr:nth-child(even) { background: #f6fbf7; }
.wp_table tbody tr:last-child td { border-bottom: 0; }

/* 引用 */
.wp_quote {
  margin: 2em 0;
  padding: 1.4em 1.8em;
  background: #f7f9f6;
  border-left: 4px solid var(--mint_deep);
  border-radius: 0 0.8em 0.8em 0;
  color: #444;
}
.wp_quote p { margin-bottom: 0; font-style: italic; }

/* ============================================================
   WordPress本文（the_content）用：素の要素にもスタイルを当てる
   ・エディタが出力する <h2><h3><p><ul><ol><table> 等を、モックの
     wp_* クラスと同等の見た目にする
============================================================ */
.article_body h2 {
  font-family: var(--font_jp);
  font-size: 1.55em;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: .04em;
  margin: 2.2em 0 1em;
  padding-bottom: 0.5em;
  border-bottom: 2px solid var(--mint_deep);
}
.article_body h2:first-child { margin-top: 0; }
.article_body h3 {
  font-size: 1.25em;
  font-weight: 700;
  line-height: 1.6;
  margin: 2em 0 0.9em;
  padding-left: 0.9em;
  border-left: 4px solid var(--green);
}
.article_body h4 {
  font-size: 1.1em;
  font-weight: 700;
  line-height: 1.6;
  margin: 1.8em 0 0.7em;
  color: var(--green_accent);
}
/* 段落は既存の .article_body p を継承（line-height:2 等） */
.article_body a {
  color: var(--green_accent);
  text-decoration: underline;
  text-underline-offset: 0.15em;
}
.article_body a:hover { text-decoration: none; }
.article_body strong { font-weight: 700; }
.article_body img { max-width: 100%; height: auto; border-radius: 0.8em; }
.article_body figure { margin: 2em 0; }
.article_body figure img { width: 100%; }
.article_body figcaption { margin-top: 0.7em; font-size: 0.82em; color: #6a7d6c; text-align: center; }

/* 箇条書き（素の ul / ol） */
.article_body ul,
.article_body ol { margin: 0 0 1.8em; padding-left: 0.2em; }
.article_body ul > li,
.article_body ol > li { position: relative; padding-left: 1.8em; line-height: 1.9; margin-bottom: 0.7em; }
.article_body ul > li::before {
  content: "";
  position: absolute;
  left: 0.2em;
  top: 0.7em;
  width: 0.55em;
  height: 0.55em;
  border-radius: 50%;
  background: var(--green);
}
.article_body ol { counter-reset: wpol; }
.article_body ol > li { counter-increment: wpol; padding-left: 2.2em; }
.article_body ol > li::before {
  content: counter(wpol);
  position: absolute;
  left: 0;
  top: 0.15em;
  width: 1.4em;
  height: 1.4em;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--green_accent);
  color: #fff;
  font-family: var(--font_j);
  font-size: 0.75em;
  line-height: 1;
}

/* 引用（素の blockquote） */
.article_body blockquote {
  margin: 2em 0;
  padding: 1.4em 1.8em;
  background: #f7f9f6;
  border-left: 4px solid var(--mint_deep);
  border-radius: 0 0.8em 0.8em 0;
  color: #444;
}
.article_body blockquote p { margin-bottom: 0; }

/* 表（素の table） */
.article_body table {
  width: 100%;
  margin: 2em 0;
  font-size: 0.95em;
  border: 1px solid var(--mint_deep);
  border-radius: 0.8em;
  overflow: hidden;
}
.article_body table th,
.article_body table td {
  padding: 1em 1.2em;
  text-align: left;
  line-height: 1.7;
  border-bottom: 1px solid var(--mint_deep);
}
.article_body table thead th {
  background: var(--green_accent);
  color: #fff;
  font-weight: 500;
}
.article_body table tbody tr:nth-child(even) { background: #f6fbf7; }
.article_body table tbody tr:last-child td { border-bottom: 0; }

/* ============================================================
   お問い合わせフォーム（MW WP Form / .mmm-contactform）
   ・旧 style.css のフォームCSSを新デザインのトンマナで作り直し
   ・.mw_wp_form の素の要素にも当て、クラス構成が違っても崩れないように
============================================================ */
.mw_wp_form { width: 100%; max-width: 44em; margin: 1em auto 0; }
.mw_wp_form p { margin: 0 0 1em; }

/* 1項目（ラベル上・入力欄フル幅の縦積み。長いラベルにも強く、崩れにくい） */
.mmm-contactform-field {
  padding: 1.5em 0;
  border-bottom: 1px solid var(--mint_deep);
}
.mmm-contactform-field:first-child { border-top: 1px solid var(--mint_deep); }

/* wpautop が挿入する余計な <p> を除去（これが入力欄を細くしていた元凶）。
   ご希望日時の注意書きだけは表示する */
.mmm-contactform p { display: none; }
.mmm-contactform .your-date-caption p { display: block; }

.mmm-contactform-label {
  display: flex;
  align-items: center;
  gap: 0.7em;
  margin-bottom: 0.7em;
  line-height: 1.5;
}
.mmm-contactform-title { font-weight: 700; color: var(--ink); }
.mmm-contactform-require {
  flex: none;
  font-size: 0.7em;
  font-weight: 700;
  letter-spacing: 0.04em;
  color: #fff;
  background: var(--green_accent);
  border-radius: 2em;
  padding: 0.35em 0.9em;
  line-height: 1;
}
.mmm-contactform-input { min-width: 0; }

/* 入力欄 */
.mw_wp_form input[type="text"],
.mw_wp_form input[type="tel"],
.mw_wp_form input[type="email"],
.mw_wp_form input[type="number"],
.mw_wp_form textarea,
.mmm-contactform input[type="text"],
.mmm-contactform input[type="tel"],
.mmm-contactform input[type="email"],
.mmm-contactform textarea {
  width: 100%;
  font-family: inherit;
  font-size: 1em;
  line-height: 1.7;
  color: var(--ink);
  background: #fff;
  border: 1px solid var(--mint_deep);
  border-radius: 0.6em;
  padding: 0.7em 0.9em;
  -webkit-appearance: none;
  appearance: none;
  transition: border-color .25s ease, box-shadow .25s ease;
}
.mw_wp_form textarea { min-height: 9em; resize: vertical; }
.mw_wp_form input:focus,
.mw_wp_form textarea:focus,
.mw_wp_form select:focus {
  outline: none;
  border-color: var(--lh_green);
  box-shadow: 0 0 0 3px rgba(76, 186, 133, 0.18);
}
.mw_wp_form ::placeholder { color: #a7b6ab; }

/* セレクト（矢印を緑のシェブロンに） */
.mw_wp_form select,
.mmm-contactform select {
  font-family: inherit;
  font-size: 1em;
  color: var(--ink);
  background-color: #fff;
  border: 1px solid var(--mint_deep);
  border-radius: 0.6em;
  padding: 0.55em 2em 0.55em 0.8em;
  -webkit-appearance: none;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 9l6 6 6-6' fill='none' stroke='%232c7a2e' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.55em center;
  background-size: 1.1em;
  cursor: pointer;
}

/* ご希望日時（第1〜） */
.mmm-contactform .your-dates { display: grid; gap: 0.9em; }
.mmm-contactform .your-date {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35em;
  line-height: 1.6;
}
.mmm-contactform .your-date select { min-width: 4em; }
.mmm-contactform .your-date select[name^="your-time"] { min-width: 6.5em; }
.mmm-contactform .your-date-caption { font-size: 0.9em; color: #6a7d6c; margin-bottom: 0.3em; }
.mmm-contactform .your-date-caption p { margin: 0 0 0.4em; }
.mw_wp_form_confirm .mmm-contactform .your-date-caption { display: none; }

/* エラー */
.mw_wp_form .error {
  display: block;
  margin-top: 0.4em;
  font-size: 0.85em;
  font-weight: 700;
  color: #d64541;
}

/* ボタン（確認 / 送信 / 戻る） */
.mmm-contactform-btns {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 1em;
  margin-top: 2.6em;
}
.mw_wp_form input[type="submit"],
.mw_wp_form button[type="submit"],
.mw_wp_form button[type="button"],
.mmm-contactform .confirm,
.mmm-contactform .submit,
.mmm-contactform .back {
  font-family: inherit;
  font-size: 1em;
  font-weight: 700;
  letter-spacing: 0.04em;
  min-width: 12em;
  padding: 0.95em 2.4em;
  color: #fff;
  background: var(--green_accent);
  border: 1px solid var(--green_accent);
  border-radius: 2.5em;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
  transition: background .25s ease, color .25s ease, transform .2s ease, box-shadow .25s ease;
}
.mw_wp_form input[type="submit"]:hover,
.mw_wp_form button[type="submit"]:hover,
.mmm-contactform .confirm:hover,
.mmm-contactform .submit:hover {
  transform: translateY(-2px);
  box-shadow: 0 0.5em 1.2em rgba(44, 122, 46, 0.2);
}
/* 「戻る」は白抜き */
.mmm-contactform .back {
  color: var(--green_accent);
  background: #fff;
  border-color: var(--lh_green);
}
.mmm-contactform .back:hover { background: var(--mint); }

/* 確認画面：入力値をテキスト表示 */
.mw_wp_form_confirm .mmm-contactform-input { padding-top: 0.55em; line-height: 1.7; }

/* SP */
@media screen and (max-width: 768px) {
  .mmm-contactform-field { padding: 1.3em 0; }
  .mmm-contactform-btns { flex-direction: column-reverse; align-items: center; gap: 0.8em; }
  .mmm-contactform-btns > * { width: 100%; max-width: 22em; }
}

/* ============================================================
   CTA
============================================================ */
.lower_cta {
  background:
    radial-gradient(90% 120% at 50% 0%, var(--green_pale) 0%, rgba(223, 243, 232, 0) 70%),
    var(--mint_deep);
  border-radius: 0 15em 0 0;
  padding: 5em 2em;
  text-align: center;
}
@media screen and (max-width: 768px) {
  .lower_cta { border-radius: 0 5em 0 0; }
}
.lower_cta_inner { width: min(46em, 100%); margin: 0 auto; }
.lower_cta_en {
  font-size: 1em;
  letter-spacing: .3em;
  color: var(--green_accent);
  margin-bottom: 0.6em;
}
.lower_cta_title {
  font-size: 1.9em;
  font-weight: 700;
  line-height: 1.6;
  letter-spacing: .05em;
  margin-bottom: 0.7em;
}
.lower_cta_lead { font-size: 1em; color: #2e4632; margin-bottom: 2em; }

.lower_cta_box {
  display: flex;
  align-items: stretch;
  justify-content: center;
  gap: 1.4em;
  flex-wrap: wrap;
}
.lower_cta_tel {
  background: #fff;
  border-radius: 1.2em;
  padding: 1.1em 2em;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.lower_cta_tel .font_j {
  font-size: 0.8em;
  letter-spacing: .25em;
  color: var(--green_accent);
}
.lower_cta_tel strong {
  font-family: var(--font_j);
  font-size: 1.9em;
  line-height: 1.2;
  letter-spacing: .04em;
}
.lower_cta_tel small { font-size: 0.72em; color: #6a7d6c; }

.lower_cta_btn {
  display: inline-flex;
  align-items: center;
  gap: 0.7em;
  background: var(--green_accent);
  color: #fff;
  border-radius: 1.2em / 50%;
  padding: 0 2.4em;
  min-height: 3.4em;
  font-size: 1em;
  font-weight: 500;
  letter-spacing: .05em;
  transition: transform .3s ease, background .3s ease;
}
.lower_cta_btn .font_j { font-size: 0.78em; letter-spacing: .2em; opacity: 0.85; }
.lower_cta_btn:hover { background: var(--green_dark); transform: translateY(-2px); }

/* ============================================================
   related（トップの article_card を流用）
============================================================ */
.lower_related { padding: 5em 2em; text-align: center; }
.lower_related_inner { width: min(75em, 100%); margin: 0 auto; }
.lower_related_en {
  font-size: 1em;
  letter-spacing: .3em;
  color: var(--green_accent);
  margin-bottom: 0.4em;
}
.lower_related_title {
  font-size: 1.8em;
  font-weight: 700;
  letter-spacing: .06em;
  margin-bottom: 2em;
}

.article_cards {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 2em;
  max-width: 1500px;
  margin: 0 auto;
  text-align: left;
}
@media screen and (max-width: 768px) {
  .article_cards { grid-template-columns: 1fr; }
}
.article_cards > article {
  background: #fff;
  border-radius: 2em;
  padding: 2em;
  display: grid;
  grid-template-rows: auto 1fr auto;
  transition: transform .3s ease, box-shadow .3s ease;
}
.article_cards > article:hover {
  transform: translateY(-4px);
  box-shadow: 0 1.2em 2.4em rgba(44, 122, 46, 0.1);
}
.article_cards h3 {
  font-size: 1.2em;
  line-height: 1.5;
  font-weight: 600;
  margin-bottom: 1em;
  color: var(--green_accent);
}
.article_cards > article > a > p {
  font-size: 1em;
  line-height: 1.8;
  padding-bottom: 2em;
}
.article_cards > article > a > div {
  display: grid;
  grid-template-columns: 1fr 8em;
  align-items: end;
}
.article_cards > article > a > div > span {
  color: var(--green_accent);
  font-size: 0.8em;
}
.article_cards > article > a > div > strong {
  display: block;
  background: var(--green_accent);
  border-radius: 1.2em / 50%;
  color: #fff;
  text-align: center;
  padding: 0.4em;
  font-size: 0.9em;
}

/* ページトップ */
.pagetop {
  position: fixed;
  right: 1.4em;
  bottom: 1.4em;
  z-index: 40;
  width: 3em;
  height: 3em;
  display: grid;
  place-items: center;
  background: #fff;
  border: 1px solid var(--mint_deep);
  border-radius: 50%;
  box-shadow: 0 0.4em 1em rgba(44, 122, 46, 0.14);
  transition: transform .3s ease;
}
.pagetop:hover { transform: translateY(-3px); }
.pagetop span {
  width: 0.7em;
  height: 0.7em;
  border-top: 2px solid var(--green_accent);
  border-right: 2px solid var(--green_accent);
  transform: rotate(-45deg);
  margin-top: 0.25em;
}

/* ============================================================
   footer
============================================================ */
#lower_footer {
  background: var(--ink);
  color: #fff;
  padding: 4em 2em 2.4em;
  text-align: center;
}
.lower_footer_inner { width: min(60em, 100%); margin: 0 auto; }
.lower_footer_catch {
  font-size: 1.6em;
  font-weight: 700;
  line-height: 1.7;
  letter-spacing: .06em;
  margin-bottom: 1.4em;
}
.lower_footer_logo img {
  width: 16em;
  margin: 0 auto 1.8em;
  filter: brightness(0) invert(1);
}
.lower_footer_links {
  display: flex;
  justify-content: center;
  gap: 2em;
  flex-wrap: wrap;
  margin-bottom: 1.4em;
  font-size: 0.9em;
}
.lower_footer_links a { color: #cfe6d6; transition: color .3s ease; }
.lower_footer_links a:hover { color: #fff; }
.lower_footer_copy {
  font-size: 0.7em;
  letter-spacing: .08em;
  color: #8fa896;
}

/* ============================================================
   SP：ドロワーナビ
============================================================ */
@media screen and (max-width: 768px) {
  /* 大きな帯ヘッダーは隠し、コンパクトなバーに切替 */
  .lh_band { display: none; }
  .side_catch { display: none; }
  .lh_sp_bar {
    position: sticky;
    top: 0;
    z-index: 50;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1em 1.6em;
    background: rgba(255, 255, 255, 0.96);
    border-bottom: 1px solid rgba(44, 122, 46, 0.12);
  }
  .lh_sp_logo { line-height: 0; }
  .lh_sp_logo img { height: 6em; width: auto; }

  .lower_hamburger {
    display: flex;
    position: relative;
    z-index: 55;
    flex-direction: column;
    justify-content: center;
    gap: 0.5em;
    width: 3em;
    height: 3em;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
  }
  .lower_hamburger span {
    display: block;
    width: 2em;
    height: 2px;
    background: var(--green_accent);
    transition: transform .3s ease, opacity .3s ease;
  }
  body.nav_open .lower_hamburger span:nth-child(1) { transform: translateY(0.7em) rotate(45deg); }
  body.nav_open .lower_hamburger span:nth-child(2) { opacity: 0; }
  body.nav_open .lower_hamburger span:nth-child(3) { transform: translateY(-0.7em) rotate(-45deg); }

  /* ドロワー：背景なし（アーチ白パネルのみ）。
     flex だと背の高いパネルで下端までスクロールできないため、
     通常のブロックのスクロール領域にしてパネルは margin:auto で中央寄せ */
  .lower_gnav {
    display: block;            /* 基底の display:none を打ち消す */
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    /* iOSのアドレスバー対策：inset:0 だと“大きい方”の高さになり中身が収まって
       しまい（スクロール不能）、最後の項目がツールバー裏に隠れる。
       表示領域に一致する dvh を使うことで、はみ出した分がスクロールできる */
    height: 100vh;
    height: 100dvh;
    z-index: 45;
    padding: 4em 5vw 6em;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain; /* メニュー内スクロールが背景に連鎖しない */
    background: transparent;
    opacity: 0;
    pointer-events: none;
    transition: opacity .35s ease;
  }
  /* 背景ロックはJS(position:fixed)側で行う。overflow:hidden はiOSで
     メニュー内スクロールまで止めるため使わない */
  body.nav_open .lower_gnav { opacity: 1; pointer-events: auto; }

  /* アーチ型の白パネル */
  .drawer_panel {
    position: relative;
    width: min(32em, 100%);
    margin: 0 auto;
    background: #fff;
    /* 上部：しっかり丸いアーチ / 下部：わずかに丸め */
    border-radius: 16em 16em 1.6em 1.6em / 13em 13em 1.6em 1.6em;
    padding: 5em 3em 3em;
    box-shadow: 0 1em 3em rgba(60, 50, 30, 0.1);
  }
  .drawer_logo {
    display: block;
    width: 15em;
    margin: 0 auto 2.6em;
    line-height: 0;
  }
  .drawer_logo img { width: 100%; }

  .lower_gnav ul { display: block; }
  .lower_gnav li { border-bottom: 1px dashed #cfc7b4; }
  .lower_gnav li:first-child { border-top: 1px dashed #cfc7b4; }
  .lower_gnav a {
    display: block;
    padding: 1.35em 0.6em;
    font-size: 1.55em;
    font-weight: 500;
    letter-spacing: .04em;
    color: var(--ink);
    transition: color .25s ease, background-color .25s ease, padding-left .25s ease;
  }
  /* ホバー／タップで色が変わる */
  /* ホバー／タップで色が変わるのはメニュー項目(li a)だけ。ロゴ(.drawer_logo)は対象外 */
  .lower_gnav li a:hover,
  .lower_gnav li a:active,
  .lower_gnav li a:focus {
    color: var(--green_accent);
    background-color: var(--mint);
    padding-left: 1.2em;
  }

  /* ドロワー開時：SPバー（×ボタン）を画面上部に固定。sticky だと
     下スクロール時に置き去りになって閉じられなくなるため fixed に切替 */
  body.nav_open .lh_sp_bar {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    background: transparent;
    border-bottom-color: transparent;
  }
  body.nav_open .lh_sp_logo { opacity: 0; pointer-events: none; }

  .page_hero_title { font-size: 2.2em; }
  .lower_cta_box { flex-direction: column; align-items: center; }
  .lower_cta_btn { width: 100%; max-width: 20em; }
}

/* ============================================================
   サイトフッター（新デザイン・footer-2026.php）
============================================================ */
.site_footer { position: relative; z-index: 6; }

.site_footer_access {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 3em;
  align-items: center;
  width: min(75em, 100%);
  margin: 0 auto;
  padding: 4.5em 2em;
}
.site_footer_en {
  font-size: 0.95em;
  letter-spacing: .3em;
  color: var(--green_accent);
  margin-bottom: 0.6em;
}
.site_footer_office {
  font-size: 1.35em;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: .04em;
  margin-bottom: 1.2em;
}
.site_footer_addr {
  font-size: 0.92em;
  line-height: 2;
  color: #444;
  margin-bottom: 1.2em;
}
.site_footer_addr a { color: var(--green_accent); }
.site_footer_map {
  aspect-ratio: 16 / 11;
  border-radius: 1.2em;
  overflow: hidden;
}
.site_footer_map iframe { width: 100%; height: 100%; border: 0; }

.site_footer_bottom {
  background: var(--ink);
  color: #fff;
  text-align: center;
  padding: 3.4em 2em 2.4em;
}
.site_footer_logo img {
  width: 15em;
  margin: 0 auto 1.6em;
  filter: brightness(0) invert(1);
}
.site_footer_links {
  display: flex;
  justify-content: center;
  gap: 2em;
  flex-wrap: wrap;
  margin-bottom: 1.4em;
  font-size: 0.9em;
}
.site_footer_links a { color: #cfe6d6; transition: color .3s ease; }
.site_footer_links a:hover { color: #fff; }
.site_footer_copy {
  font-size: 0.7em;
  letter-spacing: .08em;
  color: #8fa896;
}

@media screen and (max-width: 768px) {
  .site_footer_access {
    grid-template-columns: 1fr;
    gap: 2em;
    padding: 3em 1.6em;
  }
  .site_footer_logo img { width: 20em; }
}