@import "./_reset.css";

@import url("https://fonts.googleapis.com/css2?family=Hind:wght@400;500;600;700&family=Jost:wght@400;500;600;700&family=Montserrat:ital,wght@0,100..900;1,100..900&family=Noto+Sans+JP:wght@100..900&display=swap");
/*
 * エントリ：読み込み順＝カスケード順（下に行くほど後勝ちになりやすい）
 *
 * 1. base/     リセット・フォント・色・ブレークポイント
 * 2. blocks/   サイト共通 → トップ（ヒーロー・サービス・新着/ホーム上書き）→ フッター
 *              → 下層共通（.subpage）→ 各固定ページ
 *
 * 補足：下層ヘッダー（.subpage-header）は _header.css 末尾に集約。
 *       トップ新着・新着テンプレ・トップ用モバイル上書きは _home.css に集約（元 _home-news / _news）。
 */
/* --- base --- */
/* Reset box-model and set borders */
/* ============================================ */
*,
::before,
::after {
  box-sizing: border-box;
  border-style: solid;
  border-width: 0;
  min-width: 0;
}
/* Document */
/* ============================================ */
/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 * 3. Remove gray overlay on links for iOS.
 */
html {
  line-height: 1.15; /* 1 */
  -webkit-text-size-adjust: 100%; /* 2 */
  -webkit-tap-highlight-color: transparent; /* 3 */
}
/* Sections */
/* ============================================ */
/**
 * Remove the margin in all browsers.
 */
body {
  margin: 0;
}
/**
 * Render the `main` element consistently in IE.
 */
main {
  display: block;
}
/* Vertical rhythm */
/* ============================================ */
p,
table,
blockquote,
address,
pre,
iframe,
form,
figure,
dl {
  margin: 0;
}
/* Headings */
/* ============================================ */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: inherit;
  font-weight: inherit;
  margin: 0;
}
/* Lists (enumeration) */
/* ============================================ */
ul,
ol {
  margin: 0;
  padding: 0;
  list-style: none;
}
/* Lists (definition) */
/* ============================================ */
dt {
  font-weight: bold;
}
dd {
  margin-left: 0;
}
/* Grouping content */
/* ============================================ */
/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */
hr {
  box-sizing: content-box; /* 1 */
  height: 0; /* 1 */
  overflow: visible; /* 2 */
  border-top-width: 1px;
  margin: 0;
  clear: both;
  color: inherit;
}
/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
pre {
  font-family: monospace, monospace; /* 1 */
  font-size: inherit; /* 2 */
}
address {
  font-style: inherit;
}
/* Text-level semantics */
/* ============================================ */
/**
 * Remove the gray background on active links in IE 10.
 */
a {
  background-color: transparent;
  text-decoration: none;
  color: inherit;
}
/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */
abbr[title] {
  text-decoration: underline dotted; /* 2 */
}
/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */
b,
strong {
  font-weight: bolder;
}
/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
code,
kbd,
samp {
  font-family: monospace, monospace; /* 1 */
  font-size: inherit; /* 2 */
}
/**
 * Add the correct font size in all browsers.
 */
small {
  font-size: 80%;
}
/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}
sub {
  bottom: -0.25em;
}
sup {
  top: -0.5em;
}
/* Replaced content */
/* ============================================ */
/**
 * Prevent vertical alignment issues.
 */
svg,
img,
embed,
object,
iframe {
  vertical-align: bottom;
}
/* Forms */
/* ============================================ */
/**
 * Reset form fields to make them styleable.
 * 1. Make form elements stylable across systems iOS especially.
 * 2. Inherit text-transform from parent.
 */
button,
input,
optgroup,
select,
textarea {
  -webkit-appearance: none; /* 1 */
  appearance: none;
  vertical-align: middle;
  color: inherit;
  font: inherit;
  background: transparent;
  padding: 0;
  margin: 0;
  border-radius: 0;
  text-align: inherit;
  text-transform: inherit; /* 2 */
}
/**
 * Correct cursors for clickable elements.
 */
button,
[type="button"],
[type="reset"],
[type="submit"] {
  cursor: pointer;
}
button:disabled,
[type="button"]:disabled,
[type="reset"]:disabled,
[type="submit"]:disabled {
  cursor: default;
}
/**
 * Improve outlines for Firefox and unify style with input elements & buttons.
 */
:-moz-focusring {
  outline: auto;
}
select:disabled {
  opacity: inherit;
}
/**
 * Remove padding
 */
option {
  padding: 0;
}
/**
 * Reset to invisible
 */
fieldset {
  margin: 0;
  padding: 0;
  min-width: 0;
}
legend {
  padding: 0;
}
/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */
progress {
  vertical-align: baseline;
}
/**
 * Remove the default vertical scrollbar in IE 10+.
 */
textarea {
  overflow: auto;
}
/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto;
}
/**
 * Correct the outline style in Safari.
 */
[type="search"] {
  outline-offset: -2px;
}
/**
 * Remove the inner padding in Chrome and Safari on macOS.
 */
[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}
/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Fix font inheritance.
 */
::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}
/**
 * Fix appearance for Firefox
 */
[type="number"] {
  -moz-appearance: textfield;
}
/**
 * Clickable labels
 */
label[for] {
  cursor: pointer;
}
/* Interactive */
/* ============================================ */
/*
 * Add the correct display in Edge, IE 10+, and Firefox.
 */
details {
  display: block;
}
/*
 * Add the correct display in all browsers.
 */
summary {
  display: list-item;
}
/*
 * Remove outline for editable content.
 */
[contenteditable]:focus {
  outline: auto;
}
/* Tables */
/* ============================================ */
/**
 * 1. Correct table border color inheritance in all Chrome and Safari.
 */
table {
  border-color: inherit; /* 1 */
  border-collapse: collapse;
}
caption {
  text-align: left;
}
td,
th {
  vertical-align: top;
  padding: 0;
}
th {
  text-align: left;
  font-weight: bold;
}
:root {
  /* 欧文見出し用（日本語は必ず --font-noto-sans-jp を使う） */
  --font-hind: "Hind", sans-serif;
  --font-jost: "Jost", sans-serif;
  --font-montserrat: "Montserrat", sans-serif;
  --font-noto-sans-jp: "Noto Sans JP", sans-serif;
  --font-noto-sans: "Noto Sans", sans-serif;
}
html {
  font-size: 62.5%;
}
body {
  font-family: var(--font-noto-sans-jp), sans-serif;
}
:root {
  /* kizuna-en.com Elementor キット（post-5）に合わせる */
  --color-primary: #05aa5a;
  --color-accent: #05aa5a;
  --color-yellow: #fcee21;
  --color-text-muted: #7a7a7a;
  /* 下層ヘッダー：非アクティブのナビ文字（中〜濃グレー） */
  --color-nav-inactive: #54595f;
  --color-body: #666666;
  --color-link: #39b54a;
  --color-link-light-green: #8cc63f;
  --color-section-cream: #fffff9;
  --container-max: 1140px;
  /* develop/html/index.html のフッターと同じ変数名 */
  --color-mail-bg: #8cc63f;
  --color-tel-bg: #22b573;
  --color-footer-deep: #009245;
  /* 必須マーク等（.haveto） */
  --color-required: #c00;
}
.haveto {
  color: var(--color-required);
}
/* =============================================================================
   ブレイクポイント（3段階）

   サイト全体で次の境界に揃える。

   - スマホ:     max-width: 767px
   - タブレット: min-width: 768px and max-width: 1023px
   - PC:        min-width: 1024px

   メディアクエリ内では var() が使えないため、各 CSS では上記の数値を直書きする。
   ============================================================================= */
/* --- サイト共通（グローバルヘッダに下層ヘッダを含む） --- */
/* =============================================================================
   Drawer（モバイルのみ / 本番は ~767px）
   ============================================================================= */
.drawer__state {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}
.drawer__backdrop {
  position: fixed;
  inset: 0;
  z-index: 998;
  background: rgba(0, 0, 0, 0.4);
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.25s, visibility 0.25s;
  cursor: pointer;
}
.drawer__sheet {
  position: fixed;
  top: 0;
  right: 0;
  z-index: 999;
  width: min(320px, 88vw);
  height: 100%;
  background: #fff;
  padding: 80px 32px 24px;
  overflow-y: auto;
  transform: translateX(100%);
  transition: transform 0.3s ease;
  box-shadow: -4px 0 24px rgba(0, 0, 0, 0.12);
}
.drawer__state:checked ~ .drawer__backdrop {
  opacity: 1;
  visibility: visible;
}
.drawer__state:checked ~ .drawer__sheet {
  transform: translateX(0);
}
.drawer__bar {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1001;
  padding: 12px 0;
  background: rgba(255, 255, 255, 0.97);
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.06);
}
.drawer__bar-inner {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  padding: 0 16px;
}
.drawer__toggle {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  background: none;
  border: 0;
  border-radius: 51px;
  cursor: pointer;
  /* ハンバーガー線は currentColor — 閉じたときは緑 */
  color: var(--color-accent);
  font-family: var(--font-noto-sans-jp), sans-serif;
  font-size: 16px;
  font-weight: 600;
  letter-spacing: 2px;
  padding: 8px 12px;
  transition: color 0.6s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.2s ease,
    background-color 0.25s ease;
}
.drawer__toggle:hover {
  color: var(--color-yellow);
}
.drawer__sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}
/* ハンバーガー → X（CSS 2 本線 / 600ms / cubic-bezier(0.4, 0, 0.2, 1)） */
.menu-hamburger {
  position: relative;
  display: block;
  width: 26px;
  height: 14px;
  flex-shrink: 0;
}
.menu-hamburger__bar {
  position: absolute;
  left: 0;
  width: 100%;
  height: 3px;
  border-radius: 2px;
  background: currentColor;
  transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1),
    top 0.6s cubic-bezier(0.4, 0, 0.2, 1),
    bottom 0.6s cubic-bezier(0.4, 0, 0.2, 1),
    margin-top 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}
