@charset "UTF-8";
/* =============================================
   佐土原ちゃい動物病院
   - SPデザイン基準 375px / PCデザイン基準 1440px
   - モバイルファースト。1024px以上でPCレイアウト（上限なしで画面幅に比例）
============================================= */
/* ---------------------------------------------
   Reset
--------------------------------------------- */
*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  -webkit-text-size-adjust: 100%;
}

body,
h1,
h2,
h3,
h4,
h5,
h6,
p,
figure,
blockquote,
dl,
dd,
ul,
ol {
  margin: 0;
  padding: 0;
}

ul,
ol {
  list-style: none;
}

img,
picture,
svg,
video {
  display: block;
  max-width: 100%;
  height: auto;
}

a {
  color: inherit;
  text-decoration: none;
}

button {
  border: none;
  background: none;
  font: inherit;
  color: inherit;
  cursor: pointer;
}

address {
  font-style: normal;
}

/* ---------------------------------------------
   Foundation
--------------------------------------------- */
:root {
  /* Figma変数 */
  --color-title: #593821;
  --color-orange: #ca6721;
  --color-text: #29231e;
  --color-bg: #f8f4de;
  /* Figma変数外の使用色 */
  --color-nav: #26211f;
  --color-green: #74ab79;
  --color-num: #9cbe76;
  --color-orange-d: #c4611c;
  --color-chip: #dfa43d;
  --color-line: #e1dfd5;
  --color-line-green: #4dc764;
  --color-cream: #fccf82;
  --color-white: #fff;
  --font-ja: "Noto Sans JP", "Hiragino Sans", "Yu Gothic", sans-serif;
  --font-round: "Zen Maru Gothic", "Hiragino Maru Gothic ProN", sans-serif;
  --font-en: "Roboto", "Helvetica Neue", Arial, sans-serif;
  --font-hand: "Caveat", cursive;
  /* デザイン1pxを表す可変単位。SPは375px基準で、1024px未満まで画面幅いっぱいに比例 */
  --u: 0.26667vw;
  /* 文字用の単位。タブレット幅で文字が肥大しないよう、450px幅相当（1.2px：16px → 19.2px）で頭打ち */
  --fu: min(var(--u), 1.2px);
  /* SP下部固定バーの高さ。文字に合わせて頭打ちにする。カスタムプロパティの値は補間して渡す */
  --bar-h: calc(54 * var(--fu));
}
@media (min-width: 1024px) {
  :root {
    /* PCレイアウトは1440px基準。1440pxまでは画面幅に比例して拡大縮小し、
    それより広い画面ではデザインどおりの大きさで止める（中身は中央寄せ・背景のみ全幅） */
    --u: min(0.06944vw, 1px);
    /* 1024〜1150px前後（タブレット横向き・小さめのPC）ではレイアウトと一緒に文字まで縮むため、
    文字だけ 0.8px（16px → 12.8px）を下限にする */
    --fu: max(var(--u), 0.8px);
    --bar-h: 0px;
  }
}

/* body の overflow は html が visible だと画面（viewport）に引き渡され、body 自体では切り取られない。
   html 側にも指定して、body の overflow-x: clip が確実に効くようにする */
html {
  overflow-x: clip;
  /* ページ内リンク（#〜）はスムーススクロール */
  scroll-behavior: smooth;
}
@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
}

body {
  font-family: var(--font-ja);
  color: var(--color-text);
  background: var(--color-white);
  line-height: 1.8;
  /* 全幅背景（bp.bleed）や装飾のはみ出しで横スクロールが出ないようにする */
  overflow-x: clip;
  /* 括弧などの約物をブラウザ側で詰めない（デザインと同じ字送りにする） */
  text-spacing-trim: space-all;
  /* 日本語を文節（意味のまとまり）単位で折り返す。未対応ブラウザは通常の折り返し */
  word-break: auto-phrase;
}

/* =============================================
   角丸コンテナ内のメディア
   overflow:hidden のクリップだけだと角がジャギーになるため、
   中の画像にも同じ角丸を継承させる
============================================= */
.p-main-visual__visual img,
.p-top-concept__img img,
.p-top-reason__img img,
.p-top-greeting__img img,
.p-top-blog__img > img,
.p-top-blog__ph {
  border-radius: inherit;
}

.l-wrapper {
  /* 下層ページのヘッダー（絶対配置）の基準 */
  position: relative;
  overflow-x: hidden;
  padding-bottom: var(--bar-h);
}
@media (min-width: 1024px) {
  .l-wrapper {
    /* PCレイアウトは1440pxで頭打ちにして中央寄せ。
    全幅の背景は bp.bleed でこの枠の外（画面端）まで伸ばし、html の overflow で隠す */
    max-width: calc(1440 * var(--u));
    margin-inline: auto;
    overflow-x: visible;
  }
}

/* =============================================
   Layout: ヘッダー
============================================= */
.l-header {
  position: absolute;
  inset: 0;
  /* ドロワー（子要素）を下部固定バー(z-index:50)より前面に出すため */
  z-index: 60;
}
@media (min-width: 1024px) {
  .l-header {
    z-index: 10;
  }
}
.l-header {
  /* ---------------------------------------------
     下層ページのヘッダー
     ページタイトル（クリーム背景）の上に重ねて表示する
  --------------------------------------------- */
}
.l-header--lower {
  inset: 0 0 auto;
  height: calc(54 * var(--u));
}
@media (min-width: 1024px) {
  .l-header--lower {
    height: calc(140 * var(--u));
  }
}
.l-header--lower {
  /* SPのロゴはTOPより小さい（デザイン：228×54） */
}
.l-header--lower .c-logo-sp {
  left: calc(-6 * var(--fu));
  top: 0;
  width: calc(228 * var(--fu));
}
@media (min-width: 1024px) {
  .l-header--lower .l-drawer {
    /* グローバルナビを横並びに */
    left: calc(319 * var(--u));
    /* 右端も固定し、項目の間隔で幅を吸収する（スクロールバー分などで幅が足りないとき「採用情報」が切れないように） */
    right: calc(54 * var(--u));
    top: calc(55 * var(--u));
  }
}
.l-header--lower .l-drawer {
  /* メニューを開いたときのロゴも同じ位置・大きさに揃える */
}
.l-header--lower .l-drawer__logo {
  left: calc(-6 * var(--fu));
  top: 0;
  width: calc(228 * var(--fu));
}
.l-header--lower {
  /* ロゴ（縦組み・TOPの約0.66倍） */
}
@media (min-width: 1024px) {
  .l-header--lower .c-logo {
    left: calc(30 * var(--u));
    top: calc(28 * var(--u));
    width: calc(157 * var(--u));
  }
}
@media (min-width: 1024px) {
  .l-header--lower .c-logo__mark {
    margin-bottom: calc(10 * var(--u));
  }
}
@media (min-width: 1024px) {
  .l-header--lower .c-logo__en {
    margin-top: calc(4.6 * var(--u));
  }
}
@media (min-width: 1024px) {
  .l-header--lower .c-gnav__list {
    display: flex;
    justify-content: space-between;
    gap: calc(16 * var(--u));
  }
}
@media (min-width: 1024px) {
  .l-header--lower .c-gnav__link {
    gap: 0;
    /* 横並びのナビは1行に収める必要があるため、文字の下限（bp.fs）は使わずレイアウトと一緒に縮める */
    font-size: calc(16 * var(--u));
    letter-spacing: calc(1.92 * var(--u));
  }
}
@media (min-width: 1024px) {
  .l-header--lower .c-gnav__link::before {
    display: none;
  }
}
@media (min-width: 1024px) {
  .l-header--lower .c-gnav__row {
    gap: calc(6 * var(--u));
  }
}
.l-header--lower .c-gnav {
  /* 子メニューは項目の下に表示 */
}
@media (min-width: 1024px) {
  .l-header--lower .c-gnav__panel {
    right: auto;
    left: 50%;
    top: calc(100% + calc(16 * var(--u)));
    transform: translateX(-50%);
  }
}
@media (min-width: 1024px) {
  .l-header--lower .c-gnav__item + .c-gnav__item {
    margin-top: 0;
  }
}
.l-header--lower {
  /* WEB予約ボタンは画面右下に常時表示 */
}
@media (min-width: 1024px) {
  .l-header--lower .c-btn-reserve {
    left: auto;
    right: calc(40 * var(--u));
    top: auto;
    bottom: calc(40 * var(--u));
  }
}

/* =============================================
   Layout: ドロワー / グローバルナビ
============================================= */
.l-drawer {
  position: fixed;
  inset: 0;
  z-index: 55;
  overflow-y: auto;
  background: var(--color-bg);
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.4s, visibility 0.4s;
}
@media (min-width: 1024px) {
  .l-drawer {
    position: absolute;
    inset: auto;
    left: 80.972%;
    top: 20%;
    overflow: visible;
    background: none;
    opacity: 1;
    visibility: visible;
  }
}
.l-drawer.is-open {
  opacity: 1;
  visibility: visible;
}
.l-drawer {
  /* ドロワーは画面全体を覆うが、中身はページ本体と同じ幅・同じ位置に揃える */
}
.l-drawer__inner {
  position: relative;
  min-height: 100%;
}
@media (min-width: 1024px) {
  .l-drawer__inner {
    min-height: 0;
  }
}
.l-drawer {
  /* デザインではメニューを開くとロゴとボタンが3〜7pxずれているが、
  開閉で動いて見えるため、閉じている状態（ヘッダー）の位置に合わせている */
}
.l-drawer__logo {
  position: absolute;
  left: calc(-15 * var(--fu));
  top: calc(-7 * var(--fu));
  /* ヘッダーのロゴ・ハンバーガーと同じく、文字単位で頭打ち */
  width: calc(320 * var(--fu));
}
.l-drawer__logo img {
  width: 100%;
}
.l-drawer__close {
  position: absolute;
  right: calc(13 * var(--fu));
  top: calc(10 * var(--fu));
  display: flex;
  align-items: center;
  justify-content: center;
  width: calc(44 * var(--fu));
  height: calc(44 * var(--fu));
  border-radius: 50%;
  background: var(--color-cream);
  transition: opacity 0.3s;
}
.l-drawer__close:hover {
  opacity: 0.8;
}
.l-drawer__close span {
  position: absolute;
  width: calc(20 * var(--fu));
  height: calc(1.5 * var(--fu));
  border-radius: 999px;
  background: var(--color-white);
}
.l-drawer__close span:nth-child(1) {
  transform: rotate(45deg);
}
.l-drawer__close span:nth-child(2) {
  transform: rotate(-45deg);
}
@media (min-width: 1024px) {
  .l-drawer__logo, .l-drawer__close {
    display: none;
  }
}

/* =============================================
   Layout: 下部固定バー（SPのみ）
============================================= */
.l-fixed-bar {
  position: fixed;
  left: 50%;
  bottom: 0;
  z-index: 50;
  display: flex;
  width: 100%;
  height: var(--bar-h);
  transform: translateX(-50%);
}
@media (min-width: 1024px) {
  .l-fixed-bar {
    display: none;
  }
}
.l-fixed-bar__item {
  display: flex;
  flex: 1;
  align-items: center;
  justify-content: center;
  gap: calc(10 * var(--fu));
  color: var(--color-white);
  font-size: calc(16 * var(--fu));
  line-height: 1;
}
.l-fixed-bar__item--line {
  gap: calc(5 * var(--fu));
  background: var(--color-line-green);
  font-weight: 500;
  letter-spacing: calc(1.92 * var(--fu));
}
.l-fixed-bar__item--reserve {
  gap: calc(12 * var(--fu));
  background: var(--color-orange);
  font-weight: 500;
  letter-spacing: calc(1.92 * var(--fu));
}
.l-fixed-bar {
  /* バーは高さを文字に合わせて頭打ちにしているため、アイコン・余白も文字単位（bp.fs）で揃える */
}
.l-fixed-bar__icon {
  width: calc(23 * var(--fu));
}
.l-fixed-bar__icon--line {
  width: calc(38 * var(--fu));
}

/* =============================================
   フッター
============================================= */
.l-footer {
  position: relative;
  /* 波（フッター上端から23〜52px）がクリーム面の末端に重なる位置まで引き上げる */
  margin-top: calc(-52 * var(--u));
  padding-bottom: calc(40 * var(--u));
  /* 背景は敷かない。クリーム面との境目は __wave（白）で作る */
  background: none;
}
@media (min-width: 1024px) {
  .l-footer {
    /* デザインは1068px。診療時間の注記ぶんナビを下げたので74px高くしている */
    height: calc(1142 * var(--u));
    margin-top: calc(-117 * var(--u));
    padding: 0;
    background: none;
  }
}
.l-footer__wave {
  position: absolute;
  left: 0;
  top: calc(23 * var(--u));
  width: 100%;
  height: calc(29 * var(--u));
  background: url("../img/top/wave-footer-sp.svg?v=20260917") no-repeat center/100% 100%;
  left: calc(50% - 50vw - 4px);
  width: calc(100vw + 8px);
}
@media (min-width: 1024px) {
  .l-footer__wave {
    top: calc(55 * var(--u));
    height: calc(107.5 * var(--u));
    background-image: url("../img/top/wave-footer.svg?v=20260917");
  }
}
.l-footer__wave {
  /* 直前のセクションがクリーム面でないページ用。
  波はクリーム色（波の下＝クリーム）に差し替え、その下もクリームで塗る */
}
.has-footer-cream .l-footer__wave {
  background-image: url("../img/top/wave-footer-cream-sp.svg?v=20260930");
}
@media (min-width: 1024px) {
  .has-footer-cream .l-footer__wave {
    background-image: url("../img/top/wave-footer-cream.svg?v=20260930");
  }
}
.has-footer-cream .l-footer::before {
  content: "";
  position: absolute;
  top: calc(52 * var(--u));
  bottom: 0;
  background: #f8f1de;
  left: calc(50% - 50vw - 4px);
  width: calc(100vw + 8px);
}
@media (min-width: 1024px) {
  .has-footer-cream .l-footer::before {
    top: calc(162.5 * var(--u));
  }
}
.l-footer__trees {
  position: absolute;
  left: calc(211 * var(--u));
  top: 0;
  width: calc(158.83 * var(--u));
  pointer-events: none;
}
@media (min-width: 1024px) {
  .l-footer__trees {
    left: auto;
    right: calc(19.88 * var(--u));
    top: 0;
    width: calc(478.12 * var(--u));
  }
}
.l-footer__inner {
  position: relative;
  padding-top: calc(58 * var(--u));
  text-align: center;
}
@media (min-width: 1024px) {
  .l-footer__inner {
    height: 100%;
    margin-inline: auto;
    padding: 0;
  }
}
.l-footer__logo {
  display: block;
  /* 素材は余白込みのため枠は431px（デザイン値）。表示上のロゴ幅は約323px。
  親より広い場合 margin:auto が効かないため translateX で中央寄せする */
  width: calc(431 * var(--u));
  margin-left: 50%;
  transform: translateX(-50%);
}
@media (min-width: 1024px) {
  .l-footer__logo {
    position: absolute;
    left: calc(603 * var(--u));
    top: calc(175 * var(--u));
    width: calc(237 * var(--u));
    margin: 0;
    transform: none;
  }
}
.l-footer__logo-h {
  width: 100%;
}
@media (min-width: 1024px) {
  .l-footer__logo-h {
    display: none;
  }
}
.l-footer__logo-v {
  display: none;
}
@media (min-width: 1024px) {
  .l-footer__logo-v {
    display: block;
  }
}
.l-footer__logo-mark {
  width: calc(69.3 * var(--u));
  margin: 0 auto calc(15 * var(--u));
}
.l-footer__logo-ja {
  width: 100%;
}
.l-footer__logo-en {
  width: 82.945%;
  margin: calc(7 * var(--u)) auto 0;
}
.l-footer {
  /* デザインではロゴ画像（余白込み）の直下からTELが始まる */
}
.l-footer__info {
  margin-top: 0;
}
@media (min-width: 1024px) {
  .l-footer__info {
    position: absolute;
    left: calc(230 * var(--u));
    top: calc(386 * var(--u));
    /* 診療時間表の手前まで。タブレット横で住所が表の下に潜らないよう、収まらなければ折り返す */
    width: calc(422 * var(--u));
    margin: 0;
    text-align: left;
  }
}
.l-footer__tel {
  font-family: var(--font-en);
  font-size: calc(18 * var(--fu));
  letter-spacing: calc(2.16 * var(--fu));
  line-height: calc(28 * var(--fu));
  color: #26211f;
}
.l-footer__tel strong {
  font-size: calc(24 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(2.16 * var(--fu));
}
.l-footer__address {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: calc(4 * var(--u));
  margin-top: calc(12 * var(--u));
  font-size: calc(16 * var(--fu));
  letter-spacing: calc(1.92 * var(--fu));
  line-height: calc(19 * var(--fu));
  color: #26211f;
}
@media (min-width: 1024px) {
  .l-footer__address {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    gap: calc(6 * var(--u)) calc(11 * var(--u));
    margin-top: calc(16 * var(--u));
  }
}
.l-footer__zip {
  font-family: var(--font-en);
}
.l-footer__map {
  margin-top: calc(28 * var(--u));
}
@media (min-width: 1024px) {
  .l-footer__map {
    margin-top: calc(32 * var(--u));
  }
}
.l-footer {
  /* --- 診療時間表 --- */
}
.l-footer__hours {
  margin-top: calc(32 * var(--u));
  padding-inline: calc(12 * var(--u));
}
@media (min-width: 1024px) {
  .l-footer__hours {
    position: absolute;
    left: calc(662 * var(--u));
    top: calc(363 * var(--u));
    width: calc(548 * var(--u));
    margin: 0;
    padding: 0;
  }
}
.l-footer__copyright {
  margin-top: calc(56 * var(--u));
  padding: calc(11 * var(--u)) 0;
  background: var(--color-bg);
  text-align: center;
  font-size: calc(12 * var(--fu));
  letter-spacing: calc(0.96 * var(--fu));
  line-height: 1.5;
  color: #26211f;
}
@media (min-width: 1024px) {
  .l-footer__copyright {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    margin: 0;
    padding: calc(18 * var(--u)) 0;
    font-size: calc(15 * var(--fu));
    letter-spacing: calc(1.8 * var(--fu));
    left: calc(50% - 50vw - 4px);
    width: calc(100vw + 8px);
  }
}

/* =============================================
   Component: ローディング（TOPのみ）
   ロゴマーク → 病院名の順に現れ、読み込み完了後にフェードアウト
============================================= */
.c-loading {
  position: fixed;
  inset: 0;
  z-index: 100;
  display: grid;
  place-items: center;
  background: var(--color-white);
  transition: opacity 0.7s ease, visibility 0.7s;
  /* JSなし・2回目以降・動きを減らす設定では出さない */
}
html:not(.js) .c-loading, .is-loading-skip .c-loading {
  display: none;
}
@media (prefers-reduced-motion: reduce) {
  .c-loading {
    display: none;
  }
}
.c-loading.is-done {
  opacity: 0;
  visibility: hidden;
}
.c-loading__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: calc(16 * var(--fu));
}
.c-loading__mark {
  width: calc(80 * var(--fu));
  animation: c-loading-in 0.9s ease 0.1s both;
}
.c-loading__name {
  width: calc(220 * var(--fu));
  animation: c-loading-in 0.9s ease 0.6s both;
}

@keyframes c-loading-in {
  0% {
    opacity: 0;
    translate: 0 calc(12 * var(--fu));
  }
  100% {
    opacity: 1;
    translate: 0 0;
  }
}
/* --- 縦ロゴ（PC） --- */
.c-logo {
  display: none;
  position: absolute;
  left: 3.056%;
  top: 35.834%;
  width: 16.528%;
}
@media (min-width: 1024px) {
  .c-logo {
    display: block;
  }
}
.c-logo__link {
  display: block;
}
.c-logo__mark {
  width: 29.118%;
  margin: 0 0 calc(15 * var(--u)) 39.79%;
}
.c-logo__name {
  width: 100%;
}
.c-logo__en {
  width: 82.945%;
  margin: calc(7 * var(--u)) auto 0;
}

/* --- 横ロゴ（SP） --- */
.c-logo-sp {
  position: absolute;
  left: calc(-15 * var(--fu));
  top: calc(-7 * var(--fu));
  /* タブレット幅で肥大しないよう、文字と同じく頭打ちにする */
  width: calc(320 * var(--fu));
}
@media (min-width: 1024px) {
  .c-logo-sp {
    display: none;
  }
}
.c-logo-sp img {
  width: 100%;
}

/* --- 電話番号・住所（PC） --- */
.c-header-info {
  display: none;
  position: absolute;
  /* 文字に下限があり狭い画面では横幅が伸びるため、右端基準で置く */
  right: calc(30 * var(--u));
  top: 3.034%;
  align-items: center;
  gap: calc(18 * var(--u));
  height: calc(35 * var(--u));
}
@media (min-width: 1024px) {
  .c-header-info {
    display: flex;
  }
}
.c-header-info__tel {
  font-family: var(--font-en);
  font-size: calc(18 * var(--fu));
  letter-spacing: calc(2.16 * var(--fu));
  line-height: 1;
  white-space: nowrap;
}
.c-header-info__tel strong {
  font-size: calc(24 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.44 * var(--fu));
}
.c-header-info__divider {
  width: 1px;
  height: 100%;
  background: var(--color-text);
}
.c-header-info__address {
  display: flex;
  align-items: center;
  gap: calc(11 * var(--u));
  font-size: calc(16 * var(--fu));
  letter-spacing: calc(1.92 * var(--fu));
  line-height: 1;
  white-space: nowrap;
}
.c-header-info__zip {
  font-family: var(--font-en);
}

/* --- ハンバーガー（SP） --- */
.c-hamburger {
  position: absolute;
  /* 大きさ・位置は文字と同じく頭打ち（ロゴと揃える）。右端基準で置く */
  right: calc(13 * var(--fu));
  top: calc(10 * var(--fu));
  z-index: 60;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: calc(2.5 * var(--fu));
  width: calc(44 * var(--fu));
  height: calc(44 * var(--fu));
  border-radius: 50%;
  background: var(--color-cream);
}
@media (min-width: 1024px) {
  .c-hamburger {
    /* PCではハンバーガーは不要 */
    display: none;
  }
}
.c-hamburger {
  /* ドロワーを開いている間は閉じるボタンと重なるため隠す */
}
.is-drawer-open .c-hamburger {
  visibility: hidden;
}
.c-hamburger__line {
  display: block;
  width: calc(20 * var(--fu));
  height: calc(1.5 * var(--fu));
  border-radius: 999px;
  background: var(--color-white);
  transition: transform 0.3s, opacity 0.3s;
}

.c-gnav {
  padding: calc(96 * var(--u)) calc(28 * var(--u)) calc(48 * var(--u));
}
@media (min-width: 1024px) {
  .c-gnav {
    padding: 0;
  }
}
.c-gnav__item {
  padding-bottom: calc(12 * var(--u));
  border-bottom: 1px solid var(--color-chip);
}
@media (min-width: 1024px) {
  .c-gnav__item {
    padding-bottom: 0;
    border-bottom: none;
    /* 子メニュー：メニュー文字・矢印のどちらを押しても、ナビの左側にパネルで表示 */
    position: relative;
  }
}
.c-gnav__item + .c-gnav__item {
  margin-top: calc(16 * var(--u));
}
@media (min-width: 1024px) {
  .c-gnav__item + .c-gnav__item {
    margin-top: calc(24 * var(--u));
  }
}
.c-gnav__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-inline: calc(12 * var(--u));
}
@media (min-width: 1024px) {
  .c-gnav__row {
    justify-content: flex-start;
    gap: calc(8 * var(--u));
    padding-inline: 0;
  }
}
.c-gnav__row:has(.c-gnav__toggle) {
  /* 子メニューを持つ項目は、文字をタップしても開閉する */
}
.c-gnav__row:has(.c-gnav__toggle) .c-gnav__link {
  cursor: pointer;
}
.c-gnav__link {
  font-size: calc(16 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.28 * var(--fu));
  line-height: calc(24 * var(--fu));
  color: var(--color-nav);
  transition: color 0.3s;
}
@media (min-width: 1024px) {
  .c-gnav__link {
    display: flex;
    align-items: center;
    gap: calc(12 * var(--u));
    letter-spacing: calc(1.92 * var(--fu));
    white-space: nowrap;
  }
}
.c-gnav__link:hover {
  color: var(--color-orange);
}
@media (min-width: 1024px) {
  .c-gnav__link::before {
    content: "";
    flex-shrink: 0;
    width: calc(4 * var(--u));
    height: calc(4 * var(--u));
    border-radius: 50%;
    background: var(--color-orange);
  }
}
.c-gnav__toggle {
  flex-shrink: 0;
  width: calc(12 * var(--u));
  height: calc(7 * var(--u));
  background: url("../img/common/arrow-nav.svg?v=20260917") no-repeat center/contain;
  transform: rotate(180deg);
  transition: transform 0.3s;
}
.c-gnav__toggle[aria-expanded=true] {
  transform: rotate(0deg);
}
.c-gnav__panel {
  padding: calc(12 * var(--u)) 0 0 calc(15 * var(--u));
}
@media (min-width: 1024px) {
  .c-gnav__panel {
    position: absolute;
    right: calc(100% + calc(24 * var(--u)));
    top: calc(-16 * var(--u));
    z-index: 20;
    padding: calc(16 * var(--u));
    border-radius: calc(12 * var(--u));
    background: var(--color-white);
    box-shadow: 0 calc(4 * var(--u)) calc(16 * var(--u)) rgba(0, 0, 0, 0.12);
  }
}
.c-gnav__panel[hidden] {
  display: none;
}
.c-gnav__chips {
  display: grid;
  grid-template-columns: repeat(2, calc(140 * var(--u)));
  gap: calc(6 * var(--u)) calc(9 * var(--u));
}
.c-gnav__chips a {
  display: flex;
  align-items: center;
  justify-content: center;
  height: calc(32 * var(--u));
  border-radius: calc(20 * var(--u));
  background: var(--color-chip);
  color: var(--color-white);
  font-size: calc(16 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.92 * var(--fu));
  line-height: 1;
  transition: opacity 0.3s;
}
@media (min-width: 1024px) {
  .c-gnav__chips a {
    padding-inline: calc(12 * var(--u));
    white-space: nowrap;
  }
}
.c-gnav__chips a:hover {
  opacity: 0.85;
}

/* --- フッターナビ（SPでは非表示：SPデザインに準拠） --- */
.c-fnav {
  display: none;
}
@media (min-width: 1024px) {
  .c-fnav {
    position: absolute;
    left: calc(230 * var(--u));
    /* 診療時間表の下に注記（★・※）があるぶん、デザイン（596px）より74px下げている */
    top: calc(670 * var(--u));
    display: flex;
    gap: calc(0 * var(--u));
    width: calc(978 * var(--u));
    text-align: left;
  }
}
.c-fnav__link {
  position: relative;
  display: block;
  padding-left: calc(12 * var(--u));
  font-size: calc(18 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(2.16 * var(--fu));
  line-height: calc(22 * var(--fu));
  /* デザインどおり折り返さない（「診療時間・アクセス」が2行になるのを防ぐ） */
  white-space: nowrap;
  color: var(--color-text);
  transition: color 0.3s;
}
.c-fnav__link::before {
  content: "";
  position: absolute;
  left: 0;
  top: calc(9 * var(--u));
  width: calc(4 * var(--u));
  height: calc(4 * var(--u));
  border-radius: 50%;
  background: var(--color-orange);
}
.c-fnav__link:hover {
  color: var(--color-orange);
}
.c-fnav__sub {
  margin-top: calc(16 * var(--u));
}
.c-fnav__sub li + li {
  margin-top: calc(16 * var(--u));
}
.c-fnav__sub a {
  position: relative;
  display: block;
  padding-left: calc(30 * var(--u));
  font-size: calc(16 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.92 * var(--fu));
  line-height: calc(19 * var(--fu));
  color: #726c70;
  transition: color 0.3s;
}
.c-fnav__sub a::before {
  content: "";
  position: absolute;
  left: calc(12 * var(--u));
  top: calc(9 * var(--u));
  width: calc(12 * var(--u));
  height: 1px;
  background: #726c70;
}
.c-fnav__sub a:hover {
  color: var(--color-orange);
}
.c-fnav {
  /* 項目の間隔は gap で取る。隣接セレクタ（item + item）の margin だと、
     .temporary で非表示にした項目の次の項目にも余白が残ってしまうため */
}
.c-fnav__list {
  display: flex;
  flex-direction: column;
  gap: calc(37 * var(--u));
}
@media (min-width: 1024px) {
  .c-fnav__list:nth-child(1) {
    width: calc(276 * var(--u));
  }
}
@media (min-width: 1024px) {
  .c-fnav__list:nth-child(2) {
    width: calc(271 * var(--u));
  }
}
@media (min-width: 1024px) {
  .c-fnav__list:nth-child(3) {
    width: calc(240 * var(--u));
  }
}

.c-hours {
  /* セル間だけ隙間をあけ、表の外周には隙間を作らない
  （border-spacing は外周にも効くため、負のマージンで打ち消す） */
  width: calc(100% + 4 * var(--u));
  margin: calc(-2 * var(--u));
  border-collapse: separate;
  border-spacing: calc(2 * var(--u));
  table-layout: fixed;
  font-size: calc(16 * var(--fu));
  line-height: 1.35;
  letter-spacing: calc(1.28 * var(--fu));
  color: #26211f;
}
@media (min-width: 1024px) {
  .c-hours {
    width: calc(100% + 8 * var(--u));
    margin: calc(-4 * var(--u));
    border-spacing: calc(4 * var(--u));
    font-size: calc(16 * var(--fu));
    letter-spacing: calc(1.92 * var(--fu));
  }
}
.c-hours {
  /* 曜日の見出しだけトラッキングが広い */
}
.c-hours thead th + th {
  letter-spacing: calc(1.92 * var(--fu));
}
.c-hours th,
.c-hours td {
  height: calc(51 * var(--u));
  font-weight: 400;
  text-align: center;
  vertical-align: middle;
}
@media (min-width: 1024px) {
  .c-hours th,
  .c-hours td {
    height: calc(51 * var(--u));
  }
}
.c-hours {
  /* デザインどおり、角丸はセルごとではなく表の四隅だけ（8px） */
}
.c-hours thead th:first-child {
  border-top-left-radius: calc(8 * var(--u));
  width: calc(113 * var(--u));
}
.c-hours thead th:last-child {
  border-top-right-radius: calc(8 * var(--u));
}
.c-hours tbody tr:last-child th {
  border-bottom-left-radius: calc(8 * var(--u));
}
.c-hours tbody tr:last-child td:last-child {
  border-bottom-right-radius: calc(8 * var(--u));
}
.c-hours thead th {
  background: #d8cfc4;
}
.c-hours tbody th,
.c-hours tbody td {
  background: #faf9f7;
}
.c-hours tbody th {
  width: calc(113 * var(--u));
  font-family: var(--font-en);
}
.c-hours .is-open,
.c-hours .is-closed {
  display: inline-block;
  vertical-align: middle;
}
.c-hours .is-open {
  width: calc(16 * var(--u));
  height: calc(16 * var(--u));
  border-radius: 50%;
  background: var(--color-orange);
}
@media (min-width: 1024px) {
  .c-hours .is-open {
    width: calc(18 * var(--u));
    height: calc(18 * var(--u));
  }
}
.c-hours .is-closed {
  width: calc(16 * var(--u));
  height: 1px;
  background: var(--color-text);
}
@media (min-width: 1024px) {
  .c-hours .is-closed {
    width: calc(18 * var(--u));
  }
}
.c-hours {
  /* 時間が異なる日（★）。時間は表の下の注記（.c-hours-note）に記載 */
}
.c-hours .is-star {
  font-size: calc(18 * var(--fu));
  line-height: 1;
}
.c-hours .is-star--sat {
  color: var(--color-num);
}
.c-hours .is-star--sun {
  color: #eca089;
}
@media (min-width: 1024px) {
  .c-hours thead th:first-child,
  .c-hours tbody th {
    width: calc(156 * var(--u));
  }
}

/* =============================================
   診療時間表の注記（★・※）
============================================= */
.c-hours-note {
  margin-top: calc(8 * var(--u));
  text-align: left;
  font-size: calc(13 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(0.65 * var(--fu));
  line-height: calc(24 * var(--fu));
  color: #26211f;
}
@media (min-width: 1024px) {
  .c-hours-note {
    margin-top: calc(10 * var(--u));
    font-size: calc(14 * var(--fu));
    letter-spacing: calc(1.68 * var(--fu));
    line-height: calc(22 * var(--fu));
  }
}
.c-hours-note__item {
  position: relative;
  padding-left: 1.4em;
}
.c-hours-note__item::before {
  position: absolute;
  left: 0;
  top: 0;
}
.c-hours-note__item--sat::before {
  content: "★";
  color: var(--color-num);
}
.c-hours-note__item--sun::before {
  content: "★";
  color: #eca089;
}
.c-hours-note__item--note::before {
  content: "※";
  color: var(--color-orange);
}
.c-hours-note em {
  font-style: normal;
  color: var(--color-orange);
}

.c-heading {
  /* =============================================
     Component
  ============================================= */
  /* --- 見出し（英字＋和文） --- */
}
.c-heading__en {
  display: block;
  font-family: var(--font-en);
  font-weight: 700;
  font-size: calc(32 * var(--fu));
  letter-spacing: calc(3.84 * var(--fu));
  line-height: 1.1875;
  color: var(--color-title);
  white-space: nowrap;
  /* 大きい英字見出し（Concept など） */
}
.c-heading__en--lg {
  font-size: calc(40 * var(--fu));
  letter-spacing: calc(4.8 * var(--fu));
}
.c-heading__en em {
  font-style: normal;
  color: var(--color-orange);
}
.c-heading__ja {
  display: block;
  margin-top: calc(6 * var(--u));
  font-size: calc(16 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.92 * var(--fu));
  line-height: 1.1875;
  color: var(--color-title);
  white-space: nowrap;
}
.c-heading {
  /* --- 和文主体の見出し（ご挨拶・ブログ・症例紹介） --- */
}
.c-heading__main {
  display: block;
  font-size: calc(40 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(4.8 * var(--fu));
  line-height: calc(48 * var(--fu));
  color: var(--color-title);
  white-space: nowrap;
}
.c-heading__main em {
  font-style: normal;
  color: var(--color-orange);
}
.c-heading__sub {
  display: block;
  margin-top: calc(6 * var(--u));
  font-family: var(--font-en);
  font-weight: 500;
  font-size: calc(16 * var(--fu));
  letter-spacing: calc(1.92 * var(--fu));
  line-height: 1.1875;
  color: var(--color-text);
  white-space: nowrap;
}
.c-heading {
  /* 和文見出しの上に置く英字ラベル（下層ページ） */
}
.c-heading__label {
  display: block;
  margin-bottom: calc(8 * var(--u));
  font-family: var(--font-en);
  font-weight: 500;
  font-size: calc(16 * var(--fu));
  letter-spacing: calc(1.92 * var(--fu));
  line-height: 1.1875;
  color: var(--color-title);
  white-space: nowrap;
}
.c-heading {
  /* 下層ページの見出しはSPで26px（長い見出しも2〜3行に収める） */
}
.c-heading--lower {
  text-align: center;
}
.c-heading--lower .c-heading__main {
  font-size: calc(26 * var(--fu));
  letter-spacing: calc(3.12 * var(--fu));
  line-height: calc(40 * var(--fu));
  white-space: normal;
}
@media (min-width: 1024px) {
  .c-heading--lower .c-heading__main {
    font-size: calc(40 * var(--fu));
    letter-spacing: calc(4.8 * var(--fu));
    line-height: calc(48 * var(--fu));
  }
}

/* =============================================
   Component: 予約ボタン（WEB予約／LINE／電話）
============================================= */
.c-reserve-btns {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: calc(12 * var(--u));
}
@media (min-width: 1024px) {
  .c-reserve-btns {
    gap: calc(14 * var(--u));
  }
}
.c-reserve-btns {
  /* --- メインビジュアル内の予約ボタン（PCのみ） --- */
}
.c-reserve-btns--mv {
  display: none;
}
@media (min-width: 1024px) {
  .c-reserve-btns--mv {
    position: absolute;
    /* 1440×725 のデザイン上で left:1166px / top:564px。
    メインビジュアルが全幅に広がっても位置が合うよう％で指定 */
    left: 80.972%;
    top: 77.793%;
    z-index: 70;
    display: flex;
    flex-direction: column;
    gap: calc(14 * var(--u));
  }
}

.c-btn-web,
.c-btn-line {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: calc(52 * var(--u));
  border-radius: calc(8 * var(--u));
  color: var(--color-white);
  font-size: calc(16 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.92 * var(--fu));
  line-height: 1;
  transition: opacity 0.3s;
}
@media (min-width: 1024px) {
  .c-btn-web,
  .c-btn-line {
    width: calc(181 * var(--u));
  }
}

.c-btn-web {
  gap: calc(13 * var(--u));
  background: var(--color-orange);
}
.c-btn-web__icon {
  width: calc(23 * var(--u));
}

.c-btn-line {
  gap: calc(8 * var(--u));
  background: var(--color-line-green);
}
.c-btn-line__icon {
  width: calc(32 * var(--u));
}

.c-btn-tel {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: calc(7 * var(--u));
  width: 100%;
  height: calc(41 * var(--u));
  border: 1px solid var(--color-orange);
  border-radius: calc(20.5 * var(--u));
  background: var(--color-white);
  font-family: var(--font-en);
  font-size: calc(16 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(0.96 * var(--fu));
  line-height: 1;
  color: var(--color-orange);
  transition: opacity 0.3s;
}
@media (min-width: 1024px) {
  .c-btn-tel {
    width: calc(180 * var(--u));
  }
}
.c-btn-tel__icon {
  width: calc(20 * var(--u));
}

.c-btn-web:hover,
.c-btn-line:hover,
.c-btn-tel:hover {
  opacity: 0.85;
}

/* =============================================
   Component: 画面右端に追尾する予約ボタン（PCのみ）
============================================= */
.c-side-reserve {
  display: none;
}
@media (min-width: 1024px) {
  .c-side-reserve {
    position: fixed;
    right: calc(16 * var(--u));
    top: 50%;
    z-index: 70;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: calc(12 * var(--u));
    transform: translateY(-50%);
    /* メインビジュアルの間は隠す（JSで .is-visible を付け外し） */
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s;
  }
}
@media (min-width: 1024px) {
  .c-side-reserve.is-visible {
    opacity: 1;
    visibility: visible;
  }
}
@media (min-width: 1024px) {
  .c-side-reserve__web {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: calc(10 * var(--u));
    width: calc(52 * var(--u));
    height: calc(181 * var(--u));
    padding-top: calc(26 * var(--u));
    border-radius: calc(8 * var(--u));
    background: var(--color-orange);
    color: var(--color-white);
    font-size: calc(16 * var(--fu));
    font-weight: 500;
    letter-spacing: calc(1.92 * var(--fu));
    line-height: calc(19 * var(--fu));
    text-align: center;
    transition: opacity 0.3s;
  }
}
@media (min-width: 1024px) {
  .c-side-reserve__icon {
    width: calc(23 * var(--u));
  }
}
@media (min-width: 1024px) {
  .c-side-reserve__line {
    display: flex;
    align-items: center;
    justify-content: center;
    width: calc(52 * var(--u));
    height: calc(52 * var(--u));
    border-radius: calc(8 * var(--u));
    background: var(--color-line-green);
    transition: opacity 0.3s;
  }
}
@media (min-width: 1024px) {
  .c-side-reserve__line img {
    width: calc(32 * var(--u));
  }
}
@media (min-width: 1024px) {
  .c-side-reserve__web:hover, .c-side-reserve__line:hover {
    opacity: 0.85;
  }
}

/* =============================================
   Component: 枠線ボタン（一覧を見る）
============================================= */
.c-btn-outline {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: calc(14 * var(--u));
  width: calc(240 * var(--u));
  height: calc(50 * var(--u));
  border: 1px solid var(--color-orange);
  border-radius: 999px;
  background: var(--color-white);
  color: var(--color-orange);
  font-size: calc(18 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(2.16 * var(--fu));
  line-height: 1;
  transition: background-color 0.3s, color 0.3s;
}
.c-btn-outline::after {
  content: "";
  width: calc(8 * var(--u));
  height: calc(8 * var(--u));
  border-top: calc(2 * var(--u)) solid currentColor;
  border-right: calc(2 * var(--u)) solid currentColor;
  transform: rotate(45deg);
}
.c-btn-outline:hover {
  background: var(--color-orange);
  color: var(--color-white);
}
.c-btn-outline--sm {
  width: calc(175 * var(--u));
  font-size: calc(16 * var(--fu));
}
.c-btn-outline {
  /* 外部リンク（Google mapを見る など）。矢印の代わりに別窓アイコン。
     ホバーで文字色と一緒に白くなるよう、SVGはマスクにして currentColor で塗る */
}
.c-btn-outline--external {
  width: calc(220 * var(--u));
  font-size: calc(16 * var(--fu));
  letter-spacing: calc(1.92 * var(--fu));
}
.c-btn-outline--external::after {
  width: calc(14 * var(--u));
  height: calc(14 * var(--u));
  border: 0;
  transform: none;
  background: currentColor;
  -webkit-mask: url("../img/icon-external.svg") center/contain no-repeat;
          mask: url("../img/icon-external.svg") center/contain no-repeat;
}

/* =============================================
   Component: 詳細はこちらボタン
============================================= */
.c-btn-detail {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: calc(16 * var(--u));
  width: calc(180 * var(--u));
  height: calc(41 * var(--u));
  border: 1px solid var(--color-orange);
  border-radius: calc(20 * var(--u));
  background: var(--color-white);
  color: var(--color-orange);
  font-size: calc(16 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.92 * var(--fu));
  line-height: 1;
  transition: background-color 0.3s, color 0.3s;
}
.c-btn-detail::after {
  content: "";
  width: calc(6 * var(--u));
  height: calc(6 * var(--u));
  border-top: calc(1.5 * var(--u)) solid currentColor;
  border-right: calc(1.5 * var(--u)) solid currentColor;
  transform: rotate(45deg);
}
.c-btn-detail:hover {
  background: var(--color-orange);
  color: var(--color-white);
}

/* --- 「一覧を見る」リンク --- */
.c-link-more {
  display: inline-flex;
  align-items: center;
  gap: calc(7 * var(--u));
  font-size: calc(16 * var(--fu));
  font-weight: 600;
  letter-spacing: calc(1.92 * var(--fu));
  line-height: 1.1875;
  color: var(--color-title);
  transition: opacity 0.3s;
}
.c-link-more:hover {
  opacity: 0.7;
}
.c-link-more__icon {
  flex-shrink: 0;
  width: calc(24 * var(--u));
}

.c-pagetop {
  /* 画面左下に追尾し、フッターに近づいたらフッターの少し上で止まる
  （止まる位置はJSで transform を設定。少しスクロールしたら .is-show で表示） */
  position: fixed;
  left: 0;
  bottom: calc(var(--bar-h) + calc(16 * var(--u)));
  z-index: 40;
  display: flex;
  align-items: center;
  justify-content: center;
  width: calc(44 * var(--u));
  height: calc(44 * var(--u));
  border-radius: 0 calc(8 * var(--u)) calc(8 * var(--u)) 0;
  background: var(--color-cream);
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s, visibility 0.3s;
}
@media (min-width: 1024px) {
  .c-pagetop {
    left: calc(2 * var(--u));
    width: calc(94 * var(--u));
    height: calc(94 * var(--u));
  }
}
.c-pagetop.is-show {
  opacity: 1;
  visibility: visible;
}
.c-pagetop.is-show:hover {
  opacity: 0.8;
}
.c-pagetop img {
  width: calc(21 * var(--u));
  transform: rotate(-90deg);
}
@media (min-width: 1024px) {
  .c-pagetop img {
    width: calc(28 * var(--u));
  }
}

/* =============================================
   Component: 下層ページのページタイトル
   （クリーム背景＋下端が波の形）
============================================= */
.c-page-title {
  position: relative;
  height: calc(197 * var(--u));
  padding-top: calc(78 * var(--u));
  text-align: center;
}
@media (min-width: 1024px) {
  .c-page-title {
    height: calc(390 * var(--u));
    padding-top: calc(190 * var(--u));
  }
}
.c-page-title::before {
  content: "";
  position: absolute;
  top: 0;
  height: 100%;
  background: url("../img/lower/bg-page-title-sp.svg?v=20260918") no-repeat top center/100% 100%;
  left: calc(50% - 50vw - 4px);
  width: calc(100vw + 8px);
}
@media (min-width: 1024px) {
  .c-page-title::before {
    background-image: url("../img/lower/bg-page-title.svg?v=20260918");
  }
}
.c-page-title__ja {
  position: relative;
  display: block;
  /* 中央揃えの行末に付く字間ぶんを打ち消す（Figmaは最後の文字に字間を付けない） */
  margin-right: calc(-3.84 * var(--u));
  font-size: calc(32 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(3.84 * var(--fu));
  line-height: calc(48 * var(--fu));
  color: var(--color-orange);
}
@media (min-width: 1024px) {
  .c-page-title__ja {
    margin-right: calc(-4.8 * var(--u));
    font-size: calc(40 * var(--fu));
    letter-spacing: calc(4.8 * var(--fu));
  }
}
.c-page-title__en {
  position: relative;
  display: block;
  margin-top: calc(6 * var(--u));
  margin-right: calc(-1.92 * var(--u));
  font-family: var(--font-en);
  font-size: calc(16 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.92 * var(--fu));
  line-height: 1.1875;
  color: var(--color-title);
}
@media (min-width: 1024px) {
  .c-page-title__en {
    margin-top: calc(12 * var(--u));
  }
}

/* =============================================
   Component: パンくずリスト
   （ページタイトルの波の下・右端に重ねる）
============================================= */
.c-breadcrumb {
  position: absolute;
  top: calc(100% - calc(6 * var(--u)));
  right: calc(16 * var(--u));
  left: calc(16 * var(--u));
}
@media (min-width: 1024px) {
  .c-breadcrumb {
    top: calc(358 * var(--u));
    /* 右端に固定のWEB予約ボタンがあるので、重ならない位置まで離す */
    right: calc(80 * var(--u));
    left: calc(80 * var(--u));
  }
}
.c-breadcrumb__list {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: calc(2 * var(--fu)) 0;
}
.c-breadcrumb__item {
  display: flex;
  align-items: center;
  font-size: calc(12 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.44 * var(--fu));
  line-height: calc(18 * var(--fu));
  color: var(--color-text);
}
@media (min-width: 1024px) {
  .c-breadcrumb__item {
    font-size: calc(16 * var(--fu));
    letter-spacing: calc(1.92 * var(--fu));
    line-height: calc(24 * var(--fu));
  }
}
.c-breadcrumb__item {
  /* 区切りの「>」 */
}
.c-breadcrumb__item + .c-breadcrumb__item::before {
  content: "";
  flex-shrink: 0;
  width: calc(6 * var(--fu));
  height: calc(6 * var(--fu));
  margin: 0 calc(11 * var(--fu)) 0 calc(8 * var(--fu));
  border-top: 1px solid currentColor;
  border-right: 1px solid currentColor;
  transform: rotate(45deg);
}
@media (min-width: 1024px) {
  .c-breadcrumb__item + .c-breadcrumb__item::before {
    width: calc(8 * var(--fu));
    height: calc(8 * var(--fu));
    margin: 0 calc(16 * var(--fu)) 0 calc(11 * var(--fu));
  }
}
.c-breadcrumb__link {
  color: var(--color-chip);
  transition: opacity 0.3s;
}
@media (hover: hover) {
  .c-breadcrumb__link:hover {
    opacity: 0.7;
  }
}

/* =============================================
   Component: ページ内リンクのボタン（肉球つき）
============================================= */
.c-anchor-nav {
  display: grid;
  gap: calc(18 * var(--u));
  margin-top: calc(24 * var(--u));
  padding-inline: calc(20 * var(--u));
}
@media (min-width: 1024px) {
  .c-anchor-nav {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: calc(40 * var(--u)) calc(30 * var(--u));
    margin-top: calc(90 * var(--u));
    padding-inline: 0;
  }
}
.c-anchor-nav__link {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  height: calc(58 * var(--u));
  overflow: hidden;
  border-radius: calc(8 * var(--u));
  background: #f3e6b3;
  color: var(--color-title);
  font-size: calc(16 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(2.56 * var(--fu));
  line-height: 1.1875;
  transition: opacity 0.3s;
}
@media (min-width: 1024px) {
  .c-anchor-nav__link {
    height: calc(80 * var(--u));
  }
}
.c-anchor-nav__link:hover {
  opacity: 0.8;
}
.c-anchor-nav__link {
  /* 左下の肉球（下端で切れる。デザインに合わせて左右反転） */
}
.c-anchor-nav__link::before {
  content: "";
  position: absolute;
  left: calc(20 * var(--u));
  top: calc(31 * var(--u));
  width: calc(40 * var(--u));
  height: calc(38 * var(--u));
  transform: scaleX(-1);
  background: url("../img/lower/deco-paw.svg?v=20260918") no-repeat center/contain;
}
@media (min-width: 1024px) {
  .c-anchor-nav__link::before {
    left: calc(24 * var(--u));
    top: calc(43 * var(--u));
    width: calc(54 * var(--u));
    height: calc(51 * var(--u));
  }
}
.c-anchor-nav__link {
  /* 右の下向き矢印 */
}
.c-anchor-nav__link::after {
  content: "";
  position: absolute;
  right: calc(20 * var(--u));
  top: 50%;
  width: calc(28 * var(--u));
  height: calc(28 * var(--u));
  transform: translateY(-50%);
  background: url("../img/lower/icon-anchor-arrow.svg?v=20260918") no-repeat center/contain;
}
@media (min-width: 1024px) {
  .c-anchor-nav__link::after {
    right: calc(42 * var(--u));
  }
}
@media (min-width: 1024px) {
  .c-anchor-nav__item {
    width: calc(380 * var(--u));
  }
}

/* =============================================
   Component: 緑のかっこで挟んだ見出し 【 受付 】
============================================= */
.c-bracket-title {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: calc(16 * var(--u));
  font-size: calc(20 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(2.4 * var(--fu));
  line-height: 1.2;
  color: var(--color-title);
  text-align: center;
}
.c-bracket-title::before, .c-bracket-title::after {
  content: "";
  flex-shrink: 0;
  align-self: stretch;
  min-height: calc(40 * var(--u));
  width: calc(9.57 * var(--u));
  background: url("../img/lower/bracket-l.svg?v=20260918") no-repeat center/100% 100%;
}
.c-bracket-title::after {
  background-image: url("../img/lower/bracket-r.svg?v=20260918");
}
.c-bracket-title {
  /* 大きいサイズ（院内紹介など） */
}
.c-bracket-title--lg {
  font-size: calc(24 * var(--fu));
  letter-spacing: calc(2.88 * var(--fu));
}

/* =============================================
   Component: チェックリスト（緑のチェックアイコン付き）
============================================= */
.c-checklist {
  display: grid;
  /* タブレット縦など幅に余裕があれば2列に折り返す（スマホは1列） */
  grid-template-columns: repeat(auto-fill, minmax(calc(260 * var(--fu)), 1fr));
  gap: calc(12 * var(--u));
}
@media (min-width: 1024px) {
  .c-checklist {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: calc(24 * var(--u)) calc(80 * var(--u));
  }
}
.c-checklist__item {
  position: relative;
  padding-left: calc(34 * var(--fu));
  font-size: calc(14 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.68 * var(--fu));
  line-height: calc(24 * var(--fu));
  color: var(--color-text);
}
@media (min-width: 1024px) {
  .c-checklist__item {
    padding-left: calc(40 * var(--fu));
    font-size: calc(16 * var(--fu));
    letter-spacing: calc(1.92 * var(--fu));
  }
}
.c-checklist__item::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  /* アイコンは文字に合わせる（u だとタブレットで文字より大きくなる） */
  width: calc(24 * var(--fu));
  height: calc(24 * var(--fu));
  background: url("../img/lower/icon-check.svg") no-repeat center/contain;
}

/* =============================================
   Component: 注意書き（！アイコン付き・金色の太字）
============================================= */
.c-alert {
  display: flex;
  align-items: flex-start;
  gap: calc(10 * var(--u));
  font-size: calc(16 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(1.92 * var(--fu));
  line-height: calc(28 * var(--fu));
  color: var(--color-chip);
}
@media (min-width: 1024px) {
  .c-alert {
    justify-content: center;
    min-height: calc(48 * var(--u));
    gap: calc(16 * var(--u));
    font-size: calc(24 * var(--fu));
    letter-spacing: calc(2.88 * var(--fu));
    line-height: calc(29 * var(--fu));
  }
}
.c-alert::before {
  content: "";
  flex-shrink: 0;
  width: calc(32 * var(--u));
  height: calc(32 * var(--u));
  background: url("../img/lower/icon-warning.svg") no-repeat center/contain;
}
@media (min-width: 1024px) {
  .c-alert::before {
    width: calc(48 * var(--u));
    height: calc(48 * var(--u));
    margin-top: calc(-5 * var(--u));
  }
}

/* =============================================
   Component: ワンちゃん／ネコちゃん の見出し（丸アイコン付き）
============================================= */
.c-animal-label {
  display: flex;
  align-items: center;
  gap: calc(16 * var(--u));
  font-size: calc(20 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(2.4 * var(--fu));
  line-height: 1.2;
  color: var(--color-title);
}
@media (min-width: 1024px) {
  .c-animal-label {
    gap: calc(24 * var(--u));
    font-size: calc(24 * var(--fu));
    letter-spacing: calc(2.88 * var(--fu));
  }
}
.c-animal-label::before {
  content: "";
  flex-shrink: 0;
  width: calc(44 * var(--u));
  height: calc(44 * var(--u));
  background: no-repeat center/contain;
}
@media (min-width: 1024px) {
  .c-animal-label::before {
    width: calc(60 * var(--u));
    height: calc(60 * var(--u));
  }
}
.c-animal-label--dog::before {
  background-image: url("../img/lower/icon-dog.svg");
}
.c-animal-label--cat::before {
  background-image: url("../img/lower/icon-cat.svg");
}

.c-dot-list {
  /* =============================================
     Component: オレンジの●付きリスト
  ============================================= */
  /* ●は文字に合わせて大きさ・位置を決める（u だとタブレットで文字より大きくなりずれる） */
}
.c-dot-list > li {
  position: relative;
  padding-left: calc(18 * var(--fu));
}
.c-dot-list > li::before {
  content: "";
  position: absolute;
  left: calc(4 * var(--fu));
  top: calc(50% - calc(4 * var(--fu)));
  width: calc(8 * var(--fu));
  height: calc(8 * var(--fu));
  border-radius: 50%;
  background: var(--color-orange);
}
.c-dot-list {
  /* 2列並び（1列目の幅はデザインに合わせて固定） */
}
.c-dot-list--col2 {
  display: grid;
  grid-template-columns: calc(142 * var(--u)) 1fr;
}
.c-dot-list--narrow {
  grid-template-columns: calc(126 * var(--u)) 1fr;
}
.c-dot-list {
  /* 横並び・折り返し（金色の●。項目間 40px・行間 6px） */
}
.c-dot-list--inline {
  display: flex;
  flex-wrap: wrap;
  gap: calc(4 * var(--fu)) calc(24 * var(--fu));
  margin-block: calc(6 * var(--u));
}
@media (min-width: 1024px) {
  .c-dot-list--inline {
    gap: calc(6 * var(--fu)) calc(40 * var(--fu));
  }
}
.c-dot-list--inline > li::before {
  left: 0;
  /* 1行目の行の中央に置く（lh 単位が使えない古いブラウザは固定値） */
  top: calc(9 * var(--fu));
  top: calc((1lh - calc(10 * var(--fu))) / 2);
  width: calc(10 * var(--fu));
  height: calc(10 * var(--fu));
  background: var(--color-chip);
}
.c-dot-list--pink > li::before {
  background: #eca089;
}

/* =============================================
   Component: 診療の流れ（写真＋番号＋見出し＋説明）
============================================= */
.c-flow {
  display: grid;
  gap: calc(48 * var(--u));
  margin-top: calc(40 * var(--u));
}
@media (min-width: 1024px) {
  .c-flow {
    /* デザインでは左から227pxの位置 */
    gap: calc(80 * var(--u));
    width: calc(980 * var(--u));
    margin: calc(118 * var(--u)) 0 0 calc(227 * var(--u));
  }
}
.c-flow__item {
  position: relative;
}
@media (min-width: 1024px) {
  .c-flow__item {
    display: grid;
    grid-template-columns: calc(300 * var(--u)) 1fr;
    -moz-column-gap: calc(40 * var(--u));
         column-gap: calc(40 * var(--u));
    align-items: start;
  }
}
.c-flow__img {
  overflow: hidden;
  aspect-ratio: 300/240;
  border-radius: calc(24 * var(--u));
}
@media (min-width: 1024px) {
  .c-flow__img {
    border-radius: calc(40 * var(--u));
  }
}
.c-flow__img img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.c-flow__num {
  position: absolute;
  left: calc(-4 * var(--u));
  top: calc(-26 * var(--u));
  font-family: var(--font-hand);
  font-size: calc(72 * var(--u));
  letter-spacing: calc(1.44 * var(--fu));
  line-height: calc(44 * var(--fu));
  color: var(--color-num);
}
@media (min-width: 1024px) {
  .c-flow__num {
    left: calc(232 * var(--u));
    top: calc(-24 * var(--u));
    font-size: calc(96 * var(--u));
    letter-spacing: calc(1.92 * var(--fu));
    line-height: calc(58 * var(--fu));
  }
}
.c-flow__body {
  margin-top: calc(16 * var(--u));
}
@media (min-width: 1024px) {
  .c-flow__body {
    margin-top: 0;
    padding-top: calc(8 * var(--u));
  }
}
.c-flow__body .c-btn-monshin {
  margin-top: calc(16 * var(--u));
}
@media (min-width: 1024px) {
  .c-flow__body .c-btn-monshin {
    margin-top: calc(24 * var(--u));
  }
}
.c-flow__title {
  font-size: calc(20 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(2.4 * var(--fu));
  line-height: calc(36 * var(--fu));
  color: var(--color-title);
}
@media (min-width: 1024px) {
  .c-flow__title {
    font-size: calc(24 * var(--fu));
    letter-spacing: calc(2.88 * var(--fu));
    line-height: calc(48 * var(--fu));
  }
}
.c-flow__text {
  margin-top: calc(8 * var(--u));
  font-size: calc(14 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.68 * var(--fu));
  line-height: calc(28 * var(--fu));
  color: var(--color-text);
}
@media (min-width: 1024px) {
  .c-flow__text {
    margin-top: calc(16 * var(--u));
    font-size: calc(16 * var(--fu));
    letter-spacing: calc(1.92 * var(--fu));
    line-height: calc(32 * var(--fu));
  }
}
.c-flow__text strong {
  font-weight: inherit;
  color: var(--color-orange);
}

/* =============================================
   Component: WEB問診票ボタン（アイコン付きの枠線ボタン）
============================================= */
.c-btn-monshin {
  display: inline-flex;
  align-items: center;
  width: calc(180 * var(--u));
  height: calc(41 * var(--u));
  padding-left: calc(16 * var(--u));
  border: 1px solid var(--color-orange);
  border-radius: calc(20 * var(--u));
  background: var(--color-white);
  color: var(--color-orange);
  font-size: calc(16 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.92 * var(--fu));
  line-height: 1;
  white-space: nowrap;
  transition: background-color 0.3s, color 0.3s;
}
.c-btn-monshin::before {
  content: "";
  flex-shrink: 0;
  width: calc(24 * var(--u));
  height: calc(24 * var(--u));
  margin-right: calc(7 * var(--u));
  background-color: currentColor;
  -webkit-mask: url("../img/common/icon-monshin.svg") no-repeat center/contain;
  mask: url("../img/common/icon-monshin.svg") no-repeat center/contain;
}
.c-btn-monshin::after {
  content: "";
  width: calc(5.5 * var(--u));
  height: calc(5.5 * var(--u));
  margin-left: calc(13 * var(--u));
  border-top: 1px solid currentColor;
  border-right: 1px solid currentColor;
  transform: rotate(45deg);
}
.c-btn-monshin:hover {
  background: var(--color-orange);
  color: var(--color-white);
}

/* =============================================
   Component: 予約ボタン（WEB予約／お電話）
============================================= */
.c-cta {
  display: grid;
  gap: calc(16 * var(--u));
}
@media (min-width: 1024px) {
  .c-cta {
    grid-template-columns: repeat(2, calc(380 * var(--u)));
    gap: calc(24 * var(--u));
  }
}
.c-cta__btn {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  height: calc(72 * var(--u));
  padding-right: calc(12 * var(--u));
  border: calc(2 * var(--u)) solid;
  border-radius: calc(50 * var(--u));
  background: var(--color-white);
  color: var(--color-title);
  font-weight: 700;
  transition: opacity 0.3s;
}
@media (min-width: 1024px) {
  .c-cta__btn {
    height: calc(94 * var(--u));
    padding-right: calc(18 * var(--u));
    border-width: calc(3 * var(--u));
  }
}
.c-cta__btn:hover {
  opacity: 0.7;
}
.c-cta__btn {
  /* 右端の＞ */
}
.c-cta__btn::after {
  content: "";
  position: absolute;
  right: calc(26 * var(--u));
  top: 50%;
  width: calc(8 * var(--u));
  height: calc(8 * var(--u));
  margin-top: calc(-4 * var(--u));
  border-top: calc(2 * var(--u)) solid;
  border-right: calc(2 * var(--u)) solid;
  border-color: inherit;
  transform: rotate(45deg);
}
@media (min-width: 1024px) {
  .c-cta__btn::after {
    right: calc(31 * var(--u));
    width: calc(9 * var(--u));
    height: calc(9 * var(--u));
    margin-top: calc(-4.5 * var(--u));
    border-width: calc(3 * var(--u)) calc(3 * var(--u)) 0 0;
  }
}
.c-cta__btn--web {
  gap: calc(12 * var(--u));
  border-color: var(--color-green);
  font-size: calc(18 * var(--fu));
  letter-spacing: calc(2.16 * var(--fu));
  line-height: 1;
}
@media (min-width: 1024px) {
  .c-cta__btn--web {
    gap: calc(18 * var(--u));
    font-size: calc(24 * var(--fu));
    letter-spacing: calc(2.88 * var(--fu));
  }
}
.c-cta__btn--web::before {
  content: "";
  width: calc(28 * var(--u));
  height: calc(32 * var(--u));
  background: currentColor;
  -webkit-mask: url("../img/common/icon-calendar.svg") no-repeat center/contain;
  mask: url("../img/common/icon-calendar.svg") no-repeat center/contain;
}
@media (min-width: 1024px) {
  .c-cta__btn--web::before {
    width: calc(37.2 * var(--u));
    height: calc(42 * var(--u));
  }
}
.c-cta__btn--tel {
  flex-direction: column;
  gap: calc(6 * var(--u));
  border-color: var(--color-orange);
}
@media (min-width: 1024px) {
  .c-cta__btn--tel {
    gap: calc(8 * var(--u));
    padding-right: 0;
  }
}
.c-cta__label {
  font-size: calc(13 * var(--fu));
  letter-spacing: calc(1.56 * var(--fu));
  line-height: 1;
}
@media (min-width: 1024px) {
  .c-cta__label {
    font-size: calc(16 * var(--fu));
    letter-spacing: calc(1.92 * var(--fu));
    line-height: calc(24 * var(--fu));
  }
}
.c-cta__tel {
  display: flex;
  align-items: center;
  font-family: var(--font-en);
  font-weight: 500;
  font-size: calc(20 * var(--fu));
  letter-spacing: calc(1.2 * var(--fu));
  line-height: 1;
}
@media (min-width: 1024px) {
  .c-cta__tel {
    font-size: calc(24 * var(--fu));
    letter-spacing: calc(1.44 * var(--fu));
    line-height: calc(29 * var(--fu));
  }
}
.c-cta__tel::before {
  content: "";
  width: calc(18 * var(--u));
  height: calc(24 * var(--u));
  margin-right: calc(2 * var(--u));
  background: currentColor;
  -webkit-mask: url("../img/common/icon-tel-b.svg") no-repeat center/contain;
  mask: url("../img/common/icon-tel-b.svg") no-repeat center/contain;
}
@media (min-width: 1024px) {
  .c-cta__tel::before {
    width: calc(20 * var(--u));
    height: calc(28.5 * var(--u));
    margin-right: calc(9 * var(--u));
  }
}

/* =============================================
   Component: 注意事項の枠（！アイコン付きの見出し＋本文）
============================================= */
.c-note {
  position: relative;
  padding: calc(24 * var(--u)) calc(20 * var(--u)) calc(32 * var(--u));
  border: calc(2 * var(--u)) solid #d26761;
  border-radius: calc(16 * var(--u));
  background: var(--color-white);
  font-size: calc(14 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.68 * var(--fu));
  line-height: calc(28 * var(--fu));
  color: var(--color-text);
}
@media (min-width: 1024px) {
  .c-note {
    width: calc(980 * var(--u));
    margin-inline: auto;
    padding: calc(32 * var(--u)) calc(90 * var(--u));
    border-radius: calc(24 * var(--u));
    font-size: calc(16 * var(--fu));
    letter-spacing: calc(1.92 * var(--fu));
    line-height: calc(32 * var(--fu));
  }
}
.c-note__title {
  display: flex;
  align-items: center;
  gap: calc(10 * var(--u));
  font-size: calc(18 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(2.16 * var(--fu));
  line-height: 1.4;
  color: var(--color-title);
}
@media (min-width: 1024px) {
  .c-note__title {
    gap: calc(16 * var(--u));
    margin-left: calc(-6 * var(--u));
    font-size: calc(24 * var(--fu));
    letter-spacing: calc(2.88 * var(--fu));
    line-height: calc(48 * var(--fu));
  }
}
.c-note__title::before {
  content: "！";
  flex-shrink: 0;
  display: grid;
  place-items: center;
  width: calc(36 * var(--u));
  height: calc(36 * var(--u));
  border-radius: 50%;
  background: #eca089;
  color: var(--color-white);
  font-size: calc(18 * var(--fu));
  letter-spacing: 0;
}
@media (min-width: 1024px) {
  .c-note__title::before {
    width: calc(50 * var(--u));
    height: calc(50 * var(--u));
    font-size: calc(24 * var(--fu));
  }
}
.c-note__title + .c-note__text {
  margin-top: calc(16 * var(--u));
}
@media (min-width: 1024px) {
  .c-note__title + .c-note__text {
    margin-top: calc(24 * var(--u));
  }
}
.c-note {
  /* 見出しのアイコンが「＋」のもの（ワクチンの副作用など） */
}
.c-note--plus .c-note__title::before {
  content: "＋";
}
.c-note {
  /* 段落を並べる本文 */
}
.c-note__text > p + p {
  margin-top: calc(24 * var(--u));
}
@media (min-width: 1024px) {
  .c-note__text > p + p {
    margin-top: calc(32 * var(--u));
  }
}
.c-note__deco {
  position: absolute;
  right: calc(-12 * var(--u));
  bottom: calc(-60 * var(--u));
  width: calc(54 * var(--u));
  pointer-events: none;
}
@media (min-width: 1024px) {
  .c-note__deco {
    left: calc(912 * var(--u));
    right: auto;
    bottom: auto;
    width: calc(90 * var(--u));
  }
}

/* =============================================
   Component: ページャー（01 02 03 ＞）
============================================= */
.c-pager {
  position: relative;
  display: flex;
  justify-content: center;
  margin-top: calc(32 * var(--u));
}
@media (min-width: 1024px) {
  .c-pager {
    margin-top: calc(39 * var(--u));
  }
}
.c-pager__list {
  display: flex;
  gap: calc(13 * var(--u));
}
@media (min-width: 1024px) {
  .c-pager__list {
    /* デザインどおり、数字の並びは中央より2pxだけ右 */
    margin-left: calc(2 * var(--u));
  }
}
.c-pager__link {
  display: block;
  min-width: calc(32 * var(--u));
  border-bottom: 2px solid transparent;
  font-family: var(--font-en);
  font-size: calc(16 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(1.92 * var(--fu));
  line-height: calc(24 * var(--fu));
  text-align: center;
  color: #e1dfd5;
  transition: color 0.3s;
}
.c-pager__link:hover {
  color: var(--color-chip);
}
.c-pager__link.is-current {
  border-bottom-color: var(--color-chip);
  color: var(--color-text);
}
.c-pager {
  /* 次のページへ（山形のアイコン） */
}
.c-pager__next {
  position: absolute;
  top: calc(4 * var(--u));
  left: calc(50% + calc(90 * var(--u)));
  width: calc(10 * var(--u));
  height: calc(16 * var(--u));
  background: url("../img/common/icon-chevron.svg") no-repeat center/contain;
}
.c-pager__next:hover {
  opacity: 0.7;
}

/* =============================================
   Component: 記事詳細の前後ナビ（前へ／一覧へ／次へ）
============================================= */
.c-entry-nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: calc(48 * var(--u));
}
@media (min-width: 1024px) {
  .c-entry-nav {
    width: calc(900 * var(--u));
    margin: calc(160 * var(--u)) auto 0;
  }
}
.c-entry-nav__side {
  display: flex;
  align-items: center;
  gap: calc(16 * var(--u));
  font-size: calc(16 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(2.24 * var(--fu));
  line-height: calc(24 * var(--fu));
  color: #000;
  transition: opacity 0.3s;
}
.c-entry-nav__side:hover {
  opacity: 0.7;
}
.c-entry-nav__side::before {
  content: "";
  flex-shrink: 0;
  width: calc(30 * var(--u));
  height: calc(30 * var(--u));
  background: url("../img/common/btn-circle-arrow-outline.svg") no-repeat center/contain;
}
.c-entry-nav__side--prev {
  /* 「前へ」は矢印を左向きに */
}
.c-entry-nav__side--prev::before {
  transform: scaleX(-1);
}
.c-entry-nav__side--next {
  flex-direction: row-reverse;
}
.c-entry-nav__index {
  padding: 0 calc(11 * var(--u)) calc(3 * var(--u));
  border-bottom: 2px solid var(--color-chip);
  font-size: calc(16 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(2.24 * var(--fu));
  line-height: calc(24 * var(--fu));
  color: #000;
  transition: opacity 0.3s;
}
.c-entry-nav__index:hover {
  opacity: 0.7;
}
.c-entry-nav {
  /* 空きスロット（前後の記事が無いとき）は場所だけ確保する */
}
.c-entry-nav__empty {
  width: calc(30 * var(--u));
  visibility: hidden;
}
.c-entry-nav {
  /* お知らせは本文が短いため、デザインどおり広めに取る */
}
@media (min-width: 1024px) {
  .page-news .c-entry-nav {
    margin-top: calc(220 * var(--u));
  }
}

/* =============================================
   Component: 記事が無いときの表示（デザイン無し）
============================================= */
.c-empty {
  padding: calc(40 * var(--u)) calc(20 * var(--u)) 0;
  font-size: calc(16 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.92 * var(--fu));
  line-height: calc(32 * var(--fu));
  text-align: center;
}
@media (min-width: 1024px) {
  .c-empty {
    padding-top: calc(80 * var(--u));
  }
}

/* =============================================
   Component: 左右に波線のある見出し
   色は --pink（既定）/ --orange / --green
============================================= */
.c-line-title {
  --line-color: #d77a75;
  display: flex;
  align-items: center;
  gap: calc(16 * var(--u));
  font-size: calc(18 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(2.16 * var(--fu));
  line-height: 1.4;
  color: #d2675f;
  text-align: center;
}
@media (min-width: 1024px) {
  .c-line-title {
    gap: calc(26 * var(--u));
    font-size: calc(24 * var(--fu));
    letter-spacing: calc(2.88 * var(--fu));
  }
}
.c-line-title::before, .c-line-title::after {
  content: "";
  flex: 1;
  min-width: calc(24 * var(--u));
  height: 4px;
  background-color: var(--line-color);
  -webkit-mask: url("../img/lower/line-wave.svg") repeat-x left center/12px 4px;
  mask: url("../img/lower/line-wave.svg") repeat-x left center/12px 4px;
}
.c-line-title--orange {
  --line-color: #d9925c;
  color: var(--color-orange);
}
.c-line-title--green {
  --line-color: #93c155;
  color: #74a83a;
}

/* =============================================
   Component: ピン型アイコン付きの見出し
   アイコンは --vaccine（注射器）/ --filaria（薬）/ --flea（ノミ・マダニ）
   強調色は既定がオレンジ、--green で緑
============================================= */
.c-pin-title {
  /* 見出しの中に強調（em）が混ざるので flex にせず、アイコンは左に絶対配置。
     1行目がピンの丸の中心に来るよう上に余白をとる */
  position: relative;
  min-height: calc(58 * var(--u));
  padding: calc(8 * var(--u)) 0 0 calc(58 * var(--u));
  font-size: calc(20 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(2.4 * var(--fu));
  line-height: calc(30 * var(--fu));
  color: var(--color-title);
}
@media (min-width: 1024px) {
  .c-pin-title {
    min-height: calc(89 * var(--u));
    padding: calc(13 * var(--u)) 0 0 calc(86 * var(--u));
    font-size: calc(32 * var(--fu));
    letter-spacing: calc(3.84 * var(--fu));
    line-height: calc(44 * var(--fu));
  }
}
.c-pin-title::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: calc(46 * var(--u));
  height: calc(58 * var(--u));
  background: url("../img/preventive/icon-pin-vaccine.svg") no-repeat center/contain;
}
@media (min-width: 1024px) {
  .c-pin-title::before {
    width: calc(70 * var(--u));
    height: calc(89 * var(--u));
  }
}
.c-pin-title em {
  font-style: normal;
  color: var(--color-orange);
}
.c-pin-title--green em {
  color: #74a83a;
}
.c-pin-title--filaria::before {
  background-image: url("../img/preventive/icon-pin-filaria.svg");
}
.c-pin-title--flea::before {
  background-image: url("../img/preventive/icon-pin-flea.svg");
}

/* =============================================
   Component: 丸いアイコン付きの見出し（金色の丸に白いアイコン）
   アイコンは --dog / --cat（緑の丸）/ --dogcat / --syringe / --yen
============================================= */
.c-icon-title {
  --icon: url("../img/checkup/icon-dogcat.svg");
  --icon-size: 62%;
  display: flex;
  align-items: center;
  gap: calc(12 * var(--u));
  font-size: calc(18 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(2.16 * var(--fu));
  line-height: 1.4;
  color: var(--color-title);
}
@media (min-width: 1024px) {
  .c-icon-title {
    gap: calc(18 * var(--u));
    font-size: calc(24 * var(--fu));
    letter-spacing: calc(2.88 * var(--fu));
  }
}
.c-icon-title::before {
  content: "";
  flex-shrink: 0;
  width: calc(44 * var(--u));
  height: calc(44 * var(--u));
  border-radius: 50%;
  background: var(--icon) no-repeat center/var(--icon-size), var(--color-chip);
}
@media (min-width: 1024px) {
  .c-icon-title::before {
    width: calc(60 * var(--u));
    height: calc(60 * var(--u));
  }
}
.c-icon-title--syringe {
  --icon: url("../img/lower/icon-syringe-w.svg");
  --icon-size: 50%;
}
.c-icon-title--yen {
  --icon: url("../img/price/icon-yen.svg");
  --icon-size: 46%;
}
.c-icon-title {
  /* 犬・猫は既存の丸アイコン画像をそのまま使う */
}
.c-icon-title--dog::before, .c-icon-title--cat::before {
  background: url("../img/lower/icon-dog.svg") no-repeat center/contain;
}
.c-icon-title--cat::before {
  background-image: url("../img/lower/icon-cat-green.svg");
}

/* =============================================
   Component: 見出しがオレンジの表（ワクチン成分・年齢換算・料金）
   --green：見出しが緑 / --cream：セルがクリーム（料金表）
   SPで列が多い表は .c-table-scroll で包んで横スクロール
============================================= */
.c-table {
  --head: #f0b981;
  --dot: var(--color-chip);
  --cell: var(--color-white);
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  overflow: hidden;
  border-radius: calc(12 * var(--u));
  font-size: calc(13 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.3 * var(--fu));
  line-height: calc(20 * var(--fu));
  color: var(--color-title);
  text-align: center;
}
@media (min-width: 1024px) {
  .c-table {
    border-radius: calc(16 * var(--u));
    font-size: calc(16 * var(--fu));
    letter-spacing: calc(1.92 * var(--fu));
    line-height: calc(28 * var(--fu));
  }
}
.c-table th,
.c-table td {
  height: calc(48 * var(--u));
  padding: calc(8 * var(--u)) calc(6 * var(--u));
  vertical-align: middle;
}
@media (min-width: 1024px) {
  .c-table th,
  .c-table td {
    height: calc(56 * var(--u));
    padding: calc(12 * var(--u)) calc(16 * var(--u));
  }
}
.c-table th {
  background: var(--head);
  font-weight: 700;
}
.c-table td {
  background: var(--cell);
  border-left: 1px solid #ebe6d9;
}
.c-table tr + tr > * {
  border-top: 1px solid #ebe6d9;
}
.c-table {
  /* 見出しセル同士の区切りは白の細線 */
}
.c-table tr + tr > th,
.c-table thead th + th {
  border-color: rgba(255, 255, 255, 0.5);
}
.c-table thead th + th {
  border-left: 1px solid rgba(255, 255, 255, 0.5);
}
.c-table thead th {
  font-size: calc(14 * var(--fu));
}
@media (min-width: 1024px) {
  .c-table thead th {
    font-size: calc(16 * var(--fu));
  }
}
.c-table {
  /* ● */
}
.c-table__dot {
  display: inline-block;
  width: calc(18 * var(--u));
  height: calc(18 * var(--u));
  border-radius: 50%;
  background: var(--dot);
  vertical-align: middle;
}
@media (min-width: 1024px) {
  .c-table__dot {
    width: calc(24 * var(--u));
    height: calc(24 * var(--u));
  }
}
.c-table--green {
  --head: #b0cc91;
  --dot: var(--color-num);
}
.c-table--cream {
  --cell: #f8f1de;
}
.c-table--cream td {
  border-left-color: #e8dfc8;
}
.c-table--cream tr + tr > td {
  border-top-color: #e8dfc8;
}

/* 横スクロールの外枠（SP） */
.c-table-scroll {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
@media (min-width: 1024px) {
  .c-table-scroll {
    overflow: visible;
  }
}
.c-table-scroll > .c-table {
  min-width: calc(600 * var(--u));
}
@media (min-width: 1024px) {
  .c-table-scroll > .c-table {
    min-width: 0;
  }
}
.c-table-scroll {
  /* SPでスクロールできることを示す注記 */
}
.c-table-scroll__hint {
  margin-top: calc(8 * var(--u));
  font-size: calc(12 * var(--fu));
  letter-spacing: calc(1.2 * var(--fu));
  color: var(--color-title);
  text-align: right;
}
@media (min-width: 1024px) {
  .c-table-scroll__hint {
    display: none;
  }
}

/* =============================================
   Component: 白いカードの項目表（項目名＋内容を罫線で区切る）
   上に緑の帯の見出し（__head）を付けられる
============================================= */
.c-info-table {
  overflow: hidden;
  border-radius: calc(16 * var(--u));
  background: var(--color-white);
}
@media (min-width: 1024px) {
  .c-info-table {
    width: calc(980 * var(--u));
    margin-inline: auto;
    border-radius: calc(24 * var(--u));
  }
}
.c-info-table__head {
  padding: calc(14 * var(--u)) calc(20 * var(--u));
  background: #9dbe77;
  font-size: calc(18 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(2.16 * var(--fu));
  line-height: 1.4;
  color: var(--color-white);
}
@media (min-width: 1024px) {
  .c-info-table__head {
    padding: calc(18 * var(--u)) calc(45 * var(--u));
    font-size: calc(24 * var(--fu));
    letter-spacing: calc(2.88 * var(--fu));
  }
}
.c-info-table__list {
  padding: calc(4 * var(--u)) calc(20 * var(--u));
}
@media (min-width: 1024px) {
  .c-info-table__list {
    padding: 0 calc(40 * var(--u));
  }
}
.c-info-table__row {
  padding-block: calc(14 * var(--u));
  font-size: calc(14 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.68 * var(--fu));
  line-height: calc(24 * var(--fu));
  color: var(--color-text);
}
@media (min-width: 1024px) {
  .c-info-table__row {
    display: grid;
    grid-template-columns: calc(128 * var(--u)) minmax(0, 1fr);
    -moz-column-gap: calc(40 * var(--u));
         column-gap: calc(40 * var(--u));
    padding: calc(24 * var(--u)) calc(28 * var(--u));
    font-size: calc(15 * var(--fu));
    letter-spacing: calc(1.8 * var(--fu));
    line-height: calc(32 * var(--fu));
  }
}
.c-info-table__row + .c-info-table__row {
  border-top: 1px solid var(--color-line);
}
.c-info-table__row dt {
  font-weight: 700;
  color: var(--color-title);
}
@media (min-width: 1024px) {
  .c-info-table__row dt {
    font-weight: 500;
  }
}
.c-info-table__row dd {
  margin-top: calc(4 * var(--u));
}
@media (min-width: 1024px) {
  .c-info-table__row dd {
    margin-top: 0;
  }
}
.c-info-table {
  /* 項目名の列が広いもの（第一種動物取扱業標識） */
}
@media (min-width: 1024px) {
  .c-info-table--wide-label .c-info-table__row {
    grid-template-columns: calc(238 * var(--u)) minmax(0, 1fr);
    padding-inline: calc(40 * var(--u));
  }
}

/* =============================================
   Component: 弧を描く英字ラベル＋手書き風の番号（Recommend 01 など）
   色は既定が緑、--gold で金色
============================================= */
.c-arc-num {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  color: var(--color-num);
  line-height: 1;
  pointer-events: none;
}
.c-arc-num__arc {
  display: block;
  width: calc(84 * var(--u));
  height: auto;
  overflow: visible;
}
@media (min-width: 1024px) {
  .c-arc-num__arc {
    width: calc(112 * var(--u));
  }
}
.c-arc-num__arc text {
  font-family: var(--font-en);
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 1.2px;
  fill: currentColor;
}
.c-arc-num__num {
  margin-top: calc(-4 * var(--u));
  font-family: var(--font-hand);
  font-size: calc(64 * var(--u));
  letter-spacing: calc(1.44 * var(--fu));
}
@media (min-width: 1024px) {
  .c-arc-num__num {
    margin-top: calc(-6 * var(--u));
    font-size: calc(96 * var(--u));
  }
}
.c-arc-num--gold {
  color: var(--color-chip);
}

/* =============================================
   ヘッダー + メインビジュアル
============================================= */
.p-main-visual {
  position: relative;
  width: 100%;
  height: calc(653 * var(--u));
}
@media (min-width: 1024px) {
  .p-main-visual {
    height: auto;
    margin-inline: auto;
    aspect-ratio: 1440/725;
  }
}
@media (min-width: 1441px) {
  .p-main-visual {
    /* 1440pxを超える画面でも、メインビジュアルは画面いっぱいに広げる
    （写真・ロゴ・メニューの位置は％指定なので画面幅に合わせて広がる。メニューの文字サイズは固定） */
    width: 100vw;
    margin-inline: calc(50% - 50vw);
  }
}
.p-main-visual__visual {
  position: absolute;
  /* スライドのz-indexを内側に閉じ込め、キャッチコピーを前面に保つ */
  z-index: 0;
  left: calc(13 * var(--u));
  top: calc(64 * var(--u));
  width: calc(349 * var(--u));
  height: calc(560 * var(--u));
  border-radius: calc(30 * var(--u));
  overflow: hidden;
}
@media (min-width: 1024px) {
  .p-main-visual__visual {
    left: 22.917%;
    top: 15.586%;
    width: 54.167%;
    height: 80%;
  }
}
.p-main-visual__visual img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: bottom;
     object-position: bottom;
}
.p-main-visual__slider {
  position: relative;
  width: 100%;
  height: 100%;
  border-radius: inherit;
  overflow: hidden;
}
.p-main-visual__slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity 1.4s ease;
}
.p-main-visual__slide.is-active {
  opacity: 1;
  z-index: 1;
}
.p-main-visual__slide.is-active img {
  transform: scale(1.06);
}
@media (prefers-reduced-motion: reduce) {
  .p-main-visual__slide.is-active img {
    transform: none;
  }
}
.p-main-visual__slide {
  /* picture はインライン要素のままだと高さが確定せず、
  中の img の height:100% が効かないためブロック化する */
}
.p-main-visual__slide picture {
  display: block;
  width: 100%;
  height: 100%;
}
.p-main-visual__slide img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: bottom;
     object-position: bottom;
  transform: scale(1);
  transition: transform 7s ease-out;
}
@media (prefers-reduced-motion: reduce) {
  .p-main-visual__slide, .p-main-visual__slide img {
    transition: none;
  }
}
.p-main-visual {
  /* --- キャッチコピー --- */
}
.p-main-visual__copy {
  position: absolute;
  left: calc(20 * var(--u));
  top: calc(449 * var(--u));
  width: calc(330 * var(--u));
}
@media (min-width: 1024px) {
  .p-main-visual__copy {
    left: 11.944%;
    top: 69.655%;
    width: 39.722%;
  }
}
@media (max-width: 1023.98px) {
  .p-main-visual__copy {
    top: calc(408 * var(--u));
  }
}
@media (min-width: 1441px) {
  .p-main-visual__copy {
    /* キャッチコピーは写真に合わせて、画面幅に比例して拡大する */
    --u: 0.06944vw;
  }
}
.p-main-visual__copy {
  /* 表示演出：ローディング後（html.is-loaded）に、キャッチコピー全体がふわっと現れる */
}
.js .p-main-visual__copy {
  opacity: 0;
}
.is-loaded .p-main-visual__copy {
  animation: p-main-visual-fade 2.4s ease-out 0.2s both;
}
@media (prefers-reduced-motion: reduce) {
  .p-main-visual__copy {
    opacity: 1 !important;
    animation: none !important;
  }
}
.p-main-visual {
  /* SPは文字の頭打ちに合わせ、白帯の余白も文字単位（bp.fs）で指定。PCは写真に合わせて bp.u のまま */
}
.p-main-visual__catch {
  padding: calc(11 * var(--fu)) calc(14 * var(--fu));
  background: var(--color-white);
  font-size: calc(22 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(3.08 * var(--fu));
  line-height: 1.5;
}
@media (min-width: 1024px) {
  .p-main-visual__catch {
    padding: calc(8 * var(--u)) calc(14 * var(--u));
    font-size: calc(24 * var(--u));
    letter-spacing: calc(3.36 * var(--u));
    line-height: calc(35 * var(--u));
    white-space: nowrap;
  }
}
@media (max-width: 1023.98px) {
  .p-main-visual__catch {
    padding: calc(11 * var(--fu)) calc(14 * var(--fu));
    line-height: calc(26 * var(--fu));
  }
}
.p-main-visual__catch em {
  font-style: normal;
  color: var(--color-orange);
}
.p-main-visual {
  /* SPでは文字数が多く枠に収まらないため非表示（PCでは表示） */
}
.p-main-visual__lead {
  display: none;
  width: -moz-fit-content;
  width: fit-content;
  max-width: calc(330 * var(--u));
  padding: calc(7 * var(--fu)) calc(20 * var(--fu));
  background: var(--color-white);
  font-size: calc(14 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.96 * var(--fu));
  line-height: 1.5;
}
@media (min-width: 1024px) {
  .p-main-visual__lead {
    display: flex;
    width: calc(377 * var(--u));
    max-width: none;
    padding: calc(6 * var(--u)) calc(20 * var(--u));
    font-size: calc(16 * var(--u));
    letter-spacing: calc(2.24 * var(--u));
    line-height: calc(20 * var(--u));
    white-space: nowrap;
  }
}
@media (max-width: 1023.98px) {
  .p-main-visual__lead {
    display: block;
    padding: calc(7 * var(--fu)) calc(20 * var(--fu));
    font-size: calc(15 * var(--fu));
    letter-spacing: calc(2.1 * var(--fu));
    line-height: calc(18 * var(--fu));
  }
}
.p-main-visual__lead--1 {
  margin-top: calc(12 * var(--fu));
}
@media (min-width: 1024px) {
  .p-main-visual__lead--1 {
    margin-top: calc(12 * var(--u));
  }
}
.p-main-visual__lead--2 {
  margin-top: calc(8 * var(--u));
}
@media (min-width: 1024px) {
  .p-main-visual__lead--2 {
    margin-top: calc(8 * var(--u));
  }
}
.p-main-visual {
  /* --- 装飾 --- */
}
.p-main-visual__deco {
  position: absolute;
  pointer-events: none;
}
.p-main-visual__deco--flower {
  display: none;
}
@media (min-width: 1024px) {
  .p-main-visual__deco--flower {
    display: block;
    left: 21.667%;
    top: 92.966%;
    width: 2.986%;
  }
}
.p-main-visual__deco--dog {
  left: calc(295 * var(--u));
  top: calc(568 * var(--u));
  width: calc(69.8 * var(--u));
}
@media (min-width: 1024px) {
  .p-main-visual__deco--dog {
    left: 73.611%;
    top: 86.207%;
    width: 6.96%;
  }
}
@media (min-width: 1024px) {
  .p-main-visual__catch br, .p-main-visual__lead br {
    display: none;
  }
}

@keyframes p-main-visual-fade {
  0% {
    opacity: 0;
    translate: 0 calc(12 * var(--fu));
  }
  100% {
    opacity: 1;
    translate: 0 0;
  }
}
/* =============================================
   お知らせ
============================================= */
.p-top-news {
  margin-top: calc(51 * var(--u));
}
@media (min-width: 1024px) {
  .p-top-news {
    margin-top: calc(134 * var(--u));
  }
}
.p-top-news__card {
  position: relative;
  display: block;
  min-height: calc(95 * var(--u));
  padding: calc(24 * var(--u)) calc(20 * var(--u));
  border-radius: calc(8 * var(--u));
  background: var(--color-bg);
  transition: opacity 0.3s;
}
@media (min-width: 1024px) {
  .p-top-news__card {
    height: calc(140 * var(--u));
    min-height: 0;
    padding: calc(29 * var(--u)) calc(20 * var(--u));
  }
}
.p-top-news__card:hover {
  opacity: 0.8;
}
.p-top-news__card-date {
  display: block;
  font-family: var(--font-en);
  font-size: calc(16 * var(--fu));
  line-height: 1.1875;
  color: var(--color-orange);
}
.p-top-news__card-title {
  margin-top: calc(9 * var(--u));
  padding-right: calc(40 * var(--u));
  font-size: calc(16 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(2.24 * var(--fu));
  line-height: 1.1875;
  color: #000;
}
@media (min-width: 1024px) {
  .p-top-news__card-title {
    padding-right: 0;
  }
}
.p-top-news__card-arrow {
  position: absolute;
  right: calc(20 * var(--u));
  top: calc(36 * var(--u));
  width: calc(24 * var(--u));
  height: calc(24 * var(--u));
  background: url("../img/common/icon-arrow-link.svg?v=20260917") no-repeat center/contain;
}
@media (min-width: 1024px) {
  .p-top-news__card-arrow {
    right: calc(11 * var(--u));
    top: calc(101 * var(--u));
    width: calc(30 * var(--u));
    height: calc(30 * var(--u));
    background-image: url("../img/common/btn-circle-arrow.svg?v=20260917");
  }
}
.p-top-news__inner {
  padding-inline: calc(20 * var(--u));
}
@media (min-width: 1024px) {
  .p-top-news__inner {
    position: relative;
    display: flex;
    margin-inline: auto;
    padding-inline: calc(182 * var(--u));
  }
}
.p-top-news__head {
  text-align: center;
}
@media (min-width: 1024px) {
  .p-top-news__head {
    flex-shrink: 0;
    width: calc(172 * var(--u));
    padding-top: calc(6 * var(--u));
    text-align: left;
  }
}
.p-top-news__list {
  margin-top: calc(32 * var(--u));
}
@media (min-width: 1024px) {
  .p-top-news__list {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: calc(32 * var(--u));
    flex: 1;
    margin-top: 0;
  }
}
.p-top-news__list > li + li {
  margin-top: calc(16 * var(--u));
}
@media (min-width: 1024px) {
  .p-top-news__list > li + li {
    margin-top: 0;
  }
}
.p-top-news__more {
  display: flex;
  justify-content: center;
  margin-top: calc(24 * var(--u));
}
@media (min-width: 1024px) {
  .p-top-news__more {
    position: absolute;
    left: calc(182 * var(--u));
    top: calc(106 * var(--u));
    display: block;
    margin-top: 0;
  }
}

/* =============================================
   コンセプト
============================================= */
.p-top-concept {
  position: relative;
  margin-top: calc(120 * var(--u));
  padding: calc(80 * var(--u)) calc(20 * var(--u)) calc(120 * var(--u));
}
@media (min-width: 1024px) {
  .p-top-concept {
    /* タブレット横で本文が長くなっても下の波にかぶらないよう、本文の高さに合わせて伸ばす（本文の下は356px） */
    min-height: calc(957 * var(--u));
    margin-top: calc(109 * var(--u));
    padding: 0 0 calc(356 * var(--u));
  }
}
.p-top-concept::before {
  content: "";
  position: absolute;
  inset: calc(94 * var(--u)) 0 0;
  background: var(--color-bg);
}
@media (min-width: 1024px) {
  .p-top-concept::before {
    display: none;
  }
}
.p-top-concept__bg {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: calc(94 * var(--u));
  background: url("../img/top/wave-concept-sp.svg?v=20260917") no-repeat center/100% 100%;
  left: calc(50% - 50vw - 4px);
  width: calc(100vw + 8px);
}
@media (min-width: 1024px) {
  .p-top-concept__bg {
    height: 100%;
    background-image: url("../img/top/bg-concept.svg?v=20260917");
  }
}
.p-top-concept__head, .p-top-concept__img, .p-top-concept__body {
  position: relative;
}
.p-top-concept__head {
  text-align: center;
}
@media (min-width: 1024px) {
  .p-top-concept__head {
    position: absolute;
    left: calc(120 * var(--u));
    top: calc(121 * var(--u));
    text-align: left;
  }
}
.p-top-concept__img {
  margin-top: calc(56 * var(--u));
  border-radius: calc(30 * var(--u));
  overflow: hidden;
}
@media (min-width: 1024px) {
  .p-top-concept__img {
    position: absolute;
    left: calc(60 * var(--u));
    top: calc(228 * var(--u));
    width: calc(640 * var(--u));
    margin: 0;
  }
}
@media (max-width: 1023.98px) {
  .p-top-concept__img {
    aspect-ratio: 335/206;
    border-radius: calc(24 * var(--u));
  }
}
.p-top-concept__img img {
  width: 100%;
  height: auto;
}
@media (max-width: 1023.98px) {
  .p-top-concept__img img {
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
  }
}
.p-top-concept__body {
  margin-top: calc(40 * var(--u));
  font-size: calc(16 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(2.56 * var(--fu));
  line-height: calc(32 * var(--fu));
}
@media (min-width: 1024px) {
  .p-top-concept__body {
    width: calc(570 * var(--fu));
    margin: 0 0 0 calc(750 * var(--u));
    padding-top: calc(161 * var(--u));
    line-height: calc(40 * var(--fu));
  }
}
@media (max-width: 1023.98px) {
  .p-top-concept__body {
    padding-inline: calc(20 * var(--u));
    line-height: calc(28 * var(--fu));
  }
}
.p-top-concept__body p + p {
  margin-top: calc(24 * var(--u));
}
@media (min-width: 1024px) {
  .p-top-concept__body p + p {
    margin-top: 0;
  }
}
@media (max-width: 1023.98px) {
  .p-top-concept__body p + p {
    margin-top: calc(28 * var(--u));
  }
}
.p-top-concept__deco {
  position: absolute;
  pointer-events: none;
}
.p-top-concept__deco--cat {
  left: calc(277 * var(--u));
  top: calc(-44 * var(--u));
  width: calc(69 * var(--u));
}
@media (min-width: 1024px) {
  .p-top-concept__deco--cat {
    left: calc(355 * var(--u));
    top: calc(10 * var(--u));
    width: calc(80.82 * var(--u));
  }
}
.p-top-concept__deco--flower-tr, .p-top-concept__deco--leaf-a, .p-top-concept__deco--leaf-b {
  display: none;
}
.p-top-concept__deco--flower-bl-a {
  left: calc(55.86 * var(--u));
  top: calc(368 * var(--u));
  width: calc(32.49 * var(--u));
}
@media (min-width: 1024px) {
  .p-top-concept__deco--flower-bl-a {
    left: calc(93.09 * var(--u));
    top: calc(569 * var(--u));
    width: calc(46.12 * var(--u));
  }
}
.p-top-concept__deco--flower-bl-b {
  left: calc(10 * var(--u));
  top: calc(378.57 * var(--u));
  width: calc(50.48 * var(--u));
}
@media (min-width: 1024px) {
  .p-top-concept__deco--flower-bl-b {
    left: calc(28 * var(--u));
    top: calc(584 * var(--u));
    width: calc(71.65 * var(--u));
  }
}
@media (min-width: 1024px) {
  .p-top-concept__deco--flower-tr {
    display: block;
    left: calc(1178.99 * var(--u));
    top: calc(-29 * var(--u));
    width: calc(75.85 * var(--u));
  }
}
@media (min-width: 1024px) {
  .p-top-concept__deco--leaf-a {
    display: block;
    /* デザインでは時計回りに24度傾けて配置されている（left/topは回転後の中心を合わせた値） */
    left: calc(1241.38 * var(--u));
    top: calc(53.15 * var(--u));
    width: calc(33.44 * var(--u));
    transform: rotate(24deg);
  }
}
@media (min-width: 1024px) {
  .p-top-concept__deco--leaf-b {
    display: block;
    /* デザインでは左右反転＋反時計回りに18度傾けて配置されている */
    left: calc(1167.04 * var(--u));
    top: calc(68.07 * var(--u));
    width: calc(20.42 * var(--u));
    transform: rotate(-18deg) scaleX(-1);
  }
}

/* =============================================
   7つの選ばれる理由
============================================= */
.p-top-reason {
  position: relative;
  margin-top: calc(-104 * var(--u));
  padding: calc(76 * var(--u)) calc(20 * var(--u)) 0;
}
@media (min-width: 1024px) {
  .p-top-reason {
    margin-top: calc(-293 * var(--u));
    padding: 0;
  }
}
.p-top-reason__wave {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: calc(104 * var(--u));
  background: url("../img/top/wave-reason-sp.svg?v=20260917") no-repeat center/100% 100%;
  left: calc(50% - 50vw - 4px);
  width: calc(100vw + 8px);
}
@media (min-width: 1024px) {
  .p-top-reason__wave {
    height: calc(400 * var(--u));
    background-image: url("../img/top/wave-reason.svg?v=20260917");
  }
}
.p-top-reason__deco-pug {
  position: absolute;
  left: calc(292 * var(--u));
  top: calc(-35 * var(--u));
  width: calc(58.3 * var(--u));
  pointer-events: none;
}
@media (min-width: 1024px) {
  .p-top-reason__deco-pug {
    left: calc(1218 * var(--u));
    top: calc(-26 * var(--u));
    width: calc(88.09 * var(--u));
  }
}
.p-top-reason {
  /* 2つ目の理由の横の猫（TOP・初めての方へ共通） */
}
.p-top-reason__deco-cat {
  position: absolute;
  z-index: 1;
  right: calc(20 * var(--u));
  top: calc(-30 * var(--u));
  width: calc(70 * var(--u));
  pointer-events: none;
}
@media (min-width: 1024px) {
  .p-top-reason__deco-cat {
    left: calc(67 * var(--u));
    right: auto;
    top: calc(1247 * var(--u));
    width: calc(126 * var(--u));
  }
}
@media (max-width: 1023.98px) {
  .p-top-reason__deco-cat {
    /* 波の上は白猫だけにする（SPデザインに茶猫は無く、白猫と重なるため） */
    display: none;
  }
}
.p-top-reason__head {
  position: relative;
  display: flex;
  align-items: center;
  gap: calc(18 * var(--u));
  padding-left: calc(8 * var(--u));
}
@media (min-width: 1024px) {
  .p-top-reason__head {
    position: absolute;
    left: 0;
    top: calc(172 * var(--u));
    width: 100%;
    display: block;
    padding: 0;
  }
}
.p-top-reason__seven {
  font-family: var(--font-hand);
  font-size: calc(140 * var(--u));
  letter-spacing: calc(2.8 * var(--fu));
  line-height: calc(58 * var(--fu));
  color: var(--color-orange);
}
@media (min-width: 1024px) {
  .p-top-reason__seven {
    position: absolute;
    left: calc(903.5 * var(--u));
    top: calc(24 * var(--u));
    transform: translateX(-50%);
    font-size: calc(200 * var(--u));
    letter-spacing: calc(4 * var(--fu));
  }
}
.p-top-reason__sub, .p-top-reason__main {
  display: block;
  font-weight: 700;
  color: var(--color-title);
  white-space: nowrap;
}
.p-top-reason__sub em, .p-top-reason__main em {
  font-style: normal;
  color: var(--color-orange);
}
.p-top-reason__sub {
  font-size: calc(16 * var(--fu));
  letter-spacing: calc(1.92 * var(--fu));
  line-height: calc(30 * var(--fu));
}
@media (min-width: 1024px) {
  .p-top-reason__sub {
    position: absolute;
    left: calc(978 * var(--u));
    top: 0;
    font-size: calc(24 * var(--fu));
    letter-spacing: calc(2.88 * var(--fu));
    line-height: calc(48 * var(--fu));
  }
}
.p-top-reason__main {
  font-size: calc(24 * var(--fu));
  letter-spacing: calc(2.88 * var(--fu));
  line-height: calc(36 * var(--fu));
}
@media (min-width: 1024px) {
  .p-top-reason__main {
    position: absolute;
    left: calc(970 * var(--u));
    top: calc(47 * var(--u));
    font-size: calc(40 * var(--fu));
    letter-spacing: calc(4.8 * var(--fu));
    line-height: calc(48 * var(--fu));
  }
}
.p-top-reason__list {
  margin-top: calc(65 * var(--u));
}
@media (min-width: 1024px) {
  .p-top-reason__list {
    margin: 0 auto;
    padding-top: calc(392 * var(--u));
  }
}
@media (max-width: 1023.98px) {
  .p-top-reason__list {
    margin-top: calc(71 * var(--u));
  }
}
.p-top-reason__row {
  /* SPは画像が先に来る */
  display: flex;
  flex-direction: column-reverse;
}
@media (min-width: 1024px) {
  .p-top-reason__row {
    flex-direction: row;
    align-items: center;
    gap: calc(40 * var(--u));
    padding-inline: calc(120 * var(--u));
  }
}
.p-top-reason__row + .p-top-reason__row {
  margin-top: calc(80 * var(--u));
}
@media (min-width: 1024px) {
  .p-top-reason__row + .p-top-reason__row {
    margin-top: calc(90 * var(--u));
  }
}
@media (min-width: 1024px) {
  .p-top-reason__row:nth-child(even) {
    flex-direction: row-reverse;
  }
}
.p-top-reason__img {
  border-radius: calc(30 * var(--u));
  overflow: hidden;
}
@media (min-width: 1024px) {
  .p-top-reason__img {
    /* 文字カラムの残りを使う（1152px以上は640px。タブレット横では文字に合わせて画像が縮む） */
    flex: 1;
    min-width: 0;
  }
}
@media (max-width: 1023.98px) {
  .p-top-reason__img {
    aspect-ratio: 335/206;
    border-radius: calc(24 * var(--u));
  }
}
.p-top-reason__img img {
  width: 100%;
  height: auto;
}
@media (max-width: 1023.98px) {
  .p-top-reason__img img {
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
  }
}
.p-top-reason__text {
  position: relative;
  z-index: 1;
  /* 番号が画像の下に隠れないように前面へ */
  text-align: center;
}
@media (min-width: 1024px) {
  .p-top-reason__text {
    /* 改行位置が固定の本文が画像にかぶらないよう、幅は文字単位で取る（1152px以上は520px） */
    flex-shrink: 0;
    width: calc(520 * var(--fu));
    text-align: center;
  }
}
.p-top-reason__text p + p {
  margin-top: 0;
}
.p-top-reason__text p {
  margin-top: calc(16 * var(--u));
  font-size: calc(16 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.92 * var(--fu));
  line-height: calc(32 * var(--fu));
  text-align: left;
}
@media (min-width: 1024px) {
  .p-top-reason__text p {
    margin-top: calc(16 * var(--u));
  }
}
@media (max-width: 1023.98px) {
  .p-top-reason__text p {
    padding-inline: calc(20 * var(--u));
    line-height: calc(28 * var(--fu));
  }
}
.p-top-reason__num {
  display: block;
  margin-top: calc(-22 * var(--u));
  font-family: var(--font-hand);
  font-size: calc(96 * var(--u));
  letter-spacing: calc(1.92 * var(--fu));
  line-height: calc(58 * var(--fu));
  color: var(--color-num);
}
@media (min-width: 1024px) {
  .p-top-reason__num {
    margin-top: 0;
    font-size: calc(96 * var(--u));
  }
}
.p-top-reason__title {
  margin-top: calc(24 * var(--u));
  font-size: calc(20 * var(--fu));
  font-weight: 700;
  /* 15文字のタイトルが横335pxに1行で収まるよう字送りを調整 */
  letter-spacing: calc(1.2 * var(--fu));
  line-height: calc(32 * var(--fu));
  color: var(--color-title);
}
@media (min-width: 1024px) {
  .p-top-reason__title {
    margin-top: calc(32 * var(--u));
    font-size: calc(24 * var(--fu));
    letter-spacing: calc(2.88 * var(--fu));
    line-height: calc(48 * var(--fu));
    /* デザインどおり1行。カラム幅520pxを少し超えるものは左右にはみ出して中央揃え */
    white-space: nowrap;
  }
}
@media (max-width: 1023.98px) {
  .p-top-reason__title {
    /* 24pxでも文節で折り返せるよう、SPは左右の余白を取らずカード幅いっぱいに使う */
    padding-inline: 0;
    font-size: calc(24 * var(--fu));
    letter-spacing: calc(2.88 * var(--fu));
    line-height: calc(40 * var(--fu));
  }
}
@media (min-width: 1024px) {
  .p-top-reason__title br {
    display: none;
  }
}
.p-top-reason__btn {
  display: flex;
  justify-content: center;
  margin-top: calc(32 * var(--u));
}
@media (min-width: 1024px) {
  .p-top-reason__btn {
    justify-content: flex-end;
    margin-top: calc(16 * var(--u));
  }
}
@media (max-width: 1023.98px) {
  .p-top-reason__btn {
    margin-top: calc(24 * var(--u));
  }
}

/* =============================================
   診療科目 / 予防診療（共通のクリーム背景）
============================================= */
.p-top-medical {
  position: relative;
  margin-top: calc(114 * var(--u));
  padding-top: calc(87 * var(--u));
  /* 最後のカード下からセクション末端（波の下端）までの余白 */
  padding-bottom: calc(127 * var(--u));
}
@media (min-width: 1024px) {
  .p-top-medical {
    height: calc(1491 * var(--u));
    margin-top: calc(130 * var(--u));
    padding: 0;
  }
}
.p-top-medical__bg {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: url("../img/top/wave-medical-sp.svg?v=20260917") no-repeat top center/100% calc(87 * var(--u)), linear-gradient(var(--color-bg), var(--color-bg)) no-repeat left calc(86 * var(--u))/100% calc(100% - 172 * var(--u));
  left: calc(50% - 50vw - 4px);
  width: calc(100vw + 8px);
}
@media (min-width: 1024px) {
  .p-top-medical__bg {
    background: url("../img/top/wave-medical-top.svg?v=20260917") no-repeat top center/100% calc(335 * var(--u)), linear-gradient(var(--color-bg), var(--color-bg)) no-repeat left calc(334 * var(--u))/100% calc(100% - 668 * var(--u));
    transform: none;
  }
}
.p-top-medical__bg {
  /* 下端の波（同じ形状を上下反転して使う） */
}
.p-top-medical__bg::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: calc(87 * var(--u));
  background: url("../img/top/wave-medical-sp.svg?v=20260917") no-repeat center/100% 100%;
  transform: rotate(180deg);
  left: calc(50% - 50vw - 4px);
  width: calc(100vw + 8px);
}
@media (min-width: 1024px) {
  .p-top-medical__bg::after {
    /* 下部の波は上下反転して使う */
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: calc(335 * var(--u));
    background: url("../img/top/wave-medical-bottom.svg?v=20260917") no-repeat center/100% 100%;
    transform: rotate(180deg);
    left: calc(50% - 50vw - 4px);
    width: calc(100vw + 8px);
  }
}
.p-top-medical__deco {
  position: absolute;
  pointer-events: none;
}
.p-top-medical__deco--flower-a {
  left: calc(20 * var(--u));
  top: calc(-34 * var(--u));
  width: calc(45.67 * var(--u));
}
@media (min-width: 1024px) {
  .p-top-medical__deco--flower-a {
    left: calc(182 * var(--u));
    top: calc(7 * var(--u));
    width: calc(50.24 * var(--u));
  }
}
.p-top-medical__deco--flower-b {
  left: calc(78.18 * var(--u));
  top: calc(-14 * var(--u));
  width: calc(39.82 * var(--u));
}
@media (min-width: 1024px) {
  .p-top-medical__deco--flower-b {
    left: calc(246 * var(--u));
    top: calc(29 * var(--u));
    width: calc(43.8 * var(--u));
  }
}
.p-top-medical__deco--beagle {
  left: calc(275 * var(--u));
  top: calc(-15 * var(--u));
  width: calc(88.86 * var(--u));
}
@media (min-width: 1024px) {
  .p-top-medical__deco--beagle {
    left: calc(1254 * var(--u));
    top: calc(335 * var(--u));
    width: calc(102.86 * var(--u));
  }
}
.p-top-medical__deco--cat {
  left: calc(238 * var(--u));
  bottom: calc(76.5 * var(--u));
  width: calc(120.12 * var(--u));
  /* デザインどおりカードの上に重ねる */
  z-index: 1;
}
@media (min-width: 1024px) {
  .p-top-medical__deco--cat {
    left: calc(64 * var(--u));
    top: calc(1235 * var(--u));
    bottom: auto;
    width: calc(195 * var(--u));
  }
}

.p-top-dept {
  /* --- 診療科目 見出し --- */
}
.p-top-dept__head {
  position: relative;
  text-align: center;
}
@media (min-width: 1024px) {
  .p-top-dept__head {
    /* 診療科目の見出しは縦組み */
    position: absolute;
    left: calc(1253 * var(--u));
    top: calc(120 * var(--u));
    display: flex;
    align-items: flex-start;
    text-align: center;
  }
}
.p-top-dept__head-ja {
  display: block;
  font-size: calc(40 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(4.8 * var(--fu));
  line-height: calc(48 * var(--fu));
  color: var(--color-title);
}
@media (min-width: 1024px) {
  .p-top-dept__head-ja {
    width: calc(40 * var(--u));
    font-size: calc(40 * var(--fu));
    letter-spacing: calc(4.8 * var(--fu));
  }
}
.p-top-dept__head-ja .is-accent {
  font-style: normal;
  color: var(--color-orange);
}
@media (min-width: 1024px) {
  .p-top-dept__head-ja span {
    display: block;
  }
}
.p-top-dept__head-en {
  display: block;
  font-family: var(--font-en);
  font-weight: 500;
  font-size: calc(16 * var(--fu));
  letter-spacing: calc(1.92 * var(--fu));
  line-height: 1.35;
  color: var(--color-title);
}
@media (min-width: 1024px) {
  .p-top-dept__head-en {
    margin-left: calc(25 * var(--u));
    margin-top: calc(7 * var(--u));
    writing-mode: vertical-rl;
    font-size: calc(16 * var(--fu));
    letter-spacing: calc(1.92 * var(--fu));
  }
}
@media (max-width: 1023.98px) {
  .p-top-dept__head-en {
    margin-top: calc(6 * var(--u));
    line-height: calc(19 * var(--fu));
  }
}
.p-top-dept {
  /* --- 診療科目カード --- */
}
.p-top-dept__list {
  position: relative;
  display: grid;
  grid-template-columns: repeat(2, calc(160 * var(--u)));
  justify-content: center;
  -moz-column-gap: calc(15 * var(--u));
       column-gap: calc(15 * var(--u));
  row-gap: calc(60 * var(--u));
  margin-top: calc(95 * var(--u));
}
@media (min-width: 1024px) {
  .p-top-dept__list {
    position: absolute;
    left: calc(118 * var(--u));
    top: calc(243 * var(--u));
    grid-template-columns: repeat(3, calc(300 * var(--u)));
    -moz-column-gap: calc(64 * var(--u));
         column-gap: calc(64 * var(--u));
    row-gap: calc(75 * var(--u));
    margin: 0;
    padding: 0;
  }
}
@media (max-width: 1023.98px) {
  .p-top-dept__list {
    margin-top: calc(76 * var(--u));
  }
}
.p-top-dept__card {
  position: relative;
  display: block;
  height: calc(195 * var(--u));
  padding: calc(28 * var(--u)) calc(20 * var(--u)) 0;
  border-radius: calc(40 * var(--u));
  background: var(--color-white);
  text-align: center;
  transition: transform 0.3s, box-shadow 0.3s;
}
@media (min-width: 1024px) {
  .p-top-dept__card {
    height: calc(185 * var(--u));
    padding: calc(53 * var(--u)) calc(50 * var(--u)) 0;
    border-radius: calc(48 * var(--u));
  }
}
.p-top-dept__card:hover {
  transform: translateY(calc(-4 * var(--u)));
  box-shadow: 0 calc(8 * var(--u)) calc(20 * var(--u)) rgba(89, 56, 33, 0.12);
}
.p-top-dept__icon {
  position: absolute;
  left: 50%;
  top: calc(var(--icon-top-sp) * var(--u));
  width: calc(var(--icon-w-sp) * var(--u));
  height: auto;
  transform: translateX(-50%);
}
@media (min-width: 1024px) {
  .p-top-dept__icon {
    top: calc(var(--icon-top) * var(--u));
    width: calc(var(--icon-w) * var(--u));
  }
}
.p-top-dept__title {
  font-size: calc(24 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(3.36 * var(--fu));
  line-height: calc(36 * var(--fu));
  color: var(--color-text);
}
.p-top-dept__desc {
  margin-top: calc(8 * var(--u));
  font-size: calc(14 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.68 * var(--fu));
  line-height: calc(24 * var(--fu));
  text-align: left;
  /* 左揃えの短い説明文なので、文節単位（body の auto-phrase）ではなく
     1文字単位で折り返す。auto-phrase だと次の文節が入りきらず
     「目が赤く、」のように読点の直後で早めに改行されてしまう */
  word-break: normal;
}
@media (min-width: 1024px) {
  .p-top-dept__desc {
    margin-top: calc(6 * var(--u));
    font-size: calc(16 * var(--fu));
    letter-spacing: calc(1.92 * var(--fu));
  }
}
@media (max-width: 1023.98px) {
  .p-top-dept__desc {
    font-size: calc(16 * var(--fu));
    letter-spacing: calc(1.28 * var(--fu));
    /* 行末の字間ぶんだけ広げる（Figmaは最後の文字に字間を付けないため） */
    margin-right: calc(-1.28 * var(--u));
  }
}
.p-top-dept__arrow {
  position: absolute;
  left: 50%;
  bottom: calc(16 * var(--u));
  width: calc(24 * var(--u));
  height: calc(24 * var(--u));
  transform: translateX(-50%);
  background: url("../img/common/icon-arrow-link.svg?v=20260917") no-repeat center/contain;
}
@media (min-width: 1024px) {
  .p-top-dept__arrow {
    bottom: calc(12 * var(--u));
  }
}

.p-top-prevent__head {
  position: relative;
  text-align: center;
  /* --- 予防診療 --- */
  margin-top: calc(90 * var(--u));
}
@media (min-width: 1024px) {
  .p-top-prevent__head {
    /* 予防診療 */
    position: absolute;
    left: calc(117 * var(--u));
    top: calc(1117 * var(--u));
    margin: 0;
    text-align: left;
  }
}
@media (max-width: 1023.98px) {
  .p-top-prevent__head {
    margin-top: calc(80 * var(--u));
  }
}
.p-top-prevent__head-ja {
  display: block;
  font-size: calc(40 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(4.8 * var(--fu));
  line-height: calc(48 * var(--fu));
  color: var(--color-title);
}
@media (min-width: 1024px) {
  .p-top-prevent__head-ja {
    font-size: calc(40 * var(--fu));
    letter-spacing: calc(4.8 * var(--fu));
  }
}
.p-top-prevent__head-ja em {
  font-style: normal;
  color: var(--color-orange-d);
}
.p-top-prevent__head-en {
  display: block;
  font-family: var(--font-en);
  font-weight: 500;
  font-size: calc(16 * var(--fu));
  letter-spacing: calc(1.92 * var(--fu));
  line-height: 1.35;
  color: var(--color-title);
}
@media (min-width: 1024px) {
  .p-top-prevent__head-en {
    margin-top: calc(6 * var(--u));
    font-size: calc(16 * var(--fu));
    letter-spacing: calc(1.92 * var(--fu));
  }
}
@media (max-width: 1023.98px) {
  .p-top-prevent__head-en {
    margin-top: calc(6 * var(--u));
    line-height: calc(19 * var(--fu));
  }
}
.p-top-prevent__arrow {
  position: absolute;
  left: 50%;
  bottom: calc(16 * var(--u));
  width: calc(24 * var(--u));
  height: calc(24 * var(--u));
  transform: translateX(-50%);
  background: url("../img/common/icon-arrow-link.svg?v=20260917") no-repeat center/contain;
  left: auto;
  right: calc(24 * var(--u));
  bottom: 50%;
  transform: translateY(50%);
}
@media (min-width: 1024px) {
  .p-top-prevent__arrow {
    left: 50%;
    right: auto;
    bottom: calc(24 * var(--u));
    transform: translateX(-50%);
  }
}
.p-top-prevent__list {
  position: relative;
  margin-top: calc(56 * var(--u));
  padding-inline: calc(40 * var(--u));
}
@media (min-width: 1024px) {
  .p-top-prevent__list {
    position: absolute;
    left: calc(385 * var(--u));
    top: calc(1133 * var(--u));
    display: grid;
    grid-template-columns: repeat(3, calc(300 * var(--u)));
    -moz-column-gap: calc(38 * var(--u));
         column-gap: calc(38 * var(--u));
    margin: 0;
    padding: 0;
  }
}
.p-top-prevent__item + .p-top-prevent__item {
  margin-top: calc(16 * var(--u));
}
@media (min-width: 1024px) {
  .p-top-prevent__item + .p-top-prevent__item {
    margin-top: 0;
  }
}
.p-top-prevent__card {
  position: relative;
  display: flex;
  align-items: center;
  height: calc(90 * var(--u));
  padding-left: calc(87 * var(--u));
  border-radius: calc(18 * var(--u));
  background: var(--color-num);
  transition: opacity 0.3s;
}
@media (min-width: 1024px) {
  .p-top-prevent__card {
    display: block;
    height: calc(185 * var(--u));
    padding: calc(75 * var(--u)) 0 0;
    border-radius: calc(48 * var(--u));
    text-align: center;
  }
}
.p-top-prevent__card:hover {
  opacity: 0.85;
}
.p-top-prevent__icon {
  position: absolute;
  left: calc(24 * var(--u));
  top: 50%;
  width: calc(var(--icon-w-sp) * var(--u));
  height: auto;
  transform: translateY(-50%);
}
@media (min-width: 1024px) {
  .p-top-prevent__icon {
    left: 50%;
    top: calc(var(--icon-top) * var(--u));
    width: calc(var(--icon-w) * var(--u));
    transform: translateX(-50%);
  }
}
.p-top-prevent__title {
  font-size: calc(20 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(2.4 * var(--fu));
  line-height: 1.5;
  color: var(--color-white);
}
@media (min-width: 1024px) {
  .p-top-prevent__title {
    font-size: calc(24 * var(--fu));
    letter-spacing: calc(2.88 * var(--fu));
    line-height: calc(36 * var(--fu));
  }
}
@media (max-width: 1023.98px) {
  .p-top-prevent__title {
    font-size: calc(24 * var(--fu));
    letter-spacing: calc(3.36 * var(--fu));
    line-height: calc(36 * var(--fu));
  }
}

/* =============================================
   ペットケア
============================================= */
.p-top-petcare {
  /* クリーム面の末端から1枚目のカードまで（デザイン実測 80px） */
  margin-top: calc(80 * var(--u));
  padding-inline: calc(20 * var(--u));
}
@media (min-width: 1024px) {
  .p-top-petcare {
    margin: calc(120 * var(--u)) auto 0;
    padding-inline: calc(120 * var(--u));
  }
}
.p-top-petcare__item + .p-top-petcare__item {
  margin-top: calc(24 * var(--u));
}
@media (min-width: 1024px) {
  .p-top-petcare__item + .p-top-petcare__item {
    margin-top: calc(60 * var(--u));
  }
}
.p-top-petcare__item--hotel .p-top-petcare__card {
  background: #f3e6b3;
}
.p-top-petcare__item--hotel .p-top-petcare__title,
.p-top-petcare__item--hotel .p-top-petcare__en {
  color: var(--color-title);
}
.p-top-petcare__item--trimming .p-top-petcare__card {
  background: #e39b68;
}
.p-top-petcare__item--dogrun .p-top-petcare__card {
  background: var(--color-num);
}
.p-top-petcare__item--hotel, .p-top-petcare__item--dogrun {
  /* デザインどおり、この2枚のみ写真に20%の暗色オーバーレイ */
}
@media (min-width: 1024px) {
  .p-top-petcare__item--hotel .p-top-petcare__img::after, .p-top-petcare__item--dogrun .p-top-petcare__img::after {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(39, 39, 39, 0.2);
  }
}
.p-top-petcare__card {
  position: relative;
  display: flex;
  align-items: stretch;
  height: calc(96 * var(--u));
  border-radius: calc(8 * var(--u));
  overflow: hidden;
  transition: opacity 0.3s;
}
@media (min-width: 1024px) {
  .p-top-petcare__card {
    height: calc(280 * var(--u));
    border-radius: calc(20 * var(--u));
  }
}
.p-top-petcare__card:hover {
  opacity: 0.88;
}
.p-top-petcare__img {
  position: relative;
  flex-shrink: 0;
  width: calc(106 * var(--u));
  /* 左角丸＋右端のふくらみはデザインのパスをマスクとして適用。
  外部ファイル参照だとローカルでHTMLを直接開いた際にマスクが読めず写真が消えるため、
  SVGを埋め込んでいる */
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='106' height='96' viewBox='0 0 106 96' preserveAspectRatio='none'%3E %3Cpath d='M0 8C0 3.58172 3.58172 0 8 0H93.3921C93.3921 0 106 19.5 106 48C106 76.5 93.3921 96 93.3921 96H8C3.58172 96 0 92.4183 0 88V8Z' fill='%23000'/%3E %3C/svg%3E") no-repeat center/100% 100%;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='106' height='96' viewBox='0 0 106 96' preserveAspectRatio='none'%3E %3Cpath d='M0 8C0 3.58172 3.58172 0 8 0H93.3921C93.3921 0 106 19.5 106 48C106 76.5 93.3921 96 93.3921 96H8C3.58172 96 0 92.4183 0 88V8Z' fill='%23000'/%3E %3C/svg%3E") no-repeat center/100% 100%;
}
@media (min-width: 1024px) {
  .p-top-petcare__img {
    width: calc(400 * var(--u));
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='400' height='280' viewBox='0 0 400 280' preserveAspectRatio='none'%3E %3Cpath d='M359.649 0H20C8.95432 0 0 8.95431 0 20V260C0 271.046 8.95432 280 20 280H359.649C359.649 280 400 241.818 400 140C400 38.1818 359.649 0 359.649 0Z' fill='%23000'/%3E %3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='400' height='280' viewBox='0 0 400 280' preserveAspectRatio='none'%3E %3Cpath d='M359.649 0H20C8.95432 0 0 8.95431 0 20V260C0 271.046 8.95432 280 20 280H359.649C359.649 280 400 241.818 400 140C400 38.1818 359.649 0 359.649 0Z' fill='%23000'/%3E %3C/svg%3E");
  }
}
.p-top-petcare__img img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  /* デザインではSPのみ写真が左右反転していない（PCは反転）ため戻す */
  transform: scaleX(-1);
}
@media (min-width: 1024px) {
  .p-top-petcare__img img {
    transform: none;
  }
}
.p-top-petcare__body {
  position: relative;
  flex: 1;
  padding: calc(8 * var(--u)) calc(12 * var(--u)) 0 calc(12 * var(--u));
}
@media (min-width: 1024px) {
  .p-top-petcare__body {
    padding: calc(64 * var(--u)) 0 0 calc(56 * var(--u));
  }
}
.p-top-petcare__title {
  font-size: calc(18 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(2.16 * var(--fu));
  line-height: calc(32 * var(--fu));
  color: var(--color-bg);
}
@media (min-width: 1024px) {
  .p-top-petcare__title {
    font-size: calc(40 * var(--fu));
    letter-spacing: calc(4.8 * var(--fu));
    line-height: calc(48 * var(--fu));
  }
}
.p-top-petcare__en {
  margin-top: calc(-3 * var(--u));
  font-family: var(--font-en);
  font-weight: 500;
  font-size: calc(14 * var(--fu));
  letter-spacing: calc(1.68 * var(--fu));
  line-height: calc(18 * var(--fu));
  color: var(--color-bg);
}
@media (min-width: 1024px) {
  .p-top-petcare__en {
    margin-top: calc(6 * var(--u));
    padding-left: calc(8 * var(--u));
    font-size: calc(20 * var(--fu));
    letter-spacing: calc(2.4 * var(--fu));
    line-height: calc(28 * var(--fu));
  }
}
.p-top-petcare__badge {
  display: none;
}
@media (min-width: 1024px) {
  .p-top-petcare__badge {
    display: inline-flex;
    align-items: center;
    height: calc(44 * var(--u));
    margin-top: calc(29 * var(--u));
    padding-inline: calc(22 * var(--u));
    border-radius: 999px;
    background: var(--color-white);
    font-size: calc(16 * var(--fu));
    font-weight: 500;
    letter-spacing: calc(1.92 * var(--fu));
    line-height: 1;
    color: var(--color-text);
  }
}
.p-top-petcare__silhouette {
  position: absolute;
  left: calc(117 * var(--u));
  top: calc(19 * var(--u));
  width: calc(57 * var(--u));
  pointer-events: none;
}
@media (min-width: 1024px) {
  .p-top-petcare__silhouette {
    left: calc(288 * var(--u));
    top: calc(56 * var(--u));
    width: calc(114 * var(--u));
  }
}
.p-top-petcare__more {
  position: absolute;
  right: calc(12 * var(--u));
  top: calc(68 * var(--u));
  font-size: 0;
}
@media (min-width: 1024px) {
  .p-top-petcare__more {
    right: calc(28 * var(--u));
    top: auto;
    bottom: calc(56 * var(--u));
    transform: none;
    display: flex;
    align-items: center;
    gap: calc(12 * var(--u));
    font-size: calc(16 * var(--fu));
    font-weight: 500;
    letter-spacing: calc(1.92 * var(--fu));
    line-height: calc(24 * var(--fu));
    color: var(--color-title);
  }
}
.p-top-petcare__arrow {
  display: block;
  width: calc(20 * var(--u));
  height: calc(20 * var(--u));
  background: url("../img/common/btn-circle-arrow-lg.svg?v=20260917") no-repeat center/contain;
}
@media (min-width: 1024px) {
  .p-top-petcare__arrow {
    width: calc(34 * var(--u));
    height: calc(34 * var(--u));
  }
}

/* =============================================
   ご挨拶
============================================= */
.p-top-greeting {
  position: relative;
  margin-top: calc(120 * var(--u));
  padding-inline: calc(20 * var(--u));
}
@media (min-width: 1024px) {
  .p-top-greeting {
    position: relative;
    height: calc(790 * var(--u));
    margin: calc(240 * var(--u)) auto 0;
    padding: 0;
  }
}
.p-top-greeting__head {
  text-align: center;
}
@media (min-width: 1024px) {
  .p-top-greeting__head {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
  }
}
.p-top-greeting__deco {
  position: absolute;
  pointer-events: none;
}
.p-top-greeting__deco--dog {
  right: calc(4 * var(--u));
  top: calc(-40 * var(--u));
  width: calc(70 * var(--u));
}
@media (min-width: 1024px) {
  .p-top-greeting__deco--dog {
    right: calc(72 * var(--u));
    top: calc(-114 * var(--u));
    width: calc(140.45 * var(--u));
  }
}
.p-top-greeting__deco--mimosa {
  /* 写真の右下に重なる位置（写真上端から304px、左端から315px） */
  left: calc(315 * var(--u));
  top: calc(457 * var(--u));
  width: calc(49.83 * var(--u));
}
@media (min-width: 1024px) {
  .p-top-greeting__deco--mimosa {
    left: calc(636 * var(--u));
    right: auto;
    top: calc(673 * var(--u));
    bottom: auto;
    width: calc(88.77 * var(--u));
  }
}
.p-top-greeting__img {
  margin-top: calc(56 * var(--u));
  border-radius: calc(20 * var(--u));
  overflow: hidden;
}
@media (min-width: 1024px) {
  .p-top-greeting__img {
    position: absolute;
    left: calc(115 * var(--u));
    top: calc(160 * var(--u));
    width: calc(560 * var(--u));
    margin: 0;
    border-radius: calc(30 * var(--u));
  }
}
.p-top-greeting__img img {
  width: 100%;
  height: auto;
}
.p-top-greeting__body {
  margin-top: calc(40 * var(--u));
  font-size: calc(15 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.8 * var(--fu));
  line-height: calc(30 * var(--fu));
}
@media (min-width: 1024px) {
  .p-top-greeting__body {
    position: absolute;
    left: calc(755 * var(--u));
    top: calc(153 * var(--u));
    width: calc(560 * var(--u));
    margin: 0;
    font-size: calc(16 * var(--fu));
    letter-spacing: calc(1.92 * var(--fu));
    line-height: calc(32 * var(--fu));
  }
}
@media (max-width: 1023.98px) {
  .p-top-greeting__body {
    padding-inline: calc(20 * var(--u));
    font-size: calc(16 * var(--fu));
    letter-spacing: calc(2.56 * var(--fu));
    line-height: calc(28 * var(--fu));
  }
}
.p-top-greeting__body p + p {
  margin-top: calc(16 * var(--u));
}
@media (min-width: 1024px) {
  .p-top-greeting__body p + p {
    margin-top: 0;
  }
}
@media (max-width: 1023.98px) {
  .p-top-greeting__body p + p {
    margin-top: calc(28 * var(--u));
  }
}
.p-top-greeting__lead {
  margin-bottom: calc(24 * var(--u));
  font-size: calc(18 * var(--fu));
  font-weight: 700;
  /* 16文字が横335pxに1行で収まるよう調整（全体で2行） */
  letter-spacing: calc(1.44 * var(--fu));
  line-height: calc(32 * var(--fu));
}
@media (min-width: 1024px) {
  .p-top-greeting__lead {
    margin-bottom: calc(24 * var(--u));
    font-size: calc(24 * var(--fu));
    letter-spacing: calc(3.36 * var(--fu));
    line-height: calc(40 * var(--fu));
  }
}
@media (max-width: 1023.98px) {
  .p-top-greeting__lead {
    margin-bottom: calc(16 * var(--u));
    font-size: calc(24 * var(--fu));
    font-weight: 500;
    letter-spacing: calc(3.36 * var(--fu));
    line-height: calc(40 * var(--fu));
  }
}
.p-top-greeting__lead em {
  font-style: normal;
  color: var(--color-orange);
}
.p-top-greeting__lead {
  /* 24pxでは改行位置が合わないため、SPは自然な折り返しにする */
}
@media (max-width: 1023.98px) {
  .p-top-greeting__lead br {
    display: none;
  }
}

/* =============================================
   ブログ / 症例紹介（クリーム背景）
============================================= */
.p-top-cream {
  position: relative;
  margin-top: calc(90 * var(--u));
  padding-top: calc(29 * var(--u));
  /* 症例紹介の下からクリーム面の末端（波の下端）まで */
  padding-bottom: calc(132 * var(--u));
  background: #f8f1de;
}
@media (min-width: 1024px) {
  .p-top-cream {
    height: calc(1375 * var(--u));
    margin-top: calc(120 * var(--u));
    padding: 0;
    background: none;
    /* 背景（::before）を中身の後ろに敷くため */
    isolation: isolate;
  }
}
.p-top-cream {
  /* 上部の波とベタ面が一体になった背景画像（幅に合わせて拡縮し、下側は切れてよい）。
  1440pxを超える画面でも左右の端まで届くよう、背景は bp.bleed で全幅に伸ばす */
}
@media (min-width: 1024px) {
  .p-top-cream::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    z-index: -1;
    background: url("../img/top/bg-cream-block.png?v=20260922") no-repeat center top/100% auto;
    left: calc(50% - 50vw - 4px);
    width: calc(100vw + 8px);
  }
}
.p-top-cream__wave {
  position: absolute;
  left: 0;
  top: calc(-86 * var(--u));
  width: 100%;
  height: calc(87 * var(--u));
  background: url("../img/top/wave-cream-sp.svg?v=20260917") no-repeat center/100% 100%;
}
@media (min-width: 1024px) {
  .p-top-cream__wave {
    display: none;
  }
}

/* --- ブログ --- */
.p-top-blog {
  position: relative;
}
.p-top-blog__panel {
  margin-inline: calc(20 * var(--u));
  padding: calc(40 * var(--u)) calc(23 * var(--u)) calc(48 * var(--u));
  border-radius: calc(8 * var(--u));
  background-color: var(--color-white);
  background-image: repeating-linear-gradient(to bottom, #fff5db 0 1px, transparent 1px 14px), repeating-linear-gradient(to right, #fff5db 0 1px, transparent 1px 13px);
}
@media (min-width: 1024px) {
  .p-top-blog__panel {
    border-radius: calc(24 * var(--u));
    background-image: repeating-linear-gradient(to bottom, #fff5db 0 1px, transparent 1px 14px), repeating-linear-gradient(to right, #fff5db 0 1px, transparent 1px 12.727px);
    position: absolute;
    left: calc(119 * var(--u));
    top: calc(220 * var(--u));
    width: calc(1200 * var(--u));
    height: calc(624 * var(--u));
    margin: 0;
    padding: calc(80 * var(--u)) calc(136 * var(--u)) 0;
  }
}
@media (max-width: 1023.98px) {
  .p-top-blog__panel {
    padding: calc(56 * var(--u)) calc(26 * var(--u)) calc(56 * var(--u)) calc(29 * var(--u));
  }
}
.p-top-blog__head {
  text-align: center;
}
.p-top-blog__list {
  margin-top: calc(40 * var(--u));
}
@media (min-width: 1024px) {
  .p-top-blog__list {
    display: grid;
    grid-template-columns: repeat(3, calc(280 * var(--u)));
    gap: calc(40 * var(--u));
    margin-top: calc(69 * var(--u));
  }
}
.p-top-blog__item + .p-top-blog__item {
  margin-top: calc(32 * var(--u));
}
@media (min-width: 1024px) {
  .p-top-blog__item + .p-top-blog__item {
    margin-top: 0;
  }
}
@media (max-width: 1023.98px) {
  .p-top-blog__item + .p-top-blog__item {
    margin-top: calc(40 * var(--u));
  }
}
.p-top-blog__card {
  display: block;
  transition: opacity 0.3s;
}
.p-top-blog__card:hover {
  opacity: 0.8;
}
.p-top-blog__img {
  position: relative;
  aspect-ratio: 2/1;
  border-radius: calc(8 * var(--u));
  overflow: hidden;
}
.p-top-blog__img > img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.p-top-blog__ph {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: calc(6 * var(--u));
  width: 100%;
  height: 100%;
  background: #f8f1de;
}
.p-top-blog__ph-mark {
  width: calc(54.4 * var(--u));
}
.p-top-blog__ph-ja {
  width: calc(186.9 * var(--u));
  margin-top: calc(6 * var(--u));
}
.p-top-blog__ph-en {
  width: calc(155 * var(--u));
}
.p-top-blog__date {
  display: block;
  margin-top: calc(12 * var(--u));
  font-family: var(--font-en);
  font-size: calc(16 * var(--fu));
  line-height: 1.1875;
  color: var(--color-orange);
}
@media (min-width: 1024px) {
  .p-top-blog__date {
    margin-top: calc(12 * var(--u));
  }
}
.p-top-blog__excerpt {
  margin-top: calc(9 * var(--u));
  font-size: calc(16 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.92 * var(--fu));
  line-height: calc(24 * var(--fu));
}
@media (max-width: 1023.98px) {
  .p-top-blog__excerpt {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    font-weight: 400;
    letter-spacing: calc(2.24 * var(--fu));
  }
}
.p-top-blog__more {
  display: flex;
  justify-content: center;
  margin-top: calc(40 * var(--u));
}
@media (min-width: 1024px) {
  .p-top-blog__more {
    margin-top: calc(50 * var(--u));
  }
}
@media (max-width: 1023.98px) {
  .p-top-blog__more .c-btn-outline {
    font-size: calc(16 * var(--fu));
    letter-spacing: calc(2.24 * var(--fu));
  }
}
.p-top-blog__deco {
  position: absolute;
  right: calc(10 * var(--u));
  bottom: calc(-30 * var(--u));
  width: calc(80 * var(--u));
  pointer-events: none;
}
@media (min-width: 1024px) {
  .p-top-blog__deco {
    right: calc(82 * var(--u));
    bottom: auto;
    top: calc(736 * var(--u));
    width: calc(128.53 * var(--u));
  }
}

.p-top-case {
  /* --- 症例紹介 --- */
  margin-top: calc(80 * var(--u));
  padding-inline: calc(20 * var(--u));
}
@media (min-width: 1024px) {
  .p-top-case {
    position: absolute;
    left: calc(118 * var(--u));
    top: calc(1004 * var(--u));
    display: flex;
    align-items: flex-start;
    gap: calc(102 * var(--u));
    width: calc(1204 * var(--u));
    margin: 0;
    padding: 0;
  }
}
.p-top-case__head {
  text-align: center;
}
@media (min-width: 1024px) {
  .p-top-case__head {
    flex-shrink: 0;
    width: calc(175 * var(--u));
    text-align: left;
  }
}
.p-top-case__more {
  display: flex;
  justify-content: center;
  margin-top: calc(24 * var(--u));
}
@media (min-width: 1024px) {
  .p-top-case__more {
    position: absolute;
    left: 0;
    top: calc(113 * var(--u));
    justify-content: flex-start;
    margin-top: 0;
  }
}
@media (max-width: 1023.98px) {
  .p-top-case__more .c-btn-outline {
    width: calc(240 * var(--u));
  }
}
.p-top-case__list {
  margin-top: calc(32 * var(--u));
}
@media (min-width: 1024px) {
  .p-top-case__list {
    display: grid;
    grid-template-columns: repeat(3, calc(280 * var(--u)));
    gap: calc(40 * var(--u));
    margin-top: 0;
  }
}
@media (max-width: 1023.98px) {
  .p-top-case__list {
    margin-top: calc(40 * var(--u));
  }
}
.p-top-case__item + .p-top-case__item {
  margin-top: calc(16 * var(--u));
}
@media (min-width: 1024px) {
  .p-top-case__item + .p-top-case__item {
    margin-top: 0;
  }
}
.p-top-case__card {
  position: relative;
  display: block;
  min-height: calc(95 * var(--u));
  padding: calc(24 * var(--u)) calc(56 * var(--u)) calc(24 * var(--u)) calc(20 * var(--u));
  border-radius: calc(8 * var(--u));
  background: var(--color-white);
  transition: opacity 0.3s;
}
@media (min-width: 1024px) {
  .p-top-case__card {
    height: calc(140 * var(--u));
    min-height: 0;
    padding: calc(27 * var(--u)) calc(20 * var(--u)) 0;
  }
}
@media (max-width: 1023.98px) {
  .p-top-case__card {
    padding-top: calc(22 * var(--u));
  }
}
.p-top-case__card:hover {
  opacity: 0.8;
}
.p-top-case__meta {
  display: flex;
  align-items: center;
  gap: calc(14 * var(--u));
}
@media (max-width: 1023.98px) {
  .p-top-case__meta {
    gap: calc(8 * var(--u));
  }
}
.p-top-case__date {
  font-family: var(--font-en);
  font-size: calc(16 * var(--fu));
  line-height: 1.1875;
  color: var(--color-orange);
}
.p-top-case__tag {
  display: inline-flex;
  align-items: center;
  height: calc(24 * var(--u));
  padding-inline: calc(12 * var(--u));
  border-radius: calc(4 * var(--u));
  background: #e5e0d5;
  font-size: calc(14 * var(--fu));
  font-weight: 500;
  line-height: 1;
  color: var(--color-text);
}
@media (max-width: 1023.98px) {
  .p-top-case__tag {
    padding-inline: calc(4 * var(--u));
    border-radius: calc(2 * var(--u));
    background: #e1dfd5;
    font-size: calc(15 * var(--fu));
    font-weight: 400;
    letter-spacing: calc(2.1 * var(--fu));
    color: #000;
  }
}
.p-top-case__title {
  margin-top: calc(11 * var(--u));
  font-size: calc(16 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(2.24 * var(--fu));
  line-height: 1.1875;
  color: #000;
}
@media (min-width: 1024px) {
  .p-top-case__title {
    padding-right: 0;
  }
}
@media (max-width: 1023.98px) {
  .p-top-case__title {
    margin-top: calc(6 * var(--u));
  }
}
.p-top-case__arrow {
  position: absolute;
  right: calc(24 * var(--u));
  top: 50%;
  width: calc(8 * var(--u));
  height: calc(8 * var(--u));
  margin-top: calc(-6 * var(--u));
  border-top: calc(1.5 * var(--u)) solid var(--color-text);
  border-right: calc(1.5 * var(--u)) solid var(--color-text);
  transform: rotate(45deg);
}
@media (min-width: 1024px) {
  .p-top-case__arrow {
    right: calc(20 * var(--u));
    top: auto;
    bottom: calc(23 * var(--u));
    margin-top: 0;
  }
}

.p-about-card {
  /* =============================================
     病院案内（about/）
  ============================================= */
  /* ---------------------------------------------
     共通：写真＋【見出し】＋説明のカード
  --------------------------------------------- */
}
.p-about-card__img {
  aspect-ratio: 480/336;
  overflow: hidden;
  border-radius: calc(16 * var(--u));
  background: #cecece;
}
@media (min-width: 1024px) {
  .p-about-card__img {
    border-radius: calc(24 * var(--u));
  }
}
.p-about-card__img img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.p-about-card__title {
  margin-top: calc(20 * var(--u));
}
@media (min-width: 1024px) {
  .p-about-card__title {
    margin-top: calc(24 * var(--u));
  }
}
.p-about-card__text {
  margin-top: calc(12 * var(--u));
  font-size: calc(14 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.68 * var(--fu));
  line-height: calc(28 * var(--fu));
  color: var(--color-text);
}
@media (min-width: 1024px) {
  .p-about-card__text {
    margin-top: calc(16 * var(--u));
    padding-inline: calc(8 * var(--u));
    font-size: calc(16 * var(--fu));
    letter-spacing: calc(1.92 * var(--fu));
    line-height: calc(32 * var(--fu));
  }
}
@media (min-width: 1024px) {
  .p-about-card--sm .p-about-card__img {
    aspect-ratio: 320/224;
  }
}
.p-about-card--sm {
  /* 機器名はデザイン上、カード幅から左右に少しはみ出して1行に収めている */
}
@media (min-width: 1024px) {
  .p-about-card--sm .p-about-card__title {
    margin-inline: calc(-12 * var(--u));
  }
}

/* ---------------------------------------------
   院内紹介
--------------------------------------------- */
.p-about-facility {
  margin-top: calc(64 * var(--u));
  padding-inline: calc(20 * var(--u));
}
@media (min-width: 1024px) {
  .p-about-facility {
    /* 院内紹介：2列 */
    margin-top: calc(124 * var(--u));
    padding-inline: 0;
  }
}
.p-about-facility__list {
  display: grid;
  gap: calc(48 * var(--u));
  margin-top: calc(40 * var(--u));
}
@media (min-width: 1024px) {
  .p-about-facility__list {
    grid-template-columns: repeat(2, calc(480 * var(--u)));
    justify-content: center;
    gap: calc(80 * var(--u)) calc(120 * var(--u));
    margin-top: calc(94 * var(--u));
  }
}

/* ---------------------------------------------
   医療機器紹介（クリーム背景・上端が波）
--------------------------------------------- */
.p-about-equipment {
  position: relative;
  margin-top: calc(96 * var(--u));
  padding: calc(110 * var(--u)) calc(20 * var(--u)) calc(150 * var(--u));
}
@media (min-width: 1024px) {
  .p-about-equipment {
    /* 医療機器紹介：3列 */
    margin-top: calc(160 * var(--u));
    /* 下余白：最後の説明文〜セクション末端（フッターが117px重なる） */
    padding: calc(182 * var(--u)) 0 calc(265 * var(--u));
  }
}
.p-about-equipment::before {
  content: "";
  position: absolute;
  top: 0;
  height: 100%;
  background: url("../img/lower/wave-cream-sp.svg?v=20260918") no-repeat top center/100% calc(87 * var(--u)), linear-gradient(#f8f1de, #f8f1de) no-repeat left calc(86 * var(--u))/100% calc(100% - calc(86 * var(--u)));
  left: calc(50% - 50vw - 4px);
  width: calc(100vw + 8px);
}
@media (min-width: 1024px) {
  .p-about-equipment::before {
    background: url("../img/lower/wave-cream.svg?v=20260918") no-repeat top center/100% calc(335 * var(--u)), linear-gradient(#f8f1de, #f8f1de) no-repeat left calc(334 * var(--u))/100% calc(100% - calc(334 * var(--u)));
  }
}
.p-about-equipment > * {
  position: relative;
}
.p-about-equipment__lead {
  margin-top: calc(32 * var(--u));
  font-size: calc(14 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.68 * var(--fu));
  line-height: calc(28 * var(--fu));
  color: var(--color-text);
}
@media (min-width: 1024px) {
  .p-about-equipment__lead {
    /* 行末の字送りぶん広げて、デザインと同じ位置で改行させる */
    width: calc(1201.92 * var(--u));
    margin: calc(56 * var(--u)) auto 0;
    font-size: calc(16 * var(--fu));
    letter-spacing: calc(1.92 * var(--fu));
    line-height: calc(32 * var(--fu));
    text-align: center;
  }
}
.p-about-equipment__list {
  display: grid;
  gap: calc(48 * var(--u));
  margin-top: calc(40 * var(--u));
}
@media (min-width: 1024px) {
  .p-about-equipment__list {
    grid-template-columns: repeat(3, calc(320 * var(--u)));
    gap: calc(80 * var(--u)) calc(120 * var(--u));
    width: calc(1200 * var(--u));
    margin: calc(40 * var(--u)) auto 0;
  }
}
.p-about-equipment__group {
  margin-top: calc(64 * var(--u));
}
@media (min-width: 1024px) {
  .p-about-equipment__group {
    width: calc(1200 * var(--u));
    margin: calc(80 * var(--u)) auto 0;
  }
}
.p-about-equipment__group .p-about-equipment__list {
  margin-top: calc(32 * var(--u));
}
@media (min-width: 1024px) {
  .p-about-equipment__group .p-about-equipment__list {
    width: auto;
    margin-top: calc(40 * var(--u));
  }
}
.p-about-equipment {
  /* 小見出し（ピン型アイコン＋見出し） */
}
.p-about-equipment__subhead {
  display: flex;
  align-items: center;
  gap: calc(12 * var(--u));
  font-size: calc(22 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(2.64 * var(--fu));
  line-height: 1.3;
  color: var(--color-title);
}
@media (min-width: 1024px) {
  .p-about-equipment__subhead {
    gap: calc(16 * var(--u));
    font-size: calc(32 * var(--fu));
    letter-spacing: calc(3.84 * var(--fu));
    line-height: 1;
  }
}
.p-about-equipment__subhead img {
  flex-shrink: 0;
  width: calc(50 * var(--u));
}
@media (min-width: 1024px) {
  .p-about-equipment__subhead img {
    width: calc(70 * var(--u));
  }
}
.p-about-equipment {
  /* 装飾 */
}
.p-about-equipment__deco {
  position: absolute;
  pointer-events: none;
}
.p-about-equipment__deco--tulip-a {
  left: calc(20 * var(--u));
  top: calc(20 * var(--u));
  width: calc(30 * var(--u));
}
@media (min-width: 1024px) {
  .p-about-equipment__deco--tulip-a {
    left: calc(75 * var(--u));
    top: calc(47 * var(--u));
    width: calc(50.3 * var(--u));
  }
}
.p-about-equipment__deco--tulip-b {
  left: calc(58 * var(--u));
  top: calc(30 * var(--u));
  width: calc(29 * var(--u));
}
@media (min-width: 1024px) {
  .p-about-equipment__deco--tulip-b {
    left: calc(139 * var(--u));
    top: calc(64 * var(--u));
    width: calc(49.1 * var(--u));
  }
}
.p-about-equipment__deco--dog {
  right: calc(20 * var(--u));
  top: calc(-50 * var(--u));
  width: calc(63 * var(--u));
}
@media (min-width: 1024px) {
  .p-about-equipment__deco--dog {
    left: calc(1247 * var(--u));
    right: auto;
    top: calc(-94 * var(--u));
    width: calc(105 * var(--u));
  }
}

/* =============================================
   スタッフ紹介（about/staff/）
============================================= */
.p-staff-section {
  position: relative;
  margin-top: calc(64 * var(--u));
  padding-inline: calc(20 * var(--u));
}
@media (min-width: 1024px) {
  .p-staff-section {
    margin-top: calc(124 * var(--u));
    padding-inline: 0;
  }
}
.p-staff-section {
  /* ---------------------------------------------
     看護師（クリーム背景・上端が波）
  --------------------------------------------- */
}
.p-staff-section--nurse {
  margin-top: calc(96 * var(--u));
  padding-top: calc(110 * var(--u));
  padding-bottom: calc(150 * var(--u));
}
@media (min-width: 1024px) {
  .p-staff-section--nurse {
    margin-top: calc(160 * var(--u));
    padding-top: calc(182 * var(--u));
    /* 最後の写真の下〜セクション末端（フッターが117px重なる） */
    padding-bottom: calc(297 * var(--u));
  }
}
.p-staff-section--nurse::before {
  content: "";
  position: absolute;
  top: 0;
  height: 100%;
  background: url("../img/lower/wave-cream-sp.svg?v=20260918") no-repeat top center/100% calc(87 * var(--u)), linear-gradient(#f8f1de, #f8f1de) no-repeat left calc(86 * var(--u))/100% calc(100% - calc(86 * var(--u)));
  left: calc(50% - 50vw - 4px);
  width: calc(100vw + 8px);
}
@media (min-width: 1024px) {
  .p-staff-section--nurse::before {
    background: url("../img/lower/wave-cream.svg?v=20260918") no-repeat top center/100% calc(335 * var(--u)), linear-gradient(#f8f1de, #f8f1de) no-repeat left calc(334 * var(--u))/100% calc(100% - calc(334 * var(--u)));
  }
}
.p-staff-section--nurse > * {
  position: relative;
}
@media (min-width: 1024px) {
  .p-staff-section--nurse .p-staff-list {
    gap: calc(80 * var(--u));
  }
}
.p-staff-section__deco {
  position: absolute;
  pointer-events: none;
}
.p-staff-section__deco--dog {
  left: calc(16 * var(--u));
  top: calc(-40 * var(--u));
  width: calc(64 * var(--u));
}
@media (min-width: 1024px) {
  .p-staff-section__deco--dog {
    left: calc(60 * var(--u));
    top: calc(-24 * var(--u));
    width: calc(108 * var(--u));
  }
}
.p-staff-section__deco--flower-a {
  right: calc(52 * var(--u));
  top: calc(4 * var(--u));
  width: calc(32 * var(--u));
}
@media (min-width: 1024px) {
  .p-staff-section__deco--flower-a {
    left: calc(1263 * var(--u));
    right: auto;
    top: calc(-19 * var(--u));
    width: calc(53 * var(--u));
  }
}
.p-staff-section__deco--flower-b {
  right: calc(16 * var(--u));
  top: calc(20 * var(--u));
  width: calc(34 * var(--u));
}
@media (min-width: 1024px) {
  .p-staff-section__deco--flower-b {
    left: calc(1316 * var(--u));
    right: auto;
    top: calc(6 * var(--u));
    width: calc(57 * var(--u));
  }
}

.p-staff-list {
  display: grid;
  gap: calc(64 * var(--u));
  margin-top: calc(40 * var(--u));
}
@media (min-width: 1024px) {
  .p-staff-list {
    /* デザインでは中央ではなく左から119pxの位置に配置 */
    width: calc(1066 * var(--u));
    margin: calc(94 * var(--u)) 0 0 calc(119 * var(--u));
    gap: calc(120 * var(--u));
  }
}

@media (min-width: 1024px) {
  .p-staff-profile {
    display: grid;
    grid-template-columns: calc(336 * var(--u)) calc(674 * var(--u));
    -moz-column-gap: calc(56 * var(--u));
         column-gap: calc(56 * var(--u));
    align-items: start;
  }
}
.p-staff-profile {
  /* ---------------------------------------------
     プロフィール（写真＋名前＋紹介文＋項目）
  --------------------------------------------- */
}
.p-staff-profile__img {
  width: calc(235 * var(--u));
  margin-inline: auto;
  overflow: hidden;
  border-radius: calc(20 * var(--u));
  aspect-ratio: 336/560;
}
@media (min-width: 1024px) {
  .p-staff-profile__img {
    width: auto;
    margin: 0;
  }
}
.p-staff-profile__img img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.p-staff-profile--nurse .p-staff-profile__img {
  aspect-ratio: 336/371;
}
.p-staff-profile__body {
  margin-top: calc(24 * var(--u));
}
@media (min-width: 1024px) {
  .p-staff-profile__body {
    margin-top: calc(16 * var(--u));
  }
}
.p-staff-profile__name {
  font-family: var(--font-round);
  font-size: calc(26 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(3.12 * var(--fu));
  line-height: 1.4;
  color: var(--color-chip);
}
@media (min-width: 1024px) {
  .p-staff-profile__name {
    padding-left: calc(13 * var(--u));
    font-size: calc(32 * var(--fu));
    letter-spacing: calc(3.84 * var(--fu));
    line-height: calc(46 * var(--fu));
  }
}
.p-staff-profile__item ul {
  list-style: disc;
  padding-left: 2rem;
}
.p-staff-profile__item ul li {
  line-height: 20px;
  padding-left: 0;
}
.p-staff-profile__text, .p-staff-profile__value {
  font-size: calc(14 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.68 * var(--fu));
  line-height: calc(28 * var(--fu));
  color: var(--color-text);
}
@media (min-width: 1024px) {
  .p-staff-profile__text, .p-staff-profile__value {
    font-size: calc(16 * var(--fu));
    letter-spacing: calc(1.92 * var(--fu));
    line-height: calc(32 * var(--fu));
  }
}
.p-staff-profile__text {
  margin-top: calc(16 * var(--u));
}
@media (min-width: 1024px) {
  .p-staff-profile__text {
    margin-top: calc(24 * var(--u));
    padding-inline: calc(16 * var(--u));
  }
}
.p-staff-profile {
  /* 項目（所属学会・学会発表・経歴・趣味） */
}
.p-staff-profile__items {
  margin-top: calc(24 * var(--u));
  /* 項目が「経歴・趣味」の2列だけの場合も、紹介文との間隔は24px */
}
.p-staff-profile__items > .p-staff-profile__cols:first-child {
  margin-top: 0;
}
@media (min-width: 1024px) {
  .p-staff-profile__items > .p-staff-profile__cols:first-child {
    margin-top: 0;
  }
}
.p-staff-profile__item + .p-staff-profile__item, .p-staff-profile__items > .p-staff-profile__cols {
  margin-top: calc(24 * var(--u));
}
@media (min-width: 1024px) {
  .p-staff-profile__item + .p-staff-profile__item, .p-staff-profile__items > .p-staff-profile__cols {
    margin-top: calc(32 * var(--u));
  }
}
.p-staff-profile__cols {
  display: grid;
  gap: calc(24 * var(--u));
}
@media (min-width: 1024px) {
  .p-staff-profile__cols {
    /* 右カラムはデザインで336px */
    grid-template-columns: calc(320 * var(--u)) calc(352 * var(--u));
    -moz-column-gap: calc(32 * var(--u));
         column-gap: calc(32 * var(--u));
  }
}
.p-staff-profile__cols > .p-staff-profile__item {
  margin-top: 0;
}
@media (min-width: 1024px) {
  .p-staff-profile__cols > .p-staff-profile__item {
    margin-top: 0;
  }
}
.p-staff-profile__label {
  padding: calc(3 * var(--u)) calc(16 * var(--u));
  border-radius: calc(4 * var(--u));
  background: var(--color-chip);
  color: var(--color-white);
  font-size: calc(16 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(1.92 * var(--fu));
  line-height: calc(24 * var(--fu));
}
@media (min-width: 1024px) {
  .p-staff-profile__label {
    font-size: calc(18 * var(--fu));
    letter-spacing: calc(2.16 * var(--fu));
  }
}
.p-staff-profile__value {
  margin-top: calc(8 * var(--u));
  padding-inline: calc(16 * var(--u));
}
@media (min-width: 1024px) {
  .p-staff-profile__value {
    /* 項目の中身はデザイン上、右端まで使う（学会発表の演題が1行に収まる幅） */
    padding-right: 0;
  }
}
.p-staff-profile {
  /* 学会発表：年と演題、2行目（学会名）は演題の頭にそろえる */
}
.p-staff-profile__talk {
  display: grid;
  grid-template-columns: auto 1fr;
  -moz-column-gap: 1em;
       column-gap: 1em;
}
.p-staff-profile__talk + .p-staff-profile__talk {
  margin-top: calc(12 * var(--u));
}
.p-staff-profile__talk dd {
  margin: 0;
}
.p-staff-profile {
  /* 経歴：学校・勤務先と区分（卒業・勤務など）を2列でそろえる */
}
.p-staff-profile__career {
  display: grid;
  grid-template-columns: max-content max-content;
  -moz-column-gap: 1.5em;
       column-gap: 1.5em;
}
.p-staff-profile__career dd {
  margin: 0;
}

/* =============================================
   診療科目（テンプレート「診療科目」page-medical.php。腫瘍科のデザインがベース）
============================================= */
/* ---------------------------------------------
   こんな症状に心当たりはありませんか？
--------------------------------------------- */
.p-medical-symptoms {
  margin-top: calc(56 * var(--u));
  padding-inline: calc(20 * var(--u));
}
@media (min-width: 1024px) {
  .p-medical-symptoms {
    margin-top: calc(90 * var(--u));
    padding-inline: 0;
  }
}
.p-medical-symptoms .c-checklist {
  margin-top: calc(32 * var(--u));
}
@media (min-width: 1024px) {
  .p-medical-symptoms .c-checklist {
    width: calc(1189 * var(--u));
    margin: calc(94 * var(--u)) 0 0 calc(120 * var(--u));
  }
}
.p-medical-symptoms .c-alert {
  margin-top: calc(32 * var(--u));
}
@media (min-width: 1024px) {
  .p-medical-symptoms .c-alert {
    margin-top: calc(56 * var(--u));
  }
}

/* ---------------------------------------------
   このような病気の可能性があります
--------------------------------------------- */
.p-medical-disease {
  margin-top: calc(80 * var(--u));
  padding-inline: calc(20 * var(--u));
}
@media (min-width: 1024px) {
  .p-medical-disease {
    margin-top: calc(180 * var(--u));
    padding-inline: 0;
  }
}
.p-medical-disease__group {
  margin-top: calc(48 * var(--u));
}
@media (min-width: 1024px) {
  .p-medical-disease__group {
    width: calc(1200 * var(--u));
    margin: calc(94 * var(--u)) auto 0;
  }
}
.p-medical-disease__group + .p-medical-disease__group {
  margin-top: calc(64 * var(--u));
}
@media (min-width: 1024px) {
  .p-medical-disease__group + .p-medical-disease__group {
    margin-top: calc(120 * var(--u));
  }
}
.p-medical-disease__list {
  display: grid;
  gap: calc(48 * var(--u));
  margin-top: calc(24 * var(--u));
}
@media (min-width: 1024px) {
  .p-medical-disease__list {
    gap: calc(81 * var(--u));
    margin-top: calc(40 * var(--u));
  }
}
.p-medical-disease__img {
  overflow: hidden;
  aspect-ratio: 480/336;
  border-radius: calc(16 * var(--u));
}
@media (min-width: 1024px) {
  .p-medical-disease__img {
    border-radius: calc(24 * var(--u));
  }
}
.p-medical-disease__img img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.p-medical-disease__body {
  margin-top: calc(16 * var(--u));
}
@media (min-width: 1024px) {
  .p-medical-disease__body {
    /* 行の高さは写真で決める（説明文は写真の上下中央にそろえ、少しはみ出してもよい） */
    margin-block: calc(-40 * var(--u));
  }
}
.p-medical-disease__title {
  position: relative;
  font-size: calc(20 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(2.4 * var(--fu));
  line-height: calc(40 * var(--fu));
  color: var(--color-title);
}
@media (min-width: 1024px) {
  .p-medical-disease__title {
    font-size: calc(24 * var(--fu));
    letter-spacing: calc(2.88 * var(--fu));
    line-height: calc(48 * var(--fu));
  }
}
.p-medical-disease__title {
  /* 金色の手書き風アンダーライン */
}
.p-medical-disease__title::after {
  content: "";
  position: absolute;
  left: 0;
  /* 行の高さ（文字単位）に合わせて下端に置く */
  top: calc(39 * var(--fu));
  width: calc(240 * var(--fu));
  height: calc(2 * var(--fu));
  background: url("../img/oncology/line-wavy.png") no-repeat center/100% 100%;
}
@media (min-width: 1024px) {
  .p-medical-disease__title::after {
    top: calc(47 * var(--fu));
    width: calc(320 * var(--fu));
  }
}
.p-medical-disease__text {
  margin-top: calc(14 * var(--u));
  font-size: calc(14 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.68 * var(--fu));
  line-height: calc(28 * var(--fu));
  color: var(--color-text);
}
@media (min-width: 1024px) {
  .p-medical-disease__text {
    margin-top: calc(16 * var(--u));
    font-size: calc(16 * var(--fu));
    letter-spacing: calc(1.92 * var(--fu));
    line-height: calc(32 * var(--fu));
  }
}
@media (min-width: 1024px) {
  .p-medical-disease__item {
    display: grid;
    grid-template-columns: calc(480 * var(--u)) calc(683 * var(--u));
    -moz-column-gap: calc(37 * var(--u));
         column-gap: calc(37 * var(--u));
    align-items: center;
  }
}
@media (min-width: 1024px) {
  .p-medical-disease__item--reverse {
    grid-template-columns: calc(683 * var(--u)) calc(480 * var(--u));
  }
}
@media (min-width: 1024px) {
  .p-medical-disease__item--reverse .p-medical-disease__img {
    order: 2;
  }
}

/* ---------------------------------------------
   症例紹介（クリーム背景・上下が波）
--------------------------------------------- */
.p-medical-case {
  position: relative;
  margin-top: calc(96 * var(--u));
  padding: calc(110 * var(--u)) calc(20 * var(--u)) calc(64 * var(--u));
}
@media (min-width: 1024px) {
  .p-medical-case {
    margin-top: calc(180 * var(--u));
    padding: calc(182 * var(--u)) 0 calc(160 * var(--u));
  }
}
.p-medical-case::before {
  content: "";
  position: absolute;
  top: 0;
  height: 100%;
  background: url("../img/lower/wave-cream-sp.svg?v=20260918") no-repeat top center/100% calc(87 * var(--u)), linear-gradient(#f8f1de, #f8f1de) no-repeat left calc(86 * var(--u))/100% calc(100% - calc(86 * var(--u)));
  left: calc(50% - 50vw - 4px);
  width: calc(100vw + 8px);
}
@media (min-width: 1024px) {
  .p-medical-case::before {
    background: url("../img/lower/wave-cream.svg?v=20260918") no-repeat top center/100% calc(335 * var(--u)), linear-gradient(#f8f1de, #f8f1de) no-repeat left calc(334 * var(--u))/100% calc(100% - calc(334 * var(--u)));
  }
}
.p-medical-case {
  /* 下端の波（セクションの外側にはみ出す） */
}
.p-medical-case::after {
  content: "";
  position: absolute;
  top: 100%;
  height: calc(87 * var(--u));
  background: url("../img/lower/wave-cream-bottom-sp.svg?v=20260918") no-repeat center/100% 100%;
  left: calc(50% - 50vw - 4px);
  width: calc(100vw + 8px);
}
@media (min-width: 1024px) {
  .p-medical-case::after {
    height: calc(335 * var(--u));
    background-image: url("../img/lower/wave-cream-bottom.svg?v=20260918");
  }
}
.p-medical-case > * {
  position: relative;
}
.p-medical-case__deco {
  position: absolute;
  z-index: 1;
  pointer-events: none;
}
.p-medical-case__deco--cat {
  right: calc(12 * var(--u));
  top: calc(-40 * var(--u));
  width: calc(110 * var(--u));
}
@media (min-width: 1024px) {
  .p-medical-case__deco--cat {
    left: calc(1154 * var(--u));
    right: auto;
    top: calc(-42 * var(--u));
    width: calc(206 * var(--u));
  }
}
.p-medical-case__deco--flower-a {
  left: calc(46 * var(--u));
  bottom: calc(-24 * var(--u));
  width: calc(32 * var(--u));
}
@media (min-width: 1024px) {
  .p-medical-case__deco--flower-a {
    left: calc(99 * var(--u));
    bottom: calc(-17 * var(--u));
    width: calc(52 * var(--u));
  }
}
.p-medical-case__deco--flower-b {
  left: calc(16 * var(--u));
  bottom: calc(-38 * var(--u));
  width: calc(26 * var(--u));
}
@media (min-width: 1024px) {
  .p-medical-case__deco--flower-b {
    left: calc(57 * var(--u));
    bottom: calc(-41 * var(--u));
    width: calc(42 * var(--u));
  }
}
.p-medical-case__list {
  display: grid;
  gap: calc(16 * var(--u));
  margin-top: calc(40 * var(--u));
}
@media (min-width: 1024px) {
  .p-medical-case__list {
    grid-template-columns: repeat(3, calc(320 * var(--u)));
    gap: calc(80 * var(--u));
    width: calc(1120 * var(--u));
    margin: calc(94 * var(--u)) 0 0 calc(157 * var(--u));
  }
}
.p-medical-case__card {
  display: grid;
  grid-template-columns: calc(128 * var(--u)) 1fr;
  grid-template-rows: auto auto;
  -moz-column-gap: calc(16 * var(--u));
       column-gap: calc(16 * var(--u));
  align-content: center;
  transition: opacity 0.3s;
}
@media (min-width: 1024px) {
  .p-medical-case__card {
    display: block;
  }
}
.p-medical-case__card:hover {
  opacity: 0.8;
}
.p-medical-case__img {
  grid-row: 1/3;
  overflow: hidden;
  aspect-ratio: 320/224;
  border-radius: calc(8 * var(--u));
  background: #cecece;
}
@media (min-width: 1024px) {
  .p-medical-case__img {
    border-radius: calc(24 * var(--u));
  }
}
.p-medical-case__img img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.p-medical-case__meta {
  display: flex;
  align-items: center;
  align-self: end;
  gap: calc(12 * var(--u));
}
@media (min-width: 1024px) {
  .p-medical-case__meta {
    gap: calc(20 * var(--u));
    margin-top: calc(24 * var(--u));
  }
}
.p-medical-case__date {
  font-family: var(--font-en);
  font-size: calc(14 * var(--fu));
  line-height: 1.1875;
  color: var(--color-orange);
}
@media (min-width: 1024px) {
  .p-medical-case__date {
    font-size: calc(16 * var(--fu));
  }
}
.p-medical-case__tag {
  display: inline-flex;
  align-items: center;
  height: calc(22 * var(--u));
  padding-inline: calc(4 * var(--u));
  border-radius: calc(2 * var(--u));
  background: #e1dfd5;
  font-size: calc(13 * var(--fu));
  letter-spacing: calc(1.56 * var(--fu));
  line-height: 1;
  color: #000;
}
@media (min-width: 1024px) {
  .p-medical-case__tag {
    height: calc(24 * var(--u));
    font-size: calc(15 * var(--fu));
    letter-spacing: calc(1.8 * var(--fu));
  }
}
.p-medical-case__title {
  margin-top: calc(8 * var(--u));
  font-size: calc(14 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.92 * var(--fu));
  line-height: 1.1875;
  color: #000;
}
@media (min-width: 1024px) {
  .p-medical-case__title {
    font-size: calc(16 * var(--fu));
  }
}
.p-medical-case__more {
  display: flex;
  justify-content: center;
  margin-top: calc(40 * var(--u));
}
.p-medical-case__more .c-btn-outline {
  font-size: calc(16 * var(--fu));
}

/* ---------------------------------------------
   当クリニックの◯◯診療の特徴
--------------------------------------------- */
.p-medical-feature {
  position: relative;
  margin-top: calc(120 * var(--u));
  padding-inline: calc(20 * var(--u));
}
@media (min-width: 1024px) {
  .p-medical-feature {
    margin-top: calc(182 * var(--u));
    padding-inline: 0;
  }
}
.p-medical-feature__list {
  display: grid;
  gap: calc(48 * var(--u));
  margin-top: calc(56 * var(--u));
}
@media (min-width: 1024px) {
  .p-medical-feature__list {
    grid-template-columns: repeat(3, calc(380 * var(--u)));
    gap: calc(30 * var(--u));
    width: calc(1200 * var(--u));
    margin: calc(110 * var(--u)) auto 0;
  }
}
.p-medical-feature__item {
  display: flex;
  flex-direction: column;
}
.p-medical-feature__item:nth-child(1) {
  /* デザインでは写真・見出しがカード中央から少しずれて配置されている（400px間隔） */
}
@media (min-width: 1024px) {
  .p-medical-feature__item:nth-child(1) :is(.p-medical-feature__img,
  .p-medical-feature__title) {
    translate: calc(7.5 * var(--u)) 0;
  }
}
@media (min-width: 1024px) {
  .p-medical-feature__item:nth-child(2) :is(.p-medical-feature__img,
  .p-medical-feature__title) {
    translate: calc(-2.5 * var(--u)) 0;
  }
}
@media (min-width: 1024px) {
  .p-medical-feature__item:nth-child(3) :is(.p-medical-feature__img,
  .p-medical-feature__title) {
    translate: calc(-13 * var(--u)) 0;
  }
}
.p-medical-feature__img {
  position: relative;
  width: calc(200 * var(--u));
  margin-inline: auto;
}
@media (min-width: 1024px) {
  .p-medical-feature__img {
    width: calc(240 * var(--u));
  }
}
.p-medical-feature__img img {
  width: 100%;
  aspect-ratio: 1;
  border-radius: 50%;
  -o-object-fit: cover;
     object-fit: cover;
}
.p-medical-feature__num {
  position: absolute;
  z-index: 1;
  left: calc(-20 * var(--u));
  top: calc(-16 * var(--u));
  font-family: var(--font-hand);
  font-size: calc(80 * var(--u));
  letter-spacing: calc(1.6 * var(--fu));
  line-height: calc(48 * var(--fu));
  color: var(--color-num);
}
@media (min-width: 1024px) {
  .p-medical-feature__num {
    left: calc(-24 * var(--u));
    top: calc(-16 * var(--u));
    font-size: calc(96 * var(--u));
    letter-spacing: calc(1.92 * var(--fu));
    line-height: calc(58 * var(--fu));
  }
}
.p-medical-feature__title {
  position: relative;
  margin-top: calc(20 * var(--u));
  font-size: calc(20 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(2.4 * var(--fu));
  line-height: calc(32 * var(--fu));
  color: var(--color-title);
  text-align: center;
}
@media (min-width: 1024px) {
  .p-medical-feature__title {
    margin-top: calc(24 * var(--u));
    font-size: calc(24 * var(--fu));
    letter-spacing: calc(2.88 * var(--fu));
    line-height: calc(36 * var(--fu));
  }
}
.p-medical-feature__body {
  flex: 1;
  margin-top: calc(-14 * var(--u));
  padding: calc(40 * var(--u)) calc(24 * var(--u)) calc(32 * var(--u));
  border-radius: calc(16 * var(--u));
  background: #f8f1de;
  font-size: calc(14 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.68 * var(--fu));
  line-height: calc(28 * var(--fu));
  color: var(--color-text);
}
@media (min-width: 1024px) {
  .p-medical-feature__body {
    min-height: calc(336 * var(--u));
    margin-top: calc(-16 * var(--u));
    padding: calc(48 * var(--u)) calc(30 * var(--u)) calc(30 * var(--u));
    border-radius: calc(24 * var(--u));
    font-size: calc(16 * var(--fu));
    letter-spacing: calc(1.92 * var(--fu));
    line-height: calc(32 * var(--fu));
  }
}

/* ---------------------------------------------
   ◯◯診療の流れ（クリーム背景・上端が波）
--------------------------------------------- */
.p-medical-flow {
  position: relative;
  margin-top: calc(120 * var(--u));
  padding: calc(110 * var(--u)) calc(20 * var(--u)) calc(150 * var(--u));
}
@media (min-width: 1024px) {
  .p-medical-flow {
    margin-top: calc(180 * var(--u));
    padding: calc(182 * var(--u)) 0 calc(297 * var(--u));
  }
}
.p-medical-flow::before {
  content: "";
  position: absolute;
  top: 0;
  height: 100%;
  background: url("../img/lower/wave-cream-sp.svg?v=20260918") no-repeat top center/100% calc(87 * var(--u)), linear-gradient(#f8f1de, #f8f1de) no-repeat left calc(86 * var(--u))/100% calc(100% - calc(86 * var(--u)));
  left: calc(50% - 50vw - 4px);
  width: calc(100vw + 8px);
}
@media (min-width: 1024px) {
  .p-medical-flow::before {
    background: url("../img/lower/wave-cream.svg?v=20260918") no-repeat top center/100% calc(335 * var(--u)), linear-gradient(#f8f1de, #f8f1de) no-repeat left calc(334 * var(--u))/100% calc(100% - calc(334 * var(--u)));
  }
}
.p-medical-flow > * {
  position: relative;
}
.p-medical-flow__deco {
  position: absolute;
  left: calc(16 * var(--u));
  top: calc(-56 * var(--u));
  width: calc(56 * var(--u));
  pointer-events: none;
}
@media (min-width: 1024px) {
  .p-medical-flow__deco {
    left: calc(69 * var(--u));
    top: calc(-8 * var(--u));
    width: calc(97 * var(--u));
  }
}

/* =============================================
   避妊・去勢（prevention/neuter/）
============================================= */
/* 本文の共通設定（段落と●リストが混在するブロック） */
/* クリーム背景（上端が波） */
/* クリーム面の下端の波（セクションの外にはみ出す） */
/* ---------------------------------------------
   避妊去勢手術のすすめ
--------------------------------------------- */
.p-neuter-intro {
  margin-top: calc(56 * var(--u));
  padding-inline: calc(20 * var(--u));
}
@media (min-width: 1024px) {
  .p-neuter-intro {
    margin-top: calc(90 * var(--u));
    padding-inline: calc(120 * var(--u));
  }
}
.p-neuter-intro__content {
  margin-top: calc(32 * var(--u));
}
@media (min-width: 1024px) {
  .p-neuter-intro__content {
    position: relative;
    margin-top: calc(94 * var(--u));
  }
}
.p-neuter-intro__title {
  font-size: calc(20 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(2.4 * var(--fu));
  line-height: calc(36 * var(--fu));
  color: var(--color-title);
}
@media (min-width: 1024px) {
  .p-neuter-intro__title {
    font-size: calc(24 * var(--fu));
    letter-spacing: calc(2.88 * var(--fu));
    line-height: calc(48 * var(--fu));
  }
}
.p-neuter-intro__title em {
  font-style: normal;
  color: #e39b68;
}
.p-neuter-intro__text {
  font-size: calc(14 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.68 * var(--fu));
  line-height: calc(28 * var(--fu));
  color: var(--color-text);
  margin-top: calc(12 * var(--u));
}
@media (min-width: 1024px) {
  .p-neuter-intro__text {
    font-size: calc(16 * var(--fu));
    letter-spacing: calc(1.92 * var(--fu));
    line-height: calc(32 * var(--fu));
    margin-top: calc(16 * var(--u));
  }
}
.p-neuter-intro__imgs {
  position: relative;
  height: calc(250 * var(--u));
  margin-top: calc(24 * var(--u));
}
@media (min-width: 1024px) {
  .p-neuter-intro__imgs {
    /* 本文（文字単位の幅）の右隣に置く。タブレット横で本文が広がっても画像にかぶらない */
    position: absolute;
    left: calc(calc(700 * var(--fu)) + calc(20 * var(--u)));
    /* デザインでは右の余白に70pxはみ出す。1152px以上は幅550px、それ未満は残りの幅に縮める */
    right: calc(-70 * var(--u));
    top: 0;
    height: auto;
    aspect-ratio: 550/425;
    margin: 0;
  }
}
.p-neuter-intro__img {
  position: absolute;
  border-radius: calc(16 * var(--u));
  -o-object-fit: cover;
     object-fit: cover;
}
@media (min-width: 1024px) {
  .p-neuter-intro__img {
    border-radius: calc(24 * var(--u));
  }
}
.p-neuter-intro__img--01 {
  left: 0;
  top: 0;
  width: calc(240 * var(--u));
  aspect-ratio: 400/280;
}
@media (min-width: 1024px) {
  .p-neuter-intro__img--01 {
    left: 0;
    width: 72.7272727273%;
  }
}
.p-neuter-intro__img--02 {
  right: 0;
  bottom: 0;
  width: calc(180 * var(--u));
  aspect-ratio: 300/210;
}
@media (min-width: 1024px) {
  .p-neuter-intro__img--02 {
    left: 45.4545454545%;
    right: auto;
    top: 50.5882352941%;
    bottom: auto;
    width: 54.5454545455%;
  }
}
.p-neuter-intro .c-cta {
  margin-top: calc(32 * var(--u));
}
@media (min-width: 1024px) {
  .p-neuter-intro .c-cta {
    margin-top: calc(64 * var(--u));
  }
}
@media (min-width: 1024px) {
  .p-neuter-intro__body {
    width: calc(700 * var(--fu));
  }
}

/* ---------------------------------------------
   パンフレット／避妊手術とは／去勢手術とは（クリーム背景）
--------------------------------------------- */
.p-neuter-cream {
  position: relative;
  margin-top: calc(96 * var(--u));
  padding: calc(110 * var(--u)) calc(20 * var(--u)) calc(64 * var(--u));
}
@media (min-width: 1024px) {
  .p-neuter-cream {
    margin-top: calc(120 * var(--u));
    padding: calc(182 * var(--u)) calc(120 * var(--u)) calc(180 * var(--u));
  }
}
.p-neuter-cream::before {
  content: "";
  position: absolute;
  top: 0;
  height: 100%;
  background: url("../img/lower/wave-cream-sp.svg?v=20260918") no-repeat top center/100% calc(87 * var(--u)), linear-gradient(#f8f1de, #f8f1de) no-repeat left calc(86 * var(--u))/100% calc(100% - calc(86 * var(--u)));
  left: calc(50% - 50vw - 4px);
  width: calc(100vw + 8px);
}
@media (min-width: 1024px) {
  .p-neuter-cream::before {
    background: url("../img/lower/wave-cream.svg?v=20260918") no-repeat top center/100% calc(335 * var(--u)), linear-gradient(#f8f1de, #f8f1de) no-repeat left calc(334 * var(--u))/100% calc(100% - calc(334 * var(--u)));
  }
}
.p-neuter-cream::after {
  content: "";
  position: absolute;
  top: 100%;
  height: calc(87 * var(--u));
  background: no-repeat center/100% 100%;
  left: calc(50% - 50vw - 4px);
  width: calc(100vw + 8px);
  background-image: url("../img/lower/wave-cream-bottom-sp.svg?v=20260918");
}
@media (min-width: 1024px) {
  .p-neuter-cream::after {
    height: calc(335 * var(--u));
    background-image: url("../img/lower/wave-cream-bottom.svg?v=20260918");
  }
}
.p-neuter-cream > * {
  position: relative;
}
.p-neuter-cream__deco {
  position: absolute;
  z-index: 1;
  pointer-events: none;
}
.p-neuter-cream__deco--dog {
  left: calc(16 * var(--u));
  top: calc(-24 * var(--u));
  width: calc(64 * var(--u));
}
@media (min-width: 1024px) {
  .p-neuter-cream__deco--dog {
    left: calc(60 * var(--u));
    top: 0;
    width: calc(108 * var(--u));
  }
}
.p-neuter-cream__deco--flower-a {
  left: calc(24 * var(--u));
  bottom: calc(-44 * var(--u));
  width: calc(30 * var(--u));
}
@media (min-width: 1024px) {
  .p-neuter-cream__deco--flower-a {
    left: calc(137 * var(--u));
    bottom: calc(-61 * var(--u));
    width: calc(50 * var(--u));
  }
}
.p-neuter-cream__deco--flower-b {
  left: calc(62 * var(--u));
  bottom: calc(-50 * var(--u));
  width: calc(26 * var(--u));
}
@media (min-width: 1024px) {
  .p-neuter-cream__deco--flower-b {
    left: calc(201 * var(--u));
    bottom: calc(-69 * var(--u));
    width: calc(44 * var(--u));
  }
}

.p-neuter-pamphlet__content {
  margin-top: calc(32 * var(--u));
}
@media (min-width: 1024px) {
  .p-neuter-pamphlet__content {
    display: grid;
    /* 本文は改行位置が固定のため文字単位の幅にし、画像側を縮める（1152px以上は 335px / 681px） */
    grid-template-columns: minmax(0, 1fr) calc(681 * var(--fu));
    -moz-column-gap: calc(40 * var(--u));
         column-gap: calc(40 * var(--u));
    align-items: start;
    margin: calc(94 * var(--u)) calc(72 * var(--u)) 0;
  }
}
.p-neuter-pamphlet__img {
  display: block;
  width: 100%;
  max-width: calc(335 * var(--u));
  height: auto;
  margin-inline: auto;
}
@media (min-width: 1024px) {
  .p-neuter-pamphlet__img {
    max-width: none;
    margin-inline: 0;
  }
}
.p-neuter-pamphlet__body {
  font-size: calc(14 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.68 * var(--fu));
  line-height: calc(28 * var(--fu));
  color: var(--color-text);
  margin-top: calc(24 * var(--u));
}
@media (min-width: 1024px) {
  .p-neuter-pamphlet__body {
    font-size: calc(16 * var(--fu));
    letter-spacing: calc(1.92 * var(--fu));
    line-height: calc(32 * var(--fu));
    margin-top: 0;
  }
}
.p-neuter-pamphlet__body strong {
  font-weight: 700;
  color: var(--color-orange);
}

.p-neuter-surgery {
  margin-top: calc(80 * var(--u));
}
@media (min-width: 1024px) {
  .p-neuter-surgery {
    margin-top: calc(180 * var(--u));
  }
}
.p-neuter-surgery__lead {
  font-size: calc(14 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.68 * var(--fu));
  line-height: calc(28 * var(--fu));
  color: var(--color-text);
  margin-top: calc(24 * var(--u));
}
@media (min-width: 1024px) {
  .p-neuter-surgery__lead {
    font-size: calc(16 * var(--fu));
    letter-spacing: calc(1.92 * var(--fu));
    line-height: calc(32 * var(--fu));
    margin-top: calc(56 * var(--u));
    text-align: center;
  }
}
.p-neuter-surgery__subhead {
  display: flex;
  align-items: center;
  gap: calc(10 * var(--u));
  margin-top: calc(32 * var(--u));
  font-size: calc(20 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(2.4 * var(--fu));
  line-height: 1.4;
  color: var(--color-chip);
}
@media (min-width: 1024px) {
  .p-neuter-surgery__subhead {
    gap: calc(16 * var(--u));
    margin-top: calc(40 * var(--u));
    font-size: calc(32 * var(--fu));
    letter-spacing: calc(3.84 * var(--fu));
    line-height: calc(32 * var(--fu));
  }
}
.p-neuter-surgery__subhead::before {
  content: "";
  flex-shrink: 0;
  width: calc(40 * var(--u));
  height: calc(40 * var(--u));
  border-radius: 50%;
  background: no-repeat center/calc(16 * var(--u)) calc(22 * var(--u)) var(--color-chip);
}
@media (min-width: 1024px) {
  .p-neuter-surgery__subhead::before {
    width: calc(56 * var(--u));
    height: calc(56 * var(--u));
    background-size: calc(22 * var(--u)) calc(32 * var(--u));
  }
}
.p-neuter-surgery__subhead--female::before {
  background-image: url("../img/neuter/icon-female.svg");
}
.p-neuter-surgery__subhead--male::before {
  background-image: url("../img/neuter/icon-male.svg");
  background-size: calc(20 * var(--u)) calc(20 * var(--u));
}
@media (min-width: 1024px) {
  .p-neuter-surgery__subhead--male::before {
    background-size: calc(28 * var(--u)) calc(28 * var(--u));
  }
}
.p-neuter-surgery__subhead + .p-neuter-disease {
  margin-top: calc(24 * var(--u));
}
@media (min-width: 1024px) {
  .p-neuter-surgery__subhead + .p-neuter-disease {
    margin-top: calc(40 * var(--u));
  }
}

.p-neuter-disease {
  font-size: calc(14 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.68 * var(--fu));
  line-height: calc(28 * var(--fu));
  color: var(--color-text);
  margin-top: calc(40 * var(--u));
}
@media (min-width: 1024px) {
  .p-neuter-disease {
    font-size: calc(16 * var(--fu));
    letter-spacing: calc(1.92 * var(--fu));
    line-height: calc(32 * var(--fu));
    margin-top: calc(56 * var(--u));
  }
}
.p-neuter-disease__title {
  position: relative;
  padding-left: calc(22 * var(--u));
  font-size: calc(18 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(2.16 * var(--fu));
  line-height: calc(32 * var(--fu));
  color: var(--color-text);
}
@media (min-width: 1024px) {
  .p-neuter-disease__title {
    padding-left: calc(26 * var(--u));
    font-size: calc(24 * var(--fu));
    letter-spacing: calc(2.88 * var(--fu));
    line-height: calc(40 * var(--fu));
  }
}
.p-neuter-disease__title::before {
  content: "";
  position: absolute;
  left: 0;
  top: calc(9 * var(--u));
  width: calc(14 * var(--u));
  height: calc(14 * var(--u));
  border-radius: 50%;
  background: var(--color-chip);
}
@media (min-width: 1024px) {
  .p-neuter-disease__title::before {
    top: calc(12 * var(--u));
    width: calc(18 * var(--u));
    height: calc(18 * var(--u));
  }
}
.p-neuter-disease__title + .p-neuter-disease__text {
  margin-top: calc(12 * var(--u));
}
@media (min-width: 1024px) {
  .p-neuter-disease__title + .p-neuter-disease__text {
    margin-top: calc(16 * var(--u));
  }
}
.p-neuter-disease {
  /* デザインどおり3項目＋2項目で改行 */
}
@media (min-width: 1024px) {
  .p-neuter-disease__list {
    max-width: calc(600 * var(--u));
  }
}

/* ---------------------------------------------
   行動面でのメリット
--------------------------------------------- */
.p-neuter-benefit {
  margin-top: calc(120 * var(--u));
  padding-inline: calc(20 * var(--u));
}
@media (min-width: 1024px) {
  .p-neuter-benefit {
    margin-top: calc(182 * var(--u));
    padding-inline: calc(120 * var(--u));
  }
}
.p-neuter-benefit__content {
  margin-top: calc(32 * var(--u));
}
@media (min-width: 1024px) {
  .p-neuter-benefit__content {
    display: grid;
    grid-template-columns: calc(416 * var(--u)) 1fr;
    -moz-column-gap: calc(56 * var(--u));
         column-gap: calc(56 * var(--u));
    align-items: start;
    margin-top: calc(94 * var(--u));
  }
}
.p-neuter-benefit__img {
  overflow: hidden;
  aspect-ratio: 416/291;
  border-radius: calc(16 * var(--u));
}
@media (min-width: 1024px) {
  .p-neuter-benefit__img {
    margin-top: calc(26 * var(--u));
    border-radius: calc(24 * var(--u));
  }
}
.p-neuter-benefit__img img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.p-neuter-benefit__body {
  font-size: calc(14 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.68 * var(--fu));
  line-height: calc(28 * var(--fu));
  color: var(--color-text);
  margin-top: calc(24 * var(--u));
}
@media (min-width: 1024px) {
  .p-neuter-benefit__body {
    font-size: calc(16 * var(--fu));
    letter-spacing: calc(1.92 * var(--fu));
    line-height: calc(32 * var(--fu));
    margin-top: 0;
  }
}

/* ---------------------------------------------
   手術の時期
--------------------------------------------- */
.p-neuter-season {
  margin-top: calc(80 * var(--u));
  padding-inline: calc(20 * var(--u));
}
@media (min-width: 1024px) {
  .p-neuter-season {
    margin-top: calc(180 * var(--u));
    padding-inline: calc(120 * var(--u));
  }
}
.p-neuter-season__lead {
  font-size: calc(14 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.68 * var(--fu));
  line-height: calc(28 * var(--fu));
  color: var(--color-text);
  margin-top: calc(24 * var(--u));
}
@media (min-width: 1024px) {
  .p-neuter-season__lead {
    font-size: calc(16 * var(--fu));
    letter-spacing: calc(1.92 * var(--fu));
    line-height: calc(32 * var(--fu));
    margin-top: calc(56 * var(--u));
    text-align: center;
  }
}
.p-neuter-season__item {
  font-size: calc(14 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.68 * var(--fu));
  line-height: calc(28 * var(--fu));
  color: var(--color-text);
  margin-top: calc(32 * var(--u));
}
@media (min-width: 1024px) {
  .p-neuter-season__item {
    font-size: calc(16 * var(--fu));
    letter-spacing: calc(1.92 * var(--fu));
    line-height: calc(32 * var(--fu));
    margin-top: calc(40 * var(--u));
  }
}
.p-neuter-season__item + .p-neuter-season__item {
  margin-top: calc(40 * var(--u));
}
@media (min-width: 1024px) {
  .p-neuter-season__item + .p-neuter-season__item {
    margin-top: calc(56 * var(--u));
  }
}
.p-neuter-season__point {
  display: flex;
  align-items: center;
  gap: calc(10 * var(--u));
  margin-top: calc(20 * var(--u));
  font-size: calc(16 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(1.92 * var(--fu));
  line-height: calc(28 * var(--fu));
  color: var(--color-title);
}
@media (min-width: 1024px) {
  .p-neuter-season__point {
    gap: calc(16 * var(--u));
    margin-top: calc(40 * var(--u));
    font-size: calc(18 * var(--fu));
    letter-spacing: calc(2.16 * var(--fu));
    line-height: calc(30 * var(--fu));
  }
}
.p-neuter-season__point::before {
  content: "";
  flex-shrink: 0;
  width: calc(22 * var(--u));
  height: calc(22 * var(--u));
  background: url("../img/lower/icon-check-orange.svg") no-repeat center/contain;
}
@media (min-width: 1024px) {
  .p-neuter-season__point::before {
    width: calc(24 * var(--u));
    height: calc(24 * var(--u));
  }
}
.p-neuter-season__point + .p-neuter-season__text {
  margin-top: calc(12 * var(--u));
}
@media (min-width: 1024px) {
  .p-neuter-season__point + .p-neuter-season__text {
    margin-top: calc(17 * var(--u));
  }
}
.p-neuter-season__text strong {
  font-weight: 700;
  color: var(--color-orange);
}

/* ---------------------------------------------
   当院の避妊去勢手術の特徴（クリーム背景・上下が波）
--------------------------------------------- */
.p-neuter-feature {
  position: relative;
  margin-top: calc(96 * var(--u));
  padding: calc(110 * var(--u)) calc(20 * var(--u)) calc(64 * var(--u));
}
@media (min-width: 1024px) {
  .p-neuter-feature {
    margin-top: calc(180 * var(--u));
    padding: calc(182 * var(--u)) calc(120 * var(--u)) calc(240 * var(--u));
  }
}
.p-neuter-feature::before {
  content: "";
  position: absolute;
  top: 0;
  height: 100%;
  background: url("../img/lower/wave-cream-sp.svg?v=20260918") no-repeat top center/100% calc(87 * var(--u)), linear-gradient(#f8f1de, #f8f1de) no-repeat left calc(86 * var(--u))/100% calc(100% - calc(86 * var(--u)));
  left: calc(50% - 50vw - 4px);
  width: calc(100vw + 8px);
}
@media (min-width: 1024px) {
  .p-neuter-feature::before {
    background: url("../img/lower/wave-cream.svg?v=20260918") no-repeat top center/100% calc(335 * var(--u)), linear-gradient(#f8f1de, #f8f1de) no-repeat left calc(334 * var(--u))/100% calc(100% - calc(334 * var(--u)));
  }
}
.p-neuter-feature::after {
  content: "";
  position: absolute;
  top: 100%;
  height: calc(87 * var(--u));
  background: no-repeat center/100% 100%;
  left: calc(50% - 50vw - 4px);
  width: calc(100vw + 8px);
  background-image: url("../img/lower/wave-cream-bottom-b-sp.svg?v=20260918");
}
@media (min-width: 1024px) {
  .p-neuter-feature::after {
    height: calc(335 * var(--u));
    background-image: url("../img/lower/wave-cream-bottom-b.svg?v=20260918");
  }
}
.p-neuter-feature > * {
  position: relative;
}
.p-neuter-feature__deco {
  position: absolute;
  z-index: 1;
  pointer-events: none;
}
.p-neuter-feature__deco--dog {
  left: calc(16 * var(--u));
  top: calc(-56 * var(--u));
  width: calc(56 * var(--u));
}
@media (min-width: 1024px) {
  .p-neuter-feature__deco--dog {
    left: calc(69 * var(--u));
    top: calc(-8 * var(--u));
    width: calc(97 * var(--u));
  }
}
.p-neuter-feature__deco--tulip-a {
  left: calc(20 * var(--u));
  top: calc(100% + calc(20 * var(--u)));
  width: calc(30 * var(--u));
}
@media (min-width: 1024px) {
  .p-neuter-feature__deco--tulip-a {
    left: calc(72 * var(--u));
    top: calc(100% + calc(47 * var(--u)));
    width: calc(50 * var(--u));
  }
}
.p-neuter-feature__deco--tulip-b {
  left: calc(56 * var(--u));
  top: calc(100% + calc(30 * var(--u)));
  width: calc(29 * var(--u));
}
@media (min-width: 1024px) {
  .p-neuter-feature__deco--tulip-b {
    left: calc(136 * var(--u));
    top: calc(100% + calc(64 * var(--u)));
    width: calc(49 * var(--u));
  }
}
.p-neuter-feature__list {
  display: grid;
  gap: calc(48 * var(--u));
  margin-top: calc(40 * var(--u));
}
@media (min-width: 1024px) {
  .p-neuter-feature__list {
    gap: calc(98 * var(--u));
    margin-top: calc(94 * var(--u));
  }
}
@media (min-width: 1024px) {
  .p-neuter-feature__list-dot {
    /* デザインどおり3項目＋2項目で改行 */
    max-width: calc(500 * var(--u));
    line-height: calc(32 * var(--fu));
  }
}
.p-neuter-feature__list-dot + .p-neuter-feature__text {
  margin-top: 0;
}
.p-neuter-feature__img {
  overflow: hidden;
  aspect-ratio: 416/291;
  border-radius: calc(16 * var(--u));
}
@media (min-width: 1024px) {
  .p-neuter-feature__img {
    border-radius: calc(24 * var(--u));
  }
}
.p-neuter-feature__img img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.p-neuter-feature__body {
  font-size: calc(14 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.68 * var(--fu));
  line-height: calc(28 * var(--fu));
  color: var(--color-text);
  margin-top: calc(16 * var(--u));
}
@media (min-width: 1024px) {
  .p-neuter-feature__body {
    /* 行の間隔は写真で決める（本文は写真より長くてもよい） */
    margin: calc(-13 * var(--u)) 0 calc(-60 * var(--u));
    padding-left: calc(14 * var(--u));
    font-size: calc(16 * var(--fu));
    letter-spacing: calc(1.92 * var(--fu));
    line-height: calc(28 * var(--fu));
  }
}
.p-neuter-feature {
  /* 手書き風の「feature」＋番号 */
}
.p-neuter-feature__num {
  position: relative;
  display: block;
  margin-top: calc(22 * var(--u));
  font-family: var(--font-hand);
  font-size: calc(52 * var(--u));
  letter-spacing: calc(1.04 * var(--fu));
  line-height: calc(46 * var(--fu));
  color: var(--color-chip);
}
@media (min-width: 1024px) {
  .p-neuter-feature__num {
    margin: calc(27 * var(--u)) 0 0 calc(-14 * var(--u));
    font-size: calc(64 * var(--u));
    letter-spacing: calc(1.28 * var(--fu));
    line-height: calc(58 * var(--fu));
  }
}
.p-neuter-feature__num::before {
  content: "";
  position: absolute;
  left: calc(-1 * var(--u));
  top: calc(-22 * var(--u));
  width: calc(64 * var(--u));
  height: calc(30 * var(--u));
  background: url("../img/neuter/label-feature.svg") no-repeat left top/contain;
}
@media (min-width: 1024px) {
  .p-neuter-feature__num::before {
    top: calc(-27 * var(--u));
    width: calc(80 * var(--u));
    height: calc(38 * var(--u));
  }
}
.p-neuter-feature__title {
  margin-top: calc(12 * var(--u));
  font-family: var(--font-round);
  font-size: calc(20 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(2.4 * var(--fu));
  line-height: calc(32 * var(--fu));
  color: #97b971;
}
@media (min-width: 1024px) {
  .p-neuter-feature__title {
    margin-top: calc(28 * var(--u));
    font-size: calc(24 * var(--fu));
    letter-spacing: calc(2.88 * var(--fu));
    line-height: calc(40 * var(--fu));
  }
}
.p-neuter-feature__text {
  margin-top: calc(12 * var(--u));
}
@media (min-width: 1024px) {
  .p-neuter-feature__text {
    margin-top: calc(24 * var(--u));
  }
}
@media (min-width: 1024px) {
  .p-neuter-feature__item {
    display: grid;
    grid-template-columns: calc(416 * var(--u)) calc(654 * var(--u));
    -moz-column-gap: calc(54 * var(--u));
         column-gap: calc(54 * var(--u));
    align-items: start;
  }
}

/* ---------------------------------------------
   避妊・去勢手術の流れ
--------------------------------------------- */
.p-neuter-flow {
  margin-top: calc(120 * var(--u));
  padding-inline: calc(20 * var(--u));
}
@media (min-width: 1024px) {
  .p-neuter-flow {
    margin-top: calc(182 * var(--u));
    padding-inline: 0;
  }
}

/* ---------------------------------------------
   術後の注意点／ご相談（クリーム背景・上端が波）
--------------------------------------------- */
.p-neuter-consult {
  position: relative;
  margin-top: calc(96 * var(--u));
  padding: calc(110 * var(--u)) calc(20 * var(--u)) calc(150 * var(--u));
}
@media (min-width: 1024px) {
  .p-neuter-consult {
    margin-top: calc(180 * var(--u));
    padding: calc(182 * var(--u)) 0 calc(297 * var(--u));
  }
}
.p-neuter-consult::before {
  content: "";
  position: absolute;
  top: 0;
  height: 100%;
  background: url("../img/lower/wave-cream-sp.svg?v=20260918") no-repeat top center/100% calc(87 * var(--u)), linear-gradient(#f8f1de, #f8f1de) no-repeat left calc(86 * var(--u))/100% calc(100% - calc(86 * var(--u)));
  left: calc(50% - 50vw - 4px);
  width: calc(100vw + 8px);
}
@media (min-width: 1024px) {
  .p-neuter-consult::before {
    background: url("../img/lower/wave-cream.svg?v=20260918") no-repeat top center/100% calc(335 * var(--u)), linear-gradient(#f8f1de, #f8f1de) no-repeat left calc(334 * var(--u))/100% calc(100% - calc(334 * var(--u)));
  }
}
.p-neuter-consult > * {
  position: relative;
}
.p-neuter-consult__deco {
  position: absolute;
  left: calc(16 * var(--u));
  top: calc(-56 * var(--u));
  width: calc(56 * var(--u));
  pointer-events: none;
}
@media (min-width: 1024px) {
  .p-neuter-consult__deco {
    left: calc(69 * var(--u));
    top: calc(-8 * var(--u));
    width: calc(97 * var(--u));
  }
}
.p-neuter-consult .c-heading {
  margin-top: calc(120 * var(--u));
}
@media (min-width: 1024px) {
  .p-neuter-consult .c-heading {
    margin-top: calc(227 * var(--u));
  }
}
.p-neuter-consult__text {
  font-size: calc(14 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.68 * var(--fu));
  line-height: calc(28 * var(--fu));
  color: var(--color-text);
  margin-top: calc(32 * var(--u));
  text-align: center;
}
@media (min-width: 1024px) {
  .p-neuter-consult__text {
    font-size: calc(16 * var(--fu));
    letter-spacing: calc(1.92 * var(--fu));
    line-height: calc(32 * var(--fu));
    margin-top: calc(94 * var(--u));
  }
}
@media (min-width: 1024px) {
  .p-neuter-consult .c-note__deco {
    top: calc(237 * var(--u));
  }
}

/* =============================================
   初めての方へ（first/）
============================================= */
/* ---------------------------------------------
   私たちの想い
--------------------------------------------- */
.p-first-feelings {
  position: relative;
  margin-top: calc(80 * var(--u));
  padding: 0 calc(20 * var(--u)) calc(150 * var(--u));
}
@media (min-width: 1024px) {
  .p-first-feelings {
    height: calc(874 * var(--u));
    margin-top: calc(132 * var(--u));
    padding: 0;
  }
}
@media (max-width: 1023.98px) {
  .p-first-feelings {
    padding-bottom: calc(34 * var(--u));
  }
}
.p-first-feelings__head {
  text-align: center;
}
@media (min-width: 1024px) {
  .p-first-feelings__head {
    position: absolute;
    left: calc(173 * var(--u));
    top: calc(24 * var(--u));
    width: calc(67 * var(--u));
    height: calc(288 * var(--u));
    text-align: left;
  }
}
.p-first-feelings__en {
  display: block;
  margin-bottom: calc(8 * var(--u));
  font-family: var(--font-en);
  font-weight: 500;
  font-size: calc(14 * var(--fu));
  letter-spacing: calc(1.68 * var(--fu));
  line-height: 1.2;
  color: var(--color-title);
}
@media (min-width: 1024px) {
  .p-first-feelings__en {
    left: 0;
    top: calc(10 * var(--u));
    font-size: calc(16 * var(--fu));
    letter-spacing: calc(1.92 * var(--fu));
    line-height: calc(19 * var(--fu));
  }
}
@media (max-width: 1023.98px) {
  .p-first-feelings__en {
    margin-bottom: calc(6 * var(--u));
    font-size: calc(16 * var(--fu));
    letter-spacing: calc(1.92 * var(--fu));
    line-height: calc(19 * var(--fu));
  }
}
.p-first-feelings__ja {
  display: block;
  font-size: calc(26 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(3.12 * var(--fu));
  line-height: calc(40 * var(--fu));
  color: var(--color-title);
}
@media (min-width: 1024px) {
  .p-first-feelings__ja {
    left: calc(27 * var(--u));
    font-size: calc(40 * var(--fu));
    letter-spacing: calc(8 * var(--fu));
    line-height: calc(40 * var(--fu));
  }
}
@media (max-width: 1023.98px) {
  .p-first-feelings__ja {
    font-size: calc(40 * var(--fu));
    letter-spacing: calc(4.8 * var(--fu));
    line-height: calc(48 * var(--fu));
  }
}
.p-first-feelings__ja em {
  font-style: normal;
  color: var(--color-orange);
}
.p-first-feelings__text {
  font-size: calc(14 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.68 * var(--fu));
  line-height: calc(28 * var(--fu));
  color: var(--color-text);
  margin-top: calc(32 * var(--u));
}
@media (min-width: 1024px) {
  .p-first-feelings__text {
    position: absolute;
    width: calc(561.6 * var(--u));
    margin: 0;
    font-size: calc(16 * var(--fu));
    letter-spacing: calc(2.56 * var(--fu));
    line-height: calc(40 * var(--fu));
  }
}
@media (max-width: 1023.98px) {
  .p-first-feelings__text {
    margin-top: calc(40 * var(--u));
    padding-inline: calc(20 * var(--u));
    font-size: calc(16 * var(--fu));
    letter-spacing: calc(2.56 * var(--fu));
  }
}
@media (min-width: 1024px) {
  .p-first-feelings__text--02 {
    left: calc(524 * var(--u));
    top: calc(474 * var(--u));
  }
}
@media (max-width: 1023.98px) {
  .p-first-feelings__text--02 {
    margin-top: calc(28 * var(--u));
  }
}
@media (min-width: 1024px) {
  .p-first-feelings__text--01 {
    left: calc(356 * var(--u));
    top: calc(210 * var(--u));
  }
}
.p-first-feelings__imgs {
  position: relative;
  height: calc(280 * var(--u));
  margin-top: calc(32 * var(--u));
}
@media (min-width: 1024px) {
  .p-first-feelings__imgs {
    position: absolute;
    inset: 0;
    height: auto;
    margin: 0;
  }
}
@media (max-width: 1023.98px) {
  .p-first-feelings__imgs {
    height: calc(334 * var(--u));
    margin-top: calc(20 * var(--u));
  }
}
.p-first-feelings__img {
  position: absolute;
  width: calc(180 * var(--u));
  aspect-ratio: 1;
  border-radius: calc(16 * var(--u));
  -o-object-fit: cover;
     object-fit: cover;
}
@media (min-width: 1024px) {
  .p-first-feelings__img {
    width: calc(360 * var(--u));
    border-radius: calc(24 * var(--u));
  }
}
@media (max-width: 1023.98px) {
  .p-first-feelings__img {
    width: calc(192 * var(--u));
    border-radius: calc(24 * var(--u));
  }
}
.p-first-feelings__img--01 {
  right: 0;
  top: 0;
}
@media (min-width: 1024px) {
  .p-first-feelings__img--01 {
    left: calc(1020 * var(--u));
    right: auto;
    top: 0;
  }
}
.p-first-feelings__img--02 {
  left: 0;
  bottom: 0;
}
@media (min-width: 1024px) {
  .p-first-feelings__img--02 {
    left: calc(60 * var(--u));
    top: calc(482 * var(--u));
    bottom: auto;
  }
}
@media (max-width: 1023.98px) {
  .p-first-feelings__img--02 {
    top: calc(142 * var(--u));
    bottom: auto;
  }
}
.p-first-feelings__deco {
  position: absolute;
  z-index: 2;
  pointer-events: none;
}
.p-first-feelings__deco--leaf-a {
  left: calc(8 * var(--u));
  bottom: calc(330 * var(--u));
  width: calc(40 * var(--u));
}
@media (min-width: 1024px) {
  .p-first-feelings__deco--leaf-a {
    left: calc(116 * var(--u));
    top: calc(332 * var(--u));
    bottom: auto;
    width: calc(103 * var(--u));
  }
}
@media (max-width: 1023.98px) {
  .p-first-feelings__deco--leaf-a {
    left: calc(12 * var(--u));
    top: auto;
    bottom: calc(207 * var(--u));
    width: calc(56 * var(--u));
  }
}
.p-first-feelings__deco--leaf-b {
  right: calc(12 * var(--u));
  bottom: calc(160 * var(--u));
  width: calc(36 * var(--u));
}
@media (min-width: 1024px) {
  .p-first-feelings__deco--leaf-b {
    left: calc(1093 * var(--u));
    right: auto;
    top: calc(601 * var(--u));
    bottom: auto;
    width: calc(96 * var(--u));
  }
}
@media (max-width: 1023.98px) {
  .p-first-feelings__deco--leaf-b {
    left: calc(305 * var(--u));
    right: auto;
    top: auto;
    bottom: calc(133 * var(--u));
    width: calc(60 * var(--u));
  }
}
.p-first-feelings__deco--cat {
  right: calc(24 * var(--u));
  bottom: calc(-20 * var(--u));
  width: calc(56 * var(--u));
}
@media (min-width: 1024px) {
  .p-first-feelings__deco--cat {
    left: calc(1174 * var(--u));
    right: auto;
    top: calc(783 * var(--u));
    bottom: auto;
    width: calc(110 * var(--u));
  }
}
@media (max-width: 1023.98px) {
  .p-first-feelings__deco--cat {
    left: calc(297 * var(--u));
    right: auto;
    top: auto;
    bottom: calc(-52 * var(--u));
    width: calc(52 * var(--u));
  }
}
.p-first-feelings {
  /* 縦書き（デザインは1文字48px送り） */
}
@media (min-width: 1024px) {
  .p-first-feelings__en, .p-first-feelings__ja {
    position: absolute;
    top: 0;
    margin: 0;
    writing-mode: vertical-rl;
    /* 文字の下限で高さが足りなくなっても2列に折り返さない */
    white-space: nowrap;
  }
}

.p-top-reason {
  /* ---------------------------------------------
     7つの選ばれる理由（TOPのパーツをクリーム背景で使用）
  --------------------------------------------- */
}
.p-top-reason--first {
  margin-top: 0;
  padding-bottom: calc(64 * var(--u));
}
@media (min-width: 1024px) {
  .p-top-reason--first {
    margin-top: 0;
    padding-bottom: calc(130 * var(--u));
  }
}
.p-top-reason--first .p-top-reason__wave {
  background-image: url("../img/lower/wave-reason-sp-cream.svg?v=20260918");
}
@media (min-width: 1024px) {
  .p-top-reason--first .p-top-reason__wave {
    background-image: url("../img/lower/wave-reason-cream.svg?v=20260918");
  }
}
.p-top-reason--first {
  /* 波より下のクリーム面 */
}
.p-top-reason--first::before {
  content: "";
  position: absolute;
  top: calc(103 * var(--u));
  bottom: 0;
  background: var(--color-bg);
  left: calc(50% - 50vw - 4px);
  width: calc(100vw + 8px);
}
@media (min-width: 1024px) {
  .p-top-reason--first::before {
    top: calc(398 * var(--u));
  }
}
.p-top-reason--first {
  /* 下端の波（セクションの外にはみ出す） */
}
.p-top-reason--first::after {
  content: "";
  position: absolute;
  top: 100%;
  height: calc(87 * var(--u));
  background: url("../img/lower/wave-bg-bottom-b-sp.svg?v=20260918") no-repeat center/100% 100%;
  left: calc(50% - 50vw - 4px);
  width: calc(100vw + 8px);
}
@media (min-width: 1024px) {
  .p-top-reason--first::after {
    height: calc(335 * var(--u));
    background-image: url("../img/lower/wave-bg-bottom-b.svg?v=20260918");
  }
}
.p-top-reason--first .p-top-reason__list {
  position: relative;
}
.p-top-reason--first {
  /* 行の間隔は写真で決める（本文が写真より長くても広げない） */
}
@media (min-width: 1024px) {
  .p-top-reason--first .p-top-reason__text {
    margin-block: calc(-40 * var(--u));
  }
}
.p-top-reason__deco-flower {
  position: absolute;
  z-index: 1;
  top: calc(100% + calc(4 * var(--u)));
  pointer-events: none;
}
@media (min-width: 1024px) {
  .p-top-reason__deco-flower {
    top: calc(100% + calc(5 * var(--u)));
  }
}
.p-top-reason__deco-flower--red {
  left: calc(62 * var(--u));
  width: calc(36 * var(--u));
}
@media (min-width: 1024px) {
  .p-top-reason__deco-flower--red {
    left: calc(257 * var(--u));
    width: calc(72 * var(--u));
  }
}
.p-top-reason__deco-flower--white {
  left: calc(20 * var(--u));
  width: calc(33 * var(--u));
}
@media (min-width: 1024px) {
  .p-top-reason__deco-flower--white {
    left: calc(167 * var(--u));
    top: calc(100% + calc(15 * var(--u)));
    width: calc(66 * var(--u));
  }
}

/* ---------------------------------------------
   診療対象動物
--------------------------------------------- */
.p-first-animals {
  position: relative;
  margin-top: calc(120 * var(--u));
  padding-inline: calc(20 * var(--u));
}
@media (min-width: 1024px) {
  .p-first-animals {
    margin-top: calc(182 * var(--u));
  }
}
.p-first-animals__list {
  display: flex;
  justify-content: center;
  gap: calc(64 * var(--u));
  margin-top: calc(32 * var(--u));
}
@media (min-width: 1024px) {
  .p-first-animals__list {
    gap: calc(80 * var(--u));
    margin-top: calc(80 * var(--u));
  }
}
.p-first-animals__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: calc(6 * var(--u));
  font-size: calc(20 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(2.4 * var(--fu));
  line-height: 1.2;
  color: var(--color-title);
}
@media (min-width: 1024px) {
  .p-first-animals__item {
    gap: calc(8 * var(--u));
    font-size: calc(24 * var(--fu));
    letter-spacing: calc(2.88 * var(--fu));
    line-height: calc(29 * var(--fu));
  }
}
.p-first-animals__item::before {
  content: "";
  width: calc(52 * var(--u));
  height: calc(52 * var(--u));
  background: no-repeat center/contain;
}
@media (min-width: 1024px) {
  .p-first-animals__item::before {
    width: calc(60 * var(--u));
    height: calc(60 * var(--u));
  }
}
.p-first-animals__item--dog::before {
  background-image: url("../img/lower/icon-dog.svg");
}
.p-first-animals__item--cat::before {
  background-image: url("../img/lower/icon-cat-green.svg");
}

/* ---------------------------------------------
   診療の流れ
--------------------------------------------- */
.p-first-flow {
  position: relative;
  margin-top: calc(80 * var(--u));
  padding-inline: calc(20 * var(--u));
}
@media (min-width: 1024px) {
  .p-first-flow {
    margin-top: calc(160 * var(--u));
    padding-inline: calc(230 * var(--u));
  }
}
.p-first-flow__lead {
  font-size: calc(14 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.68 * var(--fu));
  line-height: calc(28 * var(--fu));
  color: var(--color-text);
  margin-top: calc(24 * var(--u));
}
@media (min-width: 1024px) {
  .p-first-flow__lead {
    font-size: calc(16 * var(--fu));
    letter-spacing: calc(1.92 * var(--fu));
    line-height: calc(32 * var(--fu));
    margin-top: calc(56 * var(--u));
  }
}
@media (max-width: 1023.98px) {
  .p-first-flow__lead {
    margin-top: calc(40 * var(--u));
    padding-inline: calc(20 * var(--u));
    font-size: calc(16 * var(--fu));
    letter-spacing: calc(1.92 * var(--fu));
  }
}
.p-first-flow .c-flow {
  margin-top: calc(48 * var(--u));
}
@media (min-width: 1024px) {
  .p-first-flow .c-flow {
    margin: calc(56 * var(--u)) 0 0;
  }
}
.p-first-flow .c-note {
  margin-top: calc(56 * var(--u));
}
@media (min-width: 1024px) {
  .p-first-flow .c-note {
    margin-top: calc(115 * var(--u));
  }
}
.p-first-flow .c-note__deco {
  right: calc(-10 * var(--u));
  bottom: auto;
  top: calc(-60 * var(--u));
}
@media (min-width: 1024px) {
  .p-first-flow .c-note__deco {
    top: calc(267 * var(--u));
  }
}
@media (min-width: 1024px) {
  .p-first-flow .c-flow__body .c-btn-monshin {
    margin-top: calc(16 * var(--u));
  }
}
.p-first-flow {
  /* --- その他の注意事項 --- */
}
@media (max-width: 1023.98px) {
  .page-first .p-first-flow .c-note {
    margin-top: calc(100 * var(--u));
    padding: calc(40 * var(--u)) calc(18 * var(--u));
    border-radius: calc(24 * var(--u));
    font-size: calc(16 * var(--fu));
    letter-spacing: calc(1.92 * var(--fu));
    line-height: calc(32 * var(--fu));
  }
}
@media (max-width: 1023.98px) {
  .page-first .p-first-flow .c-note__deco {
    right: calc(13 * var(--u));
    top: calc(-60 * var(--u));
    width: calc(57 * var(--u));
  }
}

.p-first-belongings {
  margin-top: calc(56 * var(--u));
}
@media (min-width: 1024px) {
  .p-first-belongings {
    display: flex;
    align-items: flex-start;
    gap: calc(42 * var(--u));
    margin: calc(120 * var(--u)) 0 0 calc(84 * var(--u));
  }
}
@media (max-width: 1023.98px) {
  .p-first-belongings {
    margin-top: calc(80 * var(--u));
  }
}
.p-first-belongings__title {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: calc(8 * var(--u));
  font-size: calc(20 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(2.4 * var(--fu));
  line-height: calc(28 * var(--fu));
  color: var(--color-title);
}
@media (min-width: 1024px) {
  .p-first-belongings__title {
    gap: calc(8 * var(--u));
    font-size: calc(24 * var(--fu));
    letter-spacing: calc(2.88 * var(--fu));
    line-height: calc(32 * var(--fu));
  }
}
@media (max-width: 1023.98px) {
  .p-first-belongings__title {
    font-size: calc(24 * var(--fu));
    letter-spacing: calc(2.88 * var(--fu));
    line-height: calc(32 * var(--fu));
  }
}
.p-first-belongings__title::after {
  content: "";
  width: calc(40 * var(--u));
  height: calc(40 * var(--u));
  background: url("../img/first/icon-belongings.svg") no-repeat center/contain;
}
@media (min-width: 1024px) {
  .p-first-belongings__title::after {
    width: calc(50 * var(--u));
    height: calc(50 * var(--u));
  }
}
@media (max-width: 1023.98px) {
  .p-first-belongings__title::after {
    width: calc(50 * var(--u));
    height: calc(50 * var(--u));
  }
}
.p-first-belongings__list {
  font-size: calc(14 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.68 * var(--fu));
  line-height: calc(28 * var(--fu));
  color: var(--color-text);
  display: grid;
  gap: calc(4 * var(--u));
  margin-top: calc(24 * var(--u));
}
@media (min-width: 1024px) {
  .p-first-belongings__list {
    font-size: calc(16 * var(--fu));
    letter-spacing: calc(1.92 * var(--fu));
    line-height: calc(32 * var(--fu));
    display: flex;
    flex-wrap: wrap;
    gap: calc(16 * var(--u)) calc(56 * var(--u));
    width: calc(700 * var(--u));
    margin-top: calc(5 * var(--u));
  }
}
@media (max-width: 1023.98px) {
  .p-first-belongings__list {
    gap: calc(8 * var(--u));
    margin-top: calc(40 * var(--u));
    font-size: calc(16 * var(--fu));
    letter-spacing: calc(1.92 * var(--fu));
    line-height: calc(32 * var(--fu));
  }
}
.p-first-belongings__list li {
  position: relative;
  padding-left: calc(18 * var(--u));
}
@media (min-width: 1024px) {
  .p-first-belongings__list li {
    padding-left: calc(20 * var(--u));
  }
}
@media (max-width: 1023.98px) {
  .p-first-belongings__list li {
    padding-left: calc(20 * var(--u));
  }
}
.p-first-belongings__list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: calc(9 * var(--u));
  width: calc(10 * var(--u));
  height: calc(10 * var(--u));
  border-radius: 50%;
  background: var(--color-orange);
}
@media (min-width: 1024px) {
  .p-first-belongings__list li::before {
    top: calc(10 * var(--u));
    width: calc(12 * var(--u));
    height: calc(12 * var(--u));
  }
}
@media (max-width: 1023.98px) {
  .p-first-belongings__list li::before {
    top: calc(10 * var(--u));
    width: calc(12 * var(--u));
    height: calc(12 * var(--u));
  }
}

/* ---------------------------------------------
   セカンドオピニオン／専門科目（クリーム背景・上下が波）
--------------------------------------------- */
.p-first-so {
  position: relative;
  margin-top: calc(120 * var(--u));
  padding: calc(110 * var(--u)) calc(20 * var(--u)) calc(64 * var(--u));
}
@media (min-width: 1024px) {
  .p-first-so {
    margin-top: calc(160 * var(--u));
    padding: calc(184 * var(--u)) calc(120 * var(--u)) calc(168 * var(--u));
  }
}
.p-first-so::before {
  content: "";
  position: absolute;
  top: 0;
  height: 100%;
  background: url("../img/lower/wave-cream-sp.svg?v=20260918") no-repeat top center/100% calc(87 * var(--u)), linear-gradient(#f8f1de, #f8f1de) no-repeat left calc(86 * var(--u))/100% calc(100% - calc(86 * var(--u)));
  left: calc(50% - 50vw - 4px);
  width: calc(100vw + 8px);
}
@media (min-width: 1024px) {
  .p-first-so::before {
    background: url("../img/lower/wave-cream.svg?v=20260918") no-repeat top center/100% calc(335 * var(--u)), linear-gradient(#f8f1de, #f8f1de) no-repeat left calc(334 * var(--u))/100% calc(100% - calc(334 * var(--u)));
  }
}
.p-first-so::after {
  content: "";
  position: absolute;
  top: 100%;
  height: calc(87 * var(--u));
  background: url("../img/lower/wave-cream-bottom-b-sp.svg?v=20260918") no-repeat center/100% 100%;
  left: calc(50% - 50vw - 4px);
  width: calc(100vw + 8px);
}
@media (min-width: 1024px) {
  .p-first-so::after {
    height: calc(335 * var(--u));
    background-image: url("../img/lower/wave-cream-bottom-b.svg?v=20260918");
  }
}
.p-first-so > * {
  position: relative;
}
.p-first-so__deco {
  position: absolute;
  z-index: 1;
  pointer-events: none;
}
.p-first-so__deco--tulip-a {
  right: calc(52 * var(--u));
  top: calc(-20 * var(--u));
  width: calc(30 * var(--u));
}
@media (min-width: 1024px) {
  .p-first-so__deco--tulip-a {
    left: calc(1239 * var(--u));
    right: auto;
    top: calc(-35 * var(--u));
    width: calc(50 * var(--u));
  }
}
.p-first-so__deco--tulip-b {
  right: calc(16 * var(--u));
  top: calc(-10 * var(--u));
  width: calc(29 * var(--u));
}
@media (min-width: 1024px) {
  .p-first-so__deco--tulip-b {
    left: calc(1303 * var(--u));
    right: auto;
    top: calc(-18 * var(--u));
    width: calc(49 * var(--u));
  }
}
.p-first-so__deco--flower-pink {
  left: calc(-8 * var(--u));
  bottom: calc(-16 * var(--u));
  width: calc(34 * var(--u));
}
@media (min-width: 1024px) {
  .p-first-so__deco--flower-pink {
    left: calc(-16 * var(--u));
    bottom: calc(-31 * var(--u));
    width: calc(56 * var(--u));
  }
}
@media (max-width: 1023.98px) {
  .p-first-so__deco--flower-pink {
    left: calc(-8 * var(--u));
    bottom: calc(-16 * var(--u));
    width: calc(29 * var(--u));
  }
}
.p-first-so__deco--flower-yellow {
  left: calc(28 * var(--u));
  bottom: calc(-24 * var(--u));
  width: calc(38 * var(--u));
}
@media (min-width: 1024px) {
  .p-first-so__deco--flower-yellow {
    left: calc(50 * var(--u));
    bottom: calc(-14 * var(--u));
    width: calc(63 * var(--u));
  }
}
@media (max-width: 1023.98px) {
  .p-first-so__deco--flower-yellow {
    left: calc(27 * var(--u));
    bottom: calc(-8 * var(--u));
    width: calc(33 * var(--u));
  }
}
.p-first-so__deco--flower-red {
  left: calc(62 * var(--u));
  top: calc(100% + calc(4 * var(--u)));
  width: calc(36 * var(--u));
}
@media (min-width: 1024px) {
  .p-first-so__deco--flower-red {
    left: calc(260 * var(--u));
    top: calc(100% + calc(5 * var(--u)));
    width: calc(72 * var(--u));
  }
}
.p-first-so__deco--flower-white {
  left: calc(20 * var(--u));
  top: calc(100% + calc(8 * var(--u)));
  width: calc(33 * var(--u));
}
@media (min-width: 1024px) {
  .p-first-so__deco--flower-white {
    left: calc(170 * var(--u));
    top: calc(100% + calc(15 * var(--u)));
    width: calc(66 * var(--u));
  }
}
.p-first-so__content {
  margin-top: calc(32 * var(--u));
}
@media (min-width: 1024px) {
  .p-first-so__content {
    display: grid;
    grid-template-columns: calc(640 * var(--u)) calc(480 * var(--u));
    -moz-column-gap: calc(54 * var(--u));
         column-gap: calc(54 * var(--u));
    align-items: start;
    margin-top: calc(104 * var(--u));
  }
}
@media (max-width: 1023.98px) {
  .p-first-so__content {
    margin-top: calc(40 * var(--u));
  }
}
.p-first-so__img {
  position: relative;
}
.p-first-so__img > img:first-child {
  width: 100%;
  aspect-ratio: 640/400;
  border-radius: calc(16 * var(--u));
  -o-object-fit: cover;
     object-fit: cover;
}
@media (min-width: 1024px) {
  .p-first-so__img > img:first-child {
    border-radius: calc(24 * var(--u));
  }
}
@media (max-width: 1023.98px) {
  .p-first-so__img > img:first-child {
    aspect-ratio: 335/209;
    border-radius: calc(24 * var(--u));
  }
}
.p-first-so__text {
  font-size: calc(14 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.68 * var(--fu));
  line-height: calc(28 * var(--fu));
  color: var(--color-text);
  margin-top: calc(32 * var(--u));
}
@media (min-width: 1024px) {
  .p-first-so__text {
    margin-top: calc(20 * var(--u));
    font-size: calc(16 * var(--fu));
    letter-spacing: calc(2.56 * var(--fu));
    line-height: calc(40 * var(--fu));
  }
}
@media (max-width: 1023.98px) {
  .p-first-so__text {
    margin-top: calc(40 * var(--u));
    padding-inline: calc(20 * var(--u));
    font-size: calc(16 * var(--fu));
    letter-spacing: calc(1.92 * var(--fu));
    line-height: calc(32 * var(--fu));
  }
}
.p-first-so__dept-head {
  margin-top: calc(80 * var(--u));
}
@media (min-width: 1024px) {
  .p-first-so__dept-head {
    margin-top: calc(180 * var(--u));
  }
}
.p-first-so__catch {
  margin-top: calc(32 * var(--u));
  font-size: calc(18 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(2.16 * var(--fu));
  line-height: calc(44 * var(--fu));
  color: var(--color-title);
  text-align: center;
}
@media (min-width: 1024px) {
  .p-first-so__catch {
    margin-top: calc(94 * var(--u));
    font-size: calc(24 * var(--fu));
    letter-spacing: calc(2.88 * var(--fu));
    line-height: calc(66 * var(--fu));
  }
}
.p-first-so__catch strong {
  display: inline-block;
  margin-inline: calc(8 * var(--u));
  padding: 0 calc(10 * var(--u));
  border-radius: calc(4 * var(--u));
  background: var(--color-num);
  font-size: calc(22 * var(--fu));
  color: var(--color-white);
  line-height: calc(44 * var(--fu));
}
@media (min-width: 1024px) {
  .p-first-so__catch strong {
    vertical-align: top;
    margin-inline: calc(10 * var(--u)) calc(12 * var(--u));
    padding: 0 calc(14 * var(--u));
    font-size: calc(32 * var(--fu));
    letter-spacing: calc(3.84 * var(--fu));
    line-height: calc(66 * var(--fu));
  }
}
.p-first-so__lead {
  font-size: calc(14 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.68 * var(--fu));
  line-height: calc(28 * var(--fu));
  color: var(--color-text);
  margin-top: calc(24 * var(--u));
}
@media (min-width: 1024px) {
  .p-first-so__lead {
    font-size: calc(16 * var(--fu));
    letter-spacing: calc(1.92 * var(--fu));
    line-height: calc(32 * var(--fu));
    margin-top: calc(32 * var(--u));
    text-align: center;
  }
}
.p-first-so__talk {
  margin-top: calc(40 * var(--u));
}
@media (min-width: 1024px) {
  .p-first-so__talk {
    width: calc(980 * var(--u));
    margin: calc(56 * var(--u)) auto 0;
  }
}
.p-first-so__talk-title {
  display: inline-block;
  padding: calc(10 * var(--u)) calc(20 * var(--u));
  border-radius: calc(8 * var(--u)) calc(8 * var(--u)) 0 0;
  background: var(--color-num);
  font-size: calc(16 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(1.92 * var(--fu));
  line-height: calc(28 * var(--fu));
  color: var(--color-white);
}
@media (min-width: 1024px) {
  .p-first-so__talk-title {
    padding: calc(13 * var(--u)) calc(24 * var(--u));
    font-size: calc(18 * var(--fu));
    letter-spacing: calc(2.16 * var(--fu));
    line-height: calc(30 * var(--fu));
  }
}
.p-first-so__talk-list {
  font-size: calc(14 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.68 * var(--fu));
  line-height: calc(28 * var(--fu));
  color: var(--color-text);
  display: grid;
  gap: calc(12 * var(--u));
  padding: calc(20 * var(--u));
  border-radius: 0 calc(16 * var(--u)) calc(16 * var(--u));
  background: var(--color-white);
}
@media (min-width: 1024px) {
  .p-first-so__talk-list {
    font-size: calc(16 * var(--fu));
    letter-spacing: calc(1.92 * var(--fu));
    line-height: calc(32 * var(--fu));
    gap: calc(8 * var(--u));
    margin-top: calc(-1 * var(--u));
    padding: calc(25 * var(--u)) calc(24 * var(--u)) calc(23 * var(--u));
  }
}
.p-first-so__talk-list > div {
  position: relative;
  padding-left: calc(20 * var(--u));
}
@media (min-width: 1024px) {
  .p-first-so__talk-list > div {
    padding-left: calc(20 * var(--u));
  }
}
.p-first-so__talk-list > div::before {
  content: "";
  position: absolute;
  left: 0;
  top: calc(9 * var(--u));
  width: calc(10 * var(--u));
  height: calc(10 * var(--u));
  border-radius: 50%;
  background: var(--color-num);
}
@media (min-width: 1024px) {
  .p-first-so__talk-list > div::before {
    top: calc(10 * var(--u));
    width: calc(12 * var(--u));
    height: calc(12 * var(--u));
  }
}
@media (min-width: 1024px) {
  .p-first-so__talk-list dt,
  .p-first-so__talk-list dd {
    display: inline;
  }
}
@media (min-width: 1024px) {
  .p-first-so__talk-list dt {
    margin-right: calc(32 * var(--u));
  }
}
.p-first-so {
  /* ---------------------------------------------
     セカンドオピニオンの診療の流れ
  --------------------------------------------- */
}
.p-first-so-flow {
  margin-top: calc(120 * var(--u));
  padding-inline: calc(20 * var(--u));
}
@media (min-width: 1024px) {
  .p-first-so-flow {
    margin-top: calc(182 * var(--u));
    padding-inline: calc(230 * var(--u));
  }
}
@media (max-width: 1023.98px) {
  .p-first-so-flow {
    margin-top: calc(120 * var(--u));
  }
}
.p-first-so-flow__head {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: calc(12 * var(--u));
  font-size: calc(22 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(2.64 * var(--fu));
  line-height: calc(34 * var(--fu));
  color: var(--color-title);
  text-align: center;
}
@media (min-width: 1024px) {
  .p-first-so-flow__head {
    flex-direction: row;
    gap: calc(16 * var(--u));
    font-size: calc(32 * var(--fu));
    letter-spacing: calc(3.84 * var(--fu));
    line-height: calc(32 * var(--fu));
    text-align: left;
  }
}
@media (max-width: 1023.98px) {
  .p-first-so-flow__head {
    gap: calc(16 * var(--u));
    font-size: calc(32 * var(--fu));
    letter-spacing: calc(3.84 * var(--fu));
    line-height: calc(40 * var(--fu));
  }
}
.p-first-so-flow__head::before {
  content: "";
  width: calc(50 * var(--u));
  height: calc(64 * var(--u));
  background: url("../img/first/icon-so.svg") no-repeat center/contain;
}
@media (min-width: 1024px) {
  .p-first-so-flow__head::before {
    width: calc(70 * var(--u));
    height: calc(89 * var(--u));
  }
}
@media (max-width: 1023.98px) {
  .p-first-so-flow__head::before {
    width: calc(70 * var(--u));
    height: calc(89 * var(--u));
  }
}
.p-first-so-flow__head em {
  font-style: normal;
  color: var(--color-orange);
}
.p-first-so-flow .c-flow {
  margin-top: calc(48 * var(--u));
}
@media (min-width: 1024px) {
  .p-first-so-flow .c-flow {
    margin: calc(64 * var(--u)) 0 0;
  }
}

.p-top-medical {
  /* ---------------------------------------------
     診療科目 / 予防診療（TOPのパーツ）
  --------------------------------------------- */
}
.p-top-medical--first {
  margin-top: calc(120 * var(--u));
}
@media (min-width: 1024px) {
  .p-top-medical--first {
    margin-top: calc(180 * var(--u));
  }
}

/* ---------------------------------------------
   よくあるご質問
--------------------------------------------- */
.p-first-faq {
  margin-top: calc(96 * var(--u));
  padding-inline: calc(20 * var(--u));
}
@media (min-width: 1024px) {
  .p-first-faq {
    margin-top: calc(153 * var(--u));
    padding-inline: calc(230 * var(--u));
  }
}
@media (max-width: 1023.98px) {
  .p-first-faq {
    margin-top: calc(120 * var(--u));
  }
}
.p-first-faq__list {
  margin-top: calc(32 * var(--u));
  border-bottom: 2px solid #e1dfd5;
}
@media (min-width: 1024px) {
  .p-first-faq__list {
    margin-top: calc(94 * var(--u));
  }
}
@media (max-width: 1023.98px) {
  .p-first-faq__list {
    margin: calc(40 * var(--u)) calc(-12 * var(--u)) 0;
  }
}
.p-first-faq__item {
  border-top: 2px solid #e1dfd5;
}
.p-first-faq__item[open] .p-first-faq__q::after {
  background: linear-gradient(var(--color-title), var(--color-title)) no-repeat center/100% 2px;
}
@media (min-width: 1024px) {
  .p-first-faq__item[open] .p-first-faq__q {
    padding-bottom: calc(18 * var(--u));
  }
}
@media (max-width: 1023.98px) {
  .p-first-faq__item[open] .p-first-faq__q {
    padding-bottom: calc(24 * var(--u));
  }
}
.p-first-faq__q::before, .p-first-faq__a::before {
  position: absolute;
  left: 0;
  font-family: var(--font-hand);
  font-weight: 700;
  font-size: calc(22 * var(--fu));
  letter-spacing: 0;
  line-height: calc(24 * var(--fu));
}
.p-first-faq__q {
  position: relative;
  display: block;
  padding: calc(20 * var(--u)) calc(40 * var(--u)) calc(20 * var(--u)) calc(28 * var(--u));
  font-size: calc(14 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(1.68 * var(--fu));
  line-height: calc(24 * var(--fu));
  color: var(--color-num);
  cursor: pointer;
  list-style: none;
}
@media (min-width: 1024px) {
  .p-first-faq__q {
    padding: calc(38 * var(--u)) calc(84 * var(--u)) calc(40 * var(--u)) calc(77 * var(--u));
    font-size: calc(16 * var(--fu));
    letter-spacing: calc(1.92 * var(--fu));
    line-height: calc(32 * var(--fu));
  }
}
@media (max-width: 1023.98px) {
  .p-first-faq__q {
    padding: calc(22 * var(--u)) calc(32 * var(--u)) calc(24 * var(--u));
    font-size: calc(16 * var(--fu));
    letter-spacing: calc(1.92 * var(--fu));
    line-height: calc(32 * var(--fu));
  }
}
.p-first-faq__q::-webkit-details-marker {
  display: none;
}
.p-first-faq__q::before {
  content: "Q";
  top: calc(20 * var(--u));
  color: var(--color-num);
}
@media (min-width: 1024px) {
  .p-first-faq__q::before {
    left: calc(41 * var(--u));
    top: calc(42 * var(--u));
    font-size: calc(24 * var(--fu));
  }
}
@media (max-width: 1023.98px) {
  .p-first-faq__q::before {
    left: calc(13 * var(--u));
    top: calc(26 * var(--u));
    font-size: calc(24 * var(--fu));
  }
}
.p-first-faq__q {
  /* ＋／－ */
}
.p-first-faq__q::after {
  content: "";
  position: absolute;
  right: 0;
  top: 50%;
  width: calc(20 * var(--u));
  height: calc(20 * var(--u));
  margin-top: calc(-10 * var(--u));
  background: linear-gradient(var(--color-title), var(--color-title)) no-repeat center/100% 2px, linear-gradient(var(--color-title), var(--color-title)) no-repeat center/2px 100%;
}
@media (min-width: 1024px) {
  .p-first-faq__q::after {
    right: calc(40 * var(--u));
    width: calc(24 * var(--u));
    height: calc(24 * var(--u));
    margin-top: calc(-12 * var(--u));
  }
}
@media (max-width: 1023.98px) {
  .p-first-faq__q::after {
    right: calc(16 * var(--u));
    width: calc(14 * var(--u));
    height: calc(14 * var(--u));
    margin-top: calc(-7 * var(--u));
  }
}
.p-first-faq__a {
  position: relative;
  padding: calc(16 * var(--u)) 0 calc(24 * var(--u)) calc(28 * var(--u));
  border-top: 1px dashed #e1dfd5;
  font-size: calc(14 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.68 * var(--fu));
  line-height: calc(28 * var(--fu));
  color: var(--color-text);
}
@media (min-width: 1024px) {
  .p-first-faq__a {
    margin-inline: calc(40 * var(--u));
    padding: calc(21 * var(--u)) 0 calc(40 * var(--u)) calc(37 * var(--u));
    font-size: calc(16 * var(--fu));
    letter-spacing: calc(1.92 * var(--fu));
    line-height: calc(32 * var(--fu));
  }
}
@media (max-width: 1023.98px) {
  .p-first-faq__a {
    margin-inline: calc(12 * var(--u));
    padding: calc(23 * var(--u)) 0 calc(24 * var(--u)) calc(20 * var(--u));
    font-size: calc(16 * var(--fu));
    letter-spacing: calc(1.92 * var(--fu));
    line-height: calc(32 * var(--fu));
  }
}
.p-first-faq__a::before {
  content: "A";
  top: calc(18 * var(--u));
  color: var(--color-orange);
}
@media (min-width: 1024px) {
  .p-first-faq__a::before {
    top: calc(24 * var(--u));
    font-size: calc(24 * var(--fu));
  }
}
@media (max-width: 1023.98px) {
  .p-first-faq__a::before {
    top: calc(25 * var(--u));
    font-size: calc(24 * var(--fu));
  }
}

/* ---------------------------------------------
   WEB予約について
--------------------------------------------- */
.p-first-web {
  position: relative;
  margin-top: calc(96 * var(--u));
  padding: calc(110 * var(--u)) calc(20 * var(--u)) calc(150 * var(--u));
}
@media (min-width: 1024px) {
  .p-first-web {
    margin-top: calc(180 * var(--u));
    padding: calc(182 * var(--u)) calc(230 * var(--u)) calc(200 * var(--u));
  }
}
.p-first-web::before {
  content: "";
  position: absolute;
  top: 0;
  height: 100%;
  background: url("../img/lower/wave-cream-sp.svg?v=20260918") no-repeat top center/100% calc(87 * var(--u)), linear-gradient(#f8f1de, #f8f1de) no-repeat left calc(86 * var(--u))/100% calc(100% - calc(86 * var(--u)));
  left: calc(50% - 50vw - 4px);
  width: calc(100vw + 8px);
}
@media (min-width: 1024px) {
  .p-first-web::before {
    background: url("../img/lower/wave-cream.svg?v=20260918") no-repeat top center/100% calc(335 * var(--u)), linear-gradient(#f8f1de, #f8f1de) no-repeat left calc(334 * var(--u))/100% calc(100% - calc(334 * var(--u)));
  }
}
.p-first-web > * {
  position: relative;
}
.p-first-web__lead {
  font-size: calc(14 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.68 * var(--fu));
  line-height: calc(28 * var(--fu));
  color: var(--color-text);
  margin-top: calc(24 * var(--u));
}
@media (min-width: 1024px) {
  .p-first-web__lead {
    font-size: calc(16 * var(--fu));
    letter-spacing: calc(1.92 * var(--fu));
    line-height: calc(32 * var(--fu));
    margin-top: calc(94 * var(--u));
  }
}
.p-first-web__list {
  display: grid;
  gap: calc(32 * var(--u));
  margin-top: calc(32 * var(--u));
}
@media (min-width: 1024px) {
  .p-first-web__list {
    gap: calc(45 * var(--u));
    margin: calc(59 * var(--u)) 0 0 calc(40 * var(--u));
  }
}
.p-first-web__item {
  position: relative;
  padding-left: calc(56 * var(--u));
  font-size: calc(14 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.68 * var(--fu));
  line-height: calc(28 * var(--fu));
  color: var(--color-text);
}
@media (min-width: 1024px) {
  .p-first-web__item {
    padding-left: calc(87 * var(--u));
    font-size: calc(16 * var(--fu));
    letter-spacing: calc(1.92 * var(--fu));
    line-height: calc(32 * var(--fu));
  }
}
.p-first-web__num {
  position: absolute;
  left: 0;
  top: calc(-4 * var(--u));
  font-family: var(--font-hand);
  font-size: calc(40 * var(--fu));
  line-height: calc(44 * var(--fu));
  color: var(--color-num);
}
@media (min-width: 1024px) {
  .p-first-web__num {
    top: calc(-5 * var(--u));
    font-size: calc(56 * var(--u));
    letter-spacing: calc(1.12 * var(--fu));
    line-height: calc(58 * var(--fu));
  }
}
.p-first-web__title {
  font-size: calc(18 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(2.16 * var(--fu));
  line-height: calc(32 * var(--fu));
  color: var(--color-title);
}
@media (min-width: 1024px) {
  .p-first-web__title {
    font-size: calc(24 * var(--fu));
    letter-spacing: calc(2.88 * var(--fu));
    line-height: calc(48 * var(--fu));
  }
}
.p-first-web__text {
  margin-top: calc(4 * var(--u));
}
@media (min-width: 1024px) {
  .p-first-web__text {
    margin-top: calc(8 * var(--u));
  }
}
.p-first-web__btns {
  margin-top: calc(12 * var(--u));
}
@media (min-width: 1024px) {
  .p-first-web__btns {
    margin-top: calc(8 * var(--u));
    gap: calc(24 * var(--u));
  }
}
.p-first-web__btns + .p-first-web__text {
  margin-top: calc(16 * var(--u));
}
@media (min-width: 1024px) {
  .p-first-web__btns + .p-first-web__text {
    margin-top: calc(16 * var(--u));
  }
}
.p-first-web__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: calc(12 * var(--u));
  width: calc(180 * var(--u));
  height: calc(41 * var(--u));
  margin-top: calc(8 * var(--u));
  border: 1px solid var(--color-orange);
  border-radius: calc(20 * var(--u));
  background: var(--color-white);
  color: var(--color-orange);
  font-size: calc(14 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.68 * var(--fu));
}
@media (min-width: 1024px) {
  .p-first-web__btn {
    font-size: calc(16 * var(--fu));
    letter-spacing: calc(1.92 * var(--fu));
  }
}
.p-first-web__btn::after {
  content: "";
  width: calc(5.5 * var(--u));
  height: calc(5.5 * var(--u));
  border-top: 1px solid currentColor;
  border-right: 1px solid currentColor;
  transform: rotate(45deg);
}

.c-flow__btns {
  margin-top: calc(16 * var(--u));
}

@media (max-width: 1023.98px) {
  .page-first .c-heading--lower .c-heading__main {
    font-size: calc(40 * var(--fu));
    letter-spacing: calc(4.8 * var(--fu));
    line-height: calc(48 * var(--fu));
  }
}
@media (max-width: 1023.98px) {
  .page-first .c-flow {
    gap: calc(80 * var(--u));
    margin-top: calc(40 * var(--u));
  }
}
@media (max-width: 1023.98px) {
  .page-first .c-flow__item {
    padding-top: calc(40 * var(--u));
  }
}
@media (max-width: 1023.98px) {
  .page-first .c-flow__img {
    margin-inline: calc(20 * var(--u));
    aspect-ratio: 295/200;
    border-radius: calc(40 * var(--u));
  }
}
@media (max-width: 1023.98px) {
  .page-first .c-flow__num {
    left: 0;
    top: 0;
    font-size: calc(96 * var(--u));
    letter-spacing: calc(1.92 * var(--fu));
    line-height: calc(58 * var(--fu));
  }
}
@media (max-width: 1023.98px) {
  .page-first .c-flow__body {
    margin-top: calc(24 * var(--u));
  }
}
@media (max-width: 1023.98px) {
  .page-first .c-flow__title {
    font-size: calc(24 * var(--fu));
    letter-spacing: calc(2.88 * var(--fu));
    line-height: calc(40 * var(--fu));
    text-align: center;
  }
}
@media (max-width: 1023.98px) {
  .page-first .c-flow__text {
    margin-top: calc(16 * var(--u));
    padding-inline: calc(20 * var(--u));
    font-size: calc(16 * var(--fu));
    letter-spacing: calc(1.92 * var(--fu));
    line-height: calc(32 * var(--fu));
  }
}
@media (max-width: 1023.98px) {
  .page-first .c-flow__body .c-btn-monshin {
    justify-content: center;
    margin: calc(16 * var(--u)) 0 0 calc(20 * var(--u));
    padding-left: 0;
  }
}
.page-first .c-btn-monshin {
  /* SPデザインはアイコンなし */
}
@media (max-width: 1023.98px) {
  .page-first .c-btn-monshin::before {
    display: none;
  }
}
@media (max-width: 1023.98px) {
  .page-first .c-note__title {
    flex-direction: column;
    gap: calc(4 * var(--u));
    font-size: calc(24 * var(--fu));
    letter-spacing: calc(2.88 * var(--fu));
    line-height: calc(40 * var(--fu));
    text-align: center;
  }
}
@media (max-width: 1023.98px) {
  .page-first .c-note__title::before {
    width: calc(40 * var(--u));
    height: calc(40 * var(--u));
    font-size: calc(22 * var(--fu));
  }
}
@media (max-width: 1023.98px) {
  .page-first .c-note__title + .c-note__text {
    margin-top: calc(24 * var(--u));
  }
}

/* フッター上がクリームのページ（一覧・記事・404・汎用の固定ページ）は、フッターまでの余白を本文側で確保する。
   フッターはマイナスマージンで上に重なるので、余白が無いと本文の末尾が隠れる */
.has-footer-cream main {
  padding-bottom: calc(80 * var(--u));
}
@media (min-width: 1024px) {
  .has-footer-cream main {
    padding-bottom: calc(242 * var(--u));
  }
}

/* =============================================
   お知らせ一覧 / 症例紹介一覧（罫線で区切ったリスト）
============================================= */
.p-archive {
  margin-top: calc(40 * var(--u));
  padding-inline: calc(20 * var(--u));
}
@media (min-width: 1024px) {
  .p-archive {
    width: calc(980 * var(--u));
    margin: calc(89 * var(--u)) auto 0;
    padding: 0;
  }
}
.p-archive__list {
  border-top: 2px solid var(--color-line);
}
.p-archive__item {
  border-bottom: 2px solid var(--color-line);
}
.p-archive__link {
  position: relative;
  display: block;
  padding: calc(16 * var(--u)) calc(40 * var(--u)) calc(16 * var(--u)) 0;
  transition: opacity 0.3s;
}
@media (min-width: 1024px) {
  .p-archive__link {
    display: flex;
    align-items: center;
    padding: calc(39 * var(--u)) calc(40 * var(--u));
  }
}
.p-archive__link:hover {
  opacity: 0.7;
}
.p-archive__date {
  display: block;
  font-family: var(--font-en);
  font-size: calc(16 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(1.92 * var(--fu));
  line-height: calc(24 * var(--fu));
  color: var(--color-chip);
}
@media (min-width: 1024px) {
  .p-archive__date {
    flex-shrink: 0;
    width: calc(101 * var(--u));
    margin-right: calc(56 * var(--u));
  }
}
.p-archive__title {
  margin-right: calc(-2.24 * var(--u));
  font-size: calc(16 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(2.24 * var(--fu));
  line-height: calc(24 * var(--fu));
  color: #000;
}
.p-archive__arrow {
  position: absolute;
  right: 0;
  top: 50%;
  width: calc(30 * var(--u));
  height: calc(30 * var(--u));
  margin-top: calc(-15 * var(--u));
  background: url("../img/common/btn-circle-arrow-o.svg") no-repeat center/contain;
}
@media (min-width: 1024px) {
  .p-archive__arrow {
    right: calc(40 * var(--u));
    top: calc(39 * var(--u));
    margin-top: 0;
  }
}
.p-archive {
  /* 診療科のラベル */
}
.p-archive__cat {
  display: inline-block;
  min-width: calc(58 * var(--u));
  padding-inline: calc(4 * var(--u));
  border-radius: calc(2 * var(--u));
  background: var(--color-line);
  font-size: calc(15 * var(--fu));
  letter-spacing: calc(2.1 * var(--fu));
  line-height: calc(24 * var(--fu));
  text-align: center;
  color: #000;
}
.p-archive__meta {
  display: flex;
  align-items: center;
  gap: calc(12 * var(--u));
}
@media (min-width: 1024px) {
  .p-archive__meta {
    /* PCは日付・ラベル・タイトルを1行に並べる */
    display: contents;
  }
}
.p-archive {
  /* --- 症例紹介：日付＋ラベル＋タイトル --- */
}
@media (min-width: 1024px) {
  .p-archive--case {
    width: calc(919 * var(--u));
    margin-inline: 0;
  }
}
@media (min-width: 1024px) {
  .p-archive--case .p-archive__date {
    margin-right: calc(32 * var(--u));
  }
}
@media (min-width: 1024px) {
  .p-archive--case .p-archive__cat {
    margin-right: calc(24 * var(--u));
  }
}

/* =============================================
   症例紹介：一覧＋カテゴリー（2カラム）
============================================= */
.p-case-layout {
  padding-inline: calc(20 * var(--u));
}
@media (min-width: 1024px) {
  .p-case-layout {
    display: flex;
    justify-content: space-between;
    /* デザインどおり左120px・右60px */
    margin: 0 calc(60 * var(--u)) 0 calc(120 * var(--u));
    padding: 0;
  }
}
@media (min-width: 1024px) {
  .p-case-layout__main {
    width: calc(919 * var(--u));
  }
}

.p-cat-box {
  margin-top: calc(40 * var(--u));
  border-radius: calc(8 * var(--u));
  overflow: hidden;
}
@media (min-width: 1024px) {
  .p-cat-box {
    flex-shrink: 0;
    width: calc(300 * var(--u));
    margin-top: calc(80 * var(--u));
    border-radius: 0;
    overflow: visible;
  }
}
.p-cat-box__head {
  padding: calc(12 * var(--u)) calc(16 * var(--u));
  background: #e39b68;
  font-size: calc(20 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(2.4 * var(--fu));
  line-height: calc(32 * var(--fu));
  color: var(--color-white);
}
@media (min-width: 1024px) {
  .p-cat-box__head {
    padding: calc(4 * var(--u)) calc(24 * var(--u));
    border-radius: calc(8 * var(--u));
    font-size: calc(24 * var(--fu));
    letter-spacing: calc(2.88 * var(--fu));
    line-height: calc(48 * var(--fu));
  }
}
.p-cat-box__list {
  padding-top: calc(8 * var(--u));
  border-bottom: 2px solid var(--color-line);
}
@media (min-width: 1024px) {
  .p-cat-box__list {
    padding: calc(8 * var(--u)) 0 calc(7 * var(--u));
  }
}
.p-cat-box__link {
  position: relative;
  display: flex;
  align-items: center;
  gap: calc(8 * var(--u));
  padding: calc(6 * var(--u)) calc(16 * var(--u)) calc(6 * var(--u)) 0;
  font-size: calc(16 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(2.24 * var(--fu));
  line-height: calc(24 * var(--fu));
  color: #000;
  transition: opacity 0.3s;
}
@media (min-width: 1024px) {
  .p-cat-box__link {
    gap: calc(8 * var(--u));
    padding: calc(6 * var(--u)) calc(16 * var(--u));
  }
}
.p-cat-box__link:hover {
  opacity: 0.7;
}
.p-cat-box__link::before {
  content: "";
  flex-shrink: 0;
  width: calc(10 * var(--u));
  height: calc(10 * var(--u));
  border-radius: 50%;
  background: var(--color-orange);
}
.p-cat-box__link::after {
  content: "";
  position: absolute;
  right: 0;
  top: 50%;
  width: calc(7 * var(--u));
  height: calc(12 * var(--u));
  margin-top: calc(-6 * var(--u));
  background: url("../img/common/icon-chevron-o.svg") no-repeat center/contain;
}
@media (min-width: 1024px) {
  .p-cat-box__link::after {
    right: calc(16 * var(--u));
  }
}

/* =============================================
   ブログ一覧（3カラムのカード）
============================================= */
.p-blog-list {
  display: grid;
  gap: calc(32 * var(--u));
  margin-top: calc(40 * var(--u));
  padding-inline: calc(20 * var(--u));
}
@media (min-width: 1024px) {
  .p-blog-list {
    grid-template-columns: repeat(3, 1fr);
    gap: calc(80 * var(--u)) calc(60 * var(--u));
    width: calc(1200 * var(--u));
    margin: calc(90 * var(--u)) auto 0;
    padding: 0;
  }
}
.p-blog-list {
  /* カード一覧のページャーはデザインどおり広めに離す */
}
@media (min-width: 1024px) {
  .p-blog-list + .c-pager {
    margin-top: calc(80 * var(--u));
  }
}

.p-blog-card {
  display: block;
}
.p-blog-card:hover {
  opacity: 0.8;
}
.p-blog-card__img {
  display: flex;
  align-items: center;
  justify-content: center;
  aspect-ratio: 360/180;
  border-radius: calc(8 * var(--u));
  background: #f8f1de;
  overflow: hidden;
}
.p-blog-card__photo {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.p-blog-card {
  /* 画像が無いときのロゴ */
}
.p-blog-card__ph {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}
.p-blog-card__ph-mark {
  width: calc(70 * var(--u));
}
.p-blog-card__ph-ja {
  width: calc(240 * var(--u));
  margin-top: calc(16 * var(--u));
}
.p-blog-card__ph-en {
  width: calc(199 * var(--u));
  margin-top: calc(7 * var(--u));
}
.p-blog-card__date {
  display: block;
  margin-top: calc(16 * var(--u));
  font-family: var(--font-en);
  font-size: calc(16 * var(--fu));
  line-height: 1.1875;
  color: var(--color-orange);
}
.p-blog-card__title {
  margin-top: calc(8 * var(--u));
  font-size: calc(18 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(2.16 * var(--fu));
  line-height: calc(32 * var(--fu));
  color: var(--color-title);
}
.p-blog-card__text {
  margin-top: calc(6 * var(--u));
  /* 行末に付く字間ぶんを打ち消し、デザインと同じ位置で折り返す */
  margin-right: calc(-2.24 * var(--u));
  font-size: calc(16 * var(--fu));
  letter-spacing: calc(2.24 * var(--fu));
  line-height: calc(24 * var(--fu));
  color: #000;
  /* 4行を超える本文は省略する */
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
  overflow: hidden;
}
@media (min-width: 1024px) {
  .p-blog-card__text {
    line-height: calc(19 * var(--fu));
  }
}

/* スマホはデザインが無いので、折り返しは文節で切る（対応ブラウザのみ） */
@media (max-width: 1023.98px) {
  .p-blog-card__title,
  .p-blog-card__text,
  .p-archive__title {
    word-break: auto-phrase;
  }
}

/* =============================================
   お知らせ／ブログの詳細ページ
============================================= */
.p-entry {
  margin-top: calc(40 * var(--u));
  padding-inline: calc(20 * var(--u));
}
@media (min-width: 1024px) {
  .p-entry {
    width: calc(800 * var(--u));
    margin: calc(90 * var(--u)) auto 0;
    padding: 0;
  }
}
.p-entry__date {
  display: block;
  /* 中央揃えの行末に付く字間ぶんを打ち消す */
  margin-right: calc(-1.92 * var(--u));
  font-family: var(--font-en);
  font-size: calc(16 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(1.92 * var(--fu));
  line-height: calc(24 * var(--fu));
  text-align: center;
  color: var(--color-chip);
}
.p-entry {
  /* 症例紹介：日付＋診療科（詳細ページのデザインが無いため、一覧のラベルに合わせる） */
}
.p-entry__meta {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: calc(12 * var(--u));
}
.p-entry__meta .p-entry__date {
  margin-right: 0;
}
.p-entry__cat {
  display: inline-block;
  min-width: calc(58 * var(--u));
  padding-inline: calc(4 * var(--u));
  border-radius: calc(2 * var(--u));
  background: var(--color-line);
  font-size: calc(15 * var(--fu));
  letter-spacing: calc(2.1 * var(--fu));
  line-height: calc(24 * var(--fu));
  text-align: center;
  color: #000;
}
.p-entry__title {
  margin-top: calc(8 * var(--u));
  /* 行末に付く字間ぶんを打ち消す（SPは1行に収めるため左右に振り分ける） */
  margin-inline: calc(-1.2 * var(--u));
  padding-bottom: calc(24 * var(--u));
  border-bottom: 2px solid var(--color-line);
  font-size: calc(20 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(2.4 * var(--fu));
  line-height: calc(32 * var(--fu));
  text-align: center;
  color: var(--color-text);
}
@media (min-width: 1024px) {
  .p-entry__title {
    margin-top: calc(16 * var(--u));
    margin-inline: 0;
    text-indent: calc(2.88 * var(--u));
    padding-bottom: calc(31 * var(--u));
    font-size: calc(24 * var(--fu));
    letter-spacing: calc(2.88 * var(--fu));
  }
}
.p-entry__body {
  margin-top: calc(24 * var(--u));
}
@media (min-width: 1024px) {
  .p-entry__body {
    margin-top: calc(38 * var(--u));
  }
}
.p-entry__body > * + * {
  margin-top: calc(16 * var(--u));
}
@media (min-width: 1024px) {
  .p-entry__body > * + * {
    margin-top: calc(16 * var(--u));
  }
}
.p-entry__body > h2 + * {
  margin-top: calc(16 * var(--u));
}
.p-entry__body p {
  /* 行末に付く字間ぶんを打ち消し、デザインと同じ位置で折り返す */
  margin-right: calc(-2.24 * var(--u));
  font-size: calc(16 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(2.24 * var(--fu));
  line-height: calc(32 * var(--fu));
  color: #000;
}
.p-entry__body--blog {
  /* ブログ本文は太さ・行間が控えめ */
}
.p-entry__body--blog p {
  font-weight: 400;
  line-height: calc(24 * var(--fu));
}
.p-entry__body img {
  display: block;
  width: 100%;
  border-radius: calc(8 * var(--u));
}
@media (min-width: 1024px) {
  .p-entry__body img {
    width: calc(400 * var(--u));
    border-radius: calc(8 * var(--u));
  }
}
.p-entry__body h2 {
  padding: calc(12 * var(--u)) calc(16 * var(--u));
  border-radius: calc(8 * var(--u));
  background: #f8f1de;
  font-size: calc(18 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(2.16 * var(--fu));
  line-height: calc(32 * var(--fu));
  color: var(--color-title);
}
@media (min-width: 1024px) {
  .p-entry__body h2 {
    padding: calc(12 * var(--u));
    font-size: calc(24 * var(--fu));
    letter-spacing: calc(2.88 * var(--fu));
    line-height: calc(32 * var(--fu));
  }
}
@media (min-width: 1024px) {
  .p-entry__body > h2 {
    margin-top: calc(40 * var(--u));
  }
}
.p-entry {
  /* 404などのボタン */
}
.p-entry__btn {
  display: flex;
  justify-content: center;
  margin-top: calc(40 * var(--u));
}
@media (min-width: 1024px) {
  .p-entry__btn {
    margin-top: calc(64 * var(--u));
  }
}
.p-entry {
  /* スマホはデザインが無いので、折り返しは文節で切る（対応ブラウザのみ） */
}
@media (max-width: 1023.98px) {
  .p-entry__title, .p-entry__body p, .p-entry__body h2 {
    word-break: auto-phrase;
  }
}

/* 本文（SP 14px / PC 16px） */
/* 小さめの本文（表・カード内。SP 13px / PC 14px） */
/* 中見出し（SP 20px / PC 24px） */
/* クリーム背景（上端が波）。::before に使う */
/* クリーム面の下端の波（セクションの外にはみ出す）。::after に使う */
/* 横スクロールする表の外枠（SPで列が多い表） */
/* =============================================
   下層ページの共通ブロック
   （ペットケア・予防医療・健康診断・採用情報・料金表）
============================================= */
/* ---------------------------------------------
   セクション（左右の余白・クリーム背景）
--------------------------------------------- */
.p-lower-sec {
  position: relative;
  margin-top: calc(80 * var(--u));
  padding-inline: calc(20 * var(--u));
}
@media (min-width: 1024px) {
  .p-lower-sec {
    margin-top: calc(160 * var(--u));
    padding-inline: calc(120 * var(--u));
  }
}
.p-lower-sec {
  /* ページタイトル直後 */
}
.p-lower-sec--first {
  margin-top: calc(56 * var(--u));
}
@media (min-width: 1024px) {
  .p-lower-sec--first {
    margin-top: calc(90 * var(--u));
  }
}
.p-lower-sec {
  /* クリーム背景（上端が波・下端も波で次のセクションへ） */
}
.p-lower-sec--cream {
  margin-top: calc(96 * var(--u));
  padding-top: calc(110 * var(--u));
  padding-bottom: calc(64 * var(--u));
}
@media (min-width: 1024px) {
  .p-lower-sec--cream {
    margin-top: calc(120 * var(--u));
    padding-top: calc(182 * var(--u));
    padding-bottom: calc(120 * var(--u));
  }
}
.p-lower-sec--cream::before {
  content: "";
  position: absolute;
  top: 0;
  height: 100%;
  background: url("../img/lower/wave-cream-sp.svg?v=20260918") no-repeat top center/100% calc(87 * var(--u)), linear-gradient(#f8f1de, #f8f1de) no-repeat left calc(86 * var(--u))/100% calc(100% - calc(86 * var(--u)));
  left: calc(50% - 50vw - 4px);
  width: calc(100vw + 8px);
}
@media (min-width: 1024px) {
  .p-lower-sec--cream::before {
    background: url("../img/lower/wave-cream.svg?v=20260918") no-repeat top center/100% calc(335 * var(--u)), linear-gradient(#f8f1de, #f8f1de) no-repeat left calc(334 * var(--u))/100% calc(100% - calc(334 * var(--u)));
  }
}
.p-lower-sec--cream::after {
  content: "";
  position: absolute;
  top: 100%;
  height: calc(87 * var(--u));
  background: url("../img/lower/wave-cream-bottom-sp.svg?v=20260918") no-repeat center/100% 100%;
  left: calc(50% - 50vw - 4px);
  width: calc(100vw + 8px);
}
@media (min-width: 1024px) {
  .p-lower-sec--cream::after {
    height: calc(335 * var(--u));
    background-image: url("../img/lower/wave-cream-bottom.svg?v=20260918");
  }
}
.p-lower-sec--cream > * {
  position: relative;
}
.p-lower-sec--cream {
  /* 下端の波の向きが逆のもの */
}
.p-lower-sec--cream.p-lower-sec--lip-b::after {
  content: "";
  position: absolute;
  top: 100%;
  height: calc(87 * var(--u));
  background: url("../img/lower/wave-cream-bottom-b-sp.svg?v=20260918") no-repeat center/100% 100%;
  left: calc(50% - 50vw - 4px);
  width: calc(100vw + 8px);
}
@media (min-width: 1024px) {
  .p-lower-sec--cream.p-lower-sec--lip-b::after {
    height: calc(335 * var(--u));
    background-image: url("../img/lower/wave-cream-bottom-b.svg?v=20260918");
  }
}
.p-lower-sec--cream {
  /* クリーム面の次のセクションは波のぶん下げる */
}
.p-lower-sec--cream + .p-lower-sec {
  margin-top: calc(120 * var(--u));
}
@media (min-width: 1024px) {
  .p-lower-sec--cream + .p-lower-sec {
    margin-top: calc(233 * var(--u));
  }
}
.p-lower-sec {
  /* フッター直前のクリーム面（下端の波なし。フッターの白い波が上に重なる） */
}
.p-lower-sec--last {
  padding-bottom: calc(150 * var(--u));
}
@media (min-width: 1024px) {
  .p-lower-sec--last {
    padding-bottom: calc(235 * var(--u));
  }
}
.p-lower-sec--last::after {
  content: none;
}
.p-lower-sec {
  /* セクション内の見出し下の余白 */
}
.p-lower-sec > .c-heading + * {
  margin-top: calc(32 * var(--u));
}
@media (min-width: 1024px) {
  .p-lower-sec > .c-heading + * {
    margin-top: calc(80 * var(--u));
  }
}
.p-lower-sec > .c-heading + * {
  /* 導入は写真が本文より上にはみ出すぶん下げる */
}
@media (min-width: 1024px) {
  .p-lower-sec > .c-heading + *.p-lower-intro {
    margin-top: calc(190 * var(--u));
  }
}
.p-lower-sec {
  /* セクション内で続く2つめ以降の大見出し */
}
.p-lower-sec > .c-heading ~ .c-heading {
  margin-top: calc(80 * var(--u));
}
@media (min-width: 1024px) {
  .p-lower-sec > .c-heading ~ .c-heading {
    margin-top: calc(180 * var(--u));
  }
}
.p-lower-sec {
  /* 診療の流れ（デザインでは左から227pxの位置） */
}
@media (min-width: 1024px) {
  .p-lower-sec .c-flow {
    margin-left: calc(107 * var(--u));
  }
}
.p-lower-sec {
  /* 装飾イラスト */
}
.p-lower-sec__deco {
  position: absolute;
  z-index: 1;
  pointer-events: none;
}

/* ---------------------------------------------
   導入（本文＋重なった2枚の写真）
--------------------------------------------- */
@media (min-width: 1024px) {
  .p-lower-intro {
    position: relative;
  }
}
@media (min-width: 1024px) {
  .p-lower-intro__body {
    width: calc(700 * var(--fu));
  }
}
.p-lower-intro {
  /* 写真が本文の少し上から始まるもの（予防医療） */
}
@media (min-width: 1024px) {
  .p-lower-sec > .c-heading + .p-lower-intro--sm {
    margin-top: calc(127 * var(--u));
  }
}
@media (min-width: 1024px) {
  .p-lower-intro--sm .p-lower-intro__imgs {
    top: calc(-24 * var(--u));
  }
}
.p-lower-intro__title {
  font-size: calc(20 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(2.4 * var(--fu));
  line-height: calc(36 * var(--fu));
  color: var(--color-title);
}
@media (min-width: 1024px) {
  .p-lower-intro__title {
    font-size: calc(24 * var(--fu));
    letter-spacing: calc(2.88 * var(--fu));
    line-height: calc(48 * var(--fu));
  }
}
.p-lower-intro__title em {
  font-style: normal;
  color: #e39b68;
}
.p-lower-intro__title--green em {
  color: var(--color-num);
}
.p-lower-intro__text {
  font-size: calc(14 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.68 * var(--fu));
  line-height: calc(28 * var(--fu));
  color: var(--color-text);
}
@media (min-width: 1024px) {
  .p-lower-intro__text {
    font-size: calc(16 * var(--fu));
    letter-spacing: calc(1.92 * var(--fu));
    line-height: calc(32 * var(--fu));
  }
}
.p-lower-intro__text {
  margin-top: calc(12 * var(--u));
}
@media (min-width: 1024px) {
  .p-lower-intro__text {
    margin-top: calc(16 * var(--u));
  }
}
.p-lower-intro__text p + p {
  margin-top: calc(28 * var(--u));
}
@media (min-width: 1024px) {
  .p-lower-intro__text p + p {
    margin-top: calc(32 * var(--u));
  }
}
.p-lower-intro__imgs {
  position: relative;
  height: calc(250 * var(--u));
  margin-top: calc(24 * var(--u));
}
@media (min-width: 1024px) {
  .p-lower-intro__imgs {
    /* 本文（文字単位の幅）の右隣に置く。デザインでは右の余白に70pxはみ出す */
    position: absolute;
    left: calc(calc(700 * var(--fu)) + calc(20 * var(--u)));
    right: calc(-70 * var(--u));
    top: calc(-80 * var(--u));
    height: auto;
    aspect-ratio: 550/425;
    margin: 0;
  }
}
.p-lower-intro__img {
  position: absolute;
  border-radius: calc(16 * var(--u));
  -o-object-fit: cover;
     object-fit: cover;
}
@media (min-width: 1024px) {
  .p-lower-intro__img {
    border-radius: calc(24 * var(--u));
  }
}
.p-lower-intro__img--01 {
  left: 0;
  top: 0;
  width: calc(240 * var(--u));
  aspect-ratio: 400/280;
}
@media (min-width: 1024px) {
  .p-lower-intro__img--01 {
    width: 72.7272727273%;
  }
}
.p-lower-intro__img--02 {
  right: 0;
  bottom: 0;
  width: calc(180 * var(--u));
  aspect-ratio: 300/210;
}
@media (min-width: 1024px) {
  .p-lower-intro__img--02 {
    left: 45.4545454545%;
    right: auto;
    top: 50.5882352941%;
    bottom: auto;
    width: 54.5454545455%;
  }
}
.p-lower-intro .c-cta {
  margin-top: calc(32 * var(--u));
}
@media (min-width: 1024px) {
  .p-lower-intro .c-cta {
    margin-top: calc(64 * var(--u));
  }
}

/* ---------------------------------------------
   中央揃えの本文（健康診断・採用情報の導入など）
--------------------------------------------- */
.p-lower-lead {
  font-size: calc(14 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.68 * var(--fu));
  line-height: calc(28 * var(--fu));
  color: var(--color-text);
}
@media (min-width: 1024px) {
  .p-lower-lead {
    font-size: calc(16 * var(--fu));
    letter-spacing: calc(1.92 * var(--fu));
    line-height: calc(32 * var(--fu));
  }
}
.p-lower-lead {
  text-align: center;
}
@media (max-width: 1023.98px) {
  .p-lower-lead {
    text-align: left;
  }
}
.p-lower-lead p + p {
  margin-top: calc(28 * var(--u));
}
@media (min-width: 1024px) {
  .p-lower-lead p + p {
    margin-top: calc(32 * var(--u));
  }
}
.p-lower-lead strong {
  font-weight: inherit;
  color: var(--color-orange);
}

/* ---------------------------------------------
   写真（左）＋本文の2列
--------------------------------------------- */
.p-lower-media {
  display: grid;
  gap: calc(20 * var(--u));
}
@media (min-width: 1024px) {
  .p-lower-media {
    grid-template-columns: calc(480 * var(--u)) minmax(0, 1fr);
    gap: calc(56 * var(--u));
    align-items: start;
  }
}
.p-lower-media__img {
  overflow: hidden;
  border-radius: calc(16 * var(--u));
}
@media (min-width: 1024px) {
  .p-lower-media__img {
    border-radius: calc(24 * var(--u));
  }
}
.p-lower-media__img img {
  width: 100%;
  aspect-ratio: 480/336;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: inherit;
}
.p-lower-media__body {
  font-size: calc(13 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.3 * var(--fu));
  line-height: calc(22 * var(--fu));
  color: var(--color-text);
}
@media (min-width: 1024px) {
  .p-lower-media__body {
    font-size: calc(14 * var(--fu));
    letter-spacing: calc(1.68 * var(--fu));
    line-height: calc(24 * var(--fu));
  }
}
@media (min-width: 1024px) {
  .p-lower-media__body {
    font-size: calc(15 * var(--fu));
    letter-spacing: calc(1.8 * var(--fu));
    line-height: calc(28 * var(--fu));
  }
}
.p-lower-media__body p + p {
  margin-top: calc(24 * var(--u));
}
@media (min-width: 1024px) {
  .p-lower-media__body p + p {
    margin-top: calc(28 * var(--u));
  }
}

/* ---------------------------------------------
   本文（段落の間を1行あける）
--------------------------------------------- */
.p-lower-text {
  font-size: calc(13 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.3 * var(--fu));
  line-height: calc(22 * var(--fu));
  color: var(--color-text);
}
@media (min-width: 1024px) {
  .p-lower-text {
    font-size: calc(14 * var(--fu));
    letter-spacing: calc(1.68 * var(--fu));
    line-height: calc(24 * var(--fu));
  }
}
@media (min-width: 1024px) {
  .p-lower-text {
    font-size: calc(15 * var(--fu));
    letter-spacing: calc(1.8 * var(--fu));
    line-height: calc(32 * var(--fu));
  }
}
.p-lower-text p + p {
  margin-top: calc(24 * var(--u));
}
@media (min-width: 1024px) {
  .p-lower-text p + p {
    margin-top: calc(32 * var(--u));
  }
}

/* ---------------------------------------------
   ピン見出し・アイコン見出しのまとまり（見出し＋中身）
--------------------------------------------- */
.p-lower-block {
  margin-top: calc(56 * var(--u));
}
@media (min-width: 1024px) {
  .p-lower-block {
    margin-top: calc(100 * var(--u));
  }
}
.p-lower-block > * + * {
  margin-top: calc(24 * var(--u));
}
@media (min-width: 1024px) {
  .p-lower-block > * + * {
    margin-top: calc(40 * var(--u));
  }
}
.p-lower-block {
  /* ピン見出しの下。本文はピンの先端のすぐ下から始まる */
}
.p-lower-block > .c-pin-title + * {
  margin-top: calc(20 * var(--u));
}
@media (min-width: 1024px) {
  .p-lower-block > .c-pin-title + * {
    margin-top: calc(32 * var(--u));
  }
}
.p-lower-block > .c-pin-title + .p-lower-text {
  margin-top: calc(12 * var(--u));
}
@media (min-width: 1024px) {
  .p-lower-block > .c-pin-title + .p-lower-text {
    margin-top: calc(8 * var(--u));
  }
}
.p-lower-block > .c-icon-title + * {
  margin-top: calc(20 * var(--u));
}
@media (min-width: 1024px) {
  .p-lower-block > .c-icon-title + * {
    margin-top: calc(32 * var(--u));
  }
}
.p-lower-block {
  /* 波線の見出しの直後 */
}
.c-line-title + .p-lower-block {
  margin-top: calc(40 * var(--u));
}
@media (min-width: 1024px) {
  .c-line-title + .p-lower-block {
    margin-top: calc(64 * var(--u));
  }
}
.p-lower-block {
  /* 見出しと写真が横並び（写真が右で見出しの高さから始まる） */
}
@media (min-width: 1024px) {
  .p-lower-block--side {
    display: grid;
    grid-template-columns: minmax(0, 1fr) calc(480 * var(--u));
    -moz-column-gap: calc(44 * var(--u));
         column-gap: calc(44 * var(--u));
    align-items: start;
  }
  .p-lower-block--side > .c-pin-title {
    grid-column: 1;
  }
  .p-lower-block--side > .p-lower-block__img {
    grid-column: 2;
    grid-row: 1/span 2;
    margin-top: 0;
  }
  .p-lower-block--side > .p-lower-text {
    grid-column: 1;
    margin-top: calc(8 * var(--u));
  }
}
.p-lower-block__img {
  overflow: hidden;
  border-radius: calc(16 * var(--u));
}
@media (min-width: 1024px) {
  .p-lower-block__img {
    border-radius: calc(24 * var(--u));
  }
}
.p-lower-block__img img {
  width: 100%;
  aspect-ratio: 480/336;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: inherit;
}

/* =============================================
   ペットケア（petcare/）
============================================= */
/* ---------------------------------------------
   ドッグランのご利用を検討されている方へ
--------------------------------------------- */
.p-petcare-target {
  display: grid;
  gap: calc(48 * var(--u));
  margin-top: calc(32 * var(--u));
}
@media (min-width: 1024px) {
  .p-petcare-target {
    grid-template-columns: repeat(2, calc(480 * var(--u)));
    justify-content: center;
    gap: calc(120 * var(--u));
    margin-top: calc(100 * var(--u));
  }
}
.p-petcare-target__title {
  margin-top: calc(80 * var(--u));
}
@media (min-width: 1024px) {
  .p-petcare-target__title {
    margin: calc(146 * var(--u)) calc(27 * var(--u)) 0;
  }
}
.p-petcare-target__img {
  overflow: hidden;
  border-radius: calc(16 * var(--u));
}
@media (min-width: 1024px) {
  .p-petcare-target__img {
    border-radius: calc(24 * var(--u));
  }
}
.p-petcare-target__img img {
  width: 100%;
  aspect-ratio: 480/336;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: inherit;
}
.p-petcare-target__head {
  margin-top: calc(20 * var(--u));
  font-size: calc(18 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(2.16 * var(--fu));
  line-height: calc(30 * var(--fu));
  color: var(--color-title);
  text-align: center;
}
@media (min-width: 1024px) {
  .p-petcare-target__head {
    margin-top: calc(44 * var(--u));
    font-size: calc(24 * var(--fu));
    letter-spacing: calc(2.88 * var(--fu));
    line-height: calc(36 * var(--fu));
    white-space: nowrap;
  }
}
.p-petcare-target__head em {
  font-style: normal;
  color: var(--color-num);
}
.p-petcare-target__text {
  font-size: calc(13 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.3 * var(--fu));
  line-height: calc(22 * var(--fu));
  color: var(--color-text);
}
@media (min-width: 1024px) {
  .p-petcare-target__text {
    font-size: calc(14 * var(--fu));
    letter-spacing: calc(1.68 * var(--fu));
    line-height: calc(24 * var(--fu));
  }
}
.p-petcare-target__text {
  margin-top: calc(16 * var(--u));
}
@media (min-width: 1024px) {
  .p-petcare-target__text {
    margin: calc(32 * var(--u)) calc(8 * var(--u)) 0;
    font-size: calc(15 * var(--fu));
    letter-spacing: calc(1.8 * var(--fu));
    line-height: calc(32 * var(--fu));
  }
}

/* ---------------------------------------------
   おすすめポイント（写真に白いカードが重なる）
--------------------------------------------- */
.p-petcare-point__deco--dog {
  right: calc(16 * var(--u));
  top: calc(-40 * var(--u));
  width: calc(60 * var(--u));
}
@media (min-width: 1024px) {
  .p-petcare-point__deco--dog {
    right: calc(40 * var(--u));
    top: calc(-60 * var(--u));
    width: calc(110 * var(--u));
  }
}
.p-petcare-point__deco--tulip-a {
  left: calc(20 * var(--u));
  top: calc(24 * var(--u));
  width: calc(28 * var(--u));
}
@media (min-width: 1024px) {
  .p-petcare-point__deco--tulip-a {
    left: calc(72 * var(--u));
    top: calc(30 * var(--u));
    width: calc(45 * var(--u));
  }
}
.p-petcare-point__deco--tulip-b {
  left: calc(54 * var(--u));
  top: calc(30 * var(--u));
  width: calc(28 * var(--u));
}
@media (min-width: 1024px) {
  .p-petcare-point__deco--tulip-b {
    left: calc(136 * var(--u));
    top: calc(48 * var(--u));
    width: calc(46 * var(--u));
  }
}
.p-petcare-point__list {
  display: grid;
  gap: calc(48 * var(--u));
}
@media (min-width: 1024px) {
  .p-petcare-point__list {
    gap: calc(80 * var(--u));
  }
}
@media (min-width: 1024px) {
  .p-petcare-point__item {
    display: grid;
    /* 写真720px・カード657px。177px重ねる */
    grid-template-columns: calc(543 * var(--u)) calc(177 * var(--u)) minmax(0, 1fr);
    grid-template-rows: calc(233 * var(--u)) auto;
  }
}
.p-petcare-point__img {
  overflow: hidden;
  border-radius: calc(16 * var(--u));
}
@media (min-width: 1024px) {
  .p-petcare-point__img {
    grid-column: 1/3;
    grid-row: 1/3;
    align-self: start;
    border-radius: calc(24 * var(--u));
  }
}
.p-petcare-point__img img {
  width: 100%;
  aspect-ratio: 720/505;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: inherit;
}
.p-petcare-point__body {
  position: relative;
  margin: calc(-40 * var(--u)) calc(16 * var(--u)) 0;
  padding: calc(48 * var(--u)) calc(20 * var(--u)) calc(28 * var(--u));
  border-radius: calc(16 * var(--u));
  background: var(--color-white);
}
@media (min-width: 1024px) {
  .p-petcare-point__body {
    z-index: 1;
    grid-column: 2/4;
    grid-row: 2;
    margin: 0;
    padding: calc(76 * var(--u)) calc(40 * var(--u)) calc(52 * var(--u));
    border-radius: calc(24 * var(--u));
  }
}
.p-petcare-point__num {
  position: absolute;
  right: calc(16 * var(--u));
  top: calc(-58 * var(--u));
}
@media (min-width: 1024px) {
  .p-petcare-point__num {
    right: calc(20 * var(--u));
    top: calc(-82 * var(--u));
  }
}
.p-petcare-point__title {
  font-size: calc(18 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(2.16 * var(--fu));
  line-height: calc(30 * var(--fu));
  color: var(--color-num);
}
@media (min-width: 1024px) {
  .p-petcare-point__title {
    font-size: calc(24 * var(--fu));
    letter-spacing: calc(2.88 * var(--fu));
    line-height: calc(36 * var(--fu));
  }
}
.p-petcare-point__text {
  font-size: calc(13 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.3 * var(--fu));
  line-height: calc(22 * var(--fu));
  color: var(--color-text);
}
@media (min-width: 1024px) {
  .p-petcare-point__text {
    font-size: calc(14 * var(--fu));
    letter-spacing: calc(1.68 * var(--fu));
    line-height: calc(24 * var(--fu));
  }
}
.p-petcare-point__text {
  margin-top: calc(12 * var(--u));
}
@media (min-width: 1024px) {
  .p-petcare-point__text {
    margin-top: calc(20 * var(--u));
    font-size: calc(15 * var(--fu));
    letter-spacing: calc(1.8 * var(--fu));
    line-height: calc(32 * var(--fu));
  }
}

/* ---------------------------------------------
   ご利用の流れ／持ち物／注意事項
--------------------------------------------- */
.p-petcare-flow__deco--flower-a {
  left: calc(20 * var(--u));
  top: calc(-110 * var(--u));
  width: calc(36 * var(--u));
}
@media (min-width: 1024px) {
  .p-petcare-flow__deco--flower-a {
    left: calc(163 * var(--u));
    top: calc(-240 * var(--u));
    width: calc(66 * var(--u));
  }
}
.p-petcare-flow__deco--flower-b {
  left: calc(64 * var(--u));
  top: calc(-118 * var(--u));
  width: calc(40 * var(--u));
}
@media (min-width: 1024px) {
  .p-petcare-flow__deco--flower-b {
    left: calc(254 * var(--u));
    top: calc(-254 * var(--u));
    width: calc(72 * var(--u));
  }
}

.p-petcare-belongings {
  margin-top: calc(64 * var(--u));
}
@media (min-width: 1024px) {
  .p-petcare-belongings {
    display: flex;
    align-items: flex-start;
    gap: calc(48 * var(--u));
    margin: calc(160 * var(--u)) 0 0 calc(193 * var(--u));
  }
}
.p-petcare-belongings__title {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: calc(8 * var(--u));
  font-size: calc(24 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(2.88 * var(--fu));
  line-height: calc(32 * var(--fu));
  color: var(--color-title);
}
.p-petcare-belongings__title::after {
  content: "";
  width: calc(50 * var(--u));
  height: calc(50 * var(--u));
  background: url("../img/first/icon-belongings.svg") no-repeat center/contain;
}
.p-petcare-belongings__list {
  font-size: calc(13 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.3 * var(--fu));
  line-height: calc(22 * var(--fu));
  color: var(--color-text);
}
@media (min-width: 1024px) {
  .p-petcare-belongings__list {
    font-size: calc(14 * var(--fu));
    letter-spacing: calc(1.68 * var(--fu));
    line-height: calc(24 * var(--fu));
  }
}
.p-petcare-belongings__list {
  display: grid;
  gap: calc(12 * var(--u));
  margin-top: calc(24 * var(--u));
}
@media (min-width: 1024px) {
  .p-petcare-belongings__list {
    gap: calc(16 * var(--u));
    margin-top: calc(8 * var(--u));
    font-size: calc(15 * var(--fu));
    letter-spacing: calc(1.8 * var(--fu));
    line-height: calc(32 * var(--fu));
  }
}

.p-petcare-note {
  margin-top: calc(56 * var(--u));
}
@media (min-width: 1024px) {
  .p-petcare-note {
    margin-top: calc(110 * var(--u));
    padding-inline: calc(40 * var(--u));
  }
}
@media (min-width: 1024px) {
  .p-petcare-note .c-note__title {
    margin-left: 0;
  }
}
@media (min-width: 1024px) {
  .p-petcare-note .c-note__deco {
    left: auto;
    right: calc(-30 * var(--u));
    bottom: calc(-24 * var(--u));
  }
}
.p-petcare-note__list {
  display: grid;
  gap: calc(10 * var(--u));
}
@media (min-width: 1024px) {
  .p-petcare-note__list {
    gap: calc(16 * var(--u));
    font-size: calc(15 * var(--fu));
    letter-spacing: calc(1.8 * var(--fu));
  }
}
.p-petcare-note__list {
  /* ●を1行目の中央にそろえる */
}
.p-petcare-note__list > li::before {
  top: calc(10 * var(--fu));
  top: calc((1lh - calc(10 * var(--fu))) / 2);
  width: calc(10 * var(--fu));
  height: calc(10 * var(--fu));
}

/* ---------------------------------------------
   第一種動物取扱業標識
--------------------------------------------- */
.p-petcare-license .c-heading__main {
  color: var(--color-title);
}

/* =============================================
   予防医療（prevention/preventive/）
============================================= */
/* ---------------------------------------------
   犬のワクチン／猫のワクチン（クリーム背景）
--------------------------------------------- */
.p-preventive-vaccine__deco--dog {
  left: calc(16 * var(--u));
  top: calc(-20 * var(--u));
  width: calc(52 * var(--u));
}
@media (min-width: 1024px) {
  .p-preventive-vaccine__deco--dog {
    left: calc(70 * var(--u));
    top: calc(20 * var(--u));
    width: calc(82 * var(--u));
  }
}
.p-preventive-vaccine__deco--tulip-a {
  right: calc(56 * var(--u));
  top: calc(-24 * var(--u));
  width: calc(28 * var(--u));
}
@media (min-width: 1024px) {
  .p-preventive-vaccine__deco--tulip-a {
    right: calc(117 * var(--u));
    top: calc(-30 * var(--u));
    width: calc(45 * var(--u));
  }
}
.p-preventive-vaccine__deco--tulip-b {
  right: calc(20 * var(--u));
  top: calc(-16 * var(--u));
  width: calc(28 * var(--u));
}
@media (min-width: 1024px) {
  .p-preventive-vaccine__deco--tulip-b {
    right: calc(50 * var(--u));
    top: calc(-14 * var(--u));
    width: calc(46 * var(--u));
  }
}
.p-preventive-vaccine__deco--flower-a {
  left: calc(20 * var(--u));
  top: calc(100% + calc(4 * var(--u)));
  width: calc(36 * var(--u));
}
@media (min-width: 1024px) {
  .p-preventive-vaccine__deco--flower-a {
    left: calc(78 * var(--u));
    top: calc(100% + calc(-20 * var(--u)));
    width: calc(66 * var(--u));
  }
}
.p-preventive-vaccine__deco--flower-b {
  left: calc(64 * var(--u));
  top: calc(100% + calc(-4 * var(--u)));
  width: calc(40 * var(--u));
}
@media (min-width: 1024px) {
  .p-preventive-vaccine__deco--flower-b {
    left: calc(168 * var(--u));
    top: calc(100% + calc(-34 * var(--u)));
    width: calc(72 * var(--u));
  }
}
.p-preventive-vaccine {
  /* 動物ごとのまとまり（2つめ以降は大きくあける） */
}
.p-preventive-vaccine__animal--cat {
  margin-top: calc(80 * var(--u));
}
@media (min-width: 1024px) {
  .p-preventive-vaccine__animal--cat {
    margin-top: calc(190 * var(--u));
  }
}
.p-preventive-vaccine__animal--cat .c-heading__main em {
  color: #74a83a;
}
.p-preventive-vaccine__rabies {
  margin-top: calc(80 * var(--u));
}
@media (min-width: 1024px) {
  .p-preventive-vaccine__rabies {
    margin-top: calc(140 * var(--u));
  }
}
.c-heading + .p-preventive-vaccine__line {
  margin-top: calc(40 * var(--u));
}
@media (min-width: 1024px) {
  .c-heading + .p-preventive-vaccine__line {
    margin-top: calc(100 * var(--u));
  }
}
@media (min-width: 1024px) {
  .p-preventive-vaccine__line {
    margin-inline: calc(43 * var(--u));
  }
}
.p-preventive-vaccine__lead {
  margin-top: calc(24 * var(--u));
}
@media (min-width: 1024px) {
  .p-preventive-vaccine__lead {
    margin-top: calc(56 * var(--u));
    padding-inline: calc(8 * var(--u));
  }
}
.p-preventive-vaccine {
  /* 見出しの直後の段落（狂犬病ワクチンとは など） */
}
@media (min-width: 1024px) {
  .p-preventive-vaccine .p-lower-block > .p-lower-text {
    padding-inline: calc(8 * var(--u));
  }
}

/* ---------------------------------------------
   扱っているワクチン（丸いラベル＋説明）
--------------------------------------------- */
.p-preventive-kinds {
  display: grid;
  gap: calc(20 * var(--u));
}
@media (min-width: 1024px) {
  .p-preventive-kinds {
    gap: calc(32 * var(--u));
    padding: 0 calc(107 * var(--u)) 0 calc(113 * var(--u));
  }
}
.p-preventive-kinds__item {
  display: grid;
  grid-template-columns: calc(56 * var(--u)) minmax(0, 1fr);
  gap: calc(16 * var(--u));
  align-items: center;
}
@media (min-width: 1024px) {
  .p-preventive-kinds__item {
    grid-template-columns: calc(80 * var(--u)) minmax(0, 1fr);
    gap: calc(40 * var(--u));
  }
}
.p-preventive-kinds__chip {
  display: grid;
  place-items: center;
  aspect-ratio: 1;
  border-radius: 50%;
  background: var(--color-chip);
  font-size: calc(13 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(1.3 * var(--fu));
  color: var(--color-white);
}
@media (min-width: 1024px) {
  .p-preventive-kinds__chip {
    font-size: calc(16 * var(--fu));
    letter-spacing: calc(1.92 * var(--fu));
  }
}
.p-preventive-kinds__text {
  font-size: calc(13 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.3 * var(--fu));
  line-height: calc(22 * var(--fu));
  color: var(--color-text);
}
@media (min-width: 1024px) {
  .p-preventive-kinds__text {
    font-size: calc(14 * var(--fu));
    letter-spacing: calc(1.68 * var(--fu));
    line-height: calc(24 * var(--fu));
  }
}
@media (min-width: 1024px) {
  .p-preventive-kinds__text {
    font-size: calc(15 * var(--fu));
    letter-spacing: calc(1.8 * var(--fu));
    line-height: calc(32 * var(--fu));
  }
}
.p-preventive-kinds--green .p-preventive-kinds__chip {
  background: #9dbe77;
}
@media (min-width: 1024px) {
  .p-lower-block > .c-pin-title + .p-preventive-kinds {
    margin-top: calc(48 * var(--u));
  }
}

/* 成分表（980px・中央） */
@media (min-width: 1024px) {
  .p-lower-block > .p-preventive-table {
    width: calc(980 * var(--u));
    margin: calc(80 * var(--u)) auto 0;
  }
}
.p-preventive-table .c-table th[scope=row] {
  font-weight: 500;
}
@media (min-width: 1024px) {
  .p-preventive-table .c-table th[scope=row] {
    width: calc(357 * var(--u));
  }
}

/* ---------------------------------------------
   接種する間隔（白いカード＋接種回のボックス）
--------------------------------------------- */
.p-preventive-interval {
  --tag: #f0b981;
  --box: #ffe4c9;
  --title: var(--color-chip);
  display: grid;
  gap: calc(16 * var(--u));
}
@media (min-width: 1024px) {
  .p-preventive-interval {
    gap: calc(24 * var(--u));
  }
}
.p-preventive-interval--green {
  --tag: #b0cc91;
  --box: #d7e9bf;
  --title: var(--color-num);
}
.p-preventive-interval__card {
  display: grid;
  grid-template-columns: calc(72 * var(--u)) minmax(0, 1fr);
  gap: calc(16 * var(--u));
  align-items: center;
  padding: calc(24 * var(--u)) calc(20 * var(--u));
  border-radius: calc(16 * var(--u));
  background: var(--color-white);
}
@media (min-width: 1024px) {
  .p-preventive-interval__card {
    grid-template-columns: calc(120 * var(--u)) minmax(0, 1fr);
    gap: calc(40 * var(--u));
    padding: calc(40 * var(--u)) calc(84 * var(--u));
  }
}
.p-preventive-interval__card--simple {
  grid-template-columns: minmax(0, 1fr);
}
.p-preventive-interval__photo {
  width: 100%;
  aspect-ratio: 1;
  border-radius: 50%;
  -o-object-fit: cover;
     object-fit: cover;
}
.p-preventive-interval__title {
  font-size: calc(20 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(2.4 * var(--fu));
  line-height: 1.4;
  color: var(--title);
}
@media (min-width: 1024px) {
  .p-preventive-interval__title {
    font-size: calc(24 * var(--fu));
    letter-spacing: calc(2.88 * var(--fu));
  }
}
.p-preventive-interval__text {
  font-size: calc(13 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.3 * var(--fu));
  line-height: calc(22 * var(--fu));
  color: var(--color-text);
}
@media (min-width: 1024px) {
  .p-preventive-interval__text {
    font-size: calc(14 * var(--fu));
    letter-spacing: calc(1.68 * var(--fu));
    line-height: calc(24 * var(--fu));
  }
}
.p-preventive-interval__text {
  margin-top: calc(8 * var(--u));
}
@media (min-width: 1024px) {
  .p-preventive-interval__text {
    margin-top: calc(12 * var(--u));
    font-size: calc(15 * var(--fu));
    letter-spacing: calc(1.8 * var(--fu));
    line-height: calc(32 * var(--fu));
  }
}
.p-preventive-interval__card--simple .p-preventive-interval__text {
  margin-top: 0;
}
.p-preventive-interval__steps {
  grid-column: 1/-1;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: calc(24 * var(--u)) calc(12 * var(--u));
  margin-top: calc(16 * var(--u));
}
@media (min-width: 1024px) {
  .p-preventive-interval__steps {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: calc(24 * var(--u));
    margin-top: calc(28 * var(--u));
  }
}
@media (min-width: 1024px) {
  .p-preventive-interval__steps--2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
.p-preventive-interval__step {
  position: relative;
  display: grid;
  place-items: center;
  min-height: calc(64 * var(--u));
  padding: calc(18 * var(--u)) calc(8 * var(--u)) calc(8 * var(--u));
  border-radius: calc(8 * var(--u));
  background: var(--box);
  font-size: calc(13 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.3 * var(--fu));
  line-height: 1.5;
  color: var(--color-title);
  text-align: center;
}
@media (min-width: 1024px) {
  .p-preventive-interval__step {
    min-height: calc(83 * var(--u));
    padding: calc(20 * var(--u)) calc(12 * var(--u)) calc(12 * var(--u));
    font-size: calc(16 * var(--fu));
    letter-spacing: calc(1.92 * var(--fu));
  }
}
.p-preventive-interval__tag {
  position: absolute;
  left: 50%;
  top: 0;
  min-width: calc(72 * var(--u));
  padding: calc(2 * var(--u)) calc(12 * var(--u));
  border-radius: 999px;
  background: var(--tag);
  font-size: calc(12 * var(--fu));
  letter-spacing: calc(1.2 * var(--fu));
  line-height: 1.6;
  transform: translate(-50%, -50%);
}
@media (min-width: 1024px) {
  .p-preventive-interval__tag {
    min-width: calc(96 * var(--u));
    font-size: calc(14 * var(--fu));
    letter-spacing: calc(1.68 * var(--fu));
  }
}

/* ワクチンの副作用（幅1200px） */
.p-preventive-side-effect {
  margin-top: calc(56 * var(--u));
}
@media (min-width: 1024px) {
  .p-preventive-side-effect {
    width: auto;
    margin-top: calc(40 * var(--u));
    padding: calc(24 * var(--u)) calc(80 * var(--u)) calc(40 * var(--u)) calc(40 * var(--u));
    font-size: calc(15 * var(--fu));
    letter-spacing: calc(1.8 * var(--fu));
  }
}
@media (min-width: 1024px) {
  .p-preventive-side-effect .c-note__title {
    margin-left: 0;
  }
}
@media (min-width: 1024px) {
  .p-preventive-side-effect .c-note__deco {
    left: auto;
    right: calc(-26 * var(--u));
    bottom: calc(-24 * var(--u));
  }
}
@media (min-width: 1024px) {
  .p-preventive-side-effect + .p-lower-block {
    margin-top: calc(120 * var(--u));
  }
}

/* ---------------------------------------------
   フィラリアのライフサイクル
--------------------------------------------- */
.p-preventive-cycle {
  padding: calc(24 * var(--u)) calc(16 * var(--u));
  border-radius: calc(16 * var(--u));
  background: #f8f1de;
}
@media (min-width: 1024px) {
  .p-preventive-cycle {
    position: relative;
    height: calc(604 * var(--u));
    padding: 0;
    border-radius: calc(24 * var(--u));
  }
}
.p-preventive-cycle__img {
  display: block;
  width: 100%;
  max-width: calc(300 * var(--u));
  margin-inline: auto;
}
@media (min-width: 1024px) {
  .p-preventive-cycle__img {
    position: absolute;
    left: calc(330 * var(--u));
    top: calc(26 * var(--u));
    width: calc(560 * var(--u));
    max-width: none;
  }
}
.p-preventive-cycle__list {
  counter-reset: cycle;
  display: grid;
  gap: calc(12 * var(--u));
  margin-top: calc(20 * var(--u));
}
@media (min-width: 1024px) {
  .p-preventive-cycle__list {
    display: block;
    margin: 0;
  }
}
.p-preventive-cycle__step {
  position: relative;
  padding-left: calc(30 * var(--u));
  font-size: calc(13 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.3 * var(--fu));
  line-height: calc(22 * var(--fu));
  color: var(--color-text);
}
@media (min-width: 1024px) {
  .p-preventive-cycle__step {
    font-size: calc(14 * var(--fu));
    letter-spacing: calc(1.68 * var(--fu));
    line-height: calc(24 * var(--fu));
  }
}
@media (min-width: 1024px) {
  .p-preventive-cycle__step {
    position: absolute;
    width: calc(320 * var(--u));
    padding: 0;
    font-size: calc(15 * var(--fu));
    letter-spacing: calc(1.8 * var(--fu));
    line-height: calc(28 * var(--fu));
    text-align: center;
  }
}
.p-preventive-cycle__step {
  /* SPは番号を付けて縦に並べる（改行は解除） */
}
.p-preventive-cycle__step::before {
  counter-increment: cycle;
  content: counter(cycle);
  position: absolute;
  left: 0;
  top: calc(1 * var(--u));
  display: grid;
  place-items: center;
  width: calc(20 * var(--u));
  height: calc(20 * var(--u));
  border-radius: 50%;
  background: var(--color-chip);
  font-size: calc(11 * var(--fu));
  color: var(--color-white);
}
@media (min-width: 1024px) {
  .p-preventive-cycle__step::before {
    content: none;
  }
}
@media (max-width: 1023.98px) {
  .p-preventive-cycle__step br {
    display: none;
  }
}
@media (min-width: 1024px) {
  .p-preventive-cycle__step--01 {
    left: calc(101 * var(--u));
    top: calc(130 * var(--u));
  }
}
@media (min-width: 1024px) {
  .p-preventive-cycle__step--02 {
    left: calc(777 * var(--u));
    top: calc(178 * var(--u));
  }
}
@media (min-width: 1024px) {
  .p-preventive-cycle__step--03 {
    left: calc(692 * var(--u));
    top: calc(506 * var(--u));
  }
}
@media (min-width: 1024px) {
  .p-preventive-cycle__step--04 {
    left: calc(105 * var(--u));
    top: calc(472 * var(--u));
  }
}

/* ---------------------------------------------
   予防薬一覧（金色のラベル＋説明）
--------------------------------------------- */
.p-preventive-medicine {
  display: grid;
  gap: calc(16 * var(--u));
}
@media (min-width: 1024px) {
  .p-preventive-medicine {
    padding-left: calc(40 * var(--u));
  }
}
@media (min-width: 1024px) {
  .p-preventive-medicine__item {
    display: grid;
    grid-template-columns: calc(241 * var(--u)) minmax(0, 1fr);
    gap: calc(26 * var(--u));
    align-items: center;
  }
}
.p-preventive-medicine__name {
  display: grid;
  place-items: center;
  min-height: calc(64 * var(--u));
  padding: calc(10 * var(--u)) calc(4 * var(--u));
  border-radius: calc(4 * var(--u));
  white-space: nowrap;
  background: var(--color-chip);
  font-size: calc(14 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(1.68 * var(--fu));
  line-height: calc(24 * var(--fu));
  color: var(--color-white);
  text-align: center;
}
@media (min-width: 1024px) {
  .p-preventive-medicine__name {
    min-height: calc(80 * var(--u));
    font-size: calc(15 * var(--fu));
    letter-spacing: calc(1.8 * var(--fu));
  }
}
.p-preventive-medicine__text {
  font-size: calc(13 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.3 * var(--fu));
  line-height: calc(22 * var(--fu));
  color: var(--color-text);
}
@media (min-width: 1024px) {
  .p-preventive-medicine__text {
    font-size: calc(14 * var(--fu));
    letter-spacing: calc(1.68 * var(--fu));
    line-height: calc(24 * var(--fu));
  }
}
.p-preventive-medicine__text {
  margin-top: calc(8 * var(--u));
}
@media (min-width: 1024px) {
  .p-preventive-medicine__text {
    margin-top: 0;
    font-size: calc(15 * var(--fu));
    letter-spacing: calc(1.8 * var(--fu));
    line-height: calc(28 * var(--fu));
  }
}

/* ---------------------------------------------
   ノミ・マダニ予防／年間スケジュール（クリーム背景）
--------------------------------------------- */
.p-preventive-flea__deco {
  left: calc(16 * var(--u));
  top: calc(-44 * var(--u));
  width: calc(110 * var(--u));
}
@media (min-width: 1024px) {
  .p-preventive-flea__deco {
    left: calc(93 * var(--u));
    top: calc(-40 * var(--u));
    width: calc(206 * var(--u));
  }
}
.p-preventive-flea__schedule {
  margin-top: calc(80 * var(--u));
}
@media (min-width: 1024px) {
  .p-preventive-flea__schedule {
    margin-top: calc(180 * var(--u));
  }
}

/* ノミ・マダニによる健康被害 */
.p-preventive-damage {
  display: grid;
  gap: calc(16 * var(--u));
}
@media (min-width: 1024px) {
  .p-preventive-damage {
    gap: calc(18 * var(--u));
  }
}
.p-preventive-damage__card {
  padding: calc(24 * var(--u)) calc(20 * var(--u));
  border-radius: calc(16 * var(--u));
  background: var(--color-white);
}
@media (min-width: 1024px) {
  .p-preventive-damage__card {
    padding: calc(38 * var(--u)) calc(84 * var(--u)) calc(40 * var(--u));
  }
}
.p-preventive-damage__title {
  font-size: calc(18 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(2.16 * var(--fu));
  line-height: 1.4;
  color: var(--color-chip);
}
@media (min-width: 1024px) {
  .p-preventive-damage__title {
    font-size: calc(24 * var(--fu));
    letter-spacing: calc(2.88 * var(--fu));
  }
}
.p-preventive-damage__list {
  display: flex;
  flex-wrap: wrap;
  gap: calc(10 * var(--u)) calc(24 * var(--u));
  margin-top: calc(16 * var(--u));
}
@media (min-width: 1024px) {
  .p-preventive-damage__list {
    gap: calc(16 * var(--u)) calc(56 * var(--u));
    margin-top: calc(24 * var(--u));
  }
}
.p-preventive-damage__list > li {
  position: relative;
  padding-left: calc(32 * var(--fu));
  font-size: calc(14 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.68 * var(--fu));
  line-height: calc(24 * var(--fu));
  color: var(--color-text);
}
@media (min-width: 1024px) {
  .p-preventive-damage__list > li {
    padding-left: calc(40 * var(--fu));
    font-size: calc(16 * var(--fu));
    letter-spacing: calc(1.92 * var(--fu));
  }
}
.p-preventive-damage__list > li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: calc(24 * var(--fu));
  height: calc(24 * var(--fu));
  background: url("../img/lower/icon-check-orange.svg") no-repeat center/contain;
}

/* 年間スケジュール */
.p-preventive-schedule__table {
  --period: #f8f1de;
  --recommend: #fbe3a6;
  --recommend-text: var(--color-chip);
  --cell: var(--period);
}
@media (min-width: 1024px) {
  .p-preventive-schedule__table {
    table-layout: fixed;
  }
}
.p-preventive-schedule__table.c-table {
  min-width: calc(900 * var(--u));
}
@media (min-width: 1024px) {
  .p-preventive-schedule__table.c-table {
    min-width: 0;
  }
}
.p-preventive-schedule__table th,
.p-preventive-schedule__table td {
  font-size: calc(12 * var(--fu));
  letter-spacing: calc(1.2 * var(--fu));
}
@media (min-width: 1024px) {
  .p-preventive-schedule__table th,
  .p-preventive-schedule__table td {
    padding-inline: calc(4 * var(--u));
    font-size: calc(14 * var(--fu));
    letter-spacing: calc(1.68 * var(--fu));
  }
}
@media (min-width: 1024px) {
  .p-preventive-schedule__table thead th:first-child {
    width: calc(357 * var(--u));
  }
}
.p-preventive-schedule__table tbody th {
  font-weight: 500;
}
.p-preventive-schedule__table--cat {
  --period: #f0ffe0;
  --recommend: #dcf5c3;
  --recommend-text: #7aad3f;
}
.p-preventive-schedule__cell.is-empty {
  background: var(--color-white);
}
.p-preventive-schedule__cell.is-recommend {
  background: var(--recommend);
  font-weight: 700;
  color: var(--recommend-text);
}

/* =============================================
   健康診断（prevention/checkup/）
============================================= */
/* ---------------------------------------------
   病気を早期に発見しましょう
--------------------------------------------- */
@media (min-width: 1024px) {
  .p-checkup-intro__lead {
    width: calc(700 * var(--fu));
    margin-inline: auto;
  }
}
@media (min-width: 1024px) {
  .c-heading + .p-checkup-intro__lead {
    margin-top: calc(64 * var(--u));
  }
}
.p-checkup-intro__deco--flower-a {
  left: calc(16 * var(--u));
  top: calc(-24 * var(--u));
  width: calc(36 * var(--u));
}
@media (min-width: 1024px) {
  .p-checkup-intro__deco--flower-a {
    left: calc(200 * var(--u));
    top: calc(120 * var(--u));
    width: calc(54 * var(--u));
  }
}
.p-checkup-intro__deco--flower-b {
  left: calc(56 * var(--u));
  top: calc(-30 * var(--u));
  width: calc(40 * var(--u));
}
@media (min-width: 1024px) {
  .p-checkup-intro__deco--flower-b {
    left: calc(265 * var(--u));
    top: calc(108 * var(--u));
    width: calc(60 * var(--u));
  }
}
.p-checkup-intro__deco--cat {
  right: calc(16 * var(--u));
  bottom: calc(-100 * var(--u));
  width: calc(54 * var(--u));
}
@media (min-width: 1024px) {
  .p-checkup-intro__deco--cat {
    right: calc(233 * var(--u));
    bottom: calc(-100 * var(--u));
    width: calc(82 * var(--u));
  }
}

/* ---------------------------------------------
   健康診断のメリット／ペットの年齢（クリーム背景）
--------------------------------------------- */
@media (min-width: 1024px) {
  .p-checkup-merit {
    margin-top: calc(170 * var(--u));
  }
}
.p-checkup-merit__deco--dog {
  left: calc(16 * var(--u));
  top: calc(-28 * var(--u));
  width: calc(56 * var(--u));
}
@media (min-width: 1024px) {
  .p-checkup-merit__deco--dog {
    left: calc(63 * var(--u));
    top: calc(-12 * var(--u));
    width: calc(100 * var(--u));
  }
}
.p-checkup-merit__deco {
  /* 下端の波の上 */
}
.p-checkup-merit__deco--tulip-a {
  left: calc(20 * var(--u));
  top: calc(100% + calc(16 * var(--u)));
  width: calc(28 * var(--u));
}
@media (min-width: 1024px) {
  .p-checkup-merit__deco--tulip-a {
    left: calc(72 * var(--u));
    top: calc(100% + calc(100 * var(--u)));
    width: calc(45 * var(--u));
  }
}
.p-checkup-merit__deco--tulip-b {
  left: calc(54 * var(--u));
  top: calc(100% + calc(22 * var(--u)));
  width: calc(28 * var(--u));
}
@media (min-width: 1024px) {
  .p-checkup-merit__deco--tulip-b {
    left: calc(136 * var(--u));
    top: calc(100% + calc(118 * var(--u)));
    width: calc(46 * var(--u));
  }
}
.p-checkup-merit__list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: calc(8 * var(--u));
}
@media (min-width: 1024px) {
  .p-checkup-merit__list {
    grid-template-columns: repeat(3, calc(343 * var(--u)));
    justify-content: center;
    gap: 0;
  }
}
.p-checkup-merit__item {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.p-checkup-merit__icon {
  display: grid;
  place-items: center;
  width: calc(96 * var(--u));
  aspect-ratio: 1;
  border-radius: 50%;
  background: #f3e6b2;
}
@media (min-width: 1024px) {
  .p-checkup-merit__icon {
    width: calc(173 * var(--u));
  }
}
.p-checkup-merit__icon img {
  width: 72%;
}
.p-checkup-merit__text {
  margin-top: calc(12 * var(--u));
  font-size: calc(13 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(1.3 * var(--fu));
  line-height: calc(20 * var(--fu));
  color: var(--color-chip);
  text-align: center;
}
@media (min-width: 1024px) {
  .p-checkup-merit__text {
    margin-top: calc(32 * var(--u));
    font-size: calc(24 * var(--fu));
    letter-spacing: calc(2.88 * var(--fu));
    line-height: calc(40 * var(--fu));
    white-space: nowrap;
  }
}
@media (max-width: 1023.98px) {
  .p-checkup-merit__text br {
    display: none;
  }
}

/* ペットの年齢（980px・中央） */
@media (min-width: 1024px) {
  .p-checkup-age {
    width: calc(980 * var(--u));
    margin-inline: auto;
  }
}
.p-checkup-age__table thead tr + tr > th {
  border-top: 1px solid rgba(255, 255, 255, 0.5);
}
.p-checkup-age__table {
  /* 2行目の見出しの左端の区切り（1行目の「ペットの年齢」の右） */
}
.p-checkup-age__table thead tr + tr > th:first-child {
  border-left: 1px solid rgba(255, 255, 255, 0.5);
}
.p-checkup-age__table tbody th {
  font-weight: 500;
}
@media (min-width: 1024px) {
  .p-checkup-age__table tbody th {
    width: calc(280 * var(--u));
  }
}

/* ---------------------------------------------
   健康診断コース
--------------------------------------------- */
@media (min-width: 1024px) {
  .p-checkup-course {
    margin-top: calc(260 * var(--u));
  }
}
.c-heading + .p-checkup-course__note {
  margin-top: calc(32 * var(--u));
}
@media (min-width: 1024px) {
  .c-heading + .p-checkup-course__note {
    margin-top: calc(80 * var(--u));
    padding-inline: calc(84 * var(--u));
  }
}
@media (min-width: 1024px) {
  .p-checkup-course__note .c-note__deco {
    left: auto;
    right: calc(-30 * var(--u));
    bottom: calc(-48 * var(--u));
  }
}
.p-checkup-course__note-list {
  display: grid;
  gap: calc(4 * var(--u));
  font-weight: 700;
}
@media (min-width: 1024px) {
  .p-checkup-course__note-list {
    font-size: calc(15 * var(--fu));
    letter-spacing: calc(1.8 * var(--fu));
  }
}
.p-checkup-course__note-list > li::before {
  top: calc(10 * var(--fu));
  top: calc((1lh - calc(10 * var(--fu))) / 2);
  width: calc(10 * var(--fu));
  height: calc(10 * var(--fu));
}
.p-checkup-course__btn {
  margin-block: calc(8 * var(--u));
}
@media (min-width: 1024px) {
  .p-checkup-course__btn {
    width: calc(180 * var(--u));
    height: calc(40 * var(--u));
    font-size: calc(15 * var(--fu));
  }
}
@media (min-width: 1024px) {
  .p-checkup-course__block {
    margin-top: calc(120 * var(--u));
  }
}
.p-checkup-course__list {
  display: grid;
  gap: calc(40 * var(--u));
}
@media (min-width: 1024px) {
  .p-checkup-course__list {
    gap: calc(120 * var(--u));
  }
}
.p-checkup-course__item {
  display: grid;
  gap: calc(16 * var(--u));
}
@media (min-width: 1024px) {
  .p-checkup-course__item {
    grid-template-columns: calc(416 * var(--u)) minmax(0, 1fr);
    gap: calc(56 * var(--u));
    align-items: start;
  }
}
.p-checkup-course__img {
  overflow: hidden;
  border-radius: calc(16 * var(--u));
}
@media (min-width: 1024px) {
  .p-checkup-course__img {
    border-radius: calc(24 * var(--u));
  }
}
.p-checkup-course__img img {
  width: 100%;
  aspect-ratio: 416/291;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: inherit;
}
.p-checkup-course__name {
  font-size: calc(22 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(2.64 * var(--fu));
  line-height: 1.4;
  color: #e39c68;
}
@media (min-width: 1024px) {
  .p-checkup-course__name {
    margin-top: calc(-6 * var(--u));
    font-size: calc(28 * var(--fu));
    letter-spacing: calc(3.36 * var(--fu));
  }
}
.p-checkup-course__tab {
  display: inline-block;
  min-width: calc(200 * var(--u));
  margin-top: calc(12 * var(--u));
  padding: calc(6 * var(--u)) calc(16 * var(--u));
  border-radius: calc(12 * var(--u)) calc(12 * var(--u)) 0 0;
  background: #e39c68;
  font-size: calc(16 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(1.92 * var(--fu));
  line-height: 1.6;
  color: var(--color-white);
}
@media (min-width: 1024px) {
  .p-checkup-course__tab {
    min-width: calc(308 * var(--u));
    margin-top: calc(20 * var(--u));
    padding: calc(8 * var(--u)) calc(24 * var(--u));
    border-radius: calc(16 * var(--u)) calc(16 * var(--u)) 0 0;
    font-size: calc(20 * var(--fu));
    letter-spacing: calc(2.4 * var(--fu));
  }
}
.p-checkup-course__items {
  display: grid;
  gap: calc(16 * var(--u));
  padding: calc(16 * var(--u));
  border-radius: 0 calc(12 * var(--u)) calc(12 * var(--u));
  background: #f8f1de;
}
@media (min-width: 1024px) {
  .p-checkup-course__items {
    gap: calc(24 * var(--u));
    padding: calc(24 * var(--u)) calc(32 * var(--u)) calc(24 * var(--u)) calc(24 * var(--u));
    border-radius: 0 calc(16 * var(--u)) calc(16 * var(--u));
  }
}
.p-checkup-course__items > li {
  position: relative;
  padding-left: calc(32 * var(--fu));
  font-size: calc(13 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(1.3 * var(--fu));
  line-height: calc(22 * var(--fu));
  color: var(--color-text);
}
@media (min-width: 1024px) {
  .p-checkup-course__items > li {
    padding-left: calc(40 * var(--fu));
    font-size: calc(15 * var(--fu));
    letter-spacing: calc(1.8 * var(--fu));
    line-height: calc(24 * var(--fu));
  }
}
.p-checkup-course__items > li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: calc(24 * var(--fu));
  height: calc(24 * var(--fu));
  background: url("../img/lower/icon-check-orange.svg") no-repeat center/contain;
}

/* その他の検査（2列） */
.p-checkup-other {
  display: grid;
  gap: calc(24 * var(--u));
}
@media (min-width: 1024px) {
  .p-checkup-other {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: calc(56 * var(--u)) calc(40 * var(--u));
  }
}
@media (min-width: 1024px) {
  .p-checkup-other__item--wide {
    grid-column: 1/-1;
  }
}
.p-checkup-other__title {
  position: relative;
  padding-left: calc(36 * var(--fu));
  font-size: calc(16 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(1.92 * var(--fu));
  line-height: calc(24 * var(--fu));
  color: var(--color-title);
}
@media (min-width: 1024px) {
  .p-checkup-other__title {
    padding-left: calc(40 * var(--fu));
    font-size: calc(18 * var(--fu));
    letter-spacing: calc(2.16 * var(--fu));
  }
}
.p-checkup-other__title::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: calc(24 * var(--fu));
  height: calc(24 * var(--fu));
  background: url("../img/lower/icon-check-orange.svg") no-repeat center/contain;
}
.p-checkup-other__text {
  font-size: calc(13 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.3 * var(--fu));
  line-height: calc(22 * var(--fu));
  color: var(--color-text);
}
@media (min-width: 1024px) {
  .p-checkup-other__text {
    font-size: calc(14 * var(--fu));
    letter-spacing: calc(1.68 * var(--fu));
    line-height: calc(24 * var(--fu));
  }
}
.p-checkup-other__text {
  margin-top: calc(8 * var(--u));
}
@media (min-width: 1024px) {
  .p-checkup-other__text {
    margin-top: calc(16 * var(--u));
    font-size: calc(15 * var(--fu));
    letter-spacing: calc(1.8 * var(--fu));
  }
}

/* ---------------------------------------------
   健康診断キャンペーン（クリーム背景）
--------------------------------------------- */
@media (min-width: 1024px) {
  .p-checkup-campaign {
    margin-top: calc(180 * var(--u));
  }
}
.p-checkup-campaign__deco {
  right: calc(16 * var(--u));
  top: calc(-44 * var(--u));
  width: calc(110 * var(--u));
}
@media (min-width: 1024px) {
  .p-checkup-campaign__deco {
    right: calc(53 * var(--u));
    top: calc(-110 * var(--u));
    width: calc(206 * var(--u));
  }
}
.p-checkup-campaign__img {
  overflow: hidden;
  border-radius: calc(16 * var(--u));
}
@media (min-width: 1024px) {
  .p-checkup-campaign__img {
    width: calc(480 * var(--u));
    margin-inline: auto;
    border-radius: calc(24 * var(--u));
  }
}
.p-checkup-campaign__img img {
  width: 100%;
  aspect-ratio: 480/336;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: inherit;
}
.p-checkup-campaign__text {
  margin-top: calc(24 * var(--u));
}
@media (min-width: 1024px) {
  .p-checkup-campaign__text {
    margin-top: calc(40 * var(--u));
  }
}
.p-checkup-campaign__btns {
  display: flex;
  justify-content: center;
  margin-top: calc(24 * var(--u));
}
@media (min-width: 1024px) {
  .p-checkup-campaign__btns {
    margin-top: calc(32 * var(--u));
  }
}
.p-checkup-campaign__btns .c-btn-tel {
  width: calc(260 * var(--u));
  height: calc(52 * var(--u));
  border-radius: 999px;
  font-size: calc(20 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(1.6 * var(--fu));
  color: var(--color-title);
}
@media (min-width: 1024px) {
  .p-checkup-campaign__btns .c-btn-tel {
    width: calc(288 * var(--u));
    height: calc(56 * var(--u));
    font-size: calc(24 * var(--fu));
    letter-spacing: calc(1.92 * var(--fu));
  }
}
.p-checkup-campaign__btns .c-btn-tel__icon {
  width: calc(24 * var(--u));
}
@media (min-width: 1024px) {
  .p-checkup-campaign__btns .c-btn-tel__icon {
    width: calc(30 * var(--u));
  }
}

/* =============================================
   採用情報（recruit/）
============================================= */
/* ---------------------------------------------
   大切にしている思い
--------------------------------------------- */
@media (min-width: 1024px) {
  .p-recruit-intro__lead {
    width: calc(640 * var(--fu));
    margin-inline: auto;
  }
}
@media (min-width: 1024px) {
  .c-heading + .p-recruit-intro__lead {
    margin-top: calc(64 * var(--u));
  }
}
.p-recruit-intro__deco--flower-a {
  left: calc(16 * var(--u));
  top: calc(-20 * var(--u));
  width: calc(32 * var(--u));
}
@media (min-width: 1024px) {
  .p-recruit-intro__deco--flower-a {
    left: calc(327 * var(--u));
    top: calc(100 * var(--u));
    width: calc(50 * var(--u));
  }
}
.p-recruit-intro__deco--flower-b {
  left: calc(50 * var(--u));
  top: calc(4 * var(--u));
  width: calc(30 * var(--u));
}
@media (min-width: 1024px) {
  .p-recruit-intro__deco--flower-b {
    left: calc(402 * var(--u));
    top: calc(146 * var(--u));
    width: calc(48 * var(--u));
  }
}
.p-recruit-intro__deco--dog {
  right: calc(16 * var(--u));
  bottom: calc(-80 * var(--u));
  width: calc(70 * var(--u));
}
@media (min-width: 1024px) {
  .p-recruit-intro__deco--dog {
    right: calc(260 * var(--u));
    bottom: calc(-120 * var(--u));
    width: calc(126 * var(--u));
  }
}

/* ---------------------------------------------
   働く魅力（白いカード＋点線の丸い写真）
--------------------------------------------- */
@media (min-width: 1024px) {
  .p-recruit-charm {
    margin-top: calc(190 * var(--u));
  }
}
.p-recruit-charm__deco--flower-a {
  left: calc(20 * var(--u));
  top: calc(-10 * var(--u));
  width: calc(36 * var(--u));
}
@media (min-width: 1024px) {
  .p-recruit-charm__deco--flower-a {
    left: calc(96 * var(--u));
    top: calc(10 * var(--u));
    width: calc(58 * var(--u));
  }
}
.p-recruit-charm__deco--flower-b {
  left: calc(64 * var(--u));
  top: calc(6 * var(--u));
  width: calc(24 * var(--u));
}
@media (min-width: 1024px) {
  .p-recruit-charm__deco--flower-b {
    left: calc(170 * var(--u));
    top: calc(36 * var(--u));
    width: calc(36 * var(--u));
  }
}
.p-recruit-charm__list {
  display: grid;
  gap: calc(48 * var(--u));
}
@media (min-width: 1024px) {
  .p-recruit-charm__list {
    gap: calc(64 * var(--u));
  }
}
.p-recruit-charm__item {
  position: relative;
}
@media (min-width: 1024px) {
  .p-recruit-charm__item {
    display: grid;
    align-items: center;
    min-height: calc(333 * var(--u));
    padding-left: calc(91 * var(--u));
  }
}
.p-recruit-charm__item {
  /* 偶数番目は写真が左 */
}
@media (min-width: 1024px) {
  .p-recruit-charm__item:nth-child(even) {
    padding-left: calc(349 * var(--u));
  }
}
.p-recruit-charm__photo {
  position: relative;
  z-index: 1;
  width: calc(200 * var(--u));
  margin-inline: auto;
  padding: calc(5 * var(--u));
  border: calc(3 * var(--u)) dashed #9cbe76;
  border-radius: 50%;
}
@media (min-width: 1024px) {
  .p-recruit-charm__photo {
    position: absolute;
    right: calc(91 * var(--u));
    top: 50%;
    width: calc(333 * var(--u));
    padding: calc(7 * var(--u));
    transform: translateY(-50%);
  }
}
@media (min-width: 1024px) {
  .p-recruit-charm__item:nth-child(even) .p-recruit-charm__photo {
    left: calc(93 * var(--u));
    right: auto;
  }
}
.p-recruit-charm__photo img {
  width: 100%;
  aspect-ratio: 1;
  border-radius: 50%;
  -o-object-fit: cover;
     object-fit: cover;
}
.p-recruit-charm__card {
  margin-top: calc(-40 * var(--u));
  padding: calc(56 * var(--u)) calc(20 * var(--u)) calc(28 * var(--u));
  border-radius: calc(16 * var(--u));
  background: var(--color-white);
}
@media (min-width: 1024px) {
  .p-recruit-charm__card {
    width: calc(760 * var(--u));
    margin-top: 0;
    padding: calc(36 * var(--u)) calc(107 * var(--u)) calc(36 * var(--u)) calc(80 * var(--u));
  }
}
@media (min-width: 1024px) {
  .p-recruit-charm__item:nth-child(even) .p-recruit-charm__card {
    padding: calc(36 * var(--u)) calc(80 * var(--u)) calc(36 * var(--u)) calc(100 * var(--u));
  }
}
.p-recruit-charm__title {
  font-size: calc(18 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(2.16 * var(--fu));
  line-height: calc(36 * var(--fu));
  color: var(--color-title);
}
@media (min-width: 1024px) {
  .p-recruit-charm__title {
    font-size: calc(24 * var(--fu));
    letter-spacing: calc(2.88 * var(--fu));
    line-height: calc(44 * var(--fu));
  }
}
.p-recruit-charm__title mark {
  margin-inline: calc(4 * var(--u));
  padding: calc(2 * var(--u)) calc(6 * var(--u));
  border-radius: calc(2 * var(--u));
  background: var(--color-chip);
  color: var(--color-white);
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
}
.p-recruit-charm__text {
  font-size: calc(13 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.3 * var(--fu));
  line-height: calc(22 * var(--fu));
  color: var(--color-text);
}
@media (min-width: 1024px) {
  .p-recruit-charm__text {
    font-size: calc(14 * var(--fu));
    letter-spacing: calc(1.68 * var(--fu));
    line-height: calc(24 * var(--fu));
  }
}
.p-recruit-charm__text {
  margin-top: calc(12 * var(--u));
}
@media (min-width: 1024px) {
  .p-recruit-charm__text {
    margin-top: calc(16 * var(--u));
    font-size: calc(15 * var(--fu));
    letter-spacing: calc(1.8 * var(--fu));
    line-height: calc(32 * var(--fu));
  }
}

/* ---------------------------------------------
   求める人材
--------------------------------------------- */
.p-recruit-people__deco--flower-a {
  right: calc(56 * var(--u));
  top: calc(320 * var(--u));
  width: calc(32 * var(--u));
}
@media (min-width: 1024px) {
  .p-recruit-people__deco--flower-a {
    right: calc(130 * var(--u));
    top: calc(545 * var(--u));
    width: calc(48 * var(--u));
  }
}
.p-recruit-people__deco--flower-b {
  right: calc(20 * var(--u));
  top: calc(316 * var(--u));
  width: calc(30 * var(--u));
}
@media (min-width: 1024px) {
  .p-recruit-people__deco--flower-b {
    right: calc(80 * var(--u));
    top: calc(538 * var(--u));
    width: calc(46 * var(--u));
  }
}
.p-recruit-people__deco--cat {
  right: calc(16 * var(--u));
  bottom: calc(-80 * var(--u));
  width: calc(50 * var(--u));
}
@media (min-width: 1024px) {
  .p-recruit-people__deco--cat {
    right: calc(170 * var(--u));
    bottom: calc(-150 * var(--u));
    width: calc(90 * var(--u));
  }
}
.p-recruit-people__list {
  display: grid;
  gap: calc(48 * var(--u));
}
@media (min-width: 1024px) {
  .p-recruit-people__list {
    gap: calc(100 * var(--u));
  }
}
.p-recruit-people__item {
  display: grid;
  gap: calc(16 * var(--u));
}
@media (min-width: 1024px) {
  .p-recruit-people__item {
    grid-template-columns: calc(416 * var(--u)) minmax(0, 1fr);
    gap: calc(48 * var(--u));
    align-items: start;
  }
}
.p-recruit-people__img {
  overflow: hidden;
  border-radius: calc(16 * var(--u));
}
@media (min-width: 1024px) {
  .p-recruit-people__img {
    border-radius: calc(24 * var(--u));
  }
}
.p-recruit-people__img img {
  width: 100%;
  aspect-ratio: 416/291;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: inherit;
}
@media (min-width: 1024px) {
  .p-recruit-people__body {
    padding-right: calc(90 * var(--u));
  }
}
@media (min-width: 1024px) {
  .p-recruit-people__num {
    margin-top: calc(-8 * var(--u));
  }
  .p-recruit-people__num .c-arc-num__num {
    font-size: calc(64 * var(--u));
  }
}
.p-recruit-people__title {
  margin-top: calc(8 * var(--u));
  font-size: calc(18 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(2.16 * var(--fu));
  line-height: calc(30 * var(--fu));
  color: var(--color-num);
}
@media (min-width: 1024px) {
  .p-recruit-people__title {
    margin: calc(16 * var(--u)) 0 0 calc(8 * var(--u));
    font-size: calc(24 * var(--fu));
    letter-spacing: calc(2.88 * var(--fu));
    line-height: calc(36 * var(--fu));
  }
}
.p-recruit-people__text {
  font-size: calc(13 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.3 * var(--fu));
  line-height: calc(22 * var(--fu));
  color: var(--color-text);
}
@media (min-width: 1024px) {
  .p-recruit-people__text {
    font-size: calc(14 * var(--fu));
    letter-spacing: calc(1.68 * var(--fu));
    line-height: calc(24 * var(--fu));
  }
}
.p-recruit-people__text {
  margin-top: calc(12 * var(--u));
}
@media (min-width: 1024px) {
  .p-recruit-people__text {
    margin: calc(20 * var(--u)) 0 0 calc(8 * var(--u));
    font-size: calc(15 * var(--fu));
    letter-spacing: calc(1.8 * var(--fu));
    line-height: calc(28 * var(--fu));
  }
}

/* ---------------------------------------------
   募集職種（クリーム背景）
--------------------------------------------- */
@media (min-width: 1024px) {
  .p-recruit-job {
    margin-top: calc(300 * var(--u));
  }
}
.p-recruit-job__deco {
  right: calc(20 * var(--u));
  top: calc(40 * var(--u));
  width: calc(48 * var(--u));
}
@media (min-width: 1024px) {
  .p-recruit-job__deco {
    /* 締めの文章（中央揃え・最長行 約840px）の左隣に置く。
       left を固定値にすると、文字の下限（--fu）が効く狭いPC幅や
       1440px超の画面で文章と重なる／離れるため、中央基準で
       「文章の半幅 + 余白 + 自身の幅」だけ左へずらす */
    left: calc(50% - calc(420 * var(--fu)) - calc(24 * var(--u)) - calc(82 * var(--u)));
    right: auto;
    top: auto;
    bottom: calc(250 * var(--u));
    width: calc(82 * var(--u));
  }
}
.p-recruit-job__table + .p-recruit-job__table {
  margin-top: calc(32 * var(--u));
}
.p-recruit-job__btn {
  display: flex;
  justify-content: center;
  margin-top: calc(24 * var(--u));
}
.p-recruit-job__text {
  margin-top: calc(48 * var(--u));
}
@media (min-width: 1024px) {
  .p-recruit-job__text {
    margin-top: calc(80 * var(--u));
    font-size: calc(15 * var(--fu));
    letter-spacing: calc(1.8 * var(--fu));
  }
}

/* =============================================
   料金表（price/）
============================================= */
/* 料金表の共通（セルの文字・列幅） */
@media (min-width: 1024px) {
  .p-price-table {
    border-radius: calc(8 * var(--u));
  }
}
@media (min-width: 1024px) {
  .p-price-table th,
  .p-price-table td {
    height: calc(60 * var(--u));
    font-size: calc(15 * var(--fu));
    letter-spacing: calc(1.8 * var(--fu));
  }
}
.p-price-table tbody th {
  font-weight: 500;
}
.p-price-table {
  /* 項目＋料金の2列（左右半分ずつ） */
}
.p-price-table--fee th {
  width: 50%;
}
.p-price-table {
  /* 症状別：程度＋4列 */
}
.p-price-table--symptom thead td {
  background: var(--head);
  border-left: 0;
}
.p-price-table--symptom thead th {
  border-left: 1px solid rgba(255, 255, 255, 0.5);
}
.p-price-table--symptom th[scope=row] {
  width: calc(90 * var(--u));
  font-weight: 700;
}
@media (min-width: 1024px) {
  .p-price-table--symptom th[scope=row] {
    width: calc(180 * var(--u));
  }
}
.p-price-table {
  /* 動物ごと：動物＋項目＋料金 */
}
@media (max-width: 1023.98px) {
  .p-price-table--group th,
  .p-price-table--group td {
    font-size: calc(12 * var(--fu));
    letter-spacing: calc(0.6 * var(--fu));
  }
}
.p-price-table--group th {
  width: calc(72 * var(--u));
  font-weight: 700;
}
@media (min-width: 1024px) {
  .p-price-table--group th {
    width: calc(180 * var(--u));
  }
}
.p-price-table--group td:last-child {
  width: 30%;
}
@media (min-width: 1024px) {
  .p-price-table--group td:last-child {
    width: 50%;
  }
}

/* ---------------------------------------------
   診察料
--------------------------------------------- */
@media (min-width: 1024px) {
  .p-price-fee {
    margin-top: calc(130 * var(--u));
  }
}
.p-price-fee__block {
  margin-top: calc(40 * var(--u));
}
@media (min-width: 1024px) {
  .p-price-fee__block {
    margin-top: calc(80 * var(--u));
  }
}
@media (min-width: 1024px) {
  .c-heading + .p-price-fee__block {
    margin-top: calc(60 * var(--u));
  }
}
.p-price-fee__title {
  margin-bottom: calc(12 * var(--u));
  font-size: calc(18 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(2.16 * var(--fu));
  line-height: 1.4;
  color: var(--color-title);
}
@media (min-width: 1024px) {
  .p-price-fee__title {
    margin-bottom: calc(20 * var(--u));
    font-size: calc(24 * var(--fu));
    letter-spacing: calc(2.88 * var(--fu));
  }
}

/* ---------------------------------------------
   症状別の料金目安
--------------------------------------------- */
@media (min-width: 1024px) {
  .p-price-guideline {
    margin-top: calc(190 * var(--u));
  }
}
.p-price-guideline__nav {
  /* セクション内なので左右の余白は親に任せる。最後の行は左詰め */
  padding-inline: 0;
}
@media (min-width: 1024px) {
  .p-price-guideline__nav {
    justify-content: flex-start;
  }
}
.c-heading + .p-price-guideline__nav {
  margin-top: calc(24 * var(--u));
}
@media (min-width: 1024px) {
  .c-heading + .p-price-guideline__nav {
    margin-top: calc(64 * var(--u));
  }
}
.p-price-guideline__block {
  margin-top: calc(40 * var(--u));
}
@media (min-width: 1024px) {
  .p-price-guideline__block {
    margin-top: calc(88 * var(--u));
  }
}
.p-price-guideline__title {
  display: flex;
  align-items: center;
  gap: calc(8 * var(--u));
  margin-bottom: calc(12 * var(--u));
  font-size: calc(17 * var(--fu));
  font-weight: 700;
  letter-spacing: calc(2.04 * var(--fu));
  line-height: 1.4;
  color: var(--color-title);
}
@media (min-width: 1024px) {
  .p-price-guideline__title {
    gap: calc(10 * var(--u));
    margin-bottom: calc(24 * var(--u));
    font-size: calc(24 * var(--fu));
    letter-spacing: calc(2.88 * var(--fu));
  }
}
.p-price-guideline__title::before {
  content: "";
  flex-shrink: 0;
  width: calc(18 * var(--fu));
  height: calc(18 * var(--fu));
  border-radius: 50%;
  background: #f0b981;
}
@media (min-width: 1024px) {
  .p-price-guideline__title::before {
    width: calc(24 * var(--fu));
    height: calc(24 * var(--fu));
  }
}
.p-price-guideline__note {
  margin-top: calc(12 * var(--u));
  font-size: calc(12 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.2 * var(--fu));
  line-height: 1.6;
  color: var(--color-text);
}
@media (min-width: 1024px) {
  .p-price-guideline__note {
    font-size: calc(14 * var(--fu));
    letter-spacing: calc(1.68 * var(--fu));
  }
}

/* ---------------------------------------------
   対応保険・お支払い方法
--------------------------------------------- */
@media (min-width: 1024px) {
  .p-price-payment {
    margin-top: calc(190 * var(--u));
  }
}
.p-price-payment__list {
  display: grid;
  gap: calc(24 * var(--u));
}
@media (min-width: 1024px) {
  .p-price-payment__list {
    width: calc(980 * var(--u));
    gap: calc(40 * var(--u));
    margin-inline: auto;
  }
}
.p-price-payment__box {
  position: relative;
  padding: calc(24 * var(--u)) calc(20 * var(--u));
  border: 2px solid var(--color-chip);
  border-radius: calc(16 * var(--u));
  background: var(--color-white);
}
@media (min-width: 1024px) {
  .p-price-payment__box {
    padding: calc(26 * var(--u)) calc(38 * var(--u)) calc(32 * var(--u));
    border-radius: calc(24 * var(--u));
  }
}
.p-price-payment__text {
  font-size: calc(13 * var(--fu));
  font-weight: 500;
  letter-spacing: calc(1.3 * var(--fu));
  line-height: calc(22 * var(--fu));
  color: var(--color-text);
}
@media (min-width: 1024px) {
  .p-price-payment__text {
    font-size: calc(14 * var(--fu));
    letter-spacing: calc(1.68 * var(--fu));
    line-height: calc(24 * var(--fu));
  }
}
.p-price-payment__text {
  margin-top: calc(16 * var(--u));
}
@media (min-width: 1024px) {
  .p-price-payment__text {
    margin-top: calc(24 * var(--u));
    font-size: calc(15 * var(--fu));
    letter-spacing: calc(1.8 * var(--fu));
  }
}
.p-price-payment__logos {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: calc(12 * var(--u)) calc(20 * var(--u));
  margin-top: calc(16 * var(--u));
}
@media (min-width: 1024px) {
  .p-price-payment__logos {
    gap: calc(32 * var(--u));
    margin-top: calc(20 * var(--u));
  }
}
.p-price-payment__logos img {
  width: auto;
  height: calc(44 * var(--u));
}
@media (min-width: 1024px) {
  .p-price-payment__logos img {
    height: calc(60 * var(--u));
  }
}
.p-price-payment__logos {
  /* カードのロゴは横長のVISAだけ低め */
}
@media (min-width: 1024px) {
  .p-price-payment__logos--card {
    gap: calc(24 * var(--u));
  }
}
.p-price-payment__logos--card li:nth-child(2) img {
  height: calc(36 * var(--u));
}
@media (min-width: 1024px) {
  .p-price-payment__logos--card li:nth-child(2) img {
    height: calc(49 * var(--u));
  }
}
.p-price-payment__logos--card li:nth-child(4) img {
  height: calc(50 * var(--u));
}
@media (min-width: 1024px) {
  .p-price-payment__logos--card li:nth-child(4) img {
    height: calc(69 * var(--u));
  }
}
.p-price-payment__deco {
  position: absolute;
  right: calc(-8 * var(--u));
  bottom: calc(-60 * var(--u));
  width: calc(54 * var(--u));
  pointer-events: none;
}
@media (min-width: 1024px) {
  .p-price-payment__deco {
    right: calc(-46 * var(--u));
    bottom: calc(-70 * var(--u));
    width: calc(90 * var(--u));
  }
}

/* PC/SP出し分け */
.u-pc {
  display: none;
}
@media (min-width: 1024px) {
  .u-pc {
    display: block;
  }
}

.u-sp {
  display: block;
}

/* 改行タグはブロックにすると空行になるため、インラインのまま出し分ける */
br.u-sp {
  display: inline;
}

@media (min-width: 1024px) {
  br.u-pc {
    display: inline;
  }
}

@media (min-width: 1024px) {
  .u-sp,
  br.u-sp {
    display: none;
  }
}

.u-fade {
  /* =============================================
     Utility: スクロールフェードイン
  ============================================= */
}
.u-fade__up {
  opacity: 0;
  transform: translateY(calc(24 * var(--u)));
  transition: opacity 0.8s ease, transform 0.8s ease;
}
@media (prefers-reduced-motion: reduce) {
  .u-fade__up {
    opacity: 1;
    transform: none;
    transition: none;
  }
}
.u-fade__up.is-visible {
  opacity: 1;
  transform: none;
}

/* =============================================
   Utility: イラストのさりげない動き
   - u-sway  : 動物。足元を軸に小さく左右に揺れる
   - u-float : 花・葉。ふわっと上下する
   既存の transform（回転・反転）と干渉しないよう、個別プロパティ（rotate / translate）で動かす
============================================= */
.u-sway {
  transform-origin: 50% 100%;
  animation: u-sway 4s ease-in-out infinite;
}
@media (prefers-reduced-motion: reduce) {
  .u-sway {
    animation: none;
  }
}

.u-float {
  animation: u-float 5s ease-in-out infinite;
}
@media (prefers-reduced-motion: reduce) {
  .u-float {
    animation: none;
  }
}

/* すべてが同じ周期で動かないよう、ずらす */
.u-sway:nth-of-type(2n),
.u-float:nth-of-type(2n) {
  animation-delay: -1.7s;
}

.u-float:nth-of-type(3n) {
  animation-duration: 6s;
}

@keyframes u-sway {
  0%, 100% {
    rotate: -2.5deg;
  }
  50% {
    rotate: 2.5deg;
  }
}
@keyframes u-float {
  0%, 100% {
    translate: 0 0;
  }
  50% {
    translate: 0 -6%;
  }
}/*# sourceMappingURL=app.css.map */