.menu-hamburger__bar:nth-child(1) {
  top: 0;
  margin-top: 0;
}
.menu-hamburger__bar:nth-child(2) {
  bottom: 0;
  margin-top: 0;
}
body:has(#drawer-state:checked) .menu-hamburger__bar:nth-child(1),
body.drawer-open .menu-hamburger__bar:nth-child(1) {
  top: 50%;
  margin-top: -1.5px;
  transform: rotate(45deg);
}
body:has(#drawer-state:checked) .menu-hamburger__bar:nth-child(2),
body.drawer-open .menu-hamburger__bar:nth-child(2) {
  bottom: auto;
  top: 50%;
  margin-top: -1.5px;
  transform: rotate(-45deg);
}
/* wp_nav_menu ul.drawer__menu — 本番モバイル縦メニューに近づける */
.drawer__menu {
  list-style: none;
  margin: 0;
  padding: 0;
}
.drawer__menu > li > a {
  display: block;
  padding: 1.2rem 0;
  font-family: var(--font-noto-sans-jp), sans-serif;
  font-size: 20px;
  font-weight: 600;
  letter-spacing: 2px;
  color: var(--color-accent);
  border-bottom: 1px solid #eee;
}
.drawer__menu .sub-menu {
  list-style: none;
  margin: 6px 0 0;
  padding: 0 0 8px 12px;
}
.drawer__menu .sub-menu a {
  display: block;
  padding: 10px 0;
  font-family: var(--font-noto-sans-jp), sans-serif;
  font-size: 20px;
  font-weight: 500;
  letter-spacing: normal;
  color: var(--color-accent);
  border-bottom: 1px solid #eee;
}
.drawer__menu .sub-menu a:hover,
.drawer__menu .sub-menu a:focus-visible,
.drawer__menu .sub-menu li.current-menu-item > a {
  background-color: var(--color-accent);
  color: #fff;
}
.drawer__menu > li > a:hover,
.drawer__menu > li > a:focus-visible,
.drawer__menu > li.current-menu-item > a,
.drawer__menu > li.current-menu-ancestor > a {
  text-decoration: underline;
  text-underline-offset: 4px;
}
.drawer__menu > li.menu-item-has-children > a {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
}
.drawer__menu > li.menu-item-has-children > a::after {
  content: "▼";
  flex-shrink: 0;
  font-size: 0.65em;
  line-height: 1;
  opacity: 0.9;
}
/* ドロワー：SERVICE 親は非表示、子のみトップレベルと同じタイポで表示 */
.drawer__menu > li.menu-item-service-parent > a.nav-menu-service-parent {
  display: none;
}
.drawer__menu > li.menu-item-service-parent > .sub-menu {
  margin: 0;
  padding: 0;
}
.drawer__menu > li.menu-item-service-parent > .sub-menu > li > a {
  padding: 1.2rem 0;
  font-size: 20px;
  font-weight: 600;
  letter-spacing: 2px;
}
@media (max-width: 767px) {
  .drawer__bar {
    display: block;
  }

  /* オーバーレイはシート側の clip-path のみ（二重に暗くしない） */
  .drawer__state:checked ~ .drawer__backdrop {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
  }

  /* 全画面・右上基点の円形展開（0.7s / cubic-bezier(0.4, 0, 0.2, 1)）— ボタン位置に合わせた at */
  .drawer__sheet {
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    max-width: none;
    height: 100%;
    min-height: 100dvh;
    padding: calc(env(safe-area-inset-top, 0px) + 96px) 28px 32px;
    background: var(--color-primary);
    box-shadow: none;
    transform: none;
    transition: clip-path 0.7s cubic-bezier(0.4, 0, 0.2, 1);
    clip-path: circle(
      0% at calc(100% - max(16px, env(safe-area-inset-right, 0px)) - 25px)
        calc(env(safe-area-inset-top, 0px) + 37px)
    );
    z-index: 900;
    pointer-events: none;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }

  .drawer__state:checked ~ .drawer__sheet {
    transform: none;
    clip-path: circle(
      150% at calc(100% - max(16px, env(safe-area-inset-right, 0px)) - 25px)
        calc(env(safe-area-inset-top, 0px) + 37px)
    );
    pointer-events: auto;
  }

  .drawer__sheet .drawer__menu > li {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.4s ease, transform 0.4s ease;
    transition-delay: 0s;
  }

  .drawer__state:checked ~ .drawer__sheet .drawer__menu > li:nth-child(1) {
    transition-delay: 0.3s;
  }

  .drawer__state:checked ~ .drawer__sheet .drawer__menu > li:nth-child(2) {
    transition-delay: 0.4s;
  }

  .drawer__state:checked ~ .drawer__sheet .drawer__menu > li:nth-child(3) {
    transition-delay: 0.5s;
  }

  .drawer__state:checked ~ .drawer__sheet .drawer__menu > li:nth-child(4) {
    transition-delay: 0.6s;
  }

  .drawer__state:checked ~ .drawer__sheet .drawer__menu > li:nth-child(5) {
    transition-delay: 0.65s;
  }

  .drawer__state:checked ~ .drawer__sheet .drawer__menu > li:nth-child(6) {
    transition-delay: 0.7s;
  }

  .drawer__state:checked ~ .drawer__sheet .drawer__menu > li:nth-child(7) {
    transition-delay: 0.75s;
  }

  .drawer__state:checked ~ .drawer__sheet .drawer__menu > li:nth-child(8) {
    transition-delay: 0.8s;
  }

  .drawer__state:checked ~ .drawer__sheet .drawer__menu > li:nth-child(9) {
    transition-delay: 0.85s;
  }

  .drawer__state:checked ~ .drawer__sheet .drawer__menu > li:nth-child(10) {
    transition-delay: 0.9s;
  }

  .drawer__state:checked ~ .drawer__sheet .drawer__menu > li:nth-child(11) {
    transition-delay: 0.95s;
  }

  .drawer__state:checked ~ .drawer__sheet .drawer__menu > li:nth-child(12) {
    transition-delay: 1s;
  }

  .drawer__state:checked ~ .drawer__sheet .drawer__menu > li {
    opacity: 1;
    transform: translateY(0);
  }

  .drawer__sheet .drawer__menu {
    text-align: center;
  }

  .drawer__sheet .drawer__menu > li > a {
    color: #f5f5f7;
    border-bottom: none;
    text-decoration: none;
  }

  .drawer__sheet .drawer__menu > li.menu-item-has-children > a {
    justify-content: center;
  }

  .drawer__sheet .drawer__menu > li.menu-item-has-children > a::after {
    content: none;
    display: none;
  }

  .drawer__sheet .drawer__menu .sub-menu {
    text-align: center;
    padding-left: 0;
    padding-right: 0;
  }

  .drawer__sheet .drawer__menu .sub-menu a {
    color: rgba(245, 245, 247, 0.92);
    border-bottom: none;
    text-decoration: none;
  }

  /* SERVICE の子：親と同じ色・太さ（親リンクは非表示） */
  .drawer__sheet .drawer__menu > li.menu-item-service-parent > .sub-menu a {
    color: #f5f5f7;
    font-weight: 600;
    letter-spacing: 2px;
  }

  .drawer__sheet
    .drawer__menu
    > li.menu-item-service-parent
    > .sub-menu
    a:hover,
  .drawer__sheet
    .drawer__menu
    > li.menu-item-service-parent
    > .sub-menu
    a:focus-visible,
  .drawer__sheet
    .drawer__menu
    > li.menu-item-service-parent
    > .sub-menu
    li.current-menu-item
    > a {
    color: #fff;
  }

  .drawer__sheet .drawer__menu > li > a:hover,
  .drawer__sheet .drawer__menu > li > a:focus-visible,
  .drawer__sheet .drawer__menu > li.current-menu-item > a,
  .drawer__sheet .drawer__menu > li.current-menu-ancestor > a {
    color: #fff;
    text-decoration: none;
  }

  .drawer__sheet .drawer__menu .sub-menu a:hover,
  .drawer__sheet .drawer__menu .sub-menu a:focus-visible,
  .drawer__sheet .drawer__menu .sub-menu li.current-menu-item > a {
    text-decoration: none;
  }

  body:has(#drawer-state:checked) .drawer__toggle,
  body.drawer-open .drawer__toggle {
    color: #fff;
    background: transparent;
    box-shadow: none;
  }

  body:has(#drawer-state:checked) .drawer__toggle:hover,
  body.drawer-open .drawer__toggle:hover {
    color: #fff;
  }

  /* タッチ後の hover 残りで閉じたあと黄色が付くのを防ぐ */
  body:not(.drawer-open) .drawer__toggle:hover,
  body:not(.drawer-open) .drawer__toggle:active {
    color: var(--color-accent);
  }
}
/* =============================================================================
   Primary nav（768px〜 / 本番ピル型ナビ）
   Elementor: e--pointer-underline + e--animation-fade 相当
   ============================================================================= */
.primary-nav {
  display: flex;
  justify-content: center;
  margin: 80px auto;
}
.primary-nav__pill {
  max-width: 694px;
  width: 100%;
  background: #fff;
  border-radius: 100px;
  box-shadow: 11px 7px 10px 0px rgba(0, 0, 0, 0.28);
  padding: 12px 32px;
}
.primary-nav__menu {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 4px 20px;
  list-style: none;
  margin: 0;
  padding: 0;
}
.primary-nav__menu > li {
  position: relative;
}
/* 親とドロップダウンの間に margin があるとホバーが途切れるため、余白は ul 内の padding に寄せる */
.primary-nav__menu > li.menu-item-has-children:hover,
.primary-nav__menu > li.menu-item-has-children:focus-within {
  z-index: 60;
}
/* トップレベル：アンダーライン 3px・フェード（Elementor Pro と同系） */
.primary-nav__menu > li > a {
  position: relative;
  font-family: var(--font-noto-sans-jp), sans-serif;
  font-size: 16px;
  font-weight: 600;
  letter-spacing: 2px;
  color: var(--color-accent);
  padding: 8px 4px;
  display: inline-block;
  transition: color 0.3s cubic-bezier(0.58, 0.3, 0.005, 1);
}
/* アンダーラインは ::before（子あり項目は ::after で ▼ を使うため） */
.primary-nav__menu > li > a::before {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 3px;
  background-color: var(--color-accent);
  opacity: 0;
  transition: opacity 0.3s cubic-bezier(0.58, 0.3, 0.005, 1);
}
.primary-nav__menu > li > a:hover::before,
.primary-nav__menu > li > a:focus-visible::before,
.primary-nav__menu > li.current-menu-item > a::before,
.primary-nav__menu > li.current-menu-ancestor > a::before {
  opacity: 1;
}
/* SERVICE など子メニュー付き：ラベル右に ▼ */
.primary-nav__menu > li.menu-item-has-children > a {
  display: inline-flex;
  align-items: center;
  gap: 0.2em;
  padding-right: 2px;
}
.primary-nav__menu > li.menu-item-has-children > a::after {
  content: "▼";
  font-size: 0.55em;
  line-height: 1;
  position: relative;
  top: 0.05em;
  opacity: 0.95;
}
.primary-nav__menu > li > a:hover,
.primary-nav__menu > li > a:focus-visible,
.primary-nav__menu > li.current-menu-item > a,
.primary-nav__menu > li.current-menu-ancestor > a {
  color: var(--color-accent);
}
/* ドロップダウン（本番 Elementor: .elementor-nav-menu--main .elementor-nav-menu ul = width:12em, top:100%） */
.primary-nav__menu .sub-menu {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  right: auto;
  transform: none;
  box-sizing: border-box;
  width: 12em;
  min-width: 12em;
  margin: 0;
  /* 旧 margin-top:6px + padding-top:8px 相当。上段はホバー可能な領域（隙間をなくす） */
  padding: 14px 0 8px;
  list-style: none;
  font-size: 14px;
  text-align: left;
  background: #fff;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
  z-index: 50;
}
.primary-nav__menu > li:hover .sub-menu,
.primary-nav__menu > li:focus-within .sub-menu {
  display: block;
}
.primary-nav__menu .sub-menu a {
  display: block;
  padding: 8px 16px;
  font-family: var(--font-noto-sans-jp), sans-serif;
  font-size: 14px;
  font-weight: 600;
  color: var(--color-accent);
}
.primary-nav__menu .sub-menu a::before,
.primary-nav__menu .sub-menu a::after {
  display: none;
}
.primary-nav__menu .sub-menu a:hover,
.primary-nav__menu .sub-menu a:focus-visible,
.primary-nav__menu .sub-menu li.current-menu-item > a {
  background-color: var(--color-accent);
  color: var(--color-yellow);
}
/* タブレット（base/_breakpoints.css の 768px–1023px） */
@media (min-width: 768px) and (max-width: 1023px) {
  .primary-nav {
    margin: 10px auto 30px;
  }

  .primary-nav__pill {
    max-width: 619px;
  }

  .primary-nav__menu > li > a {
    font-size: 14px;
  }
}
@media (max-width: 767px) {
  .primary-nav {
    display: none;
  }
}
/* --------------------------------------------------------------------------
   下層ページヘッダー（.subpage-header）— 元 blocks/_subpage-header.css
   左ロゴ + 右ピルナビ。トップは 768px+ で非表示（ヒーロー下 .primary-nav と重複回避）
   -------------------------------------------------------------------------- */
@media (min-width: 768px) {
  /* .blog 付きは「投稿をトップに」など。静的フロントは :not(.blog) で front-page 未付与でも効かせる */
  body.home.front-page .subpage-header,
  body.home:not(.blog) .subpage-header {
    display: none !important;
  }
}
.subpage-header {
  margin: 0 auto;
  position: relative;
  z-index: 1;
  background: #fff;
  padding: 40px 0 80px;
}
.subpage-header__inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: clamp(1rem, 3vw, 2rem);
  max-width: 1120px;
  margin: 0 auto;
  padding: 14px clamp(1rem, 3vw, 1.5rem);
}
.subpage-header__logo-link {
  display: block;
  flex-shrink: 0;
  /* destyle の * { min-width: 0 } により flex 内 img が幅0になるのを防ぐ */
  min-width: min-content;
  line-height: 0;
}
.subpage-header__logo {
  display: block;
  width: auto;
  height: 54px;
  max-width: min(220px, 46vw);
  min-width: 120px;
  object-fit: contain;
  object-position: left center;
}
.subpage-header__nav-wrap {
  flex: 1;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  min-width: 0;
}
/* ピル：白背景・参考画像どおりの柔らかい浮き影・大きめ角丸 */
.subpage-header .primary-nav__pill {
  max-width: none;
  width: auto;
  margin: 0;
  padding: 16px 28px 16px;
  border-radius: 50px;
  background: #fff;
}
.subpage-header .primary-nav__menu {
  flex-wrap: nowrap;
  justify-content: center;
  gap: 4px 22px;
}
@media (min-width: 768px) and (max-width: 1023px) {
  .subpage-header {
    padding-top: 2rem;
  }
  .subpage-header .primary-nav__pill {
    padding: 10px 18px 12px;
  }

  .subpage-header .primary-nav__menu {
    gap: 4px 14px;
  }

  .subpage-header .primary-nav__menu > li > a {
    font-size: 13px;
    letter-spacing: 1.5px;
    padding: 8px 2px;
  }
}
/* 非アクティブ：中〜濃グレー / アクティブ：森緑 + 太め下線のみ */
.subpage-header .primary-nav__menu > li > a {
  color: var(--color-nav-inactive);
  padding: 8px 8px 8px;
}
.subpage-header .primary-nav__menu > li > a::before {
  height: 4px;
  background-color: var(--color-primary);
  border-radius: 1px;
}
.subpage-header .primary-nav__menu > li.current-menu-item > a,
.subpage-header .primary-nav__menu > li.current-menu-ancestor > a {
  color: var(--color-primary);
}
/* 参考：下線は現在地のみ。ホバーは色だけ（下線は付けない） */
.subpage-header
  .primary-nav__menu
  > li:not(.current-menu-item):not(.current-menu-ancestor)
  > a:hover,
.subpage-header
  .primary-nav__menu
  > li:not(.current-menu-item):not(.current-menu-ancestor)
  > a:focus-visible {
  color: var(--color-primary);
}
.subpage-header
  .primary-nav__menu
  > li:not(.current-menu-item):not(.current-menu-ancestor)
  > a:hover::before,
.subpage-header
  .primary-nav__menu
  > li:not(.current-menu-item):not(.current-menu-ancestor)
  > a:focus-visible::before {
  opacity: 0;
}
.subpage-header .primary-nav__menu > li.current-menu-item > a::before,
.subpage-header .primary-nav__menu > li.current-menu-ancestor > a::before {
  opacity: 1;
}
/* ドロップダウン：非アクティブはグレー。ホバーはトップと同じく緑背景＋黄文字（.subpage-header 単体指定だと hover が負けるため明示） */
.subpage-header .primary-nav__menu .sub-menu a {
  color: var(--color-nav-inactive);
}
.subpage-header .primary-nav__menu .sub-menu a:hover,
.subpage-header .primary-nav__menu .sub-menu a:focus-visible,
.subpage-header .primary-nav__menu .sub-menu li.current-menu-item > a {
  background-color: var(--color-primary);
  color: var(--color-yellow);
}
.subpage-header
  .primary-nav__menu
  > li.menu-item-has-children:not(.current-menu-ancestor)
  > a::after {
  opacity: 0.85;
  color: var(--color-nav-inactive);
}
.subpage-header
  .primary-nav__menu
  > li.menu-item-has-children.current-menu-ancestor
  > a::after {
  color: var(--color-primary);
}
/* モバイル：ピル非表示・ロゴ＋ハンバーガー */
.subpage-header__menu-toggle {
  display: none;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  margin: 0;
  width: 50px;
  height: 50px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: #fff;
  cursor: pointer;
  /* ハンバーガー線は currentColor — 閉じたときは緑 */
  color: var(--color-primary);
  font-family: var(--font-noto-sans-jp), sans-serif;
  font-size: 16px;
  font-weight: 600;
  letter-spacing: 2px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1), 0 4px 14px rgba(0, 0, 0, 0.06);
  transition: color 0.6s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.2s ease,
    background-color 0.25s ease;
}
.subpage-header__menu-toggle:hover {
  color: var(--color-yellow);
  box-shadow: 0 3px 12px rgba(0, 0, 0, 0.12), 0 6px 18px rgba(0, 0, 0, 0.08);
}
@media (max-width: 767px) {
  .subpage-header {
    padding: 10px 0 40px;
    transition: background-color 0.25s ease;
  }

  .subpage-header__inner {
    padding: 0px 16px;
  }

  /* 固定ボタン分の幅を確保（レイアウトずれ防止） */
  .subpage-header__inner::after {
    content: "";
    flex-shrink: 0;
    width: 50px;
    height: 50px;
    pointer-events: none;
  }

  /*
   * モバイルのメニュー操作は .subpage-header__menu-toggle のみ。
   * body.home.front-page が付かない（フロントを「最新の投稿」にした場合）でも二重表示しない。
   */
  body .drawer__bar {
    display: none;
  }

  .subpage-header__nav-wrap {
    display: none;
  }

  .subpage-header__menu-toggle {
    display: flex;
    position: fixed;
    top: calc(env(safe-area-inset-top, 0px) + 12px);
    right: max(16px, env(safe-area-inset-right, 0px));
    z-index: 1000;
    margin: 0;
  }

  /*
   * ドロワー全画面シートは z-index:900。親の .subpage-header が z-index:1 のため、
   * 固定トグルが親のスタッキングに閉じ込められシートの下に隠れる → 閉じる（X）が押せない。
   * 開いているときだけヘッダーをシートより手前にし、白背景は消して全画面オーバーレイと一体化させる。
   */
  body:has(#drawer-state:checked) .subpage-header,
  body.drawer-open .subpage-header {
    z-index: 1100;
    background: transparent;
    transition: background-color 0.25s ease;
    /* 透明ヘッダー帯がタップを奪わないよう。閉じるボタンだけ操作可能 */
    pointer-events: none;
  }

  body:has(#drawer-state:checked) .subpage-header__menu-toggle,
  body.drawer-open .subpage-header__menu-toggle {
    pointer-events: auto;
    /* 開いたら線は白。白円の上だと見えないので背景は透明にして下のダークを透かす */
    color: #fff;
    background: transparent;
    box-shadow: none;
  }

  body:has(#drawer-state:checked) .subpage-header__menu-toggle:hover,
  body.drawer-open .subpage-header__menu-toggle:hover {
    color: #fff;
    box-shadow: none;
  }

  body:has(#drawer-state:checked) .subpage-header__logo-link,
  body.drawer-open .subpage-header__logo-link {
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.25s ease, visibility 0.25s ease;
    pointer-events: none;
  }

  /*
   * タッチ後に :hover が残り閉じたあとも黄色が固定されるのを防ぐ（モバイル幅では閉じ時は常に緑）
   */
  body:not(.drawer-open) .subpage-header__menu-toggle:hover,
  body:not(.drawer-open) .subpage-header__menu-toggle:active {
    color: var(--color-primary);
  }
}
@media (min-width: 768px) {
  .subpage-header__menu-toggle {
    display: none !important;
  }
}
/* --- トップ：ヒーロー → 3サービス → 新着＋トップ専用モバイル調整 --- */
/* Block: hero */
.hero {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 0;
  padding: 80px 20px 0;
  box-sizing: border-box;
}
.hero__media {
  position: relative;
  z-index: 0;
  width: 100%;
  max-width: 1140px;
  margin: 0 auto;
  background: #000;
  aspect-ratio: 16 / 9;
  max-height: 85vh;
}
.hero__video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
@media (max-width: 1023px) {
  .hero {
    padding: 20px 20px 20px;
  }
}
@media (max-width: 767px) {
  .hero {
    margin-top: 52px;
    min-height: calc(85vh - 52px);
  }
}
/* トップ SERVICE 系セクション共通（front-page の service-hospital / salon / dogwood） */
:root {
  --service-inner-max: 1140px;
  --service-section-padding: clamp(3rem, 6vw, 8rem) clamp(1.25rem, 4vw, 2rem);
  --service-grid-gap-3: clamp(6rem, 6vw, 7rem);
  --service-grid-gap-compact: clamp(2rem, 4vw, 3.5rem);
  --service-photo-bg: #e8e6e0;

  /* トップ SERVICE セクション共通タイポ（label / title / lead / 本文）— 一箇所で調整 */
  --home-service-label-fs: 2rem;
  --home-service-label-fw: 800;
  --home-service-label-letter-spacing: 2px;
  --home-service-label-font: var(--font-noto-sans-jp), sans-serif;
  --home-service-label-transform: uppercase;
  --home-service-label-color: var(--color-primary);

  --home-service-title-fs: 2.6rem;
  --home-service-title-fw: 800;
  --home-service-title-letter-spacing: 0.08em;
  --home-service-title-line-height: 1.3;
  --home-service-title-color: var(--color-primary);

  --home-service-lead-fs: clamp(1.05rem, 1.6vw, 2.25rem);
  --home-service-lead-fw: 700;
  --home-service-lead-letter-spacing: 0.04em;
  --home-service-lead-line-height: 1.55;
  --home-service-lead-color: #333;

  --home-service-body-fs: 16px;
  --home-service-body-fw: 400;
  --home-service-body-lh: 1.85;
  --home-service-body-color: var(--color-text-muted);

  /* トップ「新着」カード見出しなど、セクション h2 より一段小さい見出し */
  --home-service-card-title-fs: clamp(1.05rem, 1.4vw, 1.25rem);
  --home-service-card-title-fw: 600;
  --home-service-card-title-lh: 1.45;
}
.service-hospital__inner,
.service-salon__inner,
.service-dogwood__inner {
  max-width: var(--service-inner-max);
  margin: 0 auto;
}
.service-hospital__label,
.service-salon__label,
.service-dogwood__label {
  margin: 0 0 0.5rem;
  font-family: var(--home-service-label-font);
  font-size: var(--home-service-label-fs);
  font-weight: var(--home-service-label-fw);
  letter-spacing: var(--home-service-label-letter-spacing);
  text-transform: var(--home-service-label-transform);
  color: var(--home-service-label-color);
}
.service-hospital__title,
.service-salon__title,
.service-dogwood__title {
  font-size: var(--home-service-title-fs);
  font-weight: var(--home-service-title-fw);
  letter-spacing: var(--home-service-title-letter-spacing);
  line-height: var(--home-service-title-line-height);
  color: var(--home-service-title-color);
}
.service-hospital__lead,
.service-dogwood__lead {
  font-size: var(--home-service-lead-fs);
  font-weight: var(--home-service-lead-fw);
  letter-spacing: var(--home-service-lead-letter-spacing);
  line-height: var(--home-service-lead-line-height);
  color: var(--home-service-lead-color);
}
.service-hospital__body,
.service-salon__body,
.service-dogwood__body {
  font-size: var(--home-service-body-fs);
  font-weight: var(--home-service-body-fw);
  line-height: var(--home-service-body-lh);
  color: var(--home-service-body-color);
}
/* 緑のピルCTA（各セクションで共通） */
.service-block__cta {
  display: inline-flex;
  align-self: center;
  align-items: center;
  justify-content: center;
  min-width: 250px;
  padding: 18px 11rem;
  border-radius: 30px;
  font-size: 20px;
  font-weight: 600;
  text-decoration: none;
  color: #fff;
  background-color: var(--color-primary);
  transition: opacity 0.2s ease, transform 0.2s ease, color 0.2s ease;
}
.service-block__cta:hover {
  color: var(--color-yellow);
}
.service-block__cta:focus-visible {
  outline: 2px solid var(--color-primary);
  outline-offset: 3px;
}
/* 外部リンク CTA：アイコンは currentColor＋mask（ホバーでテキストと同じ黄色に） */
.service-block__cta[target="_blank"] {
  gap: 0.4em;
}
.service-block__cta[target="_blank"]::after {
  content: "";
  display: inline-block;
  width: 1.125em;
  height: 1.125em;
  flex-shrink: 0;
  vertical-align: middle;
  background-color: currentColor;
  mask-image: var(
    --kizunaen-icon-external,
    url("../images/icons/up-right-from.svg")
  );
  mask-repeat: no-repeat;
  mask-position: center;
  mask-size: contain;
  -webkit-mask-image: var(
    --kizunaen-icon-external,
    url("../images/icons/up-right-from.svg")
  );
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  -webkit-mask-size: contain;
}
/* 正方形サムネ＋ホバー拡大（動物病院・ドッグウッドで見た目共通） */
.service-hospital__photo-wrap,
.service-dogwood__photo-wrap {
  position: relative;
  width: 100%;
  aspect-ratio: 1;
  overflow: hidden;
  border-radius: 4px;
  background: var(--service-photo-bg);
}
.service-hospital__photo,
.service-dogwood__photo {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transform: scale(1);
  transform-origin: center center;
  transition: transform 0.55s cubic-bezier(0.33, 1, 0.68, 1);
}
.service-hospital__photo-wrap:hover .service-hospital__photo,
.service-dogwood__photo-wrap:hover .service-dogwood__photo {
  transform: scale(1.1);
}
/* OS/ブラウザの「動きを減らす」設定時は、ホバー拡大の transition を短くする */
@media (prefers-reduced-motion: reduce) {
  .service-hospital__photo,
  .service-dogwood__photo {
    transition: transform 0.25s ease-out;
  }
}
@media (max-width: 767px) {
  :root {
    --home-service-label-fs: 2rem;
    --home-service-label-fw: 800;
    --home-service-label-letter-spacing: 1.5px;
    --home-service-label-font: var(--font-montserrat), sans-serif;

    --home-service-title-fs: 2.4rem;
    --home-service-title-letter-spacing: 0.06em;

    --home-service-lead-fs: 2rem;
    --home-service-lead-line-height: 1.55;

    --home-service-body-fs: 15px;
    --home-service-body-lh: 1.85;

    --home-service-card-title-fs: clamp(1.05rem, 3vw, 1.125rem);
  }

  .service-block__cta {
    width: 100%;
    max-width: 100%;
    padding: 14px 32px;
    font-size: 18px;
  }
}
/* Block: SERVICE / 動物病院（トップ）
   共通トークン・ラベル・CTA・写真枠は _service-shared.css
   ブレイクポイントは base/_breakpoints.css（3段階）に準拠 */
.service-hospital {
  padding: var(--service-section-padding);
  background-color: #faf8f4;
  background-image: url("../images/bg.jpg");
  background-repeat: repeat;
  background-position: 0 0;
}
.service-hospital__grid {
  display: grid;
}
@media (min-width: 1024px) {
  .service-hospital__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--service-grid-gap-3);
    align-items: center;
  }
}
.service-hospital__text {
  display: flex;
  flex-direction: column;
}
.service-hospital__title {
  margin: 0 0 2rem;
}
.service-hospital__lead {
  margin: 0 0 1.5rem;
}
.service-hospital__body {
  margin: 0 0 3rem;
}
.service-hospital__media {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.75rem;
  text-align: center;
}
.service-hospital__figure {
  margin: 0;
  width: 100%;
}
.service-hospital__figure--align-start {
  align-self: start;
}
.service-hospital__figure--align-end {
  align-self: end;
}
.service-hospital__photo-wrap--vignette::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  box-shadow: inset 0 0 48px 24px rgba(250, 248, 244, 0.95);
}
.service-hospital__logo {
  display: block;
  width: 100%;
  max-width: 300px;
  height: auto;
  margin: 0 auto;
}
/*
 * タブレット：上段 50/50 で写真＋ロゴ、下段でテキスト＋CTA を中央寄せ（DOM 順はテキスト先頭のまま grid-area で配置）
 */
@media (min-width: 768px) and (max-width: 1023px) {
  .service-hospital {
    padding-inline: 6rem;
  }

  .service-hospital__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-areas:
      "fig-start fig-end"
      "text text";
    column-gap: 6rem;
    row-gap: clamp(2.5rem, 5vw, 3.5rem);
    align-items: start;
  }

  .service-hospital__text {
    grid-area: text;
    margin-inline: auto;
    width: 100%;
  }

  .service-hospital__photo-wrap {
    max-width: 100%;
    margin: 0 auto;
  }

  .service-hospital__figure--align-start {
    grid-area: fig-start;
  }

  .service-hospital__figure--align-end {
    grid-area: fig-end;
  }

  .service-hospital__figure--align-start,
  .service-hospital__figure--align-end {
    align-self: stretch;
  }

  .service-hospital__media {
    flex-direction: column;
    align-items: center;
    gap: 2rem;
  }

  .service-hospital__title {
    margin-bottom: 1.5rem;
  }

  .service-hospital__lead {
    margin-bottom: 1.25rem;
  }

  .service-hospital__body {
    margin-bottom: 4rem;
  }
}
@media (max-width: 767px) {
  .service-hospital__grid {
    grid-template-columns: 1fr;
    gap: 2rem;
    align-items: start;
  }

  .service-hospital__figure--align-start,
  .service-hospital__figure--align-end {
    align-self: stretch;
  }

  .service-hospital__media {
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
  }

  .service-hospital__figure {
    max-width: 100%;
  }
}
/* Block: SERVICE / オンラインサロン・ショップ（トップ）
   ラベル・CTA・inner は _service-shared.css */
.service-salon {
  padding: var(--service-section-padding);
  background-color: #fff;
}
.service-salon__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--service-grid-gap-compact);
  align-items: start;
}
.service-salon__visual {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
  width: 100%;
}
.service-salon__brand {
  display: block;
  width: 100%;
  max-width: 280px;
  height: auto;
}
.service-salon__photo-wrap {
  position: relative;
  width: 100%;
  max-width: 100%;
  overflow: hidden;
  border-radius: 4px;
  background: #f0f0f0;
}
.service-salon__photo-wrap--wide {
  aspect-ratio: 842 / 336;
}
.service-salon__photo {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transform: scale(1);
  transform-origin: center center;
  transition: transform 0.55s cubic-bezier(0.33, 1, 0.68, 1);
}
.service-salon__photo-wrap:hover .service-salon__photo {
  transform: scale(1.08);
}
@media (prefers-reduced-motion: reduce) {
  .service-salon__photo {
    transition: transform 0.25s ease-out;
  }
}
.service-salon__text {
  display: flex;
  flex-direction: column;
}
.service-salon__title {
  margin: 0 0 1rem;
}
.service-salon__body {
  margin: 0;
}
.service-salon__cta-row {
  display: flex;
  justify-content: center;
  margin-top: clamp(2rem, 4vw, 3.5rem);
}
.service-salon__cta-row .service-block__cta {
  align-self: center;
}
/* タブレット：ビジュアル全幅 → オンラインサロン / ショップのテキストを横2列 */
@media (min-width: 768px) and (max-width: 1023px) {
  .service-salon {
    padding-inline: 6rem;
  }

  .service-salon__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 4rem;
    row-gap: clamp(2rem, 4vw, 2.5rem);
    align-items: start;
  }

  .service-salon__visual {
    grid-column: 1 / -1;
    max-width: none;
    width: 100%;
    margin: 0;
  }
}
@media (max-width: 767px) {
  .service-salon__grid {
    grid-template-columns: 1fr;
    gap: 2rem;
  }

  .service-salon__visual {
    max-width: 400px;
    margin: 0 auto;
  }
}
/* Block: SERVICE / ドッグウッド・ガーデン（トップ）
   ラベル・inner・写真枠は _service-shared.css（写真は service-hospital のクラスを HTML で共用） */
.service-dogwood {
  padding: var(--service-section-padding);
  background-color: #f9f9e8;
}
.service-dogwood__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--service-grid-gap-3);
  align-items: stretch;
}
/* 左列：見出し・ロゴの下に写真（PC・タブレット共通。スマホは下の max-width ブロック） */
.service-dogwood__col--split {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: flex-start;
  gap: clamp(1rem, 2.5vw, 1.75rem);
  min-height: 0;
  height: 100%;
}
.service-dogwood__col--split .service-dogwood__col-head {
  flex: 0 0 auto;
  width: 100%;
  min-width: 0;
}
/* 共通 _service-shared の正方形 aspect を解除し、余白を写真で埋める（PCの3列同士の高さ揃え） */
.service-dogwood__col--split .service-dogwood__photo-wrap {
  flex: 1 1 0;
  min-width: 0;
  min-height: 0;
  width: 100%;
  aspect-ratio: auto;
}
.service-dogwood__col-head {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.service-dogwood__title {
  margin: 0 0 1rem;
}
.service-dogwood__brand {
  display: block;
  width: 100%;
  max-width: 300px;
  height: auto;
}
.service-dogwood__col--story {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  min-height: 0;
  height: 100%;
}
.service-dogwood__lead {
  margin: 0;
}
.service-dogwood__body {
  margin: 0;
}
/* 写真＋ボタンを行の下に揃える（画像とボタンの間隔は gap のみ） */
.service-dogwood__col--cta {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
  gap: clamp(1.25rem, 2.5vw, 2rem);
  min-height: 0;
  width: 100%;
  height: auto;
  align-self: end;
}
.service-dogwood__col--cta .service-dogwood__photo-wrap {
  flex-shrink: 0;
}
/*
 * 共通 .service-block__cta の padding: 18px 11rem は狭い列では幅を食いすぎるため上書き
 */
.service-dogwood__col--cta .service-block__cta {
  align-self: stretch;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
  padding-block: 16px;
  padding-inline: clamp(1.25rem, 3vw, 2.25rem);
}
/*
 * タブレット：3 列 1 行（左＝縦積み／中央＝写真＋文／右＝写真＋CTA）。
 * 右列（3 番目）はグリッド行内で下揃え（align-self: end）。
 */
@media (min-width: 768px) and (max-width: 1023px) {
  .service-dogwood {
    padding-inline: clamp(1.25rem, 5vw, 4rem);
  }

  /* 3 列・split の縦積みはベースと同じなので列グリッド定義は省略し gap のみ上書き */
  .service-dogwood__grid {
    gap: clamp(1.25rem, 3vw, 2.5rem);
  }

  .service-dogwood__title {
    font-size: 1.6rem;
  }

  .service-dogwood__lead {
    font-size: clamp(1rem, 1.65vw, 1.35rem);
  }

  .service-dogwood__col--cta {
    align-self: end;
    height: auto;
    align-items: center;
    justify-content: flex-start;
    gap: clamp(1.25rem, 2.5vw, 2rem);
  }

  .service-dogwood__col--cta .service-dogwood__photo-wrap {
    align-self: stretch;
    width: 100%;
    max-width: 100%;
  }

  .service-dogwood__col--cta .service-block__cta {
    align-self: center;
    width: auto;
    max-width: min(100%, 22rem);
    min-width: min(100%, 250px);
  }
}
/* PC・タブレット（3 列）：行高が確定する幅向けに左の写真に最低高さ */
@media (min-width: 768px) {
  .service-dogwood__col--split .service-dogwood__photo-wrap {
    min-height: 12rem;
  }
}
/* スマホ：1列目ブロック（見出し＋写真1）の下に、写真2・写真3を2列で並べる */
@media (max-width: 767px) {
  .service-dogwood__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 0.75rem;
    row-gap: 2rem;
  }

  .service-dogwood__col--story,
  .service-dogwood__col--cta {
    display: contents;
  }

  .service-dogwood__col--split {
    grid-column: 1 / -1;
    grid-row: 1;
    flex-direction: column;
    align-items: stretch;
  }

  .service-dogwood__col--story > .service-dogwood__photo-wrap {
    grid-column: 1;
    grid-row: 2;
  }

  .service-dogwood__col--cta > .service-dogwood__photo-wrap {
    grid-column: 2;
    grid-row: 2;
  }

  .service-dogwood__lead {
    grid-column: 1 / -1;
    grid-row: 3;
  }

  .service-dogwood__body {
    grid-column: 1 / -1;
    grid-row: 4;
  }

  .service-dogwood__col--cta > .service-block__cta {
    grid-column: 1 / -1;
    grid-row: 5;
    justify-self: center;
  }
}
/*
 * トップの新着（.home-news）→ 新着テンプレ（一覧・個別）→ トップ専用モバイル上書き
 * 元: _home-news.css + _news.css + _home.css（モバイルのみ）
 */
/* トップ：service-dogwood と 新着 のあいだのフル幅バナー */
.home-bnnr {
  padding: 8rem 0;
  margin: 0 auto;
  max-width: var(--service-inner-max);
}
.home-bnnr__inner {
  margin: 0 auto;
  max-width: 100%;
}
.home-bnnr__img {
  display: block;
  width: 70%;
  height: auto;
  margin-left: auto;
  margin-right: auto;
  border-radius: clamp(8px, 1.2vw, 16px);
}
.home-news {
  padding: var(--service-section-padding);
  background-color: #faf8f4;
  background-image: url("../images/bg.jpg");
  background-repeat: repeat;
  background-position: 0 0;
}
.home-news__inner {
  max-width: var(--service-inner-max);
  margin: 0 auto;
}
.home-news__heading {
  margin: 0 0 clamp(2rem, 4vw, 3rem);
  font-size: var(--home-service-title-fs);
  font-weight: 700;
  letter-spacing: var(--home-service-title-letter-spacing);
  line-height: var(--home-service-title-line-height);
  text-align: center;
  color: var(--home-service-title-color);
}
.home-news__list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6rem;
  margin: 0;
  padding: 0;
  list-style: none;
}
.home-news__card {
  display: flex;
  flex-direction: column;
  height: 100%;
  background: #fff;
  border-radius: 6px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06);
  overflow: hidden;
}
.home-news__thumb {
  position: relative;
  aspect-ratio: 16 / 10;
  overflow: hidden;
  background: #e8e6e0;
}
.home-news__thumb--placeholder {
  min-height: 140px;
}
.home-news__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.home-news__body {
  display: flex;
  flex-direction: column;
  flex: 1;
  gap: 1rem;
  padding: 2rem 2rem 2rem;
}
.home-news__title {
  margin: 0;
  font-size: 2rem;
  font-weight: var(--home-service-card-title-fw);
  line-height: var(--home-service-card-title-lh);
}
.home-news__title a {
  color: #333;
  text-decoration: none;
}
.home-news__title a:hover {
  color: var(--color-primary);
}
.home-news__excerpt {
  margin: 0;
  font-size: var(--home-service-body-fs);
  font-weight: var(--home-service-body-fw);
  line-height: var(--home-service-body-lh);
  color: var(--home-service-body-color);
  flex: 1;
}
.home-news__more {
  font-size: 16px;
  font-weight: 600;
  color: var(--color-primary);
  text-decoration: none;
  align-self: flex-start;
}
.home-news__more:hover {
  text-decoration: underline;
}
.home-news__meta {
  margin-top: auto;
  padding: 1.125rem 1.25rem 1.25rem;
  border-top: 1px solid #e5e5e5;
}
.home-news__meta time {
  display: inline-block;
  font-size: 16px;
  line-height: 1.5;
  color: #999;
}
.home-news__empty {
  margin: 0;
  padding: 2rem 1rem;
  text-align: center;
  color: var(--color-text-muted);
  font-size: 0.95rem;
}
.home-news__footer {
  display: flex;
  justify-content: center;
  margin-top: 8rem;
}
@media (max-width: 1023px) {
  .home-news__list {
    grid-template-columns: 1fr;
    gap: clamp(1.5rem, 3vw, 2rem);
    max-width: 420px;
    margin-left: auto;
    margin-right: auto;
  }
}
/* 新着情報：一覧（home / archive）・個別（single）— 元 blocks/_news.css */
.news-archive__description {
  margin: 0 0 clamp(2rem, 4vw, 3rem);
  font-size: var(--home-service-body-fs);
  line-height: var(--home-service-body-lh);
  color: var(--home-service-body-color);
}
.news-archive__description p:last-child {
  margin-bottom: 0;
}
.news-archive__list {
  margin-top: 0;
}
.news-archive__empty {
  margin: 0;
  padding: 2rem 1rem;
  text-align: center;
  color: var(--color-text-muted);
  font-size: 0.95rem;
}
/* ページネーション（the_posts_pagination） */
.news-archive .navigation.pagination {
  margin-top: clamp(3rem, 6vw, 5rem);
  padding-top: 2rem;
  border-top: 1px solid #e5e5e5;
}
.news-archive .nav-links {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.75rem 1.25rem;
}
.news-archive .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.75rem;
  min-height: 2.75rem;
  padding: 0 0.75rem;
  font-size: 1.5rem;
  font-weight: 600;
  line-height: 1.2;
  color: #333;
  text-decoration: none;
  border-radius: 6px;
  transition: color 0.2s ease, background-color 0.2s ease;
}
.news-archive .page-numbers:hover,
.news-archive .page-numbers:focus-visible {
  color: var(--color-primary);
  background-color: rgba(0, 0, 0, 0.04);
  outline: none;
}
.news-archive .page-numbers.current {
  color: #fff;
  background-color: var(--color-primary);
  pointer-events: none;
}
.news-archive .page-numbers.dots {
  min-width: auto;
  background: transparent;
  pointer-events: none;
}
@media (max-width: 767px) {
  body.is-subpage .news-single .subpage__label {
    font-size: clamp(1.125rem, 3.8vw, 1.35rem);
  }
}
.news-single__title {
  margin: 0 0 clamp(0.5rem, 1.25vw, 0.75rem);
  max-width: 52rem;
  font-family: var(--font-noto-sans-jp), sans-serif;
  font-size: clamp(1.5rem, 3.5vw, 2.25rem);
  font-weight: 700;
  letter-spacing: 0.04em;
  line-height: 1.45;
  color: var(--color-primary);
  text-align: left;
}
.news-single__meta {
  margin: 0 0 clamp(2rem, 4vw, 3rem);
  text-align: left;
}
.news-single__meta time {
  font-size: clamp(1.25rem, 2.1vw, 1.625rem);
  line-height: 1.5;
  letter-spacing: 0.02em;
  color: #888;
}
.news-single__figure {
  margin: 0 0 clamp(1.5rem, 3vw, 2.25rem);
}
.news-single__image {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 8px;
}
.news-single__content {
  margin: 0;
  padding: 0;
  font-family: var(--font-noto-sans-jp), sans-serif;
  font-size: clamp(16px, 1.8vw, 18px);
  font-weight: 400;
  line-height: 1.9;
  color: var(--color-body);
}
.news-single__content > *:first-child {
  margin-top: 0;
}
.news-single__content > *:last-child {
  margin-bottom: 0;
}
.news-single__content p {
  margin: 0 0 1.5em;
}
.news-single__content a {
  color: var(--color-primary);
  text-decoration: underline;
  text-underline-offset: 0.2em;
}
.news-single__content a:hover {
  opacity: 0.85;
}
.news-single__content h2,
.news-single__content h3,
.news-single__content h4 {
  margin: 1.75em 0 0.75em;
  font-weight: 700;
  line-height: 1.35;
  color: var(--color-primary);
}
.news-single__content h2 {
  font-size: clamp(1.35rem, 2.5vw, 1.6rem);
}
.news-single__content h3 {
  font-size: clamp(1.2rem, 2vw, 1.4rem);
}
.news-single__content ul,
.news-single__content ol {
  margin: 0 0 1.5em;
  padding-left: 1.5em;
}
.news-single__content li {
  margin-bottom: 0.35em;
}
.news-single__content img {
  max-width: 100%;
  height: auto;
}
.news-single__content .wp-block-image {
  margin: 2rem 0;
}
.news-single__pages {
  margin: 2.5rem 0 0;
  padding-top: 1.5rem;
  border-top: 1px solid #e5e5e5;
}
.news-single__pages-inner {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.35rem 0.5rem;
}
.news-single__pages-label {
  margin: 0;
  font-size: 1.4rem;
  font-weight: 600;
  color: var(--color-primary);
}
.news-single__pages .post-page-numbers {
  display: inline-block;
  margin-right: 0.35rem;
  font-weight: 600;
}
/* the_post_navigation */
.news-single__post-nav {
  margin-top: clamp(2.5rem, 5vw, 4rem);
  padding-top: 2rem;
  border-top: 1px solid #e5e5e5;
}
.news-single__post-nav .nav-links {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.news-single__post-nav .nav-previous a,
.news-single__post-nav .nav-next a {
  display: inline-block;
  font-size: 1.5rem;
  font-weight: 600;
  color: var(--color-primary);
  text-decoration: none;
}
.news-single__post-nav .nav-previous a:hover,
.news-single__post-nav .nav-next a:hover {
  text-decoration: underline;
}
@media (min-width: 768px) {
  .news-single__post-nav .nav-links {
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-start;
  }

  .news-single__post-nav .nav-next {
    margin-left: auto;
    text-align: right;
  }
}
.news-single__back {
  margin: clamp(2.5rem, 5vw, 4rem) 0 0;
  text-align: center;
}
/* トップページ（front-page）スマホでのサービス／新着のレイアウト調整 — body.home のみ */
@media (max-width: 767px) {
  body.home .hero {
    margin-top: 0;
    margin-bottom: 3rem;
    padding: 16px max(20px, env(safe-area-inset-left, 0px)) 2rem
      max(20px, env(safe-area-inset-right, 0px));
    min-height: 0;
  }

  body.home .hero__media {
    max-height: min(52vh, 380px);
    border-radius: 8px;
    overflow: hidden;
  }

  /* 各サービス／新着の塊が区切れるよう上下を広めに */
  body.home .service-hospital,
  body.home .service-salon,
  body.home .service-dogwood,
  body.home .home-news {
    padding: 4rem max(20px, env(safe-area-inset-left, 0px)) 4rem
      max(20px, env(safe-area-inset-right, 0px));
  }

  body.home .home-bnnr {
    padding: 8rem 0;
  }

  body.home .service-salon,
  body.home .service-dogwood,
  body.home .home-news {
    border-top: 1px solid rgba(0, 0, 0, 0.07);
  }

  body.home .service-hospital {
    border-top: 1px solid rgba(0, 0, 0, 0.06);
  }

  body.home .service-hospital__text {
    text-align: center;
  }

  body.home .service-hospital__label,
  body.home .service-hospital__title,
  body.home .service-hospital__lead,
  body.home .service-hospital__body {
    text-align: left;
  }

  body.home .service-hospital__grid {
    gap: 2.5rem;
  }

  body.home .service-hospital__label {
    margin-bottom: 0.75rem;
  }

  body.home .service-hospital__text .service-block__cta {
    margin-top: 0.75rem;
  }

  /*
   * 動物病院ブロック：DOM は テキスト → 川平 → いもざわ。
   * スマホでは いもざわ → 川平 の順に見せる。
   */
  body.home .service-hospital__grid > .service-hospital__text {
    order: 1;
  }

  body.home .service-hospital__grid > .service-hospital__figure--align-end {
    order: 2;
  }

  body.home .service-hospital__grid > .service-hospital__figure--align-start {
    order: 3;
  }

  body.home .service-salon__grid {
    gap: 2.25rem;
  }

  /* オンラインサロン / オンラインショップのテキスト塊の境界 */
  body.home .service-salon__grid > .service-salon__text + .service-salon__text {
    margin-top: 0.5rem;
    padding-top: 2rem;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
  }

  body.home .service-salon__visual {
    max-width: none;
    width: 100%;
  }

  body.home .service-salon__cta-row {
    margin-top: 2.5rem;
    padding-top: 2rem;
    border-top: 1px solid rgba(0, 0, 0, 0.08);
  }

  body.home .service-dogwood__grid {
    gap: 2.5rem;
  }

  body.home .service-dogwood__col-head {
    align-items: center;
    text-align: center;
  }

  body.home .service-dogwood__brand {
    margin-left: auto;
    margin-right: auto;
  }

  body.home .service-dogwood__lead {
    margin-top: 0.25rem;
    margin-bottom: 1rem;
    text-align: left;
  }

  body.home .service-dogwood__body {
    text-align: left;
  }

  body.home .service-dogwood__col--split .service-dogwood__col-head {
    padding-bottom: 0.5rem;
  }

  body.home .service-dogwood__col--cta .service-block__cta {
    margin-top: 0.5rem;
  }

  body.home .home-news__heading {
    margin-bottom: 2rem;
  }

  body.home .home-news__list {
    max-width: none;
    width: 100%;
    gap: 1.5rem;
  }

  body.home .home-news__body {
    padding: 1.5rem 1.25rem 1.5rem;
  }

  body.home .home-news__meta {
    padding: 1.25rem 1.25rem 1.35rem;
  }

  body.home .home-news__footer {
    margin-top: 3rem;
  }
}
/* --- フッター・下層レイアウト・各ページ --- */
/* develop/html/index.html のフッターと同一クラス（styles.css 準拠） */
.section-contact-split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  margin: 0;
}
.contact-col {
  text-align: center;
  padding: 40px 24px 36px;
}
.contact-col--mail {
  background: var(--color-mail-bg);
}
.contact-col--tel {
  background: var(--color-tel-bg);
}
.contact-col h2 {
  margin: 0 0 20px;
  font-family: var(--font-noto-sans-jp), sans-serif;
  font-size: 24px;
  font-weight: 700;
  letter-spacing: 2px;
  color: var(--color-yellow);
}
.contact-col .btn-yellow {
  display: inline-block;
  padding: 14px 28px;
  border-radius: 30px;
  font-family: var(--font-noto-sans-jp), sans-serif;
  font-size: 26px;
  font-weight: 700;
  color: var(--color-accent);
  text-decoration: none;
  background: var(--color-yellow);
  transition: opacity 0.2s ease;
}
.contact-col .btn-yellow:hover {
  color: var(--color-accent);
  opacity: 0.95;
}
.contact-col--tel .tel {
  display: block;
  margin: 0;
  font-family: var(--font-noto-sans-jp), sans-serif;
  font-size: 40px;
  font-weight: 700;
  color: var(--color-yellow);
}
.footer_tel {
  padding: 0;
  margin: 0;
}
.footer_tel::before {
  content: "";
  display: inline-block;
  width: 1em;
  height: 1em;
  margin: 0 6px 0 0;
  vertical-align: -0.12em;
  background: var(--kizunaen-icon-phone-y, url("../images/icons/phone_y.svg"))
    center / contain no-repeat;
}
.contact-col--tel .tel-sub {
  margin: 8px 0 0;
  font-size: 14px;
  color: var(--color-yellow);
}
.footer-main .container {
  width: 100%;
  max-width: var(--container-max);
  margin: 0 auto;
  padding: 0 20px;
}
.footer-main {
  padding: 50px 0;
  background: var(--color-accent);
}
.footer-grid {
  display: grid;
  /* 左 / 中央 / 右（外部リンク）— 3列時は右をやや広く（768px+ で上書き） */
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(1.5rem, 3vw, 2.5rem);
  align-items: start;
}
.footer-grid > * {
  min-width: 0;
}
/* 3列時：右カラムを広め・列間を詰めて LINK を折り返さない */
@media (min-width: 768px) {
  .footer-grid {
    grid-template-columns: minmax(0, 1fr) minmax(0, 0.92fr) minmax(0, 1.35fr);
    gap: clamp(1.25rem, 2.5vw, 2rem) clamp(0.6rem, 1.2vw, 1.1rem);
  }

  .footer-links a,
  .footer-links .footer-links__label {
    white-space: nowrap;
    overflow-wrap: normal;
  }
}
/* タブレット：お問い合わせ帯は2列のままタイポ調整／フッターも3等分の3列 */
@media (min-width: 768px) and (max-width: 1023px) {
  .contact-col {
    padding: 32px 20px 28px;
  }

  .contact-col h2 {
    margin-bottom: 16px;
    font-size: 20px;
    letter-spacing: 1.5px;
  }

  .contact-col .btn-yellow {
    padding: 12px 24px;
    font-size: 21px;
  }

  .contact-col--tel .tel {
    font-size: 34px;
  }

  .contact-col--tel .tel-sub {
    font-size: 13px;
  }

  .footer-main {
    padding: 44px 0;
  }

  .footer-main .container {
    padding: 0 clamp(16px, 3vw, 24px);
  }

  .footer-grid {
    gap: clamp(0.75rem, 2vw, 1.5rem) clamp(0.45rem, 1vw, 0.85rem);
  }

  .footer-brand img {
    max-width: min(180px, 46vw);
  }

  .footer-address {
    line-height: 1.55;
  }

  .footer-nav a {
    padding: 4px 0;
    letter-spacing: 0.5px;
  }

  .footer-links li {
    margin-bottom: 8px;
  }

  .footer-links a,
  .footer-links .footer-links__label {
    letter-spacing: 0.02em;
  }

  .footer-copy {
    padding: 10px 16px 18px;
  }
}
.footer-brand img {
  width: 52%;
  max-width: 220px;
  height: auto;
}
.footer-address {
  margin-top: 16px;
  color: #fff;
  font-size: 1.4rem;
  font-weight: 500;
  line-height: 1.6;
  overflow-wrap: anywhere;
}
.footer-address p {
  margin: 0 0 8px;
}
.nolink {
  color: inherit;
  pointer-events: none;
  cursor: default;
  text-decoration: none;
}
.footer-nav ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
.footer-nav a {
  display: block;
  padding: 8px 0;
  font-family: var(--font-noto-sans-jp), sans-serif;
  font-size: 1.4rem;
  font-weight: 500;
  letter-spacing: 2px;
  color: #fff;
  text-decoration: none;
  transition: color 0.2s ease;
  overflow-wrap: anywhere;
}
.footer-nav a:hover {
  color: var(--color-yellow);
}
.footer-links ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
.footer-links li {
  margin-bottom: 16px;
}
.footer-links a,
.footer-links .footer-links__label {
  font-family: var(--font-noto-sans-jp), sans-serif;
  font-size: 1.4rem;
  font-weight: 500;
  color: #fff;
  overflow-wrap: anywhere; /* スマホ1列時は長いURL等を折り返す */
}
.footer-links a {
  text-decoration: none;
  transition: color 0.2s ease;
}
.footer-links a:hover {
  color: var(--color-yellow);
}
.footer-copy {
  padding: 12px 16px 20px;
  background: var(--color-footer-deep);
  color: #fff;
  font-size: 1.4rem;
  text-align: center;
}
.footer-copy p {
  margin: 0;
}
@media (max-width: 767px) {
  .section-contact-split {
    grid-template-columns: 1fr;
  }

  .contact-col .btn-yellow {
    font-size: 18px;
  }

  .contact-col--tel .tel {
    font-size: 30px;
  }

  .footer-grid {
    grid-template-columns: 1fr;
    gap: 32px;
  }

  .footer-grid > * {
    min-width: 0;
  }

  .footer-address p,
  .footer-address .nolink,
  .footer-nav a,
  .footer-links a,
  .footer-links .footer-links__label {
    white-space: normal;
  }

  .footer-main {
    padding: 40px 0;
  }

  .footer-main .container {
    overflow-x: visible;
  }
}
/* 下層固定ページ共通：ラッパー・ヒーロー見出し・白パネル（ABOUT / COMPANY 等） */
.subpage {
  padding: 0 0 16rem;
  max-width: var(--container-max);
  margin: 0 auto;
  padding-left: clamp(1.25rem, 4vw, 2rem);
  padding-right: clamp(1.25rem, 4vw, 2rem);
}
.subpage__inner {
  max-width: 1140px;
  margin: 0 auto;
}
.subpage__panel {
  display: flow-root;
  background: #fff;
  border-radius: 32px;
  box-shadow: 6px 6px 23px 4px rgba(0, 0, 0, 0.2);
  padding: 8rem 8rem 8rem;
}
/* タブレット：パネル内の左右余白をデフォルト（8rem）よりやや広げる */
@media (min-width: 768px) and (max-width: 1023px) {
  .subpage {
    padding-left: 2rem;
    padding-right: 2rem;
    padding-bottom: 8rem;
  }

  .subpage__panel {
    padding-top: 7.5rem;
    padding-bottom: 7.5rem;
    padding-left: 2rem;
    padding-right: 2rem;
  }
}
.subpage__header {
  text-align: center;
  margin-bottom: clamp(2rem, 4vw, 8rem);
}
.subpage__label {
  margin: 0 0 8px;
  font-family: var(--font-noto-sans-jp), sans-serif;
  font-size: 20px;
  font-weight: 500;
  letter-spacing: 2px;
  color: var(--color-primary);
}
.subpage__title {
  margin: 0;
  font-family: var(--font-montserrat), sans-serif;
  font-size: clamp(42px, 6vw, 56px);
  font-weight: 800;
  letter-spacing: 0.08em;
  line-height: 1.15;
  color: var(--color-primary);
}
/*
 * 下層固定ページ共通（スマホ）
 * ABOUT / COMPANY / pet-* など .subpage を使うページはここで同じ値に揃える
 */
:root {
  --subpage-mobile-padding-bottom: 4rem;
  --subpage-mobile-header-margin-bottom: 1.75rem;
  --subpage-mobile-label-fs: 16px;
  --subpage-mobile-label-letter-spacing: 1.5px;
  --subpage-mobile-title-fs: clamp(2rem, 10vw, 2.75rem);
  --subpage-mobile-title-letter-spacing: 0.06em;
  --subpage-mobile-panel-padding: 4rem 1.25rem 4rem;
  --subpage-mobile-panel-radius: 16px;
  --subpage-mobile-panel-shadow: 0 4px 24px rgba(0, 0, 0, 0.12);
}
@media (max-width: 767px) {
  body.is-subpage .subpage {
    padding: 0 0 var(--subpage-mobile-padding-bottom);
    padding-left: max(16px, env(safe-area-inset-left, 0px));
    padding-right: max(16px, env(safe-area-inset-right, 0px));
  }

  body.is-subpage .subpage__header {
    margin-bottom: var(--subpage-mobile-header-margin-bottom);
  }

  body.is-subpage .subpage__label {
    font-size: var(--subpage-mobile-label-fs);
    letter-spacing: var(--subpage-mobile-label-letter-spacing);
  }

  body.is-subpage .subpage__title {
    font-size: var(--subpage-mobile-title-fs);
    letter-spacing: var(--subpage-mobile-title-letter-spacing);
  }

  body.is-subpage .subpage__panel {
    padding: var(--subpage-mobile-panel-padding);
    border-radius: var(--subpage-mobile-panel-radius);
    box-shadow: var(--subpage-mobile-panel-shadow);
  }
}
/* 企業情報ページ — kizuna-en.com/company/（Elementor 系）に近づける */
.page-company-page {
  /* ページ内スクロール到達時の上余白（セクションの scroll-margin と JS で共通） */
  --company-anchor-offset: clamp(1.75rem, 5vw, 6rem);
  /* 左ナビ列の幅（狭めたいときは % を下げる） */
  --company-side-nav-col: minmax(96px, 18%);
  /* 会社概要・沿革・お問い合わせ（CF7）の表ラベル列（th） */
  --company-table-label-width: 28%;
  --company-table-label-min-width: 96px;
  /* 表の横罫線（overview / CF7 共通） */
  --company-table-line: #e0e0e0;
}
/* ラッパー・ヒーロー・白パネルは _subpage.css の .subpage / .subpage__* */
/* 目次：中央・中黒区切り（本番のリスト風） */
.page-company__toc {
  margin-bottom: clamp(3rem, 5vw, 4.5rem);
}
.page-company__toc-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 0 0;
  margin: 0;
  padding: 0;
  list-style: none;
  font-family: var(--font-noto-sans-jp), sans-serif;
  font-size: 16px;
  font-weight: 600;
  color: var(--color-body);
}
.page-company__toc-list li {
  display: inline-flex;
  align-items: center;
}
.page-company__toc-list li:not(:last-child)::after {
  content: "・";
  margin: 0 0.35rem;
  color: var(--color-primary);
  font-weight: 700;
}
.page-company__toc-list a {
  color: var(--color-primary);
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: border-color 0.2s ease, opacity 0.2s ease;
}
.page-company__toc-list a:hover,
.page-company__toc-list a:focus-visible {
  border-bottom-color: var(--color-primary);
  opacity: 0.9;
}
.page-company__video-wrap {
  margin: 0 0 8rem;
  overflow: hidden;
  border-radius: 12px;
}
.page-company__video {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
/* 動画下：左ナビ + 右メイン */
.page-company__layout {
  display: grid;
  grid-template-columns: var(--company-side-nav-col) minmax(0, 1fr);
  gap: clamp(1.5rem, 4vw, 3.5rem);
  align-items: start;
  /* margin-top は動画の margin-bottom と相殺されるため padding で確保 */
  padding-top: clamp(0.5rem, 2vw, 1rem);
  padding-right: clamp(0.5rem, 3vw, 2.5rem);
  padding-bottom: 0;
  padding-left: clamp(0.5rem, 3vw, 2.5rem);
}
/* sticky 時もビューポート上端から余白（セクションのアンカー余白と揃える） */
.page-company__side-nav {
  position: sticky;
  top: calc(var(--company-anchor-offset) + env(safe-area-inset-top, 0px));
}
body.admin-bar .page-company-page .page-company__side-nav {
  top: calc(
    var(--company-anchor-offset) + env(safe-area-inset-top, 0px) + 32px
  );
}
/* WordPress 管理バー高さ（レイアウトの 3 段階ブレイクポイントとは別） */
@media screen and (max-width: 782px) {
  body.admin-bar .page-company-page .page-company__side-nav {
    top: calc(
      var(--company-anchor-offset) + env(safe-area-inset-top, 0px) + 46px
    );
  }
}
.page-company__side-nav-list {
  display: flex;
  flex-direction: column;
  gap: 1.35rem;
  margin: 0;
  padding: 0;
  list-style: none;
  font-family: var(--font-noto-sans-jp), sans-serif;
  font-size: 15px;
  font-weight: 500;
  line-height: 1.45;
  color: #8a8a8a;
}
.page-company__side-nav-list a {
  color: #8a8a8a;
  text-decoration: none;
  transition: color 0.2s ease;
}
.page-company__side-nav-list a:hover,
.page-company__side-nav-list a:focus-visible {
  color: var(--color-primary);
}
.page-company__main {
  min-width: 0;
}
.page-company__section {
  scroll-margin-top: calc(
    var(--company-anchor-offset) + env(safe-area-inset-top, 0px)
  );
}
/* セクション見出し（会社概要・沿革・お問い合わせの h2 共通） */
.page-company__section-title {
  margin: 8rem 0 clamp(1.75rem, 3vw, 2.25rem);
  padding: 0;
  border: none;
  text-align: center;
  font-family: var(--font-noto-sans-jp), sans-serif;
  font-size: clamp(26px, 3.5vw, 32px);
  font-weight: 600;
  letter-spacing: 0.06em;
  line-height: 1.35;
  color: var(--color-primary);
}
/* 表：モック風（横罫線のみ・ラベル薄グレー） */
.page-company__table-wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  margin: 0;
  padding: 0;
}
.page-company__table {
  width: 100%;
  min-width: 280px;
  border-collapse: collapse;
  font-family: var(--font-noto-sans-jp), sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.75;
  color: var(--color-body);
  background: #fff;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
}
.page-company__table--overview {
  table-layout: fixed;
  box-shadow: none;
  background: transparent;
}
/* 横罫線は行単位（th/td 両方の下線を重ねない）— スマホでは @media で別定義し二重線を防ぐ */
@media (min-width: 768px) {
  .page-company__table--overview tbody tr > * {
    padding: clamp(14px, 2.5vw, 20px) 0;
    border: none;
    border-bottom: 1px solid var(--company-table-line);
    text-align: left;
    vertical-align: top;
    background: transparent;
  }

  .page-company__table--overview tbody tr:first-child > * {
    border-top: 1px solid var(--company-table-line);
  }

  .page-company__table--overview tbody tr:last-child > * {
    border-bottom: none;
  }
}
.page-company__table--overview th {
  width: var(--company-table-label-width);
  min-width: var(--company-table-label-min-width);
  font-weight: 500;
  color: #9a9a9a;
  white-space: nowrap;
}
.page-company__table--overview td {
  color: #333;
}
/* 沿革：左列幅を会社概要テーブル（ラベル列）に合わせる */
.page-company__table--history.page-company__table--overview th {
  width: var(--company-table-label-width);
  min-width: var(--company-table-label-min-width);
  text-align: left;
  white-space: nowrap;
}
/* レガシー：overview 未使用の表（フォールバック） */
.page-company__table:not(.page-company__table--overview) th,
.page-company__table:not(.page-company__table--overview) td {
  padding: 16px 20px;
  border: 1px solid var(--company-table-line);
}
.page-company__table:not(.page-company__table--overview) th {
  width: 200px;
  min-width: 140px;
  background: #fafafa;
  font-weight: 600;
  color: var(--color-primary);
  white-space: nowrap;
}
.page-company__table:not(.page-company__table--overview) td {
  background: #fff;
  color: var(--color-body);
}
.page-company__biz-line {
  margin: 0 0 12px;
}
.page-company__cell--biz .page-company__biz-line:last-child {
  margin-bottom: 0;
}
/* 事業内容：本番同様インラインリンクを並べる */
.page-company__cell--biz .page-company__biz-line a + a {
  margin-left: 0.35em;
}
.page-company__biz-line--links a {
  display: inline;
  margin-right: 0.35em;
  white-space: normal;
}
.page-company__table a {
  color: var(--color-link);
  text-decoration: none;
  text-underline-offset: 3px;
}
.page-company__table a:hover {
  opacity: 0.85;
}
.page-company__table a.page-company__cta {
  color: #fff;
  text-decoration: none;
}
.page-company__table a.page-company__cta:hover {
  opacity: 0.92;
}
.page-company__cta-wrap {
  margin: clamp(2rem, 4vw, 2.75rem) 0 0;
}
/* 連絡先セル：電話番号の直下 */
.page-company__cta-wrap--after-tel {
  margin: clamp(0.65rem, 2vw, 1rem) 0 0;
}
.page-company__cta {
  display: inline-block;
  padding: 4px 12px;
  border-radius: 999px;
  font-family: var(--font-noto-sans-jp), sans-serif;
  font-size: 14px;
  font-weight: 600;
  color: #fff;
  text-decoration: none;
  background: var(--color-primary);
  transition: opacity 0.2s ease;
}
.page-company__cta:hover,
.page-company__cta:focus-visible {
  opacity: 0.92;
}
/* お問い合わせ */
.page-company__section--form {
  margin-top: clamp(2.25rem, 5vw, 3.5rem);
}
.page-company__form {
  /* CF7 のラベル列（最長ラベルが1行に収まる幅＋ nowrap は 768px 以上） */
  --company-form-label-width: 32%;
  --company-form-label-min-width: 11em;
  --company-form-cell-py: clamp(14px, 2.5vw, 20px);
  --company-form-cell-pt-gap: clamp(1.5rem, 4vw, 2.25rem);
  --company-form-wrap-stack: 6px 0 12px;
  --company-form-wrap-table: 0;
  width: 100%;
  max-width: 800px;
  margin-left: auto;
  margin-right: auto;
  padding: 0 0 clamp(2rem, 4vw, 2.5rem);
  background: #fff;
  border-radius: 4px;
  box-sizing: border-box;
}
/* Contact Form 7 */
.page-company__form .wpcf7 {
  font-size: 16px;
  color: var(--color-body);
}
/* CF7 table：会社概要・沿革と同じ（横罫線・左ラベル薄グレー / 右 #333） */
.page-company__form .wpcf7-form table {
  width: 100%;
  min-width: 280px;
  table-layout: fixed;
  border-collapse: collapse;
  font-family: var(--font-noto-sans-jp), sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.75;
  color: var(--color-body);
  background: transparent;
  box-shadow: none;
}
.page-company__form .wpcf7-form table :is(th, td) {
  padding: var(--company-form-cell-py) 0;
  border: none;
  text-align: left;
  vertical-align: middle;
  background: transparent;
}
@media (min-width: 768px) {
  .page-company__form .wpcf7-form table tbody tr:first-child > :is(th, td) {
    border-top: 1px solid var(--company-table-line);
  }

  .page-company__form
    .wpcf7-form
    table
    tbody
    tr:not(:first-child)
    > :is(th, td) {
    padding-top: var(--company-form-cell-pt-gap);
  }

  .page-company__form .wpcf7-form table tbody tr > td:not(:first-child),
  .page-company__form .wpcf7-form table tbody tr > th + td {
    width: auto;
    min-width: 0;
  }

  .page-company__form .wpcf7-form table th,
  .page-company__form .wpcf7-form table tr > td:first-child:has(> label) {
    white-space: nowrap;
  }

  .page-company__form .wpcf7-form table th label,
  .page-company__form .wpcf7-form table tr > td:first-child:has(> label) label {
    white-space: nowrap;
  }
}
.page-company__form .wpcf7-form table th,
.page-company__form .wpcf7-form table tr > td:first-child:has(> label) {
  width: var(--company-form-label-width);
  min-width: var(--company-form-label-min-width);
  padding-right: 12px;
  box-sizing: border-box;
  font-weight: 500;
  color: #9a9a9a;
  white-space: normal;
}
.page-company__form .wpcf7-form table td {
  color: #333;
}
.page-company__form .wpcf7-form table th label,
.page-company__form .wpcf7-form table tr > td:first-child:has(> label) label {
  display: inline;
  margin: 0;
  font-weight: 500;
  color: #9a9a9a;
  white-space: normal;
}
/* 同意チェック行：上記より後に置き、ラベル色・余白を上書き（詳細度で打ち消し不要に） */
.page-company__form .wpcf7-form table tbody tr:has(.wpcf7-acceptance) label {
  display: inline;
  margin: 0;
  font-weight: 400;
  color: var(--color-body);
  white-space: normal;
}
.page-company__form .wpcf7-form table td[colspan] {
  width: auto;
}
/* 表の外（段落など）のラベルのみ：テーブル内ラベルと打ち消し合わないよう table を除外 */
.page-company__form .wpcf7-form > p label {
  display: block;
  margin: 0 0 6px;
  font-weight: 600;
  color: #333;
}
.page-company__form .wpcf7-form-control-wrap {
  display: block;
  margin: var(--company-form-wrap-stack);
}
.page-company__form .wpcf7-form table td .wpcf7-form-control-wrap {
  margin: var(--company-form-wrap-table);
}
.page-company__form .wpcf7-text,
.page-company__form .wpcf7-email,
.page-company__form .wpcf7-tel,
.page-company__form .wpcf7-textarea {
  width: 100%;
  max-width: 100%;
  padding: 12px 14px;
  border: 1px solid #ccc;
  border-radius: 4px;
  font: inherit;
  box-sizing: border-box;
  background: #fff;
  transition: border-color 0.15s ease;
}
.page-company__form .wpcf7-text:focus,
.page-company__form .wpcf7-text:focus-visible,
.page-company__form .wpcf7-email:focus,
.page-company__form .wpcf7-email:focus-visible,
.page-company__form .wpcf7-tel:focus,
.page-company__form .wpcf7-tel:focus-visible,
.page-company__form .wpcf7-textarea:focus,
.page-company__form .wpcf7-textarea:focus-visible {
  border-color: var(--color-primary);
  outline: none;
}
.page-company__form .wpcf7-textarea {
  min-height: 180px;
  resize: vertical;
  line-height: 1.6;
}
.page-company__form .wpcf7-submit {
  display: inline-block;
  min-width: 200px;
  margin-top: 8px;
  padding: 16px 48px;
  border: none;
  border-radius: 30px;
  font-family: var(--font-noto-sans-jp), sans-serif;
  font-size: 18px;
  font-weight: 600;
  color: #fff;
  background: var(--color-primary);
  cursor: pointer;
  transition: opacity 0.2s ease;
}
.page-company__form .wpcf7-submit:hover {
  opacity: 0.92;
}
.page-company__form .wpcf7-acceptance label,
.page-company__form .wpcf7-list-item-label {
  font-weight: 400;
}
.page-company__form .wpcf7-list-item {
  margin-left: 0;
  padding-left: 0;
}
/* destyle の input { appearance: none } によりチェック・ラジオが見えなくなるのを防ぐ */
.page-company__form input[type="checkbox"] {
  appearance: auto;
  -webkit-appearance: checkbox;
  width: 1.125em;
  height: 1.125em;
  margin: 0 0.5em 0 0;
  vertical-align: middle;
  accent-color: var(--color-primary);
}
.page-company__form input[type="radio"] {
  appearance: auto;
  -webkit-appearance: radio;
  width: 1.125em;
  height: 1.125em;
  margin: 0 0.5em 0 0;
  vertical-align: middle;
  accent-color: var(--color-primary);
}
.page-company__form .wpcf7-not-valid-tip {
  margin-top: 6px;
  font-size: 13px;
  color: #c00;
}
.page-company__form .wpcf7-response-output {
  margin: 20px 0 0;
  padding: 12px 14px;
  border-radius: 4px;
  font-size: 14px;
}
.page-company__form .wpcf7-spinner {
  margin-left: 8px;
}
.page-company__form .wpcf7-recaptcha {
  margin: 16px 0;
}
.captcha-info {
  margin-top: 24px;
  font-size: 14px;
  color: #666;
  line-height: 1.5;
}
@media (max-width: 767px) {
  .page-company-page {
    --company-anchor-offset: clamp(1rem, 4vw, 2rem);
  }

  .page-company__toc-list {
    flex-direction: column;
    gap: 10px;
  }

  .page-company__toc-list li:not(:last-child)::after {
    display: none;
  }

  .page-company__video-wrap {
    margin: 0 0 2.5rem;
    border-radius: 8px;
  }

  .page-company__video {
    aspect-ratio: 16 / 9;
    max-height: min(52vh, 320px);
    object-fit: cover;
  }

  .page-company__layout {
    grid-template-columns: 1fr;
    gap: 1.5rem;
    padding: 0;
  }

  .page-company__side-nav {
    position: static;
    padding: 1rem 0 1.25rem;
    margin: 0 0 0.25rem;
  }

  .page-company__side-nav-list {
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.5rem 1rem;
    font-size: 14px;
  }

  .page-company__side-nav-list a {
    display: inline-block;
    padding: 0.35rem 0.15rem;
  }

  .page-company__section-title {
    margin: 2.25rem 0 1.25rem;
    font-size: 2.4rem;
  }

  .page-company__main
    > .page-company__section:first-child
    .page-company__section-title {
    margin-top: 0;
  }

  .page-company__section--form {
    margin-top: 1.5rem;
  }

  /* 会社概要・沿革：overview 表を縦積み。罫線は先頭行の上線 + 各行の下線のみ（セル罫線は 768px 以上のみ） */
  .page-company__table--overview {
    min-width: 0;
  }

  .page-company__table--overview tbody {
    display: block;
    border-top: 0;
  }

  .page-company__table--overview tbody tr {
    display: block;
    padding: 1.25rem 0;
    border-bottom: 1px solid var(--company-table-line);
  }

  .page-company__table--overview tbody tr:first-child {
    border-top: 1px solid var(--company-table-line);
  }

  .page-company__table--overview tbody tr:last-child {
    border-bottom: none;
  }

  .page-company__table--overview tbody tr > th,
  .page-company__table--overview tbody tr > td {
    display: block;
    width: 100%;
    min-width: 0;
    padding: 0;
    border: none;
  }

  .page-company__table--overview tbody tr > th {
    margin-bottom: 0.5rem;
    white-space: normal;
    font-size: 1.4rem;
  }

  .page-company__table--overview tbody tr > td {
    font-size: 1.5rem;
    line-height: 1.7;
  }

  .page-company__table--history.page-company__table--overview tbody tr > th {
    width: 100%;
  }

  /* 事業内容：リンクのタップ領域（上下余白・行全体） */
  .page-company__cell--biz .page-company__biz-line {
    margin-bottom: 1rem;
  }

  .page-company__cell--biz .page-company__biz-line:last-child {
    margin-bottom: 0;
  }

  .page-company__cell--biz .page-company__biz-line a {
    display: inline-block;
    width: 100%;
    max-width: 100%;
    padding: 0.7rem 0;
    box-sizing: border-box;
    line-height: 1.55;
    vertical-align: top;
  }

  .page-company__cell--biz .page-company__biz-line a + a {
    margin-left: 0;
  }

  .page-company__cell--biz .page-company__biz-line--links a {
    display: inline-block;
    width: 100%;
    margin-right: 0;
  }

  .page-company__cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: auto;
    padding: 4px 18px;
    font-size: 15px;
  }

  .page-company__table:not(.page-company__table--overview) th {
    display: block;
    width: 100%;
    min-width: 0;
    white-space: normal;
  }

  .page-company__table:not(.page-company__table--overview) td {
    display: block;
    width: 100%;
    border-top: none;
  }

  .page-company__table:not(.page-company__table--overview) tr {
    display: block;
    margin-bottom: 12px;
    border: 1px solid var(--company-table-line);
    border-radius: 4px;
    overflow: hidden;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04);
  }

  .page-company__table:not(
      .page-company__table--overview
    ).page-company__table--history
    th {
    width: 100%;
    text-align: left;
  }

  /* CF7：縦並び。tr の下線は付けない（先頭行の上線のみ） */
  .page-company__form .wpcf7-form table {
    min-width: 0;
    display: block;
  }

  .page-company__form .wpcf7-form table tbody {
    display: block;
    border-top: 0;
  }

  .page-company__form .wpcf7-form table tbody tr {
    display: block;
    padding: 1.25rem 0;
    border-bottom: none;
  }

  .page-company__form .wpcf7-form table tbody tr:first-child {
    border-top: 1px solid var(--company-table-line);
  }

  .page-company__form
    .wpcf7-form
    table
    tbody
    tr:not(:first-child)
    > :is(th, td) {
    padding-top: 0;
  }

  .page-company__form .wpcf7-form table tbody tr > th,
  .page-company__form .wpcf7-form table tbody tr > td {
    display: block;
    width: 100%;
    padding: 0;
    border: none;
  }

  .page-company__form .wpcf7-form table th {
    margin-bottom: 0.65rem;
    font-size: 1.4rem;
  }

  .page-company__form .wpcf7-form table th label,
  .page-company__form .wpcf7-form table tr > td:first-child:has(> label) {
    width: 100%;
    min-width: 0;
    white-space: normal;
  }

  .page-company__form .wpcf7-form table tr > td:first-child:has(> label) {
    margin-bottom: 0.65rem;
  }

  .page-company__form .wpcf7-form table td .wpcf7-form-control-wrap {
    margin: 0;
  }

  .page-company__form .wpcf7-submit {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    padding: 14px 24px;
    font-size: 16px;
    text-align: center;
  }

  .page-company__form {
    padding: 0 0 clamp(1.5rem, 4vw, 2rem);
  }

  .page-company__form .wpcf7-form table th,
  .page-company__form .wpcf7-form table th label,
  .page-company__form .wpcf7-form table tr > td:first-child:has(> label),
  .page-company__form .wpcf7-form table tr > td:first-child:has(> label) label {
    white-space: normal;
    min-width: 0;
  }

  .page-company__form .wpcf7-acceptance label,
  .page-company__form .wpcf7-list-item-label {
    font-size: 1.4rem;
  }
}
/* お問い合わせ専用ページ — /contact/（subpage 白パネル + CF7 + 電話） */
.page-contact-page {
  /* .page-company と同じテーブル罫線色を参照 */
  --contact-table-line: #e0e0e0;
}
.page-contact__section {
  margin: 0;
  padding: 0;
}
/* 先頭の「お問い合わせ」見出し：パネル直上なので上マージンを詰める */
.page-contact__section-title--first.page-company__section-title {
  margin-top: 0;
}
/* 電話：フォーム下のセクション */
.page-contact__tel {
  margin-top: clamp(2rem, 5vw, 3rem);
  padding: 0;
}
/* 緑枠カード（アイコン・見出し・番号・受付時間） */
.page-contact__tel-card {
  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
  padding: clamp(2rem, 4vw, 2.75rem) clamp(1.5rem, 3vw, 2.25rem);
  text-align: center;
  background: #fff;
  border: 4px solid var(--color-primary);
  border-radius: 24px;
  box-sizing: border-box;
}
.page-contact__tel-icon-wrap {
  margin: 0 0 clamp(1rem, 2.5vw, 1.35rem);
}
.page-contact__tel-icon {
  display: block;
  width: 56px;
  height: 56px;
  margin: 0 auto;
  object-fit: contain;
}
.page-contact__tel-heading {
  margin: 0 0 clamp(0.85rem, 2vw, 1.1rem);
  padding: 0;
  border: none;
  font-family: var(--font-noto-sans-jp), sans-serif;
  font-size: clamp(17px, 2.2vw, 20px);
  font-weight: 600;
  letter-spacing: 0.06em;
  line-height: 1.45;
  color: var(--color-primary);
}
.page-contact__tel-number {
  margin: 0;
}
.page-contact__tel-number a {
  font-family: var(--font-noto-sans-jp), sans-serif;
  font-size: clamp(32px, 6vw, 44px);
  font-weight: 700;
  letter-spacing: 0.04em;
  color: var(--color-primary);
  text-decoration: none;
  transition: opacity 0.2s ease;
}
.page-contact__tel-number a:hover,
.page-contact__tel-number a:focus-visible {
  opacity: 0.88;
}
.page-contact__tel-hours {
  margin: clamp(0.65rem, 2vw, 1rem) 0 0;
  font-family: var(--font-noto-sans-jp), sans-serif;
  font-size: clamp(14px, 1.8vw, 15px);
  font-weight: 500;
  line-height: 1.6;
  color: var(--color-primary);
}
/*
 * タブレット：セクションは1列のまま（フォームと電話を横並びにしない）。
 * CF7 の表だけ 768px 以上の「ラベル列｜入力列」をやめ、スマホ同様の縦積みにする（1024px 以上で再び横並び）。
 */
@media (min-width: 768px) and (max-width: 1023px) {
  .page-contact__tel {
    margin-top: clamp(2.5rem, 5vw, 3.25rem);
  }

  .page-contact__tel-card {
    max-width: min(100%, 560px);
    padding: 2.25rem 1.75rem 2.35rem;
    border-radius: 20px;
  }

  .page-contact__tel-heading {
    font-size: 1.85rem;
  }

  .page-contact__tel-number a {
    font-size: clamp(30px, 5.5vw, 38px);
  }

  .page-contact .page-company__section-title.page-contact__section-title--first {
    margin-bottom: clamp(1.5rem, 3vw, 2rem);
  }

  .page-contact .page-company__form {
    max-width: min(100%, 640px);
    padding: 0 0 clamp(1.75rem, 3.5vw, 2.25rem);
  }

  /* CF7：縦並び（_company.css の max-width 767 ブロックと同構造、contact のみ） */
  .page-contact .page-company__form .wpcf7-form table {
    min-width: 0;
    display: block;
  }

  .page-contact .page-company__form .wpcf7-form table tbody {
    display: block;
    border-top: 0;
  }

  .page-contact .page-company__form .wpcf7-form table tbody tr {
    display: block;
    padding: 1.35rem 0;
    border-bottom: none;
  }

  .page-contact .page-company__form .wpcf7-form table tbody tr:first-child {
    border-top: 1px solid var(--contact-table-line);
  }

  .page-contact
    .page-company__form
    .wpcf7-form
    table
    tbody
    tr:not(:first-child)
    > :is(th, td) {
    padding-top: 0;
  }

  .page-contact .page-company__form .wpcf7-form table tbody tr > th,
  .page-contact .page-company__form .wpcf7-form table tbody tr > td {
    display: block;
    width: 100%;
    padding: 0;
    border: none;
  }

  .page-contact .page-company__form .wpcf7-form table th {
    margin-bottom: 0.65rem;
    font-size: 1.5rem;
  }

  .page-contact .page-company__form .wpcf7-form table th label,
  .page-contact
    .page-company__form
    .wpcf7-form
    table
    tr
    > td:first-child:has(> label) {
    width: 100%;
    min-width: 0;
    white-space: normal;
  }

  .page-contact
    .page-company__form
    .wpcf7-form
    table
    tr
    > td:first-child:has(> label) {
    margin-bottom: 0.65rem;
  }

  .page-contact .page-company__form .wpcf7-form table td .wpcf7-form-control-wrap {
    margin: 0;
  }

  .page-contact .page-company__form .wpcf7-submit {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    padding: 15px 28px;
    font-size: 17px;
    text-align: center;
  }

  .page-contact .page-company__form .wpcf7-form table th,
  .page-contact .page-company__form .wpcf7-form table th label,
  .page-contact
    .page-company__form
    .wpcf7-form
    table
    tr
    > td:first-child:has(> label),
  .page-contact
    .page-company__form
    .wpcf7-form
    table
    tr
    > td:first-child:has(> label)
    label {
    white-space: normal;
    min-width: 0;
  }

  .page-contact .page-company__form .wpcf7-acceptance label,
  .page-contact .page-company__form .wpcf7-list-item-label {
    font-size: 1.45rem;
  }
}
@media (max-width: 767px) {
  body.is-subpage .page-contact__tel {
    margin-top: 1.75rem;
  }

  .page-contact__tel-card {
    padding: 1.75rem 1.25rem 1.85rem;
    border-radius: 16px;
  }

  .page-contact__tel-icon {
    width: 48px;
    height: 48px;
  }
}
/* ABOUT 専用ブロック（ラッパー・ヒーロー・白パネルは _subpage.css の .subpage__*） */
.page-about__section {
  padding-bottom: 8rem;
  scroll-margin-top: 2rem;
}
.page-about__heading {
  margin: 0 0 8rem;
  text-align: center;
  font-family: var(--font-noto-sans-jp), sans-serif;
  font-size: clamp(26px, 3.5vw, 32px);
  font-weight: 600;
  letter-spacing: 0.06em;
  line-height: 1.35;
  color: var(--color-primary);
}
.page-about__lead {
  margin: 0 auto 4rem;
  max-width: 52rem;
  text-align: center;
  font-family: var(--font-noto-sans-jp), sans-serif;
  font-size: clamp(16px, 2vw, 18px);
  font-weight: 500;
  line-height: 1.85;
  color: var(--color-body);
}
/* 3 理念：アイコン＋本文 */
.page-about__pillars {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 4rem;
  align-items: start;
}
.page-about__pillar {
  text-align: center;
}
.page-about__pillar-icon-wrap {
  display: flex;
  justify-content: center;
  margin-bottom: clamp(1rem, 2vw, 1.5rem);
}
.page-about__pillar-icon {
  display: block;
  width: auto;
  max-width: min(120px, 28vw);
  height: auto;
}
.page-about__pillar-text {
  margin: 0;
  font-family: var(--font-noto-sans-jp), sans-serif;
  font-size: 1.6rem;
  font-weight: 400;
  line-height: 1.8;
  color: var(--color-body);
  text-align: left;
}
/* 代表挨拶：写真＋プロフィール | 本文 */
.page-about__ceo {
  display: grid;
  grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr);
  gap: 4rem;
  align-items: start;
}
.page-about__ceo-side {
  display: flex;
  flex-direction: column;
  gap: clamp(1.25rem, 3vw, 2rem);
}
.page-about__ceo-photo-wrap {
  margin: 0;
  border-radius: 4px;
  overflow: hidden;
  background: #f0f0f0;
}
.page-about__ceo-photo {
  display: block;
  width: 100%;
  height: auto;
  vertical-align: middle;
}
.page-about__profile {
  font-family: var(--font-noto-sans-jp), sans-serif;
  font-size: 1.5rem;
  line-height: 1.75;
  color: var(--color-body);
}
.page-about__profile-role {
  margin: 0 0 0.5rem;
  font-weight: 500;
}
.page-about__profile-names {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.35em 0.75em;
  margin-bottom: 0.75rem;
}
.page-about__name-jp {
  margin: 0;
  font-size: clamp(22px, 3vw, 28px);
  font-weight: 700;
  color: var(--color-primary);
}
.page-about__name-en {
  margin: 0;
  font-size: 1.6rem;
  letter-spacing: 0.04em;
  color: var(--color-text-muted);
}
.page-about__profile-meta {
  margin: 0 0 1rem;
  font-size: 1.6rem;
}
.page-about__profile-list {
  margin: 0;
  padding: 0;
  list-style: none;
}
.page-about__profile-list li {
  margin-bottom: 1rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid #e8e8e8;
  font-size: 1.6rem;
  line-height: 1.65;
}
.page-about__profile-list li:last-child {
  margin-bottom: 0;
  padding-bottom: 0;
  border-bottom: none;
}
.page-about__profile-year {
  display: inline-block;
  margin-bottom: 4px;
  font-weight: 600;
  color: var(--color-primary);
}
.page-about__ceo-letter {
  font-family: var(--font-noto-sans-jp), sans-serif;
  font-size: 1.6rem;
  font-weight: 400;
  line-height: 2;
  color: var(--color-body);
}
.page-about__ceo-letter p {
  margin: 0 0 1.5em;
}
.page-about__ceo-letter p:last-child {
  margin-bottom: 0;
}
@media (max-width: 1023px) {
  .page-about__ceo {
    grid-template-columns: 1fr;
  }
}
/* タブレット：代表ブロック内を写真左・プロフィール右の2列 */
@media (min-width: 768px) and (max-width: 1023px) {
  .page-about__ceo-side {
    flex-direction: row;
    align-items: flex-start;
    gap: clamp(1.5rem, 3.5vw, 2.25rem);
  }

  .page-about__ceo-photo-wrap {
    flex: 0 1 46%;
    max-width: min(340px, 48vw);
    min-width: 0;
  }

  /* 右カラムを読みやすい行長に抑え、極端に細くして不自然な改行だらけにならないよう max-width で調整 */
  .page-about__profile {
    flex: 1 1 0;
    min-width: 0;
  }
}
@media (max-width: 767px) {
  .page-about__section {
    padding-bottom: 3rem;
    scroll-margin-top: 1rem;
  }

  .page-about__section + .page-about__section {
    padding-top: 2.5rem;
    border-top: 1px solid rgba(0, 0, 0, 0.08);
  }

  .page-about__heading {
    margin: 0 0 1.5rem;
    font-size: 2.4rem;
  }

  .page-about__lead {
    margin-bottom: 2rem;
    text-align: center;
    font-size: 1.8rem;
    font-weight: 700;
  }

  .page-about__pillars {
    grid-template-columns: 1fr;
    gap: 0;
  }

  .page-about__pillar {
    padding: 1.75rem 0;
    border-bottom: 1px solid rgba(0, 0, 0, 0.07);
  }

  .page-about__pillar:last-child {
    padding-bottom: 0;
    border-bottom: none;
  }

  .page-about__pillar:first-child {
    padding-top: 0;
  }

  .page-about__pillar-icon-wrap {
    margin-bottom: 1rem;
  }

  .page-about__pillar-icon {
    max-width: 96px;
  }

  .page-about__pillar-text {
    text-align: left;
    font-size: 1.6rem;
    line-height: 1.75;
    text-align: center;
  }

  .page-about__ceo {
    gap: 2rem;
  }

  .page-about__ceo-side {
    max-width: none;
    margin: 0;
    width: 100%;
  }

  .page-about__ceo-photo-wrap {
    max-width: 320px;
    margin: 0 auto;
  }

  .page-about__profile {
    font-size: 1.45rem;
    line-height: 1.7;
  }

  .page-about__name-jp {
    font-size: clamp(1.25rem, 4vw, 1.5rem);
  }

  .page-about__name-en {
    font-size: 1.45rem;
  }

  .page-about__profile-meta {
    font-size: 1.45rem;
    line-height: 1.65;
  }

  .page-about__profile-list li {
    font-size: 1.45rem;
    line-height: 1.65;
    margin-bottom: 0.85rem;
    padding-bottom: 0.85rem;
  }

  .page-about__ceo-letter {
    font-size: 1.5rem;
    line-height: 1.85;
  }

  .page-about__ceo-letter p {
    margin: 0 0 1.25em;
  }
}
/* ペットサービス（pet-services）。ラッパーは _subpage.css、緑 CTA は _service-shared の .service-block__cta */
.page-pet-services__section {
  padding-bottom: clamp(4rem, 8vw, 6rem);
}
.page-pet-services__section:last-child {
  padding-bottom: 0;
}
.page-pet-services__service-line {
  margin: 0 0 8rem;
  text-align: center;
  font-family: var(--font-noto-sans-jp), sans-serif;
  font-size: 3.2rem;
  font-weight: 600;
  line-height: 1.65;
  letter-spacing: 0.04em;
  color: var(--color-primary);
}
.page-pet-services__video-wrap {
  margin: 0 auto 8rem;
  max-width: min(960px, 100%);
  overflow: hidden;
  border-radius: 12px;
}
.page-pet-services__video {
  display: block;
  width: 100%;
  height: auto;
  object-fit: cover;
}
.page-pet-services__brand {
  display: flex;
  justify-content: center;
  margin: 0 0 8rem;
}
.page-pet-services__brand-img {
  display: block;
  width: auto;
  max-width: min(440px, 88vw);
  height: auto;
}
.page-pet-services__h2 {
  margin: 0 0 clamp(1.5rem, 3vw, 8rem);
  text-align: center;
  font-family: var(--font-noto-sans-jp), sans-serif;
  font-size: clamp(20px, 2.5vw, 26px);
  font-weight: 600;
  line-height: 1.65;
  letter-spacing: 0.04em;
  color: var(--color-primary);
}
.page-pet-services__br-md {
  display: none;
}
@media (min-width: 768px) {
  .page-pet-services__br-md {
    display: inline;
  }
}
.page-pet-services__prose {
  max-width: 70rem;
  margin: 0 auto;
}
.page-pet-services__prose p {
  margin: 0;
  font-family: var(--font-noto-sans-jp), sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 2;
  color: var(--color-body);
  text-align: justify;
  text-justify: inter-ideograph;
}
/* 4 サービス：768px 以上は 4 列（スマホのみ 1 列） */
.page-pet-services__features {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(1.25rem, 2vw, 2rem);
  align-items: start;
}
.page-pet-services__feature {
  display: flex;
  flex-direction: column;
  gap: clamp(1rem, 2vw, 1.5rem);
}
.page-pet-services__feature-visual {
  margin: 0 auto;
  width: 100%;
  max-width: min(100%, 20rem);
  border-radius: 4px;
  overflow: hidden;
  background: #e8e6e0;
  aspect-ratio: 1;
}
.page-pet-services__feature-img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.page-pet-services__feature-icon {
  display: flex;
  justify-content: center;
  margin: 0 0 clamp(0.5rem, 1.5vw, 0.75rem);
}
.page-pet-services__feature-icon-img {
  display: block;
  width: clamp(40px, 8vw, 48px);
  height: auto;
  flex-shrink: 0;
}
.page-pet-services__feature-body {
  text-align: center;
}
.page-pet-services__feature-title-jp {
  margin: 0 0 0.35rem;
  font-family: var(--font-noto-sans-jp), sans-serif;
  font-size: clamp(20px, 2.5vw, 24px);
  font-weight: 600;
  letter-spacing: 0.06em;
  line-height: 1.35;
  color: var(--color-primary);
}
.page-pet-services__feature-title-en {
  margin: 0 0 0.75rem;
  font-family: var(--font-noto-sans-jp), sans-serif;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.12em;
  line-height: 1.3;
  color: var(--color-text-muted);
}
.page-pet-services__feature-text {
  margin: 0;
  font-family: var(--font-noto-sans-jp), sans-serif;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.85;
  color: var(--color-body);
  text-align: left;
}
/* 4 列レイアウトに合わせたタイポ（768px 以上。スマホは下の max-width 767 で上書き） */
@media (min-width: 768px) {
  .page-pet-services__feature-title-jp {
    font-size: clamp(17px, 1.4vw, 20px);
  }

  .page-pet-services__feature-title-en {
    font-size: 12px;
  }

  .page-pet-services__feature-text {
    font-size: 13px;
    line-height: 1.75;
  }
}
.page-pet-services__cta-wrap {
  margin: 8rem 0 0;
  text-align: center;
}
@media (max-width: 767px) {
  .page-pet-services__section {
    padding-bottom: 3rem;
  }

  .page-pet-services__section--intro {
    padding-bottom: 2.5rem;
  }

  .page-pet-services__service-line {
    margin: 0 0 2.5rem;
    font-size: 2rem;
    line-height: 1.55;
    letter-spacing: 0.03em;
  }

  .page-pet-services__video-wrap {
    margin: 0 auto 2.5rem;
    border-radius: 8px;
  }

  .page-pet-services__video {
    aspect-ratio: 16 / 9;
    max-height: min(52vh, 320px);
    object-fit: cover;
  }

  .page-pet-services__brand {
    margin: 0 0 2.5rem;
  }

  .page-pet-services__brand-img {
    max-width: min(280px, 85vw);
  }

  .page-pet-services__h2 {
    margin: 0 0 1.5rem;
    font-size: 1.8rem;
    line-height: 1.65;
    letter-spacing: 0.03em;
  }

  .page-pet-services__prose {
    max-width: none;
  }

  .page-pet-services__prose p {
    font-size: 1.5rem;
    line-height: 1.85;
    text-align: left;
  }

  .page-pet-services__features {
    grid-template-columns: 1fr;
    gap: 2.5rem;
  }

  .page-pet-services__feature {
    gap: 1rem;
    padding-bottom: 2.5rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
  }

  .page-pet-services__feature:last-child {
    padding-bottom: 0;
    border-bottom: none;
  }

  .page-pet-services__feature-visual {
    max-width: 100%;
  }

  .page-pet-services__feature-icon {
    margin: 0 0 0.75rem;
  }

  .page-pet-services__feature-icon-img {
    width: clamp(56px, 16vw, 72px);
    height: auto;
  }

  .page-pet-services__feature-title-jp {
    font-size: 2.4rem;
  }

  .page-pet-services__feature-title-en {
    margin-bottom: 0.65rem;
    font-size: 1.6rem;
  }

  .page-pet-services__feature-text {
    font-size: 1.45rem;
    line-height: 1.75;
  }

  .page-pet-services__cta-wrap {
    margin: 3rem 0 0;
  }
}
/* 動物病院（pet-hospital）下層ページ — https://kizuna-en.com/pet-hospital/ 系。ラッパーは _subpage.css、緑 CTA は _service-shared */
.page-pet-hospital__section {
  padding-bottom: 8rem;
}
.page-pet-hospital__section:last-child {
  padding-bottom: 0;
}
.page-pet-hospital__title {
  margin: 0 0 8rem;
  text-align: center;
  font-family: var(--font-noto-sans-jp), sans-serif;
  font-size: 3.2rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  line-height: 1.45;
  color: var(--color-primary);
}
.page-pet-hospital__video-wrap {
  position: relative;
  width: 100%;
  max-width: min(960px, 100%);
  margin: 0 auto 8rem;
  overflow: hidden;
  border-radius: 12px;
  aspect-ratio: 16 / 9;
  background: #111;
}
.page-pet-hospital__video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}
.page-pet-hospital__split {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(1.5rem, 3vw, 2.5rem);
  align-items: start;
  margin-bottom: 8rem;
}
.page-pet-hospital__split:last-of-type {
  margin-bottom: 0;
}
.page-pet-hospital__split-main {
  min-width: 0;
}
.page-pet-hospital__brand {
  margin: 0 0 4rem;
}
.page-pet-hospital__brand--imozawa {
  display: flex;
  justify-content: center;
}
.page-pet-hospital__kpc-logo {
  display: block;
  width: 100%;
  max-width: 400px;
  height: auto;
}
.page-pet-hospital__imozawa-logo {
  display: block;
  width: 100%;
  max-width: min(576px, 100%);
  height: auto;
}
.page-pet-hospital__prose p {
  margin: 0;
  font-family: var(--font-noto-sans-jp), sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 2;
  color: var(--color-body);
  text-align: justify;
  text-justify: inter-ideograph;
}
.page-pet-hospital__split-figure {
  margin: 0 auto;
  max-width: min(100%, 40rem);
  border-radius: 4px;
  overflow: hidden;
  background: #e8e6e0;
}
.page-pet-hospital__split-figure--mobile {
  display: none;
}
.page-pet-hospital__photo {
  display: block;
  width: 100%;
  height: auto;
  object-fit: cover;
}
.page-pet-hospital__h2 {
  margin: 0 0 4rem;
  text-align: center;
  font-family: var(--font-noto-sans-jp), sans-serif;
  font-size: 2.8rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  line-height: 1.5;
  color: var(--color-primary);
}
.page-pet-hospital__features-lead {
  margin: 0 0 clamp(2rem, 4vw, 3rem);
  font-family: var(--font-noto-sans-jp), sans-serif;
  font-size: clamp(16px, 1.8vw, 18px);
  font-weight: 500;
  line-height: 1.85;
  color: var(--color-body);
  text-align: justify;
  text-justify: inter-ideograph;
}
.page-pet-hospital__features {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(2rem, 4vw, 3.5rem) clamp(1.5rem, 3vw, 2.5rem);
  align-items: start;
}
.page-pet-hospital__feature {
  display: flex;
  flex-direction: column;
  gap: clamp(1rem, 2vw, 1.5rem);
}
/* ペットサービスページの .page-pet-services__feature-visual と同じ */
.page-pet-hospital__feature-visual {
  margin: 0 auto;
  width: 100%;
  max-width: min(100%, 20rem);
  border-radius: 4px;
  overflow: hidden;
  background: #e8e6e0;
  aspect-ratio: 1;
}
.page-pet-hospital__feature-img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.page-pet-hospital__feature-body {
  text-align: center;
}
.page-pet-hospital__feature-title-jp {
  margin: 0 0 0.35rem;
  font-family: var(--font-noto-sans-jp), sans-serif;
  font-size: clamp(20px, 2.5vw, 24px);
  font-weight: 600;
  letter-spacing: 0.06em;
  line-height: 1.35;
  color: var(--color-primary);
}
.page-pet-hospital__feature-title-en {
  margin: 0 0 0.75rem;
  font-family: var(--font-noto-sans-jp), sans-serif;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.12em;
  line-height: 1.3;
  color: var(--color-text-muted);
}
.page-pet-hospital__feature-text {
  margin: 0;
  font-family: var(--font-noto-sans-jp), sans-serif;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.85;
  color: var(--color-body);
  text-align: left;
}
.page-pet-hospital__cta-wrap {
  margin: 8rem 0 0;
  text-align: center;
}
@media (min-width: 768px) and (max-width: 1023px) {
  .page-pet-hospital__features {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: clamp(1.25rem, 2vw, 2rem);
  }

  .page-pet-hospital__feature-title-jp {
    font-size: clamp(17px, 1.4vw, 20px);
  }

  .page-pet-hospital__feature-title-en {
    font-size: 12px;
  }

  .page-pet-hospital__feature-text {
    font-size: 13px;
    line-height: 1.75;
  }
}
@media (min-width: 1024px) {
  .page-pet-hospital__features {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: clamp(1.25rem, 2vw, 2rem);
  }

  .page-pet-hospital__feature-title-jp {
    font-size: clamp(17px, 1.4vw, 20px);
  }

  .page-pet-hospital__feature-title-en {
    font-size: 12px;
  }

  /* .page-pet-services__feature-text（1024px 以上）と同じ */
  .page-pet-hospital__feature-text {
    font-size: 13px;
    line-height: 1.75;
  }
}
@media (max-width: 767px) {
  .page-pet-hospital__section {
    padding-bottom: 6rem;
  }

  .page-pet-hospital__title {
    margin: 0 0 2rem;
    font-size: 2.4rem;
    line-height: 1.4;
  }

  .page-pet-hospital__video-wrap {
    margin: 0 auto 4rem;
    border-radius: 8px;
    max-height: min(52vh, 320px);
  }

  .page-pet-hospital__split {
    grid-template-columns: 1fr;
    gap: 1.5rem;
    margin-bottom: 2.5rem;
  }

  /* DOM はテキスト→画像だが、スマホでは画像を上に */
  .page-pet-hospital__split-main {
    order: 2;
  }

  .page-pet-hospital__split-figure {
    order: 1;
  }

  .page-pet-hospital__split:last-of-type {
    margin-bottom: 0;
  }

  .page-pet-hospital__brand {
    margin: 0 0 1.5rem;
  }

  .page-pet-hospital__kpc-logo,
  .page-pet-hospital__imozawa-logo {
    max-width: min(320px, 88vw);
    margin: 0 auto;
  }

  .page-pet-hospital__prose p {
    font-size: 1.5rem;
    line-height: 1.85;
    text-align: left;
  }

  .page-pet-hospital__split-figure {
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
  }

  .page-pet-hospital__split--reverse .page-pet-hospital__split-figure--desktop {
    display: none;
  }

  .page-pet-hospital__split--reverse .page-pet-hospital__split-figure--mobile {
    display: block;
  }

  .page-pet-hospital__h2 {
    margin: 0 0 1.5rem;
    font-size: 2.4rem;
    line-height: 1.65;
    letter-spacing: 0.03em;
  }

  .page-pet-hospital__features-lead {
    margin: 0 0 1.75rem;
    font-size: 1.5rem;
    line-height: 1.8;
    text-align: left;
  }

  .page-pet-hospital__features {
    grid-template-columns: 1fr;
    gap: 2.5rem;
  }

  .page-pet-hospital__feature {
    gap: 1rem;
    padding-bottom: 2.5rem;
  }

  .page-pet-hospital__feature:last-child {
    padding-bottom: 0;
    border-bottom: none;
  }

  .page-pet-hospital__feature-visual {
    max-width: 100%;
    margin: 0 auto;
  }

  /* .page-pet-services__feature（767px 以下）と同じ */
  .page-pet-hospital__feature-title-jp {
    font-size: 2.4rem;
  }

  .page-pet-hospital__feature-title-en {
    margin-bottom: 0.65rem;
    font-size: 1.6rem;
  }

  .page-pet-hospital__feature-text {
    font-size: 1.45rem;
    line-height: 1.75;
  }

  .page-pet-hospital__cta-wrap {
    margin: 3rem 0 0;
  }
}
/* ペット製品・情報（pet-products）。ラッパーは _subpage.css、緑 CTA は _service-shared の .service-block__cta */
.page-pet-products__section {
  padding-bottom: 16rem;
}
.page-pet-products__section:last-child {
  padding-bottom: 0;
}
.page-pet-products__service-line {
  margin: 0 0 8rem;
  text-align: center;
  font-family: var(--font-noto-sans-jp), sans-serif;
  font-size: 3.2rem;
  font-weight: 800;
  line-height: 1.65;
  letter-spacing: 0.04em;
  color: var(--color-primary);
}
.page-pet-products__br-md {
  display: none;
}
@media (min-width: 768px) {
  .page-pet-products__br-md {
    display: inline;
  }
}
/* 左：ビジュアル / 右：見出し＋本文（オンラインサロン） */
.page-pet-products__intro-split {
  display: flex;
  flex-direction: column;
  gap: clamp(1.5rem, 3vw, 2.5rem);
  align-items: stretch;
  margin-bottom: 8rem;
}
@media (min-width: 768px) {
  .page-pet-products__intro-split {
    flex-direction: row;
    align-items: center;
  }

  .page-pet-products__intro-visual,
  .page-pet-products__intro-body {
    flex: 1 1 50%;
    min-width: 0;
  }
}
.page-pet-products__intro-visual {
  margin: 0;
  border-radius: 4px;
  overflow: hidden;
}
.page-pet-products__intro-img {
  display: block;
  width: 100%;
  height: auto;
}
.page-pet-products__intro-heading {
  margin: 0 0 clamp(1rem, 2vw, 1.5rem);
  font-family: var(--font-noto-sans-jp), sans-serif;
  font-size: 2.8rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  line-height: 1.45;
  color: var(--color-primary);
  text-align: center;
}
@media (min-width: 768px) {
  .page-pet-products__intro-heading {
    text-align: left;
  }
}
.page-pet-products__intro-copy p {
  margin: 0 0 1.25em;
  font-family: var(--font-noto-sans-jp), sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 2;
  color: var(--color-body);
  text-align: justify;
  text-justify: inter-ideograph;
}
@media (min-width: 768px) {
  .page-pet-products__intro-copy p {
    text-align: left;
  }
}
.page-pet-products__intro-copy p:last-child {
  margin-bottom: 0;
}
.page-pet-products__cta-wrap--salon {
  margin: clamp(2rem, 4vw, 2.75rem) 0 0;
  text-align: center;
}
.page-pet-products__products {
  display: flex;
  flex-direction: column;
  gap: 12rem;
}
.page-pet-products__product {
  display: flex;
  flex-direction: column;
  gap: clamp(1.5rem, 3vw, 2.5rem);
  align-items: stretch;
}
@media (min-width: 768px) {
  .page-pet-products__product {
    flex-direction: row;
    align-items: center;
  }

  .page-pet-products__product--reverse {
    flex-direction: row-reverse;
  }

  .page-pet-products__product-visual,
  .page-pet-products__product-body {
    flex: 1 1 50%;
    min-width: 0;
  }
}
.page-pet-products__product-visual {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0;
  height: 400px;
  border-radius: 4px;
  overflow: hidden;
}
.page-pet-products__product-img {
  display: block;
  width: auto;
  max-width: 100%;
  max-height: 100%;
  height: auto;
  object-fit: contain;
}
.page-pet-products__product-body {
  text-align: center;
}
@media (min-width: 768px) {
  .page-pet-products__product-body {
    text-align: left;
  }
}
.page-pet-products__brand {
  margin: 0 0 0.5em;
  font-family: var(--font-noto-sans-jp), sans-serif;
  font-size: 2.8rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  line-height: 1.35;
  color: var(--color-primary);
}
.page-pet-products__tagline {
  margin: 0 0 1em;
  font-family: var(--font-noto-sans-jp), sans-serif;
  font-size: 2rem;
  font-weight: 600;
  line-height: 1.6;
  color: var(--color-body);
}
.page-pet-products__text {
  margin: 0 0 4rem;
  font-family: var(--font-noto-sans-jp), sans-serif;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.9;
  color: var(--color-body);
  text-align: justify;
  text-justify: inter-ideograph;
}
.page-pet-products__cta-wrap {
  margin: 0;
}
/* 取扱ブランドの CTA のみ幅を抑える（トップの .service-block__cta は共通のまま） */
.page-pet-products__product-body .service-block__cta {
  min-width: 0;
  padding: 16px 6rem;
  background-color: var(--color-link-light-green);
}
@media (min-width: 1024px) {
  .page-pet-products__text {
    font-size: 1.6rem;
    line-height: 1.85;
  }
}
/* タブレット：2列のまま余白・タイポ・画像枠を詰めてバランス調整 */
@media (min-width: 768px) and (max-width: 1023px) {
  .page-pet-products__section {
    padding-bottom: 10rem;
  }

  .page-pet-products__service-line {
    margin: 0 0 5rem;
    font-size: 2.6rem;
    line-height: 1.6;
    letter-spacing: 0.035em;
  }

  .page-pet-products__intro-split {
    gap: 2rem;
    margin-bottom: 5rem;
  }

  .page-pet-products__intro-heading {
    font-size: 2.4rem;
    line-height: 1.45;
  }

  .page-pet-products__intro-copy p {
    font-size: 15px;
    line-height: 1.95;
  }

  .page-pet-products__cta-wrap--salon {
    margin: 2rem 0 0;
  }

  .page-pet-products__products {
    gap: 9rem;
  }

  .page-pet-products__product {
    gap: 2rem;
  }

  .page-pet-products__product-visual {
    height: min(320px, 42vw);
  }

  .page-pet-products__brand {
    font-size: 2.4rem;
    line-height: 1.35;
  }

  .page-pet-products__tagline {
    margin: 0 0 0.85em;
    font-size: 1.7rem;
    line-height: 1.55;
  }

  .page-pet-products__text {
    margin: 0 0 2.75rem;
    font-size: 1.45rem;
    line-height: 1.82;
  }

  .page-pet-products__product-body .service-block__cta {
    padding: 15px 4.5rem;
    font-size: 1.6rem;
  }
}
/* スマホ：余白・タイポ・画像枠を pet-services / subpage 共通値に合わせる */
@media (max-width: 767px) {
  .page-pet-products__section {
    padding-bottom: 3rem;
  }

  .page-pet-products__service-line {
    margin: 0 0 2.5rem;
    font-size: 2rem;
    line-height: 1.55;
    letter-spacing: 0.03em;
  }

  .page-pet-products__intro-split {
    gap: 1.5rem;
    margin-bottom: 2.5rem;
  }

  .page-pet-products__intro-visual {
    border-radius: 8px;
  }

  .page-pet-products__intro-heading {
    margin: 0 0 1.5rem;
    font-size: 1.8rem;
    line-height: 1.65;
    letter-spacing: 0.03em;
  }

  .page-pet-products__intro-copy p {
    font-size: 1.5rem;
    line-height: 1.85;
    text-align: left;
  }

  .page-pet-products__cta-wrap--salon {
    margin: 1.75rem 0 0;
  }

  .page-pet-products__products {
    gap: 8rem;
  }

  .page-pet-products__product {
    gap: 1.25rem;
  }

  .page-pet-products__product-visual {
    height: min(280px, 58vw);
    max-height: 300px;
    border-radius: 8px;
  }

  .page-pet-products__brand {
    font-size: 2.4rem;
    letter-spacing: 0.06em;
  }

  .page-pet-products__tagline {
    margin: 0 0 0.85em;
    font-size: 1.6rem;
    line-height: 1.55;
  }

  .page-pet-products__text {
    margin: 0 0 2rem;
    font-size: 1.45rem;
    line-height: 1.75;
  }

  .page-pet-products__product-body .service-block__cta {
    width: 100%;
    max-width: 100%;
    padding: 14px 32px;
    font-size: 18px;
  }
}
/* コンサルティング（/consulting/）— 本番 Elementor 相当のレイアウト */
.page-consulting__section {
  margin: 0;
  padding: 0;
}
.page-consulting__intro {
  margin-bottom: clamp(2rem, 5vw, 3rem);
  padding-bottom: clamp(2rem, 4vw, 3rem);
}
.page-consulting__service-line {
  margin: 0;
  text-align: center;
  font-family: var(--font-noto-sans-jp), sans-serif;
  font-size: clamp(1.75rem, 3.5vw, 3.2rem);
  font-weight: 800;
  line-height: 1.55;
  letter-spacing: 0.04em;
  color: var(--color-primary);
}
/* メールセクション：先頭の h2 はパネル内で上マージンを詰める */
.page-consulting__section-title--first.page-company__section-title {
  margin-top: 0;
}
.page-consulting__mail {
  margin-bottom: clamp(2rem, 5vw, 3rem);
  padding-bottom: clamp(1.5rem, 4vw, 2.5rem);
}
.page-consulting__cta-wrap {
  margin: clamp(1.25rem, 3vw, 2rem) 0 0;
  text-align: center;
}
/* 電話ブロックは _contact.css の .page-contact__tel / __tel-card を流用 */
.page-consulting .page-contact__tel {
  margin-top: 0;
  padding: 0;
}
/* -------------------------------------------------------------------------
   スマホ（767px 以下）— 余白・タイポを subpage 共通値に合わせる
   ------------------------------------------------------------------------- */
@media (max-width: 767px) {
  body.is-subpage .page-consulting__intro {
    margin-bottom: 1.5rem;
    padding-bottom: 1.5rem;
  }

  body.is-subpage .page-consulting__service-line {
    font-size: clamp(1.3rem, 4.2vw, 1.55rem);
    line-height: 1.5;
    letter-spacing: 0.03em;
    padding: 0 0.125rem;
  }

  body.is-subpage .page-consulting__mail {
    margin-bottom: 1.75rem;
    padding-bottom: 1.5rem;
  }

  /* 会社ページの .page-company__section-title（モバイル 2.4rem）より一段コンパクトに */
  body.is-subpage .page-consulting .page-consulting__section-title--first.page-company__section-title {
    margin: 0 0 1rem;
    font-size: clamp(1.45rem, 4.5vw, 1.75rem);
    letter-spacing: 0.05em;
    line-height: 1.35;
  }

  body.is-subpage .page-consulting__cta-wrap {
    margin: 1rem 0 0;
  }

  body.is-subpage .page-consulting .page-contact__tel {
    margin-top: 0;
    padding: 0 0 max(0.25rem, env(safe-area-inset-bottom, 0px));
  }

  body.is-subpage .page-consulting .page-contact__tel-card {
    max-width: none;
    width: 100%;
    padding: 1.5rem 1rem 1.6rem;
    border-width: 3px;
  }

  body.is-subpage .page-consulting .page-contact__tel-heading {
    font-size: clamp(15px, 3.8vw, 17px);
  }

  body.is-subpage .page-consulting .page-contact__tel-number a {
    font-size: clamp(26px, 8vw, 34px);
  }

  body.is-subpage .page-consulting .page-contact__tel-hours {
    font-size: 0.875rem;
  }
}
/* プライバシーポリシー — /privacy-policy/（subpage 白パネル + 本文。ラッパーは _subpage.css） */
.page-privacy-policy__content {
  max-width: 70rem;
  margin: 0 auto;
}
.page-privacy-policy__section {
  margin: 0;
  padding: 0;
}
/* 先頭見出し：パネル直上なので上マージンを詰める（_contact の contact と同様） */
.page-privacy-policy__section-title--first.page-company__section-title {
  margin-top: 0;
}
.page-privacy-policy__emphasis {
  margin: 0;
  font-family: var(--font-noto-sans-jp), sans-serif;
  font-size: 16px;
  font-weight: 600;
  line-height: 2;
  color: var(--color-body);
  text-align: justify;
  text-justify: inter-ideograph;
}
.page-privacy-policy__prose p {
  margin: 0 0 1.25em;
  font-family: var(--font-noto-sans-jp), sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 2;
  color: var(--color-body);
  text-align: justify;
  text-justify: inter-ideograph;
}
.page-privacy-policy__prose p:last-child {
  margin-bottom: 0;
}
.page-privacy-policy__list {
  margin: 0 0 1.25em;
  padding-left: 1.5em;
  font-family: var(--font-noto-sans-jp), sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 2;
  color: var(--color-body);
  list-style: disc;
}
.page-privacy-policy__list li {
  margin-bottom: 0.25em;
}
.page-privacy-policy__list:last-child {
  margin-bottom: 0;
}
/* -------------------------------------------------------------------------
   タブレット（768–1023px）：パネル幅に合わせて見出し間隔を詰め、本文はややコンパクトに
   ------------------------------------------------------------------------- */
@media (min-width: 768px) and (max-width: 1023px) {
  /* 会社ページ .page-company__layout と同じ左右インセット + お問い合わせフォーム相当の読み幅（max-width 800px 中央） */
  .page-privacy-policy__content {
    max-width: min(100%, 800px);
    margin-left: auto;
    margin-right: auto;
    padding-left: clamp(0.5rem, 3vw, 2.5rem);
    padding-right: clamp(0.5rem, 3vw, 2.5rem);
  }

  /* 会社ページの h2（8rem 上マージン）より一段詰める */
  .page-privacy-policy__section:not(:first-child) .page-company__section-title {
    margin: clamp(3.25rem, 5.5vw, 4.75rem) 0 clamp(1rem, 2vw, 1.35rem);
  }

  .page-privacy-policy__section:first-child .page-company__section-title {
    margin-bottom: clamp(1.15rem, 2vw, 1.5rem);
  }

  .page-privacy-policy__emphasis {
    font-size: 15px;
    line-height: 1.9;
  }

  .page-privacy-policy__prose p,
  .page-privacy-policy__list {
    font-size: 15px;
    line-height: 1.9;
  }

  .page-privacy-policy__list {
    padding-left: 1.35em;
  }
}
/* -------------------------------------------------------------------------
   スマホ（767px 以下）：区切り線・タイポ・余白を他下層ページ（consulting / about）に揃える
   ------------------------------------------------------------------------- */
@media (max-width: 767px) {
  /* パネル内側に追加インセット（トップ各ブロックの max(20px) 系に近い余白感で他下層と揃える） */
  body.is-subpage .page-privacy-policy__content {
    max-width: none;
    margin-left: auto;
    margin-right: auto;
    padding-left: clamp(0.5rem, 4vw, 1.25rem);
    padding-right: clamp(0.5rem, 4vw, 1.25rem);
  }

  body.is-subpage .page-privacy-policy__section:not(:first-child) {
    margin-top: 0;
    padding-top: 1.75rem;
  }

  body.is-subpage .page-privacy-policy .page-company__section-title {
    margin: 0 0 1rem;
    font-size: clamp(1.45rem, 4.5vw, 1.75rem);
    letter-spacing: 0.05em;
    line-height: 1.35;
  }

  body.is-subpage
    .page-privacy-policy__section-title--first.page-company__section-title {
    margin-top: 0;
    margin-bottom: 1rem;
  }

  body.is-subpage .page-privacy-policy__emphasis {
    font-size: clamp(14px, 3.8vw, 16px);
    font-weight: 600;
    line-height: 1.85;
  }

  body.is-subpage .page-privacy-policy__prose p {
    margin: 0 0 1.1em;
    font-size: clamp(14px, 3.6vw, 15px);
    line-height: 1.85;
  }

  body.is-subpage .page-privacy-policy__list {
    margin: 0 0 1.1em;
    padding-left: 1.35em;
    font-size: clamp(14px, 3.6vw, 15px);
    line-height: 1.75;
  }

  body.is-subpage .page-privacy-policy__list li {
    margin-bottom: 0.35em;
  }

  body.is-subpage .page-privacy-policy__list:last-child {
    margin-bottom: 0;
  }
}