/*
Theme Name: ONEPET
Theme URI:  https://example.com/onepet
Author:     ONEPET
Description: ワンライフ（ONEPET）ペットトリミング事業のフランチャイズ対応カスタムテーマ。本部トップ・店舗トップ・店舗一覧・お知らせ・ブログのテンプレートを提供します。onepet-core プラグインと併用してください。
Version:    0.3.0
Text Domain: onepet
*/

/* ============================================================
 * デザイントークン（:root）
 *  Figma「ONEPETさま / PCデザイン」より抽出した確定値。
 *  brand #009fe6 / sky #eaf6fd / yellow #ffe17f・#f2ad38 / Zen Maru Gothic。
 * ============================================================ */
:root{
  /* ベース面・文字 */
  --bg:#ffffff;
  --ink:#3d3a37;          /* 本文（やや温かみのある濃グレー） */
  --ink-strong:#2b2926;   /* 見出し */
  --muted:#919191;        /* 補助テキスト（日付など） */

  /* ブランド（水色） */
  --brand:#009fe6;        /* メインの水色 */
  --brand-600:#008ccb;    /* ホバー */
  --brand-700:#0079b3;    /* 濃いめ */
  --sky:#eaf6fd;          /* 淡い水色背景（セクション/カード内アイコン等） */
  --sky-2:#eff7fc;        /* さらに淡い */
  --sky-line:#d5ebf8;     /* 淡い罫線 */

  /* アクセント（黄） */
  --yellow:#ffe17f;
  --yellow-deep:#f2ad38;

  /* 罫線・面 */
  --line:#e6eef3;
  --card:#ffffff;

  /* 効果 */
  --radius:14px;
  --radius-lg:20px;
  --radius-xl:28px;
  --radius-pill:999px;
  --shadow:0 14px 34px rgba(0,120,180,.12);
  --shadow-sm:0 6px 18px rgba(0,120,180,.09);

  /* レイアウト */
  --max:1120px;
  --gap:26px;

  /* タイポ */
  --font:"Zen Maru Gothic","Hiragino Maru Gothic ProN","Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif;
}

/* ===== リセット・基本 ===== */
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;color:var(--ink);background:var(--bg);
  font-family:var(--font);font-weight:500;
  line-height:1.9;font-size:16px;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none;transition:opacity .2s,color .2s}
a:hover{opacity:.85}
h1,h2,h3{line-height:1.5;color:var(--ink-strong);font-weight:700}

.container{max-width:var(--max);margin:0 auto;padding:0 24px}
.section{padding:80px 0;position:relative;overflow:hidden}
.section--sky{background:var(--sky)}

/* ===== 装飾（肉球・ドット・波） ===== */
.paw{position:absolute;color:var(--brand);opacity:.14;pointer-events:none;
  background:currentColor;-webkit-mask:url(assets/paw.svg) center/contain no-repeat;mask:url(assets/paw.svg) center/contain no-repeat}
/* 黄色のハーフトーン・ドット三角 */
.dots{position:absolute;width:190px;height:150px;pointer-events:none;opacity:.9;
  background-image:radial-gradient(var(--yellow-deep) 22%,transparent 24%);
  background-size:14px 14px;
  -webkit-mask:linear-gradient(215deg,#000 42%,transparent 42%);mask:linear-gradient(215deg,#000 42%,transparent 42%)}
/* 波形の区切り（白→水色 / 水色→白） */
.wave{display:block;width:100%;height:60px;line-height:0}
.wave svg{display:block;width:100%;height:100%}

/* ===== 見出し（セクションヘッダ：中央、JP大＋EN小） ===== */
.sec-head{text-align:center;margin-bottom:44px}
.sec-head__ja{font-size:clamp(1.7rem,3.6vw,2rem);letter-spacing:.14em;margin:0;color:var(--ink-strong)}
.sec-head__en{display:block;color:var(--brand);font-size:.82rem;font-weight:700;letter-spacing:.24em;margin-top:.5em;text-transform:uppercase}
/* 左寄せの縦書き見出し（お知らせ等） */
.sec-head--vert{writing-mode:vertical-rl;text-orientation:upright;display:inline-flex;align-items:flex-start;gap:14px;text-align:left;margin:0}
.sec-head--vert .sec-head__ja{letter-spacing:.18em}
.sec-head--vert .sec-head__en{writing-mode:vertical-rl;text-orientation:sideways;transform:rotate(180deg);margin:0}

/* ===== ボタン ===== */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.6em;
  padding:14px 30px;border-radius:var(--radius-pill);
  font-weight:700;color:#fff;background:var(--brand);border:2px solid var(--brand);
  box-shadow:var(--shadow-sm);transition:background .2s,box-shadow .2s,transform .05s;
}
.btn::before{content:"";width:1.15em;height:1.15em;background:#fff;
  -webkit-mask:url(assets/paw.svg) center/contain no-repeat;mask:url(assets/paw.svg) center/contain no-repeat}
.btn:hover{opacity:1;background:var(--brand-600);border-color:var(--brand-600)}
.btn:active{transform:translateY(1px)}
.btn--ghost{background:#fff;color:var(--brand);}
.btn--ghost::before{background:var(--brand)}
.btn--ghost:hover{background:var(--sky)}

/* ===== ヘッダー ===== */
.site-header{
  position:sticky;top:0;z-index:30;
  background:rgba(255,255,255,.94);backdrop-filter:saturate(1.2) blur(8px);
  border-bottom:1px solid var(--line);
}
.site-header .container{display:flex;align-items:center;justify-content:space-between;height:74px;gap:24px}
.site-logo{font-weight:900;letter-spacing:.02em;font-size:1.35rem;color:var(--brand)}
.site-nav ul{display:flex;gap:28px;list-style:none;margin:0;padding:0;align-items:center}
.site-nav a{font-size:.95rem;font-weight:700;color:var(--ink)}
.site-nav a:hover{color:var(--brand);opacity:1}
/* ハンバーガー（モバイルのみ表示） */
.nav-burger{display:none;width:44px;height:44px;cursor:pointer;flex-direction:column;justify-content:center;gap:6px;align-items:center}
.nav-burger span{display:block;width:26px;height:2.5px;background:var(--brand);border-radius:2px;transition:transform .25s,opacity .25s}

/* ===== ヒーロー（FV） ===== */
.hero{position:relative;background:var(--sky);padding:72px 0 40px}
.hero__inner{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center;position:relative;z-index:2}
.hero h1{font-size:clamp(1.8rem,3.8vw,2.5rem);line-height:1.7;margin:0 0 .6em;letter-spacing:.04em}
.hero h1 .mark{color:var(--brand)}
.hero p{color:var(--ink);max-width:560px}
.hero__actions{margin-top:30px;display:flex;gap:14px;flex-wrap:wrap}
.hero__media{position:relative}
.hero__media .blob{aspect-ratio:1/1;border-radius:46% 54% 52% 48%/52% 46% 54% 48%;overflow:hidden;background:var(--sky-2);box-shadow:var(--shadow)}
.hero__media .blob img{width:100%;height:100%;object-fit:cover}
.hero__media .blob--paw{display:flex;align-items:center;justify-content:center}
.hero__media .blob--paw::after{content:"";width:34%;height:34%;background:var(--brand);opacity:.4;
  -webkit-mask:url(assets/paw.svg) center/contain no-repeat;mask:url(assets/paw.svg) center/contain no-repeat}

/* ===== グリッド ===== */
.grid{display:grid;gap:var(--gap)}
.grid--3{grid-template-columns:repeat(3,1fr)}
.grid--2{grid-template-columns:repeat(2,1fr)}

/* ===== カード（共通・右下カット＋矢印） ===== */
.card{
  position:relative;background:var(--card);border-radius:var(--radius-lg);
  overflow:hidden;box-shadow:var(--shadow-sm);display:block;
  transition:transform .18s,box-shadow .18s;
}
a.card:hover{transform:translateY(-5px);box-shadow:var(--shadow);opacity:1}
/* 右下の水色カット三角＋白矢印（シグネチャ） */
.card--arrow::after{
  content:"";position:absolute;right:0;bottom:0;width:52px;height:52px;
  background:
    url(assets/arrow.svg) right 9px bottom 9px / 15px no-repeat,
    linear-gradient(135deg,transparent 50%,var(--brand) 50%);
}
.card__media{aspect-ratio:16/11;background:var(--sky);position:relative;overflow:hidden}
.card__media img{width:100%;height:100%;object-fit:cover}
.card__media--paw{display:flex;align-items:center;justify-content:center}
.card__media--paw::after{content:"";width:34%;height:34%;background:var(--brand);opacity:.3;
  -webkit-mask:url(assets/paw.svg) center/contain no-repeat;mask:url(assets/paw.svg) center/contain no-repeat}
.card__body{padding:22px 24px 26px}
.card__title{font-size:1.12rem;margin:.1em 0 .5em;color:var(--brand)}
.card__meta{color:var(--muted);font-size:.86rem;margin:0}
.card__meta--author{display:flex;align-items:center;gap:8px}
.card__meta-avatar{width:32px;height:32px;border-radius:50%;object-fit:cover}

/* ブログ（大きな写真＋文字オーバーレイ・横スクロールカルーセル） */
.blog-carousel{display:flex;gap:26px;overflow-x:auto;scroll-snap-type:x mandatory;padding:6px 2px 18px;
  scrollbar-width:thin;scrollbar-color:var(--brand) transparent}
.blog-carousel::-webkit-scrollbar{height:8px}
.blog-carousel::-webkit-scrollbar-thumb{background:var(--brand);border-radius:99px}
.blog-carousel::-webkit-scrollbar-track{background:var(--sky-line);border-radius:99px}
.blog-card2{position:relative;flex:0 0 clamp(280px,54%,540px);scroll-snap-align:center;
  border-radius:var(--radius-lg);overflow:hidden;aspect-ratio:3/2;background:var(--sky);box-shadow:var(--shadow-sm);
  display:block;transition:transform .18s,box-shadow .18s}
.blog-card2:hover{transform:translateY(-4px);box-shadow:var(--shadow);opacity:1}
.blog-card2 img,.blog-card2__ph{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.blog-card2__ph{display:flex;align-items:center;justify-content:center;background:var(--sky)}
.blog-card2__ph::after{content:"";width:26%;height:26%;background:var(--brand);opacity:.3;
  -webkit-mask:url(assets/paw.svg) center/contain no-repeat;mask:url(assets/paw.svg) center/contain no-repeat}
.blog-card2::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(20,30,40,.72) 0%,rgba(20,30,40,.28) 42%,transparent 68%)}
.blog-card2__body{position:absolute;left:0;right:0;bottom:0;z-index:1;padding:22px 24px;color:#fff;display:flex;flex-direction:column;gap:8px}
.blog-card2__meta{display:flex;align-items:center;gap:11px}
.blog-card2__avatar{width:40px;height:40px;border-radius:50%;border:2px solid #fff}
.blog-card2__by{display:flex;flex-direction:column;line-height:1.3;font-size:.8rem}
.blog-card2__date{opacity:.9}
.blog-card2__author{font-weight:700}
.blog-card2__title{color:#fff;font-size:1.2rem;font-weight:700;line-height:1.5;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.blog-card2__excerpt{font-size:.85rem;opacity:.92;line-height:1.7;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
@media(max-width:640px){.blog-card2{flex-basis:86%}}

/* サービスカード（アイコン付き・中央） */
.service-card{text-align:center;padding:38px 26px 40px}
.service-card .icon{
  width:74px;height:74px;margin:0 auto 18px;border-radius:var(--radius-pill);
  background:var(--sky);display:flex;align-items:center;justify-content:center;color:var(--brand);
}
.service-card .icon svg{width:38px;height:38px}
.service-card .card__title{margin-bottom:.6em}
.service-card .card__meta{line-height:1.7}
/* サービス一覧への誘導（塗りつぶし青カード） */
.card--cta{background:var(--brand);display:flex;align-items:center;justify-content:center;text-align:center;color:#fff;min-height:210px}
.card--cta .cta-label{display:inline-flex;align-items:center;gap:.6em;font-weight:700;font-size:1.1rem}
.card--cta .cta-label::before{content:"";width:1.2em;height:1.2em;background:#fff;
  -webkit-mask:url(assets/paw.svg) center/contain no-repeat;mask:url(assets/paw.svg) center/contain no-repeat}
.card--cta.card--arrow::after{background:
  url(assets/arrow.svg) right 9px bottom 9px / 15px no-repeat,
  linear-gradient(135deg,transparent 50%,#fff 50%)}
.card--cta.card--arrow::after{background-blend-mode:normal}

/* 店舗カード（アーチ型・青枠・写真＋店名バナー＋タグ） */
.store-grid{display:flex;flex-wrap:wrap;gap:26px;justify-content:center}
.store-arch{flex:0 1 262px;max-width:280px;border:2px solid var(--brand);border-radius:300px 300px 8px 8px;
  overflow:hidden;background:#fff;display:flex;flex-direction:column;box-shadow:var(--shadow-sm);
  transition:transform .18s,box-shadow .18s}
a.store-arch:hover{transform:translateY(-6px);box-shadow:var(--shadow);opacity:1}
.store-arch__photo{position:relative;height:300px;background:var(--sky);display:block}
.store-arch__photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.store-arch__photo .paw-ph{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}
.store-arch__photo .paw-ph::after{content:"";width:32%;height:32%;background:var(--brand);opacity:.3;
  -webkit-mask:url(assets/paw.svg) center/contain no-repeat;mask:url(assets/paw.svg) center/contain no-repeat}
.store-arch__name{background:var(--brand);color:#fff;text-align:center;font-weight:700;padding:11px 12px;font-size:1.06rem;letter-spacing:.04em}
.store-arch__body{padding:16px 18px 22px;text-align:center;display:flex;flex-direction:column;gap:14px;flex:1}
.store-arch__addr{color:var(--muted);font-size:.85rem;line-height:1.6}
.store-arch__tags{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:auto}
.store-arch__tags .tag{border:1px solid var(--sky-line);color:var(--brand);font-size:.72rem;font-weight:700;padding:4px 13px;border-radius:var(--radius-pill)}

/* ===== お知らせ（2カラム：縦見出し＋リスト＋写真） ===== */
.news-block{display:grid;grid-template-columns:auto 1fr auto;gap:36px;align-items:start}
.news-list{list-style:none;margin:0;padding:0}
.news-list li{display:grid;grid-template-columns:auto 1fr;gap:22px;align-items:baseline;
  padding:18px 0;border-bottom:1px solid var(--sky-line)}
.news-list li:first-child{padding-top:0}
.news-list .n-date{color:var(--muted);white-space:nowrap;font-size:.92rem;position:relative;padding-left:0}
.news-list .n-body{display:flex;gap:14px;align-items:baseline;flex-wrap:wrap;border-left:2px solid var(--brand);padding-left:20px}
.news-list .badge{background:var(--sky);color:var(--brand);font-size:.74rem;font-weight:700;padding:2px 12px;border-radius:var(--radius-pill);white-space:nowrap}
.news-list a{font-weight:700}
.news-list a:hover{color:var(--brand)}
.news-photo .blob{width:280px;height:300px;border-radius:44% 56% 50% 50%/54% 48% 52% 46%;overflow:hidden;
  position:relative;box-shadow:var(--shadow-sm)}
.news-photo .blob::before{content:"";position:absolute;inset:14px -14px -14px 14px;border-radius:inherit;background:var(--yellow);z-index:-1}
.news-photo .blob img{width:100%;height:100%;object-fit:cover}
.news-photo .blob--paw{display:flex;align-items:center;justify-content:center;background:var(--sky)}
.news-photo .blob--paw::after{content:"";width:34%;height:34%;background:var(--brand);opacity:.35;
  -webkit-mask:url(assets/paw.svg) center/contain no-repeat;mask:url(assets/paw.svg) center/contain no-repeat}

/* ===== 店舗情報（dl） ===== */
.store-info{display:grid;grid-template-columns:160px 1fr;gap:12px 24px;margin:26px 0;max-width:760px}
.store-info dt{font-weight:700;color:var(--brand)}
.store-info dd{margin:0;color:var(--ink)}

/* ===== 提供サービス・法定表示テーブル ===== */
.license-table{width:100%;border-collapse:separate;border-spacing:0;font-size:.92rem;background:#fff;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-sm);max-width:820px}
.license-table th,.license-table td{border-bottom:1px solid var(--line);padding:14px 16px;text-align:left;vertical-align:top}
.license-table tr:last-child th,.license-table tr:last-child td{border-bottom:0}
.license-table th{background:var(--sky);width:230px;white-space:nowrap;color:var(--brand)}

/* ===== 店舗情報（地図＋詳細） ===== */
.store-detail{display:grid;grid-template-columns:1fr 1fr;gap:36px;align-items:stretch}
.store-map,.store-map iframe,.store-map__placeholder{width:100%;height:100%;min-height:320px;border:0;border-radius:var(--radius-lg)}
.store-map{overflow:hidden;box-shadow:var(--shadow-sm);background:var(--sky)}
.store-map iframe{display:block}
.store-map__placeholder{background:var(--sky)}
.store-detail__info{display:flex;flex-direction:column;justify-content:center}
@media(max-width:860px){.store-detail{grid-template-columns:1fr}.store-map{min-height:260px}}

/* ===== Instagram ===== */
.insta-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.insta-grid a{aspect-ratio:1/1;border-radius:var(--radius);overflow:hidden;background:var(--sky);display:block}
.insta-grid img{width:100%;height:100%;object-fit:cover}
.insta-ph{display:flex;width:100%;height:100%;align-items:center;justify-content:center}
.insta-ph::after{content:"";width:36%;height:36%;background:var(--brand);opacity:.28;
  -webkit-mask:url(assets/paw.svg) center/contain no-repeat;mask:url(assets/paw.svg) center/contain no-repeat}
@media(max-width:640px){.insta-grid{grid-template-columns:repeat(2,1fr)}}

/* ===== ページタイトル ===== */
.page-head{padding:64px 0 56px;text-align:center;position:relative;overflow:hidden;background:var(--sky)}
.page-head .sec-head{margin-bottom:0}
/* PCはヘッダーがposition:absolute(高さ78px)で本文と重なるため、
   見出し上部が隠れないよう追加のクリアランスを確保する。 */
@media(min-width:901px){
  .page-head{padding-top:96px}
}
/* 下層ページのFV（タイトル＋リード文） */
.lower-fv{padding:72px 0 64px}
.lower-fv__lead{text-align:center;color:var(--ink);max-width:760px;margin:24px auto 0}

/* ===== サービス一覧（行カード） ===== */
.service-list{display:flex;flex-direction:column;gap:22px;max-width:900px;margin:0 auto}
.service-row{position:relative;display:grid;grid-template-columns:auto 1fr auto;gap:26px;align-items:center;
  background:#fff;border:1px solid var(--sky-line);border-radius:var(--radius-lg);padding:28px 32px;
  box-shadow:var(--shadow-sm);transition:transform .18s,box-shadow .18s}
a.service-row:hover{transform:translateY(-4px);box-shadow:var(--shadow);opacity:1}
.service-row__icon{width:70px;height:70px;border-radius:var(--radius-pill);background:var(--sky);
  display:flex;align-items:center;justify-content:center;color:var(--brand)}
.service-row__icon svg{width:36px;height:36px}
.service-row__body{display:flex;flex-direction:column;gap:6px;min-width:0}
.service-row__name{font-weight:700;color:var(--brand);font-size:1.2rem}
.service-row__lead{font-weight:700;color:var(--ink-strong)}
.service-row__desc{color:var(--muted);font-size:.9rem;line-height:1.7}
.service-row__more{color:var(--brand);font-weight:700;white-space:nowrap;font-size:.9rem;padding-right:36px}
@media(max-width:720px){
  .service-row{grid-template-columns:1fr;text-align:center;gap:14px;padding:28px 22px}
  .service-row__icon{margin:0 auto}
  .service-row__more{padding-right:0}
}

/* ===== 来店前のお願い（チェックリスト） ===== */
.notes-list{list-style:none;margin:28px auto 0;padding:0;max-width:640px}
.notes-list li{position:relative;padding:14px 14px 14px 44px;border-bottom:1px solid var(--sky-line);color:var(--ink)}
.notes-list li::before{content:"";position:absolute;left:8px;top:16px;width:22px;height:22px;
  background:var(--brand);-webkit-mask:url(assets/paw.svg) center/contain no-repeat;mask:url(assets/paw.svg) center/contain no-repeat}

/* ===== 本文（content） ===== */
.content{font-size:1rem}
.content > *{margin:0 0 1.3em}
.content img{border-radius:var(--radius)}
.content h2{font-size:1.4rem;margin:1.8em 0 .6em}
.content h3{font-size:1.15rem;margin:1.5em 0 .5em}

/* ===== ページネーション ===== */
.pagination{margin-top:44px;display:flex;justify-content:center}
.pagination .nav-links{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.pagination .page-numbers{min-width:44px;height:44px;padding:0 12px;display:inline-flex;align-items:center;justify-content:center;
  border:1px solid var(--sky-line);border-radius:var(--radius-pill);font-weight:700;color:var(--ink);background:#fff}
.pagination .page-numbers.current{background:var(--brand);border-color:var(--brand);color:#fff}
.pagination a.page-numbers:hover{border-color:var(--brand);color:var(--brand);opacity:1}

/* ===== フッター ===== */
.site-footer{position:relative;background:var(--brand);color:#fff;margin-top:64px}

/* 波形の区切り＋上部装飾 */
.footer-wave{position:relative;width:100%;height:150px;overflow:hidden}
.footer-wave__svg{position:absolute;inset:0;width:100%;height:100%;display:block}
.footer-dots{position:absolute;top:8px;left:26px;width:158px;height:92px;z-index:2;
  background-image:radial-gradient(var(--yellow-deep) 26%,transparent 28%);background-size:13px 13px;opacity:.9;
  -webkit-mask:linear-gradient(118deg,#000 36%,transparent 62%);mask:linear-gradient(118deg,#000 36%,transparent 62%)}
.footer-paw{position:absolute;top:22px;right:64px;width:32px;height:32px;z-index:2;color:#b9e2f7;
  background:currentColor;-webkit-mask:url(assets/paw.svg) center/contain no-repeat;mask:url(assets/paw.svg) center/contain no-repeat}
.footer-dog{position:absolute;left:20%;top:40px;width:80px;height:auto;z-index:3}
.footer-bowl{position:absolute;left:calc(20% - 46px);top:74px;width:42px;height:auto;z-index:3}

/* 白カード帯 */
.footer-inner{position:relative;padding:4px 0 48px}
.footer-card{position:relative;background:#fff;color:var(--ink);border-radius:26px;padding:42px 46px;
  box-shadow:0 20px 44px rgba(0,90,140,.16);display:grid;grid-template-columns:1.5fr 1fr 1.25fr auto;gap:30px;align-items:start}

/* 猫（カード右上の縁に座る） */
.footer-cat{position:absolute;right:38px;top:-62px;width:94px;height:auto;z-index:1;pointer-events:none}

/* ブランド */
.footer-logo{display:inline-flex;flex-direction:column;align-items:center;gap:7px}
.footer-logo:hover{opacity:1}
.footer-logo__paw{width:52px;height:auto}
.footer-logo__text{font-weight:900;letter-spacing:.14em;font-size:1.5rem;color:var(--ink-strong)}
.footer-tagline{margin:16px 0 0;font-size:.92rem;line-height:1.9;color:var(--ink);font-weight:700}
.footer-tagline b{color:var(--brand);font-weight:900}

/* メインナビ */
.footer-nav ul,.footer-services ul{list-style:none;margin:0;padding:0}
.footer-nav li{margin:0 0 15px}
.footer-nav a{display:inline-flex;align-items:center;gap:9px;color:var(--ink);font-weight:700;font-size:.98rem}
.footer-nav a:hover{color:var(--brand);opacity:1}
.footer-nav a svg{width:19px;height:19px;color:var(--brand);flex:none}

/* サービス */
.footer-heading{display:inline-flex;align-items:center;gap:9px;margin:0 0 15px;font-weight:700;font-size:.98rem;color:var(--ink)}
.footer-heading svg{width:19px;height:19px;color:var(--brand);flex:none}
.footer-services li{margin:0 0 11px}
.footer-services a{color:var(--ink);font-size:.9rem;font-weight:500}
.footer-services a::before{content:"・";color:var(--brand)}
.footer-services a:hover{color:var(--brand);opacity:1}

/* SNS */
.footer-sns{display:flex;flex-direction:column;gap:13px;padding-left:30px;border-left:1px solid var(--line);align-self:stretch;justify-content:center}
.footer-sns__btn{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:11px;
  background:var(--brand);color:#fff;transition:background .2s,transform .06s}
.footer-sns__btn:hover{background:var(--brand-600);color:#fff;opacity:1;transform:translateY(-2px)}
.footer-sns__btn svg{width:20px;height:20px}

/* コピーライト */
.footer-copyright{margin:0;padding:0 0 22px;text-align:center;color:#eaf6fd;font-size:.8rem;letter-spacing:.06em}

/* ===== レスポンシブ ===== */
@media(max-width:860px){
  .grid--3,.grid--2{grid-template-columns:1fr}
  .nav-burger{display:flex}
  .site-nav{position:fixed;inset:74px 0 auto 0;background:#fff;border-bottom:1px solid var(--line);
    box-shadow:var(--shadow);max-height:0;overflow:hidden;transition:max-height .3s ease;z-index:29}
  .nav-toggle:checked ~ .site-nav{max-height:70vh}
  .site-nav ul{flex-direction:column;gap:0;padding:8px 0}
  .site-nav li{width:100%}
  .site-nav a{display:block;padding:15px 24px;border-bottom:1px solid var(--line)}
  .nav-toggle:checked ~ .nav-burger span:nth-child(1){transform:translateY(8.5px) rotate(45deg)}
  .nav-toggle:checked ~ .nav-burger span:nth-child(2){opacity:0}
  .nav-toggle:checked ~ .nav-burger span:nth-child(3){transform:translateY(-8.5px) rotate(-45deg)}
  .footer-card{grid-template-columns:1fr 1fr;gap:26px 30px;padding:36px 28px}
  .footer-brand{grid-column:1 / -1}
  .footer-sns{grid-column:1 / -1;flex-direction:row;border-left:0;border-top:1px solid var(--line);padding:18px 0 0;justify-content:center}
  .footer-cat{width:78px;right:20px;top:-52px}
  .footer-dog{width:64px;left:14%}
  .footer-bowl{left:calc(14% - 38px);width:36px}
  .store-info{grid-template-columns:1fr;gap:2px 0}
  .store-info dt{margin-top:10px}
  .section{padding:56px 0}
  .hero{padding:44px 0 20px}
  .hero__inner{grid-template-columns:1fr;gap:28px}
  .hero__media{max-width:360px;margin:0 auto}
  .news-block{grid-template-columns:1fr}
  .news-photo{display:none}
  .insta-grid{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:520px){
  .footer-wave{height:112px}
  .footer-card{grid-template-columns:1fr;padding:32px 22px}
  .footer-logo{align-items:flex-start}
  .footer-dog{width:56px}
  .footer-bowl{left:calc(14% - 32px);width:30px}
  .footer-cat{width:66px;right:14px;top:-44px}
}

/* ============================================================
 * Figma faithful implementation
 * ============================================================ */
:root{
  --blue:#009fe6;
  --sky:#eff7fc;
  --home-hero-sky:#c0dcf3;
  --ink:#594f4c;
  --yellow:#ffe17f;
  --frame:1440px;
  --deco-wave-white-top:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201440%20180'%20preserveAspectRatio='none'%3E%3Cpath%20d='M0%200H1440V92C1320%2062%201240%20134%201102%20118C968%20105%20906%2042%20760%2058C604%2075%20540%20142%20386%20128C228%20113%20148%2054%200%2090V0Z'%20fill='%23fff'/%3E%3C/svg%3E");
  --deco-wave-white-top-alt:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201440%20180'%20preserveAspectRatio='none'%3E%3Cpath%20d='M0%200H1440V64C1286%20116%201208%2094%201086%2070C936%2040%20836%20122%20700%20112C562%20102%20496%2052%20342%2072C198%2090%20112%20144%200%20112V0Z'%20fill='%23fff'/%3E%3C/svg%3E");
  --deco-wave-white-bottom:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201440%20180'%20preserveAspectRatio='none'%3E%3Cpath%20d='M0%20180H1440V78C1306%20126%201196%2058%201054%2076C920%2094%20862%20146%20704%20126C558%20108%20486%2042%20334%2072C190%20100%20112%2072%200%20118V180Z'%20fill='%23fff'/%3E%3C/svg%3E");
  --deco-wave-white-bottom-alt:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201440%20180'%20preserveAspectRatio='none'%3E%3Cpath%20d='M0%20180H1440V104C1310%2058%201216%20128%201066%20116C916%20104%20846%2042%20694%2064C540%2086%20478%20142%20322%20124C184%20108%2096%2044%200%2082V180Z'%20fill='%23fff'/%3E%3C/svg%3E");
  --deco-wave-sky-bottom:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201440%20180'%20preserveAspectRatio='none'%3E%3Cpath%20d='M0%20180H1440V88C1318%2042%201218%20112%201084%20104C940%2096%20846%2038%20714%2060C548%2088%20488%20142%20320%20118C170%2096%2092%2046%200%2090V180Z'%20fill='%23eaf6fd'/%3E%3C/svg%3E");
  --deco-wave-sky-bottom-alt:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201440%20180'%20preserveAspectRatio='none'%3E%3Cpath%20d='M0%20180H1440V112C1304%20146%201238%2052%201088%2076C924%20104%20858%20140%20704%20118C548%2096%20476%2034%20342%2062C210%2090%20108%20132%200%20102V180Z'%20fill='%23eaf6fd'/%3E%3C/svg%3E");
  --deco-wave-sky-top:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201440%20180'%20preserveAspectRatio='none'%3E%3Cpath%20d='M0%200H1440V92C1320%2062%201240%20134%201102%20118C968%20105%20906%2042%20760%2058C604%2075%20540%20142%20386%20128C228%20113%20148%2054%200%2090V0Z'%20fill='%23eff7fc'/%3E%3C/svg%3E");
  /* Figma「コピー」グループ(Vector3+Vector4)を実パスから抽出：ガーゼ2枚を少しずらして重ねたような不規則な波 */
  --deco-hero-gauze-a:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20597.775%20170'%20preserveAspectRatio='none'%20overflow='hidden'%3E%3Cpath%20d='M597.286%20236.507C606.857%20106.851%20473.655%2045.2412%20405.858%2030.6431C348.696%2013.1681%20208.582%20-15.3886%20105.423%2010.1846C-23.5242%2042.1511%202.06593%20327.292%202.06593%20337.522L2.06593%200L597.775%200Z'%20fill='%23eff7fc'/%3E%3C/svg%3E");
  --deco-hero-gauze-b:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20587.569%20170'%20preserveAspectRatio='none'%20overflow='hidden'%3E%3Cpath%20d='M587.035%20273.854C596.626%20148.651%20474.649%2043.6874%20406.709%2029.5907C349.427%2012.7159%20209.019%20-14.8601%20105.645%209.83479C-23.5735%2040.7034%202.07026%20316.052%202.07026%20325.93L2.07026%200L587.569%200Z'%20fill='%23ffffff'%20fill-opacity='.6'/%3E%3C/svg%3E");
  /* HERO文字の背景に敷く、Vector3/Vector4の完全形（テキストブロック全体を覆う不規則なガーゼ状の淡いマス） */
  --deco-hero-gauze-full-a:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20597.775%20506.441'%20preserveAspectRatio='none'%3E%3Cpath%20d='M597.286%20236.507C606.857%20106.851%20473.655%2045.2412%20405.858%2030.6431C348.696%2013.1681%20208.582%20-15.3886%20105.423%2010.1846C-23.5242%2042.1511%202.06593%20327.292%202.06593%20337.522C2.06593%20347.751%2076.5099%20452.601%20126.693%20459.953C176.876%20467.306%20267.937%20521.329%20378.606%20502.469C489.275%20483.608%20585.321%20398.578%20597.286%20236.507Z'%20fill='%23eff7fc'/%3E%3C/svg%3E");
  --deco-hero-gauze-full-b:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20587.569%20495.654'%20preserveAspectRatio='none'%3E%3Cpath%20d='M587.035%20273.854C596.626%20148.651%20474.649%2043.6874%20406.709%2029.5907C349.427%2012.7159%20209.019%20-14.8601%20105.645%209.83479C-23.5735%2040.7034%202.07026%20316.052%202.07026%20325.93C2.07026%20335.808%2025.5041%20396.272%2069.6772%20420.342C109.59%20442.09%20274.61%20524.435%20379.4%20485.212C489.085%20444.157%20575.045%20430.358%20587.035%20273.854Z'%20fill='%23ffffff'%20fill-opacity='.6'/%3E%3C/svg%3E");
}
body{color:var(--ink);font-family:var(--font);font-weight:700;background:#fff}
.site-main{overflow:hidden}
.site-header{
  position:absolute;top:0;left:0;right:0;z-index:50;height:78px;margin:0;padding:0 44px 0 180px;
  display:flex;align-items:center;justify-content:flex-end;gap:40px;background:var(--blue);
  border:0;backdrop-filter:none;box-shadow:none;
}
.site-logo{
  position:absolute;left:0;top:0;width:170px;height:144px;border-radius:0 0 30px 0;background:#fff;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;color:var(--blue);
  box-shadow:0 0 5px rgba(0,0,0,.25);font-size:30px;font-weight:700;letter-spacing:0;z-index:2;
}
.site-logo img{width:100px;height:100px;object-fit:contain;margin-top:0}
.site-logo span{display:block;margin-top:0;line-height:24px}
.site-nav ul{display:flex;align-items:center;gap:28px;margin:0;padding:0;list-style:none}
.site-nav a{display:block;color:#fff;font-size:16px;font-weight:700;line-height:24px;letter-spacing:0;white-space:nowrap}
.site-nav a:hover{color:#fff;opacity:.85}
.site-contact{
  min-width:152px;height:36px;border-radius:999px;background:#f2ad38;color:#fff;
  display:inline-flex;align-items:center;justify-content:center;gap:6px;font-size:14px;font-weight:700;line-height:24px;
  flex-shrink:0;white-space:nowrap;
}
.site-contact::before{content:"";width:15px;height:15px;background:#fff;clip-path:polygon(0 44%,100% 0,66% 100%,43% 62%,20% 82%)}
.site-phone::before{content:"";width:14px;height:14px;background:#fff;-webkit-mask:url(assets/paw.svg) center/contain no-repeat;mask:url(assets/paw.svg) center/contain no-repeat}
.site-phone{display:inline-flex;align-items:center;gap:8px;color:#fff;font-size:24px;font-weight:700;line-height:24px}
.nav-burger{display:none}
.nav-drawer-foot{display:none} /* mobile drawer extras: hidden on desktop, shown in mobile @media */
body.single-store .site-nav{margin-right:auto}
/* PC最小幅寄り（901〜1180px）ではロゴ分の左パディング180pxが効いてナビ〜ボタンが詰まりやすいため、
   余白とギャップを縮めてラベルが画面端やボタンに隠れないようにする。 */
@media(min-width:901px) and (max-width:1180px){
  .site-header{padding-right:24px;gap:20px}
  .site-nav ul{gap:16px}
  .site-nav a{font-size:15px}
}

.page-wrap{position:relative;overflow:hidden;background:#fff;color:var(--ink)}
.page-wrap a:hover{opacity:.9}
.page-wrap h1,.page-wrap h2,.page-wrap h3,.page-wrap p{margin:0;color:var(--ink)}
.deco-paw{position:absolute;display:block;z-index:1;background:#c0dcf3;-webkit-mask:url(assets/figma/paw.svg) center/contain no-repeat;mask:url(assets/figma/paw.svg) center/contain no-repeat;pointer-events:none}
.footer-wave-paw{display:none} /* 既定は非表示。PCは従来のinsta肉球で表現、SP店舗のみ下記@mediaでフッター波に表示 */
.deco-dots{position:absolute;display:block;width:260px;height:260px;opacity:1;pointer-events:none;z-index:1;background-image:radial-gradient(var(--yellow) 16%,transparent 19%);background-size:14px 14px;transform:rotate(-29deg)}
/* Figma dot-grid pairs: big square (frame≈340/353) + small companion (≈130/114), rotated square clipped by section overflow */
.dg-big{width:250px;height:250px}
.dg-sm{width:95px;height:95px}
.front .about,.front .services,.front .news,.front .blog,.front .stores{overflow:visible}
.dg-about-big{left:calc(50% - 720px + 1167px);top:-145px}
.dg-about-sm{left:calc(50% - 720px + 1348px);top:132px}
.dg-svctl-big{width:260px;height:260px;left:calc(50% - 720px - 77px);top:33px}
.dg-svctl-sm{width:84px;height:84px;left:calc(50% - 720px + 181px);top:-9px}
.dg-svcnews-big{left:calc(50% - 720px + 1171px);top:-40px;z-index:0}
.dg-svcnews-sm{left:calc(50% - 720px + 1352px);top:95px}
/* PC Figma 1:2949: keep the two service -> news dot grids as separate,
   non-overlapping rotated squares behind the news content. */
@media(min-width:901px){
  .front .dg-svcnews-big{
    left:calc(50% - 720px + 1344.044479px);
    top:-227.023438px;
    width:250px;
    height:250px;
    z-index:0;
    background-image:radial-gradient(circle,#ffe17f 0 3.403417px,transparent 3.503417px);
    background-position:-4.096583px -4.096583px;
    background-size:15px 15px;
    transform:matrix(.48918882,.87217796,-.87217796,.48918882,0,0);
    transform-origin:0 0;
  }
  .front .dg-svcnews-sm{
    left:calc(50% - 720px + 1465.266754px);
    top:115.584534px;
    width:100px;
    height:100px;
    z-index:0;
    background-image:radial-gradient(circle,#ffe17f 0 3.256668px,transparent 3.356668px);
    background-position:-4.243332px -4.243332px;
    background-size:15px 15px;
    transform:matrix(-.37607962,.9265874,-.9265874,-.37607962,0,0);
    transform-origin:0 0;
  }
}
.dg-blogtl-big{width:260px;height:260px;left:calc(50% - 720px - 71px);top:-76px}
.dg-blogtl-sm{width:84px;height:84px;left:calc(50% - 720px + 187px);top:-135px}
.dg-blogstores-big{left:calc(50% - 720px + 1171px);top:-125px}
.dg-blogstores-sm{left:calc(50% - 720px + 1352px);top:152px}
.dg-storesbl-big{display:none} /* superseded by .footer-dots--big rendered inside the footer itself (crosses into the footer, needs the wave clip) */
.dg-storesbl-sm{width:84px;height:84px;left:calc(50% - 720px + 185px);top:auto;bottom:48px}
.dg-hero-tiny{width:26px;height:26px;left:92px;top:44px}
/* store page dot-grid pairs */
.store .store-about,.store .services,.store .news,.store .blog,.store .instagram{overflow:visible}
.dg-s-about-big{left:calc(50% - 720px + 1167px);top:-145px}
.dg-s-about-sm{left:calc(50% - 720px + 1348px);top:132px}
.dg-s-svctl-big{width:260px;height:260px;left:calc(50% - 720px - 77px);top:33px}
.dg-s-svctl-sm{width:84px;height:84px;left:calc(50% - 720px + 181px);top:-9px}
.dg-s-svcnews-big{display:none} /* Figma: fully covered by service bg (dot-right sits before service in paint order) */
.dg-s-svcnews-sm{left:calc(50% - 720px + 1352px);top:-65px}
.dg-s-blogtl-big{width:260px;height:260px;left:calc(50% - 720px - 71px);top:-76px}
.dg-s-blogtl-sm{width:84px;height:84px;left:calc(50% - 720px + 187px);top:-135px}
.dg-s-blogins-big{left:calc(50% - 720px + 1171px);top:-285px}
.dg-s-blogins-sm{left:calc(50% - 720px + 1352px);top:-8px}
.dg-s-instabl-big{display:none} /* superseded by .footer-dots--big rendered inside the footer itself (crosses into the footer, needs the wave clip) */
.dg-s-instabl-sm{width:84px;height:84px;left:calc(50% - 720px + 187px);top:1210px}
/* service index page dot-grid pairs */
.service-index .service-index__body{overflow:visible}
.dg-si-hero-big{left:calc(50% - 720px + 1160px);top:-188px}
.dg-si-hero-sm{left:calc(50% - 720px + 1341px);top:89px}
/* service detail page dot-grid pairs */
.service-detail .detail-intro,.service-detail .detail-features,.service-detail .detail-stores,.service-detail .price,.service-detail .notes{overflow:visible}
.dg-d-hero-big{left:calc(50% - 720px + 1160px);top:-188px}
.dg-d-hero-sm{left:calc(50% - 720px + 1341px);top:89px}
.dg-d-ftl-big{width:260px;height:260px;left:calc(50% - 720px - 77px);top:50px}
.dg-d-ftl-sm{width:84px;height:84px;left:calc(50% - 720px + 181px);top:-9px}
.dg-d-fsbr-big{display:none} /* Figma: covered by features bg (dot-right sits before features in paint order) */
.dg-d-fsbr-sm{left:calc(50% - 720px + 1346px);top:7px}
.dg-d-spbl-big{width:260px;height:260px;left:calc(50% - 720px - 77px);top:50px}
.dg-d-spbl-sm{width:84px;height:84px;left:calc(50% - 720px + 181px);top:-9px}
.dg-d-pnbr-big{left:calc(50% - 720px + 1214px);top:-82px}
.dg-d-pnbr-sm{left:calc(50% - 720px + 1395px);top:144px}
.deco-wave{position:absolute;left:0;right:0;height:180px;pointer-events:none;z-index:1;background-repeat:no-repeat;background-size:100% 100%}
.deco-wave--top{top:-1px;background-image:var(--deco-wave-white-top);background-position:center top}
.deco-wave--bottom{bottom:-1px;background-image:var(--deco-wave-sky-bottom);background-position:center bottom}
section.blog .deco-wave--top,.price .deco-wave--top{background-image:var(--deco-wave-white-top-alt)}
.detail-features .deco-wave--top{background-image:var(--deco-wave-white-top)}
.news .deco-wave--bottom,.notes .deco-wave--bottom{background-image:var(--deco-wave-sky-bottom-alt)}
.detail-stores .deco-wave--bottom,.instagram .deco-wave--bottom{background-image:var(--deco-wave-sky-bottom)}
/* sky sections transition to WHITE below → bottom wave must be white-colored */
.services .deco-wave--bottom,section.blog .deco-wave--bottom,.detail-features .deco-wave--bottom,.price .deco-wave--bottom{background-image:var(--deco-wave-white-bottom)}
.section-title{position:absolute;left:0;right:0;text-align:center;z-index:2}
.section-title h2{font-size:40px;font-weight:700;line-height:56px;letter-spacing:.2em}
.section-title p{margin-top:0;color:var(--blue);font-size:24px;font-weight:700;line-height:56px;letter-spacing:.1em}
.cta-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;min-width:174px;min-height:48px;padding:10px 30px;border-radius:999px;
  background:var(--blue);color:#fff;font-size:18px;font-weight:500;line-height:26px;box-shadow:none;border:0;
  box-sizing:border-box;
}
.cta-btn::before{content:"";width:16px;height:16px;background:#fff;-webkit-mask:url(assets/paw.svg) center/contain no-repeat;mask:url(assets/paw.svg) center/contain no-repeat}
.cta-btn--white{background:#fff;color:var(--blue)}
.cta-btn--white::before{background:var(--blue)}
.svg-icon{display:inline-block;flex:none;vertical-align:middle}
img.svg-icon{object-fit:contain}
.svg-icon--scissors{width:67.164px;height:67.282px}
.svg-icon--house{width:67px;height:58.764px}
.svg-icon--cup{width:67px;height:46px}
.svg-icon--heart{width:67px;height:74px}
.svg-icon--handshake{width:90px;height:56px}
.svg-icon--paw{
  width:18px;height:16px;background:currentColor;
  -webkit-mask:url(assets/figma/paw.svg) center/contain no-repeat;
  mask:url(assets/figma/paw.svg) center/contain no-repeat;
}
.title-line{display:flex;align-items:center;gap:12px;color:var(--blue)}
.title-line i{display:block;width:120px;border-top:2px solid var(--blue)}
.title-line b{font-size:20px;font-weight:700;line-height:30px;letter-spacing:.16em}

.home-hero{position:relative;height:852px;background-color:var(--sky);background-image:url(assets/hero.jpg);background-repeat:no-repeat;background-size:auto 826px;background-position:right -314px top 3px}
.home-hero::before{content:"";position:absolute;inset:0;background:url(assets/figma/hero-copy-panel.svg) center top/100% 100% no-repeat;z-index:0}
.home-hero::after{content:"";position:absolute;inset:0;background:url(assets/figma/hero-wave-bottom.svg) center top/100% 100% no-repeat;z-index:1}
.home-hero__photo{display:none}
.home-hero__copy{position:absolute;z-index:2;left:clamp(100px,10vw,144px);top:185px;width:640px}
.home-hero__copy::after{content:"";position:absolute;left:409px;top:59px;width:48px;height:48px;background:url(assets/figma/hero-accent-lines.svg) center/contain no-repeat;pointer-events:none}
.home-hero__copy h1{font-size:60px;font-weight:700;line-height:91px;letter-spacing:.16em;-webkit-text-stroke:10px #fff;paint-order:stroke fill}
.home-hero__copy h1 span{color:var(--blue)}
.home-hero__copy .title-line{width:436px;margin:42px 0 34px 7px}
.home-hero__copy .title-line i{flex:1;width:auto;border-top:2px dotted var(--blue)}
.home-hero__copy .title-line b{width:21px;height:18px;background:var(--blue);font-size:0;line-height:0;-webkit-mask:url(assets/paw.svg) center/contain no-repeat;mask:url(assets/paw.svg) center/contain no-repeat;flex:none}
.home-hero__copy p{font-size:18px;font-weight:700;line-height:32px;letter-spacing:normal}
.actions{display:flex;align-items:center;gap:30px}
.home-hero__copy .actions{margin-top:36px}
.hero-paw{background:#fff;opacity:.86;z-index:2}
.hero-paw--left{left:-8px;top:555px;width:48px;height:48px}
.hero-paw--upper{left:61px;top:471px;width:48px;height:48px}
.hero-paw--lower{left:-14px;top:727px;width:48px;height:48px}
.hero-paw--bottom{left:84px;top:641px;width:48px;height:48px;bottom:auto}
.hero-paw--five{left:132px;top:753px;width:48px;height:48px}
.hero-dots{right:-18px;bottom:56px;width:350px;height:350px;opacity:.86;z-index:2}

.about{position:relative;height:610px;background:#fff}
.about__image{position:absolute;left:calc(50% - 720px + 136px);top:150px;width:409.225px;height:310.528px}
.about__image::before{content:"";position:absolute;left:-14px;top:34px;width:409.225px;height:310.528px;background:url(assets/figma/about-photo-yellow.svg) center/100% 100% no-repeat;z-index:0}
.about__image img{position:relative;z-index:1;width:597.89px;height:399.39px;max-width:none;object-fit:fill;margin:-53px 0 0 -45.115px;display:block;-webkit-mask-image:url(assets/figma/about-photo-mask.svg);mask-image:url(assets/figma/about-photo-mask.svg);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:409.225px 310.528px;mask-size:409.225px 310.528px;-webkit-mask-position:45.115px 53px;mask-position:45.115px 53px}
.about__text{position:absolute;left:calc(50% - 720px + 595px);top:149px;width:500px}
.about__text p{font-size:16px;font-weight:500;line-height:40px}
.about__text .cta-btn{margin-top:42px}
.vertical-title{position:absolute;display:flex;align-items:flex-start;gap:24px;z-index:2}
.vertical-title span{display:block;writing-mode:vertical-rl;color:var(--blue);font-size:24px;font-weight:700;line-height:1;letter-spacing:.1em;text-orientation:mixed}
.vertical-title b{display:block;writing-mode:vertical-rl;text-orientation:upright;font-size:40px;font-weight:700;line-height:1.4;letter-spacing:.05em}
.vertical-title--about{left:calc(50% - 720px + 1136px);top:124px}
.about-dots--left{left:-74px;bottom:-108px}
.about-dots--right{right:-42px;top:148px}

.services{position:relative;height:1336px;background:var(--sky)}
.services .section-title{top:260px}
.service-grid{position:absolute;z-index:2;top:422px;left:calc(50% - 720px + 150px);width:1140px;display:grid;grid-template-columns:repeat(3,360px);gap:30px}
.service-item{position:relative;height:325px;border:2px solid var(--blue);border-radius:30px;background:#fff;padding:174px 30px 24px;text-align:center;overflow:hidden}
.service-item:hover{opacity:.85}
.service-item:nth-child(n+4){height:300px}
.service-item::after,.service-list-card::after{content:"";position:absolute;right:0;bottom:0;width:84px;height:75px;background:linear-gradient(135deg,transparent 50%,var(--blue) 50%)}
.service-item::before,.service-list-card::before{content:"";position:absolute;right:20px;bottom:17px;width:19px;height:16px;background:#fff;-webkit-mask:url(assets/arrow.svg) center/contain no-repeat;mask:url(assets/arrow.svg) center/contain no-repeat;z-index:2}
.service-item__icon{position:absolute;left:50%;top:30px;transform:translateX(-50%);width:130px;height:130px;border-radius:50%;background:#eaf6fd;display:flex;align-items:center;justify-content:center;color:var(--blue)}
.service-item__icon img{display:block;max-width:none}
.service-item strong{display:block;color:var(--blue);font-size:24px;font-weight:700;line-height:32px}
.service-item small{display:block;margin-top:15px;color:#1b1b1b;font-size:16px;font-weight:400;line-height:24px}
.service-item--cta{background:var(--blue);display:flex;align-items:center;justify-content:center;padding:0;color:#fff}
.service-item--cta span{display:inline-flex;align-items:center;gap:8px;color:#fff;font-size:18px;font-weight:500}
.service-item--cta::after{background:linear-gradient(135deg,transparent 50%,#fff 50%)}
.service-item--cta::before{background:var(--blue)}
.service-paw--one{left:calc(50% - 720px + 1008px);top:382px;width:36px;height:36px}
.service-paw--two{left:calc(50% - 720px + 1116px);top:472px;width:36px;height:36px}

.news{position:relative;height:734px;background:#fff}
.news .deco-wave--bottom{background:var(--deco-wave-sky-bottom) center bottom/100% 100% no-repeat}
.vertical-title--news{left:calc(50% - 720px + 136px);top:170px}
.news-feed{position:absolute;left:calc(50% - 720px + 317px);top:160px;width:550px;margin:0;padding:0;list-style:none}
.news-feed li{position:relative;display:grid;grid-template-columns:110px 1fr;gap:34px;margin:0 0 50px}
.news-feed li::after{content:"";position:absolute;left:128px;top:-6px;width:2px;height:44px;background:var(--blue)}
.news-feed time,.news-feed a{font-size:20px;font-weight:700;line-height:24px;color:var(--ink)}
.news__btn{position:absolute;left:calc(50% - 720px + 317px);top:482px}
.news__image{position:absolute;left:calc(50% - 720px + 915px);top:163px;width:388px;height:411px}
.news__image::before{content:"";position:absolute;left:-22px;top:-12px;width:411px;height:434px;background:url(assets/figma/news-photo-yellow.svg) center/100% 100% no-repeat;z-index:0}
.news__image img{position:relative;z-index:1;width:1016px;height:727px;max-width:none;object-fit:fill;margin:-130px 0 0 -255px;display:block;-webkit-mask-image:url(assets/figma/news-photo-mask.svg);mask-image:url(assets/figma/news-photo-mask.svg);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:388px 411px;mask-size:388px 411px;-webkit-mask-position:255px 130px;mask-position:255px 130px}
.news--store .news__image img{width:843px;height:604px;margin:-108px 0 0 -212px;-webkit-mask-position:212px 108px;mask-position:212px 108px}
.news-dots{left:-86px;top:70px}

section.blog{position:relative;height:1260px;background:var(--sky)}
section.blog .section-title{top:260px}
.blog-viewport{position:absolute;left:0;right:0;top:422px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.blog-viewport::-webkit-scrollbar{display:none}
.blog-track{width:100%;min-width:-webkit-min-content;min-width:min-content;display:flex;gap:40px;justify-content:center}
.blog-card{position:relative;width:600px;height:429px;flex:none;border-radius:10px;overflow:hidden;background:center/cover no-repeat;color:#fff;padding:192px 50px 30px;scroll-snap-align:center}
.blog-card::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.72),rgba(0,0,0,.26) 58%,transparent);z-index:0}
.blog-card>*{position:relative;z-index:1;color:#fff}
.blog-card--paw{background-color:var(--sky)}
.blog-card--paw::before{content:"";position:absolute;inset:0;margin:auto;width:120px;height:120px;background:var(--brand);opacity:.35;-webkit-mask:url(assets/figma/paw.svg) center/contain no-repeat;mask:url(assets/figma/paw.svg) center/contain no-repeat;z-index:0}
.blog-card__meta{display:flex;align-items:center;gap:16px;margin-bottom:38px}
.blog-card__meta img{width:55px;height:55px;border-radius:50%;object-fit:cover;background:rgba(255,255,255,.45);border:1px solid rgba(255,255,255,.5);box-shadow:0 0 0 1px rgba(0,0,0,.06)}
.blog-card__meta span{display:flex;flex-direction:column}
.blog-card__meta time{font-size:12px;font-weight:700;line-height:24px}
.blog-card__meta b{font-size:12px;font-weight:500;line-height:18px}
.blog-card strong{display:block;font-size:22px;font-weight:700;line-height:33px}
.blog-card small{display:block;margin-top:14px;font-size:16px;font-weight:400;line-height:24px}
.slider-dots{position:absolute;left:0;right:0;top:900px;display:flex;justify-content:center;gap:18px}
.slider-dots span{width:8px;height:8px;border-radius:50%;background:#d8d8d8;cursor:pointer;padding:0;border:0}
.slider-dots .is-active{background:var(--blue)}
.blog__btn{position:absolute;left:50%;top:962px;transform:translateX(-50%)}

.stores{position:relative;background:#fff;display:flow-root} /* BFC化してshop-grid/stores__btnのmargin collapseを防止(overflow:hiddenはtl肉球の上方はみ出しを壊すため不可) */
.stores .section-title{top:150px}
.shop-grid{position:relative;z-index:2;width:calc(100% - 40px);max-width:1200px;margin:312px auto 0;display:flex;flex-wrap:wrap;justify-content:center;gap:36px 29.3333px;box-sizing:border-box}
.store-card{flex:0 0 270px;min-width:0;min-height:420px;border:2px solid var(--blue);border-radius:150px 150px 0 0;background:#fff;text-align:center;color:var(--ink);display:flex;flex-direction:column}
.store-card__photo{display:block;height:270px;border-radius:150px 150px 0 0;overflow:hidden}
.store-card__photo img{width:100%;height:100%;object-fit:cover;object-position:center 25%}
.store-card strong{display:block;height:46px;background:var(--blue);color:#fff;font-size:20px;font-weight:700;line-height:46px;letter-spacing:.2em}
.store-card small{display:block;width:300px;margin-left:-15px;padding:10px 0;font-size:14px;font-weight:400;line-height:21px;box-sizing:border-box}
.store-card__tags{display:flex;flex-wrap:wrap;justify-content:center;align-items:flex-start;gap:8px 10px;margin:0 15px 20px;padding-top:2px}
.store-card__tags em{white-space:nowrap;padding:4px 14px;border:1px solid var(--blue);border-radius:999px;color:var(--blue);font-size:12px;font-style:normal;font-weight:400;line-height:16px}
.stores__btn{position:relative;z-index:2;display:flex;width:fit-content;margin:58px auto 70px}
.stores-dots{right:-72px;top:160px}
.stores .deco-wave--bottom{display:none}

/* ===== Figma忠実：各セクション隅の装飾（黄ハーフトーンドット群＋青肉球） ===== */
/* サービス紹介：左上に黄ドット、右上に肉球1、左下に肉球2、右下に黄ドット */
.service-dots{width:340px;height:340px}
.service-dots--tl{left:-34px;top:8px}
.service-dots--br{left:auto;right:-96px;top:auto;bottom:-40px;width:260px;height:260px}
/* 以下、Figma(gEqYI1t5QWuXK599hD3y9O, node 1:2026)の肉球(足跡)グループを get_metadata で実寸取得し、
   絶対座標(50%-720px基準)・サイズ・回転角をそのまま反映。回転はFigmaのrotation(ラジアン)をdeg変換。 */
.services .service-paw--one{left:calc(50% - 720px + 1105.13px);top:-34.74px;width:45.7px;height:39.66px;transform:rotate(12.91deg)}
.services .service-paw--two{left:calc(50% - 720px + 1164.62px);top:63px;width:64.54px;height:60.42px;transform:rotate(-10.66deg)}
.services .service-paw--three{left:calc(50% - 720px + 27px);top:1173px;width:44px;height:40px;transform:rotate(15deg)}
.services .service-paw--four{left:calc(50% - 720px + 103px);top:1267px;width:44px;height:45px;transform:rotate(-15deg)}
/* お知らせ：Services/News境界の肉球4つ(Newsセクションの子として上にはみ出す) */
.news-dots--tr{left:auto;right:-56px;top:-34px;bottom:auto}
.news-dots--bl{left:-70px;right:auto;top:auto;bottom:-56px}
.news-paw--one{left:calc(50% - 720px + 43.58px);top:-12.12px;width:45.7px;height:39.66px;transform:rotate(16.33deg)}
.news-paw--two{left:calc(50% - 720px + 104.33px);top:-67.58px;width:45.7px;height:39.66px;transform:rotate(41.53deg)}
.news-paw--three{left:calc(50% - 720px + 176.43px);top:8.33px;width:45.7px;height:39.66px;transform:rotate(66.24deg)}
.news-paw--four{left:calc(50% - 720px + 26.48px);top:-162.26px;width:45.7px;height:39.66px;transform:rotate(4.47deg)}
/* ブログ：自セクション右上の肉球2(Blog/Storesの境界肉球はStores側で描画) */
.blog-dots--tl{left:-56px;top:-30px}
.blog-dots--br{left:auto;right:-80px;top:auto;bottom:-30px}
.blog-paw--tr-a{left:calc(50% - 720px + 1132.08px);top:24.03px;width:45.7px;height:39.66px;transform:rotate(12.91deg)}
.blog-paw--tr-b{left:calc(50% - 720px + 1191.57px);top:121.77px;width:64.54px;height:60.42px;transform:rotate(-10.66deg)}
/* 店舗一覧：左上=Blog/Storesの境界肉球4つ、右下=自セクションの肉球2つ */
.stores-dots--tr{right:-72px;left:auto;top:-20px;bottom:auto}
.stores-dots--bl{left:-60px;right:auto;top:auto;bottom:-30px}
.stores-paw--tl-1{left:calc(50% - 720px + 40.58px);top:6.88px;width:45.7px;height:39.66px;transform:rotate(16.33deg)}
.stores-paw--tl-2{left:calc(50% - 720px + 101.33px);top:-48.58px;width:45.7px;height:39.66px;transform:rotate(41.53deg)}
.stores-paw--tl-3{left:calc(50% - 720px + 173.43px);top:27.33px;width:45.7px;height:39.66px;transform:rotate(66.24deg)}
.stores-paw--tl-4{left:calc(50% - 720px + 23.48px);top:-143.26px;width:45.7px;height:39.66px;transform:rotate(4.47deg)}
.stores-paw--br-a{left:calc(50% - 720px + 1248.25px);top:843.5px;width:45.7px;height:39.66px;transform:rotate(12.91deg);z-index:2}
.stores-paw--br-b{left:calc(50% - 720px + 1308.4px);top:941.2px;width:64.54px;height:60.42px;transform:rotate(-10.66deg);z-index:2}
/* br-a/br-bはボタン付近(実フロー)に対する固定オフセット。page-wrapのoverflow:hiddenでセクション自然高さより下は切れるため、
   ボタン下marginの範囲内に収まるようFigma生値(top836/938)より詰めて配置(親のoverflow:hiddenで見切れないための調整、はみ出し防止優先) */
/* 店舗トップ：Instagram・店舗について の隅装飾 */
.instagram{position:relative}
.insta-dots{width:300px;height:300px}
.insta-dots--tr{left:auto;right:-70px;top:-30px}
.insta-dots--bl{left:-70px;right:auto;top:auto;bottom:-30px}
.insta-paw{width:48px;height:48px}
.insta-paw--tl-a{left:40px;top:20px}
.insta-paw--tl-b{left:150px;top:-6px;width:56px;height:56px}
.insta-paw--br-a{left:auto;right:150px;top:auto;bottom:120px}
.insta-paw--br-b{left:auto;right:80px;top:auto;bottom:60px;width:40px;height:40px}
.store-about-dots--tr{left:auto;right:-40px;top:-10px}
.store-about-dots--bl{left:-46px;right:auto;top:auto;bottom:0}

.lower-hero{position:relative;height:680px;background:url(assets/figma/lower-kv.jpg) center 43%/cover no-repeat}
.lower-hero::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:132px;background:var(--deco-wave-white-bottom) center bottom/100% 100% no-repeat;z-index:1}
.lower-hero__panel{position:absolute;left:0;top:232px;width:520px;height:230px;border-radius:0 130px 130px 0;background:rgba(255,255,255,.84);display:flex;flex-direction:column;justify-content:center;padding-left:60px;z-index:2}
.lower-hero__panel .lower-hero__label{font-size:50px;font-weight:700;line-height:56px;letter-spacing:.2em}
.lower-hero__panel b{color:var(--blue);font-size:24px;font-weight:700;line-height:56px;letter-spacing:.1em}
.lower-hero-dots{right:-50px;bottom:-120px;z-index:3}
/* サービス一覧・詳細：下層FVをFigma実寸(600px)に */
.service-index .lower-hero,.service-detail .lower-hero{height:600px}
.service-index .lower-hero,.service-detail .lower-hero{background:url(assets/figma/lower-kv.jpg) -12px -295px/2064px 1382px no-repeat}
.service-index .lower-hero::after,.service-detail .lower-hero::after{top:0;bottom:0;height:auto;background:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201440%20600'%20preserveAspectRatio='none'%3E%3Cpath%20fill='%23dfeef8'%20d='M0%20516.719C71.1359%20486.075%20298.272%20443.174%20637.728%20516.719C977.185%20590.264%201314.02%20464.237%201440%20392.03L1440%20600L0%20600Z'/%3E%3Cpath%20fill='%23fff'%20d='M0%20554.152C71.1357%20521.719%20168.133%20448.913%20507.59%20526.752C847.047%20604.59%201314.02%20630.574%201440%20554.152L1440%20600L0%20600Z'/%3E%3C/svg%3E") center/100% 100% no-repeat}
.service-index .lower-hero__panel,.service-detail .lower-hero__panel{top:196px;height:250px;background:none}
.lower-hero__panel-shape{position:absolute;left:0;top:185px;width:545px;height:275px;z-index:1;pointer-events:none}
.lower-hero__paw{position:absolute;z-index:0;background:#fff;-webkit-mask:url(assets/figma/paw.svg) center/contain no-repeat;mask:url(assets/figma/paw.svg) center/contain no-repeat;pointer-events:none}
.lower-hero__paw--1{left:122px;top:441px;width:63px;height:55px;transform:rotate(14.6deg)}
.lower-hero__paw--2{left:40px;top:508px;width:65px;height:57px;transform:rotate(24.6deg)}
.lower-hero__paw--3{left:-21px;top:244px;width:67px;height:58px;transform:rotate(37.8deg)}
.lower-hero__paw--4{left:75px;top:329px;width:62px;height:54px;transform:rotate(11.9deg)}
.lower-hero__paw--5{left:48px;top:158px;width:66px;height:57px;transform:rotate(28.6deg)}
.lower-hero__paw--6{left:-27px;top:414px;width:65px;height:57px;transform:rotate(24.6deg)}
.service-index .lower-hero-dots,.service-detail .lower-hero-dots{bottom:-40px}
.service-index__body{position:relative;height:2432px;background:#fff}
.lead{position:absolute;left:0;right:0;top:52px;text-align:center;font-size:20px;font-weight:700;line-height:32px}
.divider{position:absolute;left:calc(50% - 430px);top:190px;width:860px;height:1px;border-top:1px dashed var(--blue);text-align:center;color:var(--blue)}
.divider .svg-icon--paw{position:absolute;left:50%;top:0;transform:translate(-50%,-50%);z-index:2}
.divider::after{content:"";position:absolute;left:50%;top:0;transform:translate(-50%,-50%);width:26px;height:20px;background:#fff;z-index:1}
.service-list-cards{position:absolute;left:calc(50% - 720px + 136px);top:266px;width:1168px;display:grid;grid-template-columns:repeat(2,570px);gap:30px 28px}
.service-list-card{position:relative;height:709px;border:2px solid var(--blue);border-radius:20px;background:#fff;overflow:hidden}
.service-list-card:nth-child(3),.service-list-card:nth-child(4){height:685px}
.service-list-card__image{display:block;height:300px;overflow:hidden}
.service-list-card__image img{width:100%;height:100%;object-fit:cover}
.service-list-card__content{display:block;position:relative;padding:78px 50px 50px;text-align:center}
.service-list-card .service-list-card__icon{position:absolute;left:50%;top:-62px;transform:translateX(-50%)}
.service-list-card strong{display:block;color:var(--blue);font-size:40px;font-weight:700;line-height:32px}
.service-list-card b{display:block;margin-top:38px;font-size:30px;font-weight:700;line-height:42px;letter-spacing:-.06em;color:var(--ink)}
.service-list-card small{display:block;margin-top:28px;text-align:left;font-size:16px;font-weight:400;line-height:24px;color:#1b1b1b}
.service-list-card--wide{grid-column:1/3;height:494px;display:grid;grid-template-columns:466px 1fr}
.service-list-card--wide .service-list-card__image{height:494px}
.service-list-card--wide .service-list-card__content{padding-top:200px}
.service-list-card--wide .service-list-card__icon{top:60px}

/* Desktop service cards share one fluid container from tablet-landscape up. */
@media(min-width:901px){
  .service-index .service-index__body{
    height:max(2432px,calc(3839px - 116vw));
  }
  .service-index .service-list-cards{
    left:50%;
    width:min(calc(100% - 40px),1168px);
    grid-template-columns:repeat(2,minmax(0,1fr));
    transform:translateX(-50%);
  }
  .service-index .service-list-card{
    min-width:0;
    min-height:709px;
    height:auto;
  }
  .service-index .service-list-card:nth-child(3),
  .service-index .service-list-card:nth-child(4){min-height:685px}
  .service-index .service-list-card--wide{
    grid-template-columns:minmax(360px,466px) minmax(0,1fr);
    min-height:494px;
  }
}

.service-index-dots{left:-90px;bottom:118px}
.service-index-paw--one{right:149px;bottom:172px;width:44px;height:44px}
.service-index-paw--two{right:88px;bottom:65px;width:44px;height:44px}

.detail-intro{position:relative;height:582px;background:#fff;text-align:center;padding-top:50px}
.service-list-card__icon{width:130px;height:130px;border-radius:50%;background:rgba(239,247,252,.9);display:inline-flex;align-items:center;justify-content:center;color:var(--blue)}
.service-list-card__icon img{display:block;max-width:none}
.detail-intro h1{margin-top:10px;color:var(--blue);font-size:46px;font-weight:700;line-height:56px;letter-spacing:.2em}
.detail-intro h2{margin-top:30px;font-size:30px;font-weight:700;line-height:42px;letter-spacing:-.06em}
.detail-intro .divider{top:358px}
.detail-intro p{margin-top:100px;font-size:20px;font-weight:700;line-height:32px}
.detail-features{position:relative;height:1811px;background:var(--sky)}
.pill-title{position:absolute;left:50%;top:278px;transform:translateX(-50%);z-index:2;height:92px;padding:0 60px;border-radius:999px;background:#fff;color:var(--blue);font-size:36px;font-weight:700;line-height:1;letter-spacing:.2em;text-align:center;white-space:nowrap;display:inline-flex;align-items:center;justify-content:center}
.pill-title::before,.pill-title::after{content:"";display:inline-block;flex:none;width:129px;height:13px;background:url(assets/figma/pill-dots.svg) center/129px 13px no-repeat}
.pill-title::before{margin-right:30px}
.pill-title::after{margin-left:30px}
.pill-tail{position:absolute;left:50%;bottom:-11px;transform:translateX(-50%);width:0;height:0;border-left:13px solid transparent;border-right:13px solid transparent;border-top:13px solid #fff}
/* 白背景セクションでは吹き出しを薄水色にして視認可能に（Figma準拠） */
.detail-stores .pill-title,.notes .pill-title{background:#eff7fc}
.detail-stores .pill-tail,.notes .pill-tail{border-top-color:#eff7fc}
.page-wrap h2.pill-title{color:var(--blue)}
.feature-row{position:absolute;left:calc(50% - 570px);width:1140px;display:grid;grid-template-columns:500px 1fr;gap:50px;align-items:center}
.feature-row img{width:500px;height:300px;border-radius:20px;object-fit:cover;box-shadow:18px 18px 0 #ffe17f}
.feature-row div{padding-top:20px}
.feature-row h3{font-size:30px;font-weight:700;line-height:45px;letter-spacing:.1em}
.feature-row h3::after{content:"";display:block;width:calc(100% + 50px);border-top:5px dotted #ffe17f;margin:38px 0 26px -50px}
.feature-row--two h3::after{margin-left:0}
.feature-row p{font-size:16px;font-weight:400;line-height:29px;letter-spacing:-.0125em}
.feature-no{position:absolute;left:-57px;top:-39px;width:113px;height:97px;background:url(assets/figma/feature-no.svg) center/113px 97px no-repeat;color:#fff;font-size:60px;font-weight:700;line-height:1;text-align:center;padding-top:16px;box-sizing:border-box}
.feature-row--one{top:518px}
.feature-row--two{top:922px;grid-template-columns:1fr 500px}
.feature-row--two img{grid-column:2;grid-row:1;object-position:50% 84%}
.feature-row--two div{grid-column:1;grid-row:1}
.feature-row--two .feature-no{left:583px}
.feature-row--three{top:1318px}
.feature-dots--left{left:-94px;top:250px}
.feature-dots--right{right:-80px;bottom:120px}
.detail-stores{position:relative;height:1186px;background:#fff;text-align:center}
.detail-stores .pill-title{top:160px}
.detail-stores h3{padding-top:344px;font-size:30px;font-weight:700;line-height:56px}
.detail-stores p{margin-top:10px;font-size:16px;font-weight:400;line-height:24px}
.detail-stores .shop-grid{position:absolute;left:calc(50% - 720px + 120px);width:1200px;margin:0;top:514px}
.detail-stores .cta-btn{position:absolute;left:50%;top:1065px;transform:translateX(-50%)}
.price{position:relative;height:1291px;background:var(--sky);text-align:center}
.price .pill-title{top:270px}
.price h3{padding-top:432px;font-size:30px;font-weight:700;line-height:56px}
.price p{font-size:16px;font-weight:400;line-height:32px}
.price-tables{position:absolute;left:calc(50% - 720px + 136px);top:620px;width:1168px;display:grid;grid-template-columns:638px 500px;gap:30px}
.price-card{display:flex;flex-direction:column;background:#fff;border:2px solid var(--blue);border-radius:30px;overflow:hidden;text-align:center}
.price-card__cap{display:flex;align-items:center;justify-content:center;height:52px;color:var(--blue);font-size:20px;font-weight:700;letter-spacing:.05em}
.price-card__cap svg{width:18px;height:18px;margin:0 15px;fill:currentColor}
.price table{border-collapse:separate;border-spacing:0;width:100%;height:368px;background:#fff;display:table}
.price th{height:54px;background:var(--blue);color:#fff;font-size:20px;font-weight:700;line-height:32px}
.price th .price-heading-main{font-size:1em;line-height:inherit}
.price th .price-heading-tax{display:inline;font-size:12px;font-weight:700;line-height:inherit}
.price td{height:74px;border-top:1px solid #cfeaf7;padding:10px 22px;text-align:left;vertical-align:middle;font-size:16px;font-weight:700;line-height:32px}
.price td:last-child{text-align:right;white-space:nowrap;border-left:1px solid #cfeaf7}
.price td b{display:block;line-height:28px}
.price td small{display:block;font-size:12px;font-weight:400;line-height:18px;color:#7a736e}
.notes{position:relative;height:926px;background:#fff;text-align:center}
.notes .pill-title{top:180px}
.notes h3{padding-top:322px;font-size:30px;font-weight:700;line-height:45px}
.note-grid{position:absolute;left:calc(50% - 570px);top:520px;width:1140px;display:grid;grid-template-columns:repeat(3,1fr);gap:30px}
.note-grid div{height:150px;border:1px solid #bde6f7;border-radius:10px;background:#fff;text-align:left;padding:24px 26px 20px 100px;position:relative}
.note-grid span{position:absolute;left:28px;top:42px;width:48px;height:48px;border-radius:50%;background:var(--blue);display:flex;align-items:center;justify-content:center;color:#fff}
.note-grid svg{width:28px;height:28px}
.note-grid .svg-icon--paw{width:28px;height:24px}
.note-grid .svg-icon--cup{width:30px;height:21px}
.note-grid .svg-icon--heart{width:28px;height:31px}
.note-grid b{display:block;color:var(--blue);font-size:16px;font-weight:700;line-height:24px}
.note-grid p{margin-top:8px;font-size:12px;font-weight:400;line-height:18px}
.note-grid .note-icon{width:64px;height:66px;left:22px;top:38px;background:none;border-radius:0;display:flex;align-items:center;justify-content:center}
.note-grid .note-icon svg{width:auto;height:auto;max-width:60px;max-height:62px}
.notes .divider{top:auto;bottom:109px}
.notes .notes-dots--tr{left:auto;right:-56px;top:-30px}
.notes .notes-paw--one{left:21.6px;top:-119.9px;width:44px;height:40px;transform:rotate(16.33deg);z-index:2}
.notes .notes-paw--two{left:98.3px;top:-28.4px;width:44px;height:45px;transform:rotate(41.53deg);z-index:2}
.notes .notes-paw--three{left:38.9px;top:28.6px;width:43px;height:43px;transform:rotate(-10.66deg)}
.notes .notes-paw--four{left:170px;top:47.8px;width:44px;height:43px;transform:rotate(12.91deg)}
.detail-stores{position:relative}
.detail-stores .dstores-dots--tr{left:auto;right:-56px;top:-20px}
.detail-stores .dstores-paw--one{left:21.6px;top:-162.9px;width:44px;height:40px;transform:rotate(16.33deg);z-index:2}
.detail-stores .dstores-paw--two{left:98.4px;top:-71.5px;width:44px;height:45px;transform:rotate(41.53deg);z-index:2}
.detail-stores .dstores-paw--three{left:38.9px;top:-14.4px;width:43px;height:43px;transform:rotate(-10.66deg)}
.detail-stores .dstores-paw--four{left:169.9px;top:4.4px;width:44px;height:44px;transform:rotate(12.91deg)}
.notes__actions{position:absolute;left:0;right:0;top:876px;justify-content:center}

@media(min-width:901px){
  .service-detail .note-grid>div{
    height:184px;
    padding:21px 26px 21px 100px;
    box-sizing:border-box;
  }
  .service-detail .note-grid .note-icon{top:59px}
}

.store-hero{position:relative;height:893px;background:#fff;overflow:hidden}
.store-hero::before{content:"";position:absolute;left:0;top:0;width:100%;height:893px;background:url(assets/figma/store-hero-bg.svg) center top/100% 893px no-repeat;z-index:0}
.store-hero::after{content:none}
.store-hero__stage{position:absolute;left:50%;top:0;width:1440px;height:893px;transform:translateX(-50%);z-index:1;pointer-events:none}
.store-hero__stage>img{position:absolute;display:block}
.store-hero-paw{z-index:1}
.store-hero-paw--left{left:66px;top:317px;width:257px;height:444px}
.store-hero-paw--right{left:978px;top:69px;width:268px;height:449px}
.store-hero-img{z-index:2}
.store-hero-img--cat{left:-392px;top:109px;width:720px;height:518px}
.store-hero-img--dog{left:348px;top:104px;width:730px;height:527px}
.store-hero-img--poodle{left:1098px;top:112px;width:710px;height:511px}
.store-hero__copy{position:absolute;left:0;right:0;top:545px;text-align:center;z-index:3}
.store-hero__copy h1{font-size:60px;font-weight:700;line-height:91px;letter-spacing:.16em;color:#594f4c;-webkit-text-stroke:10px #fff;paint-order:stroke fill}
.store-hero__copy h1 span{color:var(--blue)}
.store-hero__copy h1 .hero-br-sp{display:none} /* SP限定の改行（あなたの／大切な…）。PCは2行のまま */
.store-hero__copy .title-line{width:800px;margin:18px auto 28px;padding:4px 0;justify-content:center;gap:0;background:#fff;border-top:2px solid var(--blue);border-bottom:2px solid var(--blue);box-sizing:border-box}
.store-hero__copy .title-line i{display:none}
.store-hero__copy .title-line b{display:block;width:100%;font-size:20px;font-weight:700;line-height:30px;letter-spacing:.16em;color:var(--blue)}
.store-hero__copy p{font-size:18px;font-weight:700;line-height:32px;color:#594f4c}
.store-hero__copy .store-hero-spark{position:absolute;left:calc(50% + 200px);top:-31px;width:51px;height:47px;line-height:0}
.store-hero__copy .store-hero-spark svg{display:block;width:51px;height:47px}
.store-about{position:relative;height:730px;background:#fff}
.shop-map{position:absolute;left:calc(50% - 720px + 136px);top:150px;width:400px;height:430px;border-radius:22px;overflow:hidden;box-shadow:-18px 18px 0 #ffe17f}
.shop-map img{width:100%;height:100%;object-fit:cover}
.shop-map iframe{display:block;width:100%;height:100%;border:0}
.shop-info{position:absolute;left:calc(50% - 720px + 599px);top:164px;width:540px;margin:0}
.shop-info div{display:grid;grid-template-columns:120px 1fr;border-bottom:2px solid #bde6f7;min-height:56px;align-items:stretch}
.shop-info dt{display:flex;align-items:center;color:var(--blue);font-size:16px;font-weight:700;line-height:24px}
.shop-info dd{display:block;margin:0;padding:16px 0 16px 24px;border-left:2px solid #bde6f7;color:var(--ink);font-size:16px;font-weight:500;line-height:24px}
.shop-info__link{display:inline-flex;align-items:center;gap:6px;color:var(--ink)}
.shop-info__link svg{color:var(--blue);flex:none}
.store-about__btn{position:absolute;left:calc(50% - 720px + 790px);top:546px;padding:10px 76px}
.vertical-title--store{left:calc(50% - 720px + 1143px);top:150px}
.store-about-dots{right:-50px;bottom:10px}
.services--store{height:1336px}
.services--store .deco-wave--bottom{background-image:var(--deco-wave-white-bottom)}
.news--store{height:734px}
.blog--store{height:1260px}
.instagram{position:relative;height:1332px;background:#fff;text-align:center}
.instagram .section-title{top:150px}
.shop-insta-grid{position:absolute;left:calc(50% - 560px);top:312px;width:1120px;display:grid;grid-template-columns:repeat(4,280px);gap:16px}
.shop-insta-grid a{display:block;width:280px;height:380px;overflow:hidden;background:#eee}
.shop-insta-grid img{width:100%;height:100%;object-fit:cover}
.instagram .cta-btn{position:absolute;left:50%;top:1130px;transform:translateX(-50%)}

.site-footer{position:relative;margin:0;background:#fff;overflow:hidden;color:var(--blue)}
.site-footer::before{content:"";position:absolute;left:0;right:0;top:109px;bottom:0;background:var(--blue);z-index:0}
.site-footer--front{height:753px}
.site-footer--lower{height:944px}
.site-footer--store{height:1002px}
.site-footer--lower::before{top:300px}
/* ヒーローの無いページ(お問い合わせ/プライバシーポリシー/サイトマップ/会社概要/404)は
   直前のセクションが水色背景のため、フッター上部の白を同じ水色で埋めて継ぎ目をなくす。 */
.site-footer--sky-seam{background:var(--sky)}
.site-footer .footer-wave{position:absolute;inset:0;width:auto;height:auto;overflow:hidden;z-index:1}
.site-footer .footer-wave svg{position:absolute;left:0;right:0;top:0;width:100%;height:260px}
.site-footer--lower .footer-wave svg{top:191px}
.footer-dots{display:none}
/* render the bottom-left dot pair inside the footer itself, behind the blue wave, flush against its curve (no gap) */
.site-footer--lower .footer-dots--big{display:block;z-index:0;width:260px;height:260px;left:-40px;top:60px}
.site-footer--lower .footer-dots--sm{display:block;z-index:0;width:84px;height:84px;left:200px;top:20px}
.site-footer--front .footer-dots--big,.site-footer--store .footer-dots--big{display:block;z-index:0;width:260px;height:260px;left:-40px;top:-110px}
/* the small diamond doesn't reach the footer in Figma; it stays as its own decoration in the preceding section (dg-storesbl-sm / dg-s-instabl-sm) */
.footer-paw{z-index:2}
.footer-paw--one{right:120px;top:86px;width:44px;height:44px}
.footer-paw--two{right:42px;top:168px;width:36px;height:36px}
.site-footer--lower .footer-paw--one{top:25px;width:54px;height:54px}
.site-footer--lower .footer-paw--two{top:139px;width:46px;height:46px}
.footer-dog{position:absolute;left:calc(50% - 153px);top:32px;width:111px;height:auto;z-index:3}
.footer-bowl{position:absolute;left:calc(50% - 311px);top:24px;width:50px;height:auto;z-index:3}
.footer-cat{position:absolute;left:calc(50% + 422px);top:216px;width:100px;height:auto;z-index:5}
.site-footer--lower .footer-dog{top:223px}
.site-footer--lower .footer-bowl{top:215px}
.site-footer--lower .footer-cat{top:407px}
.footer-panel{position:absolute;left:0;right:0;top:0;bottom:0;z-index:2}
.site-footer .footer-card{position:absolute;left:50%;transform:translateX(-50%);width:1168px;border-radius:20px;background:#fff;color:var(--blue);box-shadow:none;display:grid;align-items:stretch;align-content:stretch;margin:0}
.site-footer--front .footer-card{top:259px;height:350px;grid-template-columns:361px 220px 317px 130px;grid-template-rows:310px;gap:30px;padding:20px}
.site-footer--lower .footer-card{top:450px;height:350px;grid-template-columns:361px 220px 317px 130px;grid-template-rows:310px;gap:30px;padding:20px}
.site-footer--store .footer-card{top:259px;height:599px;grid-template-columns:390px 1fr 110px;grid-template-rows:118px 1fr;gap:0;padding:55px 60px}
.footer-brand{display:flex;flex-direction:column;align-items:center;justify-content:center;border-right:1px solid var(--blue)}
.site-footer--front .footer-brand,.site-footer--lower .footer-brand{justify-content:flex-start}
.footer-brand img{width:200px;height:200px;object-fit:cover}
.footer-brand p{margin:0;color:var(--ink);font-size:20px;font-weight:700;line-height:30px;letter-spacing:.16em;text-align:center}
.footer-brand p span{color:var(--blue)}
.footer-nav,.footer-services{display:flex;align-items:flex-start;justify-content:flex-start;padding-top:14px}
.footer-nav ul,.footer-services ul{list-style:none;margin:0;padding:0}
.footer-nav li{margin:0 0 20px}
.footer-nav a,.footer-services p{display:flex;align-items:center;gap:10px;color:var(--blue);font-size:18px;font-weight:700;line-height:26px}
.footer-nav svg,.footer-services svg{width:18px;height:18px;flex:none}
.footer-services{flex-direction:column;padding-left:0}
.footer-services p{margin:0 0 10px}
.footer-services li{margin:0 0 6px}
.footer-services a{color:var(--blue);font-size:14px;font-weight:700;line-height:24px}
.site-footer .footer-services a::before{content:none}
.site-footer .footer-sns{border:0;border-left:1px solid var(--blue);padding:0 30px 0 50px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px}
.site-footer .footer-sns a{width:50px;height:50px;border-radius:50%;background:var(--blue);color:#fff;display:flex;align-items:center;justify-content:center;font-size:28px;font-weight:700}
.site-footer .footer-sns svg{width:27px;height:27px}
.footer-store-links{grid-column:1/3;grid-row:1;display:flex;flex-direction:column;gap:18px;align-items:flex-start}
.footer-store-links a{display:flex;align-items:center;gap:9px;color:var(--blue);font-size:18px;font-weight:700;line-height:26px}
.footer-store-links svg{width:18px;height:18px;flex:none}
.footer-store-main{display:flex;flex-wrap:wrap;gap:16px 30px}
.footer-store-heading{display:flex;align-items:center;gap:9px}
.footer-store-services{display:flex;flex-wrap:wrap;gap:12px 24px}
.footer-store-service{font-size:14px!important;font-weight:700;line-height:24px!important}
.footer-brand--store{grid-column:1;grid-row:2;border-right:0;align-self:center}
.footer-license{grid-column:2;grid-row:2;width:560px;align-self:end;border-collapse:collapse;background:#eff7fc}
.footer-license th,.footer-license td{height:38px;border-bottom:1px solid #fff;padding:5px 18px;text-align:left;font-size:12px;line-height:18px}
.footer-license th{width:190px;color:var(--blue);font-weight:700;text-align:right}
.footer-license td{position:relative;color:var(--ink);font-weight:500}
.footer-license td::before{content:"";position:absolute;left:0;top:10px;bottom:10px;width:1px;background:var(--blue)}
.site-footer--store .footer-sns{grid-column:2/4;grid-row:1;flex-direction:row;align-items:center;justify-content:flex-end;align-self:stretch;justify-self:end;width:-moz-fit-content;width:fit-content;border-left:1px solid var(--blue);padding:0 30px 0 50px;gap:20px}
.site-footer--store .footer-sns a{width:50px;height:50px;font-size:28px}
.site-footer--store .footer-sns svg{width:27px;height:27px}
.footer-copyright{position:absolute;left:0;right:0;bottom:0;height:44px;margin:0;padding:10px 0;background:#eff7fc;color:var(--blue);font-size:16px;font-weight:700;line-height:24px;text-align:center;z-index:3}

@media(max-width:900px){
  .site-header{position:absolute;height:64px;padding:0 18px 0 116px;gap:12px}
  .site-logo{width:104px;height:104px;border-radius:0 0 16px 0}
  .site-logo img{width:78px;height:78px}
  .site-logo span{font-size:18px;margin-top:-12px}
  .nav-burger{display:flex;position:relative;z-index:3}
  .site-nav{position:absolute;left:0;right:0;top:64px;background:var(--blue);max-height:0;overflow:hidden;transition:max-height .25s}
  .nav-toggle:checked ~ .site-nav{max-height:70vh}
  .site-nav ul{display:block;padding:12px 0}
  .site-nav a{padding:12px 24px}
  .site-contact{min-width:118px}
  .site-phone{display:none}
  .page-wrap{overflow:hidden}
  .home-hero,.about,.services,.news,section.blog,.stores,
  .service-index__body,.detail-intro,.detail-features,.detail-stores,
  .price,.notes,.store-hero,.store-about,.instagram{width:100%;max-width:100%;height:auto;min-height:0;padding:80px 22px;position:relative;box-sizing:border-box}
  .home-hero{padding-top:132px;background-position:58% top;background-size:auto 100%}
  .home-hero::before{inset:0;width:auto;height:auto;background-position:left top;background-size:auto 100%}
  .lower-hero::after,.store-hero::after{height:96px}
  .home-hero__copy,.about__image,.about__text,.vertical-title,.service-grid,.news-feed,.news__btn,.news__image,.blog-viewport,.blog-track,.blog__btn,.shop-grid,.stores__btn,
  .divider,.service-list-cards,.pill-title,.feature-row,.price-tables,.note-grid,.shop-map,.shop-info,.store-about__btn,.shop-insta-grid,.instagram .cta-btn{position:static;left:auto;top:auto;right:auto;bottom:auto;transform:none;width:auto}
  .home-hero__copy{position:relative;width:auto;z-index:3}
  .home-hero__copy h1,.store-hero__copy h1{font-size:38px;line-height:1.55;letter-spacing:.08em}
  .home-hero__copy p,.store-hero__copy p,.lead{font-size:15px;line-height:2}
  .actions{flex-wrap:wrap;gap:14px}
  .section-title{position:static;margin-bottom:34px}
  .section-title h2{font-size:30px;line-height:1.4}
  .section-title p{font-size:16px;line-height:1.6}
  .about{display:grid;grid-template-columns:minmax(0,1fr);gap:28px}
  .about__image{position:relative;width:100%;max-width:100%;height:250px;border-radius:76px 46px 92px 54px / 54px 82px 64px 92px;overflow:hidden}
  .about__image::before{content:"";position:absolute;inset:12px 8px -12px -12px;left:auto;top:auto;width:auto;height:auto;background:#ffe17f;border-radius:82px 54px 100px 62px / 62px 90px 72px 100px;z-index:0}
  .about__image img{width:100%;height:100%;max-width:100%;object-fit:cover;margin:0;-webkit-mask-image:none;mask-image:none;border-radius:inherit}
  .about__text{width:calc(100vw - 44px);max-width:100%;min-width:0}
  .about__text p{max-width:100%;overflow-wrap:anywhere;word-break:break-all;line-break:anywhere}
  .vertical-title{writing-mode:horizontal-tb;display:block;text-align:center;order:-1}
  .vertical-title span{display:block;writing-mode:horizontal-tb;transform:none;font-size:14px;line-height:1.6}
  .vertical-title b{writing-mode:horizontal-tb;text-orientation:mixed;font-size:30px;line-height:1.4;letter-spacing:0}
  .services,section.blog,.price{background:var(--sky)}
  .service-grid,.service-list-cards,.shop-grid,.price-tables,.note-grid,.shop-insta-grid{display:grid;grid-template-columns:1fr;gap:20px}
  .service-grid{max-width:100%;overflow:hidden}
  .service-item,.service-list-card{width:100%;max-width:100%;height:auto;min-height:260px;padding-left:24px;padding-right:24px}
  .service-item strong,.service-item small{overflow-wrap:anywhere}
  .service-list-card--wide{grid-column:auto;display:block}
  .service-list-card--wide .service-list-card__image{height:260px}
  .news-feed{margin:24px 0}
  .news-feed li{grid-template-columns:1fr;gap:4px;margin-bottom:22px}
  .news__image{height:240px;margin-top:26px;border-radius:56px 72px 52px 76px/72px 56px 78px 58px;overflow:hidden;box-shadow:-16px 16px 0 #ffe17f}
  .news__image::before{display:none}
  .news__image img{width:100%;height:100%;object-fit:cover;margin:0;-webkit-mask-image:none;mask-image:none}
  .blog-viewport{overflow:visible}
  .blog-track{display:flex;overflow-x:auto;width:auto;margin:0 -22px;padding:0 22px}
  .blog-card{width:84vw;max-width:420px;height:330px;padding:138px 24px 24px}
  .blog-card--paw::before{width:90px;height:90px}
  .shop-grid{margin-top:24px}
  .store-card{height:360px}
  .lower-hero{height:500px;background-position:58% center;background-size:auto 100%}
  .lower-hero__panel{left:0;top:166px;width:78%;height:160px;padding-left:28px}
  .lower-hero__panel .lower-hero__label{font-size:34px;line-height:1.4}
  .service-index__body .lead{position:static}
  .divider{position:relative;margin:28px auto}
  .detail-intro{text-align:center}
  .detail-intro p{margin-top:24px}
  .pill-title{position:relative;top:auto;display:inline-block;min-width:0;height:auto;padding:12px 28px;font-size:24px;line-height:1.4;letter-spacing:.1em;white-space:normal;margin-bottom:28px}
  .pill-title::before,.pill-title::after{display:none}
  .detail-stores .shop-grid,.price .price-tables{position:static;left:auto;top:auto;width:auto;margin:24px 0 0}
  .detail-stores .cta-btn{position:static;left:auto;top:auto;transform:none;margin:24px 0 0;display:inline-flex}
  .detail-stores .pill-title,.price .pill-title,.notes .pill-title{top:auto}
  .notes__actions{position:static;left:auto;right:auto;top:auto;margin:32px 0 0;flex-wrap:wrap;gap:14px}
  .detail-stores .store-card{flex:none;width:100%;min-height:0;height:auto;border-radius:90px 90px 4px 4px;padding-bottom:20px}
  .detail-stores .store-card__photo{height:200px;border-radius:88px 88px 0 0}
  .detail-stores .store-card strong{height:auto;padding:10px 8px;font-size:16px;line-height:1.5;letter-spacing:.1em}
  .detail-stores .store-card small{width:100%;height:auto;margin:0;padding:10px;font-size:12px;line-height:1.6;box-sizing:border-box}
  .detail-stores .store-card__tags{margin:0 15px 20px}
  .feature-row{display:grid;grid-template-columns:1fr;gap:20px;margin-bottom:42px}
  .feature-row img{width:100%;height:240px}
  .feature-row--two img,.feature-row--two div{grid-column:auto;grid-row:auto}
  .feature-no{left:0;top:-22px;width:60px;height:52px;background-size:60px 52px;font-size:32px;line-height:1;padding-top:9px}
  .detail-stores h3,.price h3,.notes h3{padding-top:0;font-size:22px;line-height:1.7}
  .price table{display:table}
  .note-grid div{height:auto;padding:24px 22px 22px 86px}
  .store-hero{padding:96px 22px 40px}
  .store-hero::before{height:100%}
  .store-hero__stage{position:static;transform:none;width:100%;height:auto;display:flex;gap:10px;align-items:center;justify-content:center}
  .store-hero__stage>img{position:static}
  .store-hero__stage>img.store-hero-paw{display:none}
  .store-hero__stage>img.store-hero-img{width:32%;height:auto}
  .store-hero__copy{position:relative;top:auto;padding-top:0;margin-top:26px}
  .shop-info div{grid-template-columns:100px 1fr}
  .shop-insta-grid a{width:100%;height:auto;aspect-ratio:1/1.35}
  .site-footer,.site-footer--front,.site-footer--lower,.site-footer--store{height:auto;min-height:760px;padding-top:220px}
  .site-footer .footer-card{position:relative;left:auto;top:auto;transform:none;width:auto;height:auto;margin:0 22px;padding:28px;display:grid;grid-template-columns:1fr;gap:24px}
  .footer-nav,.footer-services{padding-top:0}
  .footer-brand,.site-footer .footer-sns{border:0}
  .site-footer .footer-sns{flex-direction:row}
  .footer-store-links{grid-column:auto;grid-row:auto;grid-template-columns:1fr 1fr}
  .footer-brand--store,.footer-license,.site-footer--store .footer-sns{grid-column:auto;grid-row:auto;width:100%}
  .footer-license th,.footer-license td{display:block;width:100%;text-align:left;height:auto}
  .footer-license td::before{display:none}
}

/* ===== SP Figma忠実化（2026-07-10 追加上書き） ===== */
@media(max-width:900px){
  /* --- ヘッダー & ドロワーメニュー（Figma SPメニュー準拠） --- */
  .site-contact{display:none}
  .site-header{height:61px;padding:17px 16px;gap:30px;justify-content:flex-end;z-index:30}
  .site-logo{top:auto;bottom:-19px;width:97px;height:80px;border-radius:0 0 30px 0;box-shadow:none}
  .site-logo img{width:63px;height:63px}
  .nav-burger{width:23px;height:24px;justify-content:space-between;z-index:31}
  .nav-burger span{background:#fff;transition:transform .25s ease,opacity .18s ease}
  .nav-toggle:checked ~ .nav-burger span:nth-child(1){transform:translateY(10px) rotate(45deg)}
  .nav-toggle:checked ~ .nav-burger span:nth-child(2){opacity:0}
  .nav-toggle:checked ~ .nav-burger span:nth-child(3){transform:translateY(-10px) rotate(-45deg)}
  .site-nav{position:fixed;left:0;right:0;top:61px;bottom:0;background:#fff url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20402%20874'%20preserveAspectRatio='none'%3E%3Cpath%20d='M186%20842.265C83.4663%20782.798%2019.8587%20807.129%200%20838.526V0H402V868.074C315.5%20882.977%20230.5%20868.074%20186%20842.265Z'%20fill='%23dfeef8'/%3E%3C/svg%3E") no-repeat top left/100% 100%;max-height:0;overflow:hidden auto;transition:max-height .28s ease;display:flex;flex-direction:column;z-index:20}
  .nav-toggle:checked ~ .site-nav{max-height:calc(100vh - 61px)}
  .site-nav ul{display:flex;flex-direction:column;align-items:center;gap:30px;padding:60px 0 0;margin:0;background:none}
  .site-nav li{width:auto}
  .site-nav a{display:inline-block;padding:0;border:0;color:#000;font-size:20px;font-weight:700;letter-spacing:3.2px}
  .nav-drawer-foot{display:flex;flex-direction:column;align-items:center;padding:60px 0 60px}
  .site-nav a.nav-drawer-contact{display:inline-flex;align-items:center;gap:6px;padding:16px 60px;border-radius:44px;border:0;background:#f2ad38;color:#fff;font-size:18px;font-weight:700;letter-spacing:0;text-decoration:none}
  .nav-drawer-contact::before{content:"";width:17px;height:17px;background:#fff;clip-path:polygon(0 44%,100% 0,66% 100%,43% 62%,20% 82%)}
  .site-nav a.nav-drawer-phone{display:inline-flex;align-items:center;gap:10px;margin-top:24px;padding:0;border:0;color:var(--blue);font-size:24px;font-weight:700;letter-spacing:0;text-decoration:none}
  .nav-drawer-phone svg{width:22px;height:22px;fill:none;stroke:var(--blue)}
  .nav-drawer-div{display:block;width:min(342px,88vw);height:1px;background:var(--blue);margin:60px 0 0}
  .nav-drawer-sns{display:flex;gap:20px;padding:30px 0}
  .nav-drawer-sns a{display:flex;align-items:center;justify-content:center;width:50px;height:50px;border-radius:50%;background:var(--blue);color:#fff;text-decoration:none}
  .nav-drawer-sns a span{font-size:22px;font-weight:700;line-height:1}
  .nav-drawer-sns a svg{width:27px;height:27px}

  /* --- 総合トップ ヒーロー：テキスト→写真の縦積み（Figma: sky#EFF7FC・見出し36px・スパーク・左肉球） --- */
  .home-hero{display:flex;flex-direction:column;padding:0;background:#eff7fc;background-image:none;min-height:0;color:#594f4c}
  .home-hero::before,.home-hero::after{display:none}
  .home-hero .hero-paw{display:block;background:#fff;opacity:.86;z-index:3}
  .home-hero .hero-paw--left{left:max(34px,calc(50% - 260px + 10px));top:168px;width:26px;height:26px}
  .home-hero .hero-paw--upper{left:max(54px,calc(50% - 260px + 30px));top:150px;width:20px;height:20px}
  .home-hero .hero-paw--lower{left:max(32px,calc(50% - 260px + 8px));top:214px;width:24px;height:24px;bottom:auto}
  .home-hero .hero-paw--bottom{left:max(52px,calc(50% - 260px + 28px));top:246px;width:20px;height:20px;bottom:auto}
  .home-hero .hero-paw--five{display:none}
  .home-hero__copy{order:0;position:relative;width:auto;max-width:520px;margin:0 auto;padding:154px 24px 46px 46px;text-align:left;z-index:2}
  .home-hero__copy::before{content:"";position:absolute;z-index:-1;left:0;right:0;bottom:-46px;height:490px;background:url(assets/figma/hero-copy-panel-sp.svg) center bottom/402px auto no-repeat}
  .home-hero__copy h1{position:relative;font-size:clamp(33px,8vw,44px);line-height:1.5;letter-spacing:.16em;color:#594f4c;margin-left:16px;-webkit-text-stroke:6px #fff;text-shadow:none}
  /* フォントがclampで可変なので、スパークはh1基準のem単位で配置し2行目「大切な家族を、」の「を」に追従させる（幅で拡大してもズレない） */
  .home-hero__copy::after{display:none}
  .home-hero__copy h1::after{content:"";position:absolute;left:5.85em;top:.55em;width:.9em;height:.9em;background:url(assets/figma/hero-accent-lines.svg) center/contain no-repeat;pointer-events:none}
  .home-hero__copy .title-line{width:302px;max-width:100%;margin:16px 0 16px 4px}
  .home-hero__copy p{text-align:left;font-size:12px;line-height:22px;color:#594f4c;letter-spacing:0;max-width:316px}
  .home-hero__copy p br{display:none}
  .home-hero__photo{order:1;position:relative;display:block;margin:0;width:100%}
  .home-hero__photo img{display:block;width:100%;height:404px;object-fit:cover;object-position:center 22%}
  .home-hero__photo::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:56px;background:var(--deco-wave-white-bottom) center bottom/100% 100% no-repeat}

  /* --- セクション見出し：共通コンポSP_sectionTitle01（JP30px/lh56/字間6px/#594F4C 中央1行・EN20px/字間2px/#009FE6 中央） --- */
  .vertical-title{display:flex;flex-direction:column-reverse;align-items:center;text-align:center;gap:0;width:100%}
  .vertical-title b{width:auto;font-size:30px;line-height:56px;letter-spacing:6px;color:#594f4c;text-align:center;white-space:nowrap}
  .vertical-title b br{display:none}
  .vertical-title span{font-size:20px;line-height:1.5;letter-spacing:2px;color:#009fe6}
  .section-title h2{font-size:30px;line-height:56px;letter-spacing:6px;color:#594f4c}
  .section-title p{margin-top:0;font-size:20px;line-height:1.5;letter-spacing:2px;color:#009fe6}

  /* --- 私たちについて（About）：見出し中央/画像250×190中央/本文16px lh40 自然折返し/ボタン中央 --- */
  .about{display:flex;flex-direction:column;align-items:center;gap:30px;padding:100px 16px 130px}
  .about__image{order:0;width:250px;max-width:100%;height:190px;margin:0;border-radius:76px 46px 92px 54px / 54px 82px 64px 92px;overflow:hidden}
  .about__image::before{inset:14px 10px -12px -12px}
  .about__text{order:0;width:370px;max-width:100%;margin:0;text-align:center}
  .about__text p{text-align:left;font-size:16px;font-weight:500;line-height:40px;color:#594f4c;overflow-wrap:normal;word-break:normal;line-break:auto}
  .about__text p br:not(:first-of-type){display:none}
  .about .cta-btn{margin:30px auto 0}

  /* --- サービス紹介（front）：sky#EFF7FC・見出しは波の下・白カード360/角丸30/枠2px/padding30/gap15/説明は左寄せ --- */
  .services{background:#eff7fc;padding:150px 21px 110px}
  .dg-svctl-big{width:180px;height:180px;left:-70px;top:-11px}
  .dg-svctl-sm{width:70px;height:70px;left:15px;top:29px}
  .services .service-paw--one{left:auto;right:14px;top:24px;width:32px;height:32px;transform:none}
  .services .service-paw--two{left:auto;right:60px;top:84px;width:32px;height:32px;transform:none}
  .services .section-title{margin-bottom:30px}
  .services .service-grid{grid-template-columns:1fr;gap:30px;max-width:100%}
  .services .service-item{height:auto;min-height:0;padding:30px;display:flex;flex-direction:column;align-items:center;gap:15px;text-align:center}
  .services .service-item__icon{position:static;transform:none;left:auto;top:auto;width:127px;height:127px;background:#eff7fc;margin:0}
  .services .service-item strong{font-size:24px;line-height:32px;color:#009fe6}
  .services .service-item small{margin-top:0;width:100%;text-align:left;font-size:16px;font-weight:400;line-height:24px;color:#1b1b1b}
  .services .service-item--cta{height:300px;padding:0}

  /* --- お知らせ（front）：見出し→画像250×264→リスト(日付/タイトル20px太字#594F4C・下罫線1px青)→ボタン --- */
  .news{display:flex;flex-direction:column;align-items:center;gap:30px;padding:100px 16px 110px;background:#fff}
  .news .vertical-title{order:0;margin-bottom:0}
  .news__image{order:1;position:static;left:auto;top:auto;width:250px;height:264px;margin:0;border-radius:74px 96px 70px 100px/96px 74px 104px 78px;overflow:hidden;box-shadow:-20px 20px 0 #ffe17f}
  .news__image::before{display:none}
  .news__image img{width:100%;height:100%;object-fit:cover;margin:0;-webkit-mask-image:none;mask-image:none}
  .news-feed{order:2;position:static;left:auto;top:auto;width:370px;max-width:100%;margin:0}
  .news-feed li{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:6px;margin:0;padding:20px 0;border-bottom:1px solid #009fe6}
  .news-feed li::after{display:none}
  .news-feed time,.news-feed a{font-size:20px;font-weight:700;line-height:24px;color:#594f4c}
  .news__btn{order:3;position:static;left:auto;top:auto;margin:0}

  /* --- ブログ（front）：sky#EFF7FC・見出しは波の下・カード382×400/枠5px白/角丸30/下寄せ→ドット→ボタン --- */
  section.blog{display:flex;flex-direction:column;align-items:center;gap:30px;padding:150px 10px 110px;background:#eff7fc}
  .dg-blogtl-big{width:180px;height:180px;left:-70px;top:-11px}
  .dg-blogtl-sm{width:70px;height:70px;left:15px;top:29px}
  .blog-paw--tr-a{left:auto;right:14px;top:24px;width:32px;height:32px;transform:none}
  .blog-paw--tr-b{left:auto;right:60px;top:84px;width:32px;height:32px;transform:none}
  section.blog .section-title{margin-bottom:0}
  .blog-viewport{order:0;overflow:visible;width:100%}
  .blog-track{position:static;left:auto;top:auto;overflow-x:auto;width:100%;min-width:0;margin:0;padding:0;gap:16px;justify-content:flex-start}
  .blog-card{width:382px;max-width:100%;height:400px;flex:none;border:5px solid #fff;border-radius:30px;padding:30px;display:flex;flex-direction:column;justify-content:flex-end;gap:14px}
  .blog-card--paw::before{width:100px;height:100px}
  .blog-card__meta{margin-bottom:0;gap:10px}
  .blog-card strong{font-size:22px;line-height:1.5}
  .blog-card small{margin-top:0}
  .slider-dots{position:static;left:auto;right:auto;top:auto;margin:0}
  .blog__btn{position:static;left:auto;top:auto;transform:none;margin:0}

  /* --- 店舗トップ Instagramグリッド：2カラム --- */
  .instagram .shop-insta-grid{grid-template-columns:1fr 1fr;gap:12px}
  .instagram .cta-btn{margin-top:34px} /* グリッド画像とボタンが密着しないよう余白を確保 */
  .instagram .insta-paw--br-a,.instagram .insta-paw--br-b{display:none} /* ボタンに重なる下側の肉球はSPで非表示（Figma SPはボタン周りに肉球なし） */

  /* --- 店舗一覧（front）：2カラム(幅370中央)・カード180×305・アーチ・名前16px/字間.2em・住所12px#594F4C中央・タグ10px#EFF7FC --- */
  .stores{display:flex;flex-direction:column;align-items:center;gap:30px;padding:100px 16px 110px;background:#fff}
  .stores .section-title{margin-bottom:0}
  .stores .shop-grid{order:1;position:static;left:auto;top:auto;width:370px;max-width:100%;margin:0;display:grid;grid-template-columns:1fr 1fr;gap:30px 10px}
  .stores .store-card{height:auto;min-height:0;padding:0 0 20px;border-radius:90px 90px 4px 4px}
  .stores .store-card__photo{height:160px;border-radius:88px 88px 0 0}
  .stores .store-card strong{height:auto;padding:8px 8px;font-size:16px;line-height:1.5;letter-spacing:.2em}
  .stores .store-card small{width:100%;height:auto;margin:0;padding:10px;font-size:12px;line-height:1.5;color:#594f4c;text-align:center}
  .stores .store-card__tags{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:6px;height:auto;padding:0 10px}
  .stores .store-card__tags em{min-width:0;height:auto;padding:2px 10px;font-size:10px;line-height:1.5;background:#eff7fc}
  .stores .stores__btn{order:2;position:static;left:auto;top:auto;transform:none;margin:0}

  /* --- 店舗トップ ヒーロー（Figma SP: 大きな1枚写真→青地に左寄せ見出し→白地にライン/本文） --- */
  .store-hero{position:relative;padding:64px 0 40px;background:#fff;overflow:hidden}
  .store-hero::before{display:none}
  /* 高さは固定せずaspect-ratioで可変：幅が広がると高さも比例して伸び、被写体の切れ方が一定に（下要素は自然に押し下がる） */
  .store-hero__stage{position:relative;left:auto;right:auto;transform:none;width:100%;max-width:100%;aspect-ratio:402/322;height:auto;display:block;padding:0;margin:0;overflow:hidden;border-radius:0 0 34px 34px;z-index:2;background:var(--home-hero-sky)}
  .store-hero__stage>img{display:none}
  .store-hero__stage>img.store-hero-img--dog{display:block;position:static;width:100%;height:100%;object-fit:cover;object-position:center center}
  /* 見出し裏の青パネル：見出しは固定31px・常に2行で高さ一定なので固定高の擬似要素で賄う（幅非依存）。上へ伸ばして写真下角の裏も青に */
  .store-hero__copy{position:relative;z-index:1;transform:none;top:auto;padding:26px 24px 0;margin-top:0;text-align:center}
  .store-hero__copy::before{content:"";position:absolute;z-index:-1;left:-6%;top:-48px;width:112%;height:228px;background:var(--home-hero-sky);border-radius:0 0 50% 50%/0 0 60px 60px}
  /* テキストは左揃え＋inline-blockでブロックごと中央配置（Figma準拠）。これで2行目「を」が1行目「の」より右に出て、スパークを綺麗に付けられる */
  .store-hero__copy h1{display:inline-block;-webkit-text-stroke:6px #fff;paint-order:stroke fill;text-shadow:none;color:#594f4c;font-size:31px;line-height:1.55;letter-spacing:.03em;text-align:left}
  .store-hero__copy h1 span{color:var(--blue)}
  .store-hero__copy h1 .hero-br-sp{display:inline} /* SPは3行に（あなたの／大切な家族を、／もっと幸せに。） */
  /* スパークは2行目「大切な家族を、」の「を」の右上に。ブロック中央＆固定31pxなので中央からの一定オフセットで幅非依存に追従 */
  .store-hero__copy .store-hero-spark{display:block;position:absolute;left:calc(50% + 58px);right:auto;top:40px;width:34px;height:31px}
  .store-hero__copy .store-hero-spark svg{width:34px;height:31px}
  .store-hero__copy .title-line{width:auto;max-width:330px;margin:26px auto 22px;padding:6px 0;background:#fff;border-top:2px solid var(--blue);border-bottom:2px solid var(--blue);display:flex;box-sizing:border-box}
  .store-hero__copy .title-line b{width:100%;text-align:center;color:var(--blue);font-size:18px;line-height:1.7;letter-spacing:.1em}
  .store-hero__copy p{text-align:center;max-width:320px;margin:0 auto;font-size:13px;line-height:2.1;color:var(--ink);letter-spacing:0}
  .store-hero__copy p br{display:none}

  /* --- 店舗トップ About（Figma SP: 見出し→地図→情報表→ご予約ボタン。黄ドットは右上） --- */
  .store-about{display:flex;flex-direction:column;align-items:center;gap:0;padding:14px 22px 96px;background:#fff}
  .store-about .vertical-title--store{order:-1;position:static;left:auto;top:auto;margin:0 0 32px;width:100%}
  .store-about .shop-map{order:0;position:static;width:100%;max-width:340px;height:300px;margin:0 0 34px;border-radius:44px 30px 44px 30px/30px 44px 30px 44px;overflow:hidden;box-shadow:-16px 16px 0 #ffe17f}
  .store-about .shop-map iframe,.store-about .shop-map img{width:100%;height:100%;object-fit:cover;border:0}
  .store-about .shop-info{order:0;position:static;width:100%;max-width:360px;margin:0}
  .store-about .shop-info div{grid-template-columns:96px 1fr;min-height:52px;border-bottom:2px solid #bde6f7}
  .store-about .shop-info dt{font-size:15px}
  .store-about .shop-info dd{font-size:15px;padding:12px 0 12px 18px}
  .store-about .store-about__btn{order:0;position:static;margin:34px auto 0}
  .store-about .dg-s-about-big{left:auto;right:-56px;top:-30px;width:150px;height:150px}
  .store-about .dg-s-about-sm{left:auto;right:44px;top:70px;width:56px;height:56px}

  /* --- サービス紹介/サービス詳細ページ 共通ヒーロー（Figma「下層FV」1:13021・SP「【SP:サービス紹介】」1:11045 準拠）：
       402px幅基準・写真+青波(blue_back #DFEEF8)+白肉球6個+パネル(白/水色ブロブ2枚+見出し)+黄ドット --- */
  .service-index .lower-hero,.service-detail .lower-hero{position:relative;height:600px;max-width:402px;margin:0 auto;overflow:visible;background:#fff}
  .service-index .lower-hero::before,.service-detail .lower-hero::before{content:"";position:absolute;left:0;top:0;width:402px;height:570px;background:#dfeef8;clip-path:path("M141.702 525.746C95.5 504.534 19.8587 520.723 0 553.093L0 0H402V525.746C349.5 592.119 253.116 576.895 141.702 525.746Z");z-index:0}
  .service-index .lower-hero::after,.service-detail .lower-hero::after{content:"";position:absolute;left:0;top:0;width:402px;height:600px;background:url(assets/figma/lower-kv.jpg) -155px -109px/700px 468px no-repeat;clip-path:polygon(0 0,402px 0,402px 310px,380px 325px,340px 360px,300px 410px,260px 465px,228px 476px,190px 462px,160px 448px,130px 440px,60px 432px,0 435px);z-index:1}
  .service-index .lower-hero__paw,.service-detail .lower-hero__paw{z-index:2}
  .service-index .lower-hero__paw--1,.service-detail .lower-hero__paw--1{left:80px;top:493px;width:45px;height:45px;transform:rotate(10.66deg)}
  .service-index .lower-hero__paw--2,.service-detail .lower-hero__paw--2{left:36px;top:532px;width:49px;height:49px;transform:rotate(20.67deg)}
  .service-index .lower-hero__paw--3,.service-detail .lower-hero__paw--3{left:6px;top:373px;width:53px;height:53px;transform:rotate(33.82deg)}
  .service-index .lower-hero__paw--4,.service-detail .lower-hero__paw--4{left:51px;top:427px;width:43px;height:43px;transform:rotate(7.99deg)}
  .service-index .lower-hero__paw--5,.service-detail .lower-hero__paw--5{left:43px;top:322px;width:51px;height:51px;transform:rotate(24.67deg)}
  .service-index .lower-hero__paw--6,.service-detail .lower-hero__paw--6{left:-4px;top:476px;width:49px;height:49px;transform:rotate(20.67deg)}
  .service-index .lower-hero__panel-shape,.service-detail .lower-hero__panel-shape{display:none}
  .service-index .lower-hero__panel,.service-detail .lower-hero__panel{position:absolute;left:16px;top:315px;width:min(377px,calc(100% - 25px));height:147px;transform:none;padding:0;background:none;display:flex;align-items:center;justify-content:center;text-align:center;z-index:3}
  .service-index .lower-hero__panel::before,.service-detail .lower-hero__panel::before{content:"";position:absolute;left:0;top:0;width:min(368px,calc(100% - 9px));height:135px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 367.88 134.827'%3E%3Cpath opacity='.8' fill='%23eff7fc' d='M43.5906 3.40353C24.4461 3.40358 -7.60514e-05 24.8588 1.77446e-10 89.3611C7.60521e-05 153.863 122.438 126.613 263.016 134.424C394.708 141.742 373.697 47.2431 351.081 22.208C328.465 -2.82718 214.599 11.0613 173.479 3.40348C132.359 -4.25434 77.3296 3.40344 43.5906 3.40353Z'/%3E%3C/svg%3E") no-repeat;background-size:100% 100%;z-index:0}
  .service-index .lower-hero__panel::after,.service-detail .lower-hero__panel::after{content:"";position:absolute;left:8px;top:7px;width:min(369px,calc(100% - 8px));height:139px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 369.342 139.019'%3E%3Cpath fill='%23fff' fill-opacity='.7' d='M40.8654 11.9016C13.0067 20.1365 5.09239 53.7 5.09239 53.7C-27.5149 139.792 101.331 146.031 252.655 134.801C403.978 123.572 373.586 53.3881 349.21 26.8741C324.834 0.36022 228.278 11.9016 183.958 3.79143C139.637 -4.31871 75.6887 1.60793 40.8654 11.9016Z'/%3E%3C/svg%3E") no-repeat;background-size:100% 100%;z-index:1}
  .service-index .lower-hero__panel .lower-hero__label,.service-detail .lower-hero__panel .lower-hero__label{position:relative;z-index:2;font-size:36px;line-height:56px;letter-spacing:7.2px;color:#594f4c}
  .service-index .lower-hero__panel b,.service-detail .lower-hero__panel b{position:relative;z-index:2;display:block;margin-top:0;font-size:20px;line-height:1.5;letter-spacing:2px;color:#009fe6}
  .dg-si-hero-big,.dg-d-hero-big{left:auto;right:0;top:-119px;width:157px;height:239px;background:url(assets/figma/dot-right.png) center/contain no-repeat;transform:none}
  .dg-si-hero-sm,.dg-d-hero-sm{display:none}

  /* --- サービス紹介ページ 本文エリア：汎用の上/横パディングを外し、Figma実測の余白を各要素側で管理する --- */
  .service-index .service-index__body{padding-top:0;padding-left:0;padding-right:0}

  /* --- サービス紹介ページ リード文＋区切り（Figma: 20px/lh32/字間-0.8px/#594F4C・両端揃え） --- */
  .service-index__body .lead{position:static;width:368px;max-width:calc(100% - 34px);margin:0 auto;padding:50px 0 0;font-size:20px;font-weight:700;line-height:32px;letter-spacing:-.8px;color:#594f4c;text-align:justify}
  .service-index__body .divider{width:368px;max-width:calc(100% - 34px);margin:50px auto 0}

  /* --- サービス紹介ページ カード（Figma SP「サービスカード」1:11948 準拠）：
       固定幅367(内側box347)・角丸30・アイコン130px・タイトル30px・本文20px/16px --- */
  .service-list-cards{display:block;width:367px;max-width:calc(100% - 34px);margin:100px auto 0;overflow:hidden}
  .service-item,.service-list-card{width:367px;max-width:100%;margin:0 auto;padding:10px 10px 30px;border-radius:30px;box-sizing:border-box}
  .service-list-card{display:block}
  .service-list-card+.service-list-card{margin-top:30px}
  .service-list-card__image{height:300px;border-radius:20px}
  .service-list-card__content{padding:78px 20px 0}
  .service-list-card .service-list-card__icon{width:130px;height:130px;top:-62px;border:4px solid #fff}
  .service-list-card strong{margin-top:0;font-size:30px;line-height:32px}
  .service-list-card b{margin-top:15px;font-size:20px;line-height:1.4;letter-spacing:-1.8px;text-align:left}
  .service-list-card small{margin-top:15px;font-size:16px;line-height:1.5;letter-spacing:normal}
  .service-list-card:nth-child(3),.service-list-card:nth-child(4){height:auto}
  .service-list-card--wide{height:auto}
  .service-list-card--wide .service-list-card__image{height:300px}
  .service-list-card--wide .service-list-card__content{padding-top:78px}
  .service-list-card--wide .service-list-card__icon{top:-62px}
  .service-index-paw--one,.service-index-paw--two{display:none}

  /* --- サービス詳細 導入部：見出しフォント調整 --- */
  .detail-intro{padding:46px 22px 42px}
  .detail-intro h1{margin-top:6px;font-size:30px;line-height:1.4;letter-spacing:.14em}
  .detail-intro h2{margin-top:18px;font-size:20px;line-height:1.5;letter-spacing:0}
  .detail-intro p{margin-top:26px;font-size:16px;line-height:1.9}
  .detail-intro .divider{top:auto}

  /* --- サービス詳細 特徴：番号バッジ復活＋見出しフォント調整 --- */
  .detail-features .pill-title{display:block;width:max-content;max-width:100%;margin:0 auto 56px;text-align:center}
  .detail-features .feature-row{position:relative}
  .detail-features .feature-row--one{margin-top:24px}
  .feature-no{left:-4px;top:-16px;z-index:3}
  .feature-row div{padding-top:0}
  .feature-row h3{font-size:20px;line-height:1.5;letter-spacing:.06em}
  .feature-row h3::after{margin:20px 0 18px}
  .feature-row img{box-shadow:12px 12px 0 #ffe17f}

  /* --- フッター（SP・全バリアント）：白→青波(犬+皿)→青地に白カード→寝猫→コピー --- */
  .site-footer{background:transparent;overflow:visible;min-height:0}
  .site-footer::before{display:none}
  .site-footer--front,.site-footer--lower,.site-footer--store{display:flex;flex-direction:column;height:auto;min-height:0;padding:0}
  .site-footer .footer-wave{position:relative;order:0;width:100%;height:120px;overflow:visible;background:#fff;z-index:2;margin:0}
  /* お問い合わせ/プライバシーポリシー/サイトマップ/会社概要/404はSPでも直前セクションが水色のため、波の上の白を水色に合わせる */
  .site-footer--sky-seam .footer-wave{background:var(--sky)}
  .site-footer .footer-wave svg{position:absolute;left:0;right:0;bottom:-1px;top:auto;width:100%;height:104px}
  .site-footer .footer-dots{display:block;position:absolute;top:16px;left:18px;width:118px;height:66px;z-index:1}
  /* 犬・皿は波の境目に乗せる。波SVGは高さ104px固定で横のみ伸縮するため、leftを％指定にすると境目のy位置が幅非依存になり一つのtopで全幅そろう */
  .site-footer .footer-dog{position:absolute;left:15%;top:-4px;width:64px;height:auto;z-index:3}
  .site-footer .footer-bowl{position:absolute;left:3%;top:27px;width:34px;height:auto;z-index:3}
  /* フッター波 右側の青い肉球（Figma準拠）。SPで非表示にしたinsta肉球の代わりにフッター波側へ表示 */
  .site-footer--store .footer-wave-paw{display:block;position:absolute;z-index:3}
  .site-footer--store .footer-wave-paw--a{right:44px;top:-30px;width:46px;height:46px}
  .site-footer--store .footer-wave-paw--b{right:8px;top:18px;width:36px;height:36px}
  .footer-panel{position:relative;order:1;left:auto;top:auto;right:auto;bottom:auto;background:#009fe6;padding:92px 10px 44px;z-index:1}
  .site-footer .footer-card{position:relative;left:auto;top:auto;transform:none;width:382px;max-width:100%;height:auto;margin:0 auto;padding:20px;background:#fff;border-radius:30px;box-shadow:none;display:flex;flex-direction:column;align-items:center;gap:0}
  .site-footer--front .footer-brand,.site-footer--lower .footer-brand{border:0;align-items:center;text-align:center;padding:30px 30px 40px}
  .site-footer--front .footer-brand p,.site-footer--lower .footer-brand p{font-size:20px;letter-spacing:.16em}
  .site-footer .footer-nav{border-top:1px solid #009fe6;padding:30px 0;width:100%;align-items:center}
  .site-footer .footer-nav ul{display:flex;flex-direction:column;gap:20px;align-items:flex-start}
  .site-footer .footer-services{padding:0 0 30px;width:100%;align-items:flex-start;justify-content:flex-start}
  .site-footer .footer-sns{border-top:1px solid #009fe6;border-left:0;padding:30px 0 0;width:100%;flex-direction:row;justify-content:center;gap:20px}
  .footer-cat{position:absolute;left:auto;right:20px;top:180px;width:100px;height:auto;z-index:3}
  .site-footer--lower .footer-cat{right:30px;top:187px}
  .footer-copyright{position:relative;order:2;left:auto;right:auto;bottom:auto;height:44px;background:#eff7fc}

  /* --- フッター（店舗バリアント）：固定行高の残りでナビとブランドが重なる崩れを解消 --- */
  .site-footer .footer-card{grid-template-rows:none}
  .footer-store-main,.footer-store-services{flex-direction:column;gap:16px}
  .footer-brand--store{align-self:auto}
}

/* ============================================================
 * 店舗トップ ヒーロー：タブレット幅(600–900px)はPC同様に3枚（猫・犬・プードル）を横並びで左右見切れ表示。
 * スマホ(≤599px)は中央1枚のまま（上のブロックで指定済み）。
 * ============================================================ */
@media(min-width:600px) and (max-width:900px){
  .store .store-hero{
    --store-tablet-stage-height:40.465vw;
    isolation:isolate;
  }
  .store .store-hero::before{
    display:none;
  }
  .store .store-hero::after{
    content:"";
    display:block;
    position:absolute;
    left:0;
    top:64px;
    z-index:0;
    width:100%;
    height:calc(var(--store-tablet-stage-height) + 190px);
    background:url(assets/figma/store-hero-blue-back-sp.svg) center/100% 100% no-repeat;
    pointer-events:none;
  }
  .store-hero__stage{display:flex;flex-wrap:nowrap;align-items:center;justify-content:center;gap:0;
    aspect-ratio:auto;height:auto;min-height:0;overflow:hidden;border-radius:0;background:transparent}
  .store-hero__stage>img{display:block;position:static;flex:0 0 auto}
  .store-hero__stage>img.store-hero-paw{display:none}
  .store-hero__stage>img.store-hero-img{width:50%;height:auto;object-fit:contain}
  .store-hero__stage>img.store-hero-img--dog{width:56%}
  .store-hero__stage>img.store-hero-img--cat{margin-right:-5%}
  .store-hero__stage>img.store-hero-img--poodle{margin-left:-5%}
  .store .store-hero__copy{
    z-index:3;
  }
  .store .store-hero__copy::before{
    content:none;
  }
}

.blog-sp-fallback{display:none}

/* ============================================================
 * Figma SP frames (402px): service detail and store detail.
 * These overrides intentionally stop below tablet width so the
 * desktop rules remain untouched.
 * ============================================================ */
@media(max-width:599px){
  /* Preserve the latest single-grid lower-hero placement on phones. */
  .dg-si-hero-big,.dg-d-hero-big{right:-29px;top:-92px;width:186px;height:238px}
  .service-index .lower-hero::after,.service-detail .lower-hero::after{
    clip-path:none;
    -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 402 600' preserveAspectRatio='none'%3E%3Cpath fill='%23fff' d='M0 516.719C19.859 486.075 104.5 477 178.033 516.719C285.899 574.984 366.83 519.707 402 447.5V0H0V516.719Z'/%3E%3C/svg%3E") center/100% 100% no-repeat;
    mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 402 600' preserveAspectRatio='none'%3E%3Cpath fill='%23fff' d='M0 516.719C19.859 486.075 104.5 477 178.033 516.719C285.899 574.984 366.83 519.707 402 447.5V0H0V516.719Z'/%3E%3C/svg%3E") center/100% 100% no-repeat;
  }

  /* Service index: Figma frame 1:11045 starts the intro 27px over the hero. */
  .service-index .service-index__body{
    margin-top:calc(-27px * var(--lower-hero-scale,1));
  }
  .service-index .lower-hero__panel,.service-detail .lower-hero__panel{top:315px}

  /* Store detail: about */
  .store-hero{height:874px;min-height:874px}
  /* At the 402px Figma width, pull the whole About block up by 45px.
     Ease the correction out toward 599px so the wider-phone hero copy
     keeps enough clearance from the section heading. */
  .store-about{
    margin-top:clamp(-43px,calc(-134.83px + 22.843vw),2px);
    padding:100px 16px 102px;
    gap:30px;
  }
  .store-about .vertical-title--store{margin:0}
  .store-about .shop-map{width:370px;max-width:100%;height:auto;aspect-ratio:370/398;margin:0;border-radius:30px;box-shadow:-16px 16px 0 #ffe17f}
  .store-about .shop-info{width:370px;max-width:100%}
  .store-about .shop-info div{grid-template-columns:100px 1fr;height:64px;min-height:64px;border-bottom:1px solid #009fe6}
  .store-about .shop-info dt{display:flex;align-items:center;height:100%;font-size:16px;line-height:24px;border-right:1px solid #009fe6}
  .store-about .shop-info dd{display:flex;align-items:center;height:100%;font-size:16px;line-height:24px;padding:0 0 0 20px;border-left:0}
  .store-about .store-about__btn{margin:-10px auto 0}
  .store .services--store{margin-top:-1px;padding-bottom:171px}
  .store .news--store{padding-bottom:122px}

  /* Store detail: the design contains a latest-post card even when
     no store-specific relation is configured. Keep the fallback SP-only. */
  .blog--store .blog-sp-fallback{display:flex;flex-direction:column;align-items:center;gap:30px;width:100%}
  .blog--store .blog-empty-pc{display:none}
  section.blog--store{min-height:936px;margin-top:-24px;padding-bottom:154px}

  /* Store detail: Instagram */
  .instagram{display:flex;flex-direction:column;align-items:center;gap:30px;margin-top:4px;padding:100px 0 202px}
  .instagram .section-title{margin:0}
  .instagram .shop-insta-grid{width:402px;max-width:100%;padding:0 16px;grid-template-columns:repeat(2,180px);justify-content:center;gap:10px}
  .instagram .shop-insta-grid a{width:180px;height:244px;aspect-ratio:auto}
  .instagram .shop-insta-grid img{width:100%;height:100%;object-fit:cover}
  .instagram .cta-btn{margin:0}

  /* Shared service-detail speech-bubble headings */
  .service-detail .pill-title{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;width:371px;max-width:100%;height:139px;margin:0;padding:20px 60px;border-radius:30px;font-size:30px;line-height:32px;letter-spacing:6px;white-space:nowrap;box-sizing:border-box}
  .service-detail .pill-title::before,.service-detail .pill-title::after{display:block;width:129px;height:13px;margin:0;flex:none}

  /* Trimming: intro */
  .detail-intro{display:flex;flex-direction:column;align-items:center;margin-top:-27px;padding:50px 16px 44px;z-index:4}
  .detail-intro .service-list-card__icon{position:static;width:130px;height:130px;transform:none;flex:none}
  .detail-intro h1{margin:15px 0 0;font-size:30px;line-height:56px;letter-spacing:6px}
  .detail-intro h2{margin:15px 0 0;font-size:20px;line-height:28px}
  .detail-intro .divider{width:368px;max-width:100%;margin:50px 0 0}
  .detail-intro p{width:368px;max-width:100%;margin:40px 0 0;font-size:20px;font-weight:700;line-height:32px;text-align:justify}
  .detail-intro p br{display:none}

  /* Trimming: features */
  .detail-features{display:flex;flex-direction:column;align-items:center;padding:150px 16px 151px}
  .detail-features .pill-title{margin:0 0 60px}
  .detail-features .feature-row{display:block;position:relative;width:371px;max-width:100%;height:409px;margin:0}
  .detail-features .feature-row+.feature-row{margin-top:80px}
  .detail-features .feature-row--one{margin-top:0}
  .detail-features .feature-row img{display:block;width:371px;max-width:100%;height:222px;border:4px solid #fff;border-radius:30px;box-shadow:16px 16px 0 #ffe17f;box-sizing:border-box;object-fit:cover}
  .detail-features .feature-row--two img{box-shadow:-16px 16px 0 #ffe17f}
  .detail-features .feature-row div{margin-top:30px;padding:0}
  .detail-features .feature-row h3{font-size:20px;line-height:30px;letter-spacing:2px}
  .detail-features .feature-row h3::after{width:100%;margin:20px 0 18px;border-top-width:3px}
  .detail-features .feature-row p{font-size:16px;line-height:29px;letter-spacing:0}
  .detail-features .feature-no{left:-13px;top:-25px;width:80px;height:69px;padding-top:11px;background-size:80px 69px;font-size:42px}
  .detail-features .feature-row--two .feature-no{left:auto;right:-13px}

  /* Trimming: stores */
  .detail-stores{display:flex;flex-direction:column;align-items:center;padding:100px 16px 102px;text-align:center}
  .detail-stores .pill-title{margin:0}
  .detail-stores h3{margin:50px 0 0;padding:0;font-size:20px;line-height:30px}
  .detail-stores p{width:371px;max-width:100%;margin:20px 0 0;font-size:16px;line-height:24px}
  .detail-stores p br{display:none}
  .detail-stores .shop-grid{display:grid;grid-template-columns:repeat(2,minmax(0,180px));grid-auto-rows:1fr;align-items:stretch;gap:30px 10px;width:371px;max-width:100%;margin:50px 0 0}
  .detail-stores .store-card{align-self:stretch;width:180px;max-width:100%;height:auto;min-height:305px;padding:0;border-radius:90px 90px 4px 4px;overflow:hidden}
  .detail-stores .store-card__photo{height:160px;border-radius:88px 88px 0 0}
  .detail-stores .store-card strong{padding:8px;font-size:16px;line-height:24px;letter-spacing:3.2px}
  .detail-stores .store-card small{padding:4px 8px;font-size:12px;line-height:18px}
  .detail-stores .store-card__tags{display:flex;align-content:flex-start;justify-content:center;gap:6px;margin:0;padding:0 10px 20px}
  .detail-stores .store-card__tags em{padding:2px 7px;font-size:10px;line-height:15px}
  .detail-stores .cta-btn{margin:50px 0 0}

  /* Trimming: price */
  .price{display:flex;flex-direction:column;align-items:center;margin-top:-50px;padding:150px 16px;text-align:center}
  .price .pill-title{margin:0}
  .price h3{margin:50px 0 0;padding:0;font-size:20px;line-height:30px}
  .price>p{width:371px;max-width:100%;margin:20px 0 0;font-size:16px;line-height:32px}
  .price-tables,.price .price-tables{display:flex;flex-direction:column;gap:30px;width:371px;max-width:100%;margin:50px 0 0}
  .price-card{width:100%;gap:2px;box-sizing:border-box}
  .price-card:first-child{height:582px}
  .price-card:nth-child(2){height:422px}
  .price-card__cap{height:52px;min-height:52px;padding:10px 0;box-sizing:border-box}
  .price table{display:block;width:100%;table-layout:fixed}
  .price-card:first-child table{height:520px}
  .price-card:nth-child(2) table{height:364px}
  .price thead,.price tbody{display:block;width:100%}
  .price thead tr,.price tbody tr{display:grid;grid-template-columns:minmax(0,1fr) 130px;width:100%}
  .price thead tr{height:72px}
  .price th,.price td{display:flex;align-items:center;height:100%;padding:20px;font-size:16px;line-height:32px;box-sizing:border-box}
  .price th{justify-content:center;font-size:20px}
  .price th:last-child,.price td:last-child{width:auto;justify-content:flex-end}
  .price td:first-child{flex-direction:column;align-items:flex-start;justify-content:center}
  .price th:last-child{font-size:0;white-space:nowrap}
  .price th:last-child::before,.price th:last-child::after{content:none}
  .price th .price-heading-main{font-size:20px;line-height:32px}
  .price th .price-heading-tax{display:inline;font-size:12px;font-weight:700;line-height:32px}
  .price td{height:auto;padding:20px;font-size:16px;line-height:32px;box-sizing:border-box}
  .price-card:first-child tbody tr:nth-child(1){height:136px}
  .price-card:first-child tbody tr:nth-child(2){height:104px}
  .price-card:first-child tbody tr:nth-child(3){height:136px}
  .price-card:first-child tbody tr:nth-child(4){height:72px}
  .price-card:nth-child(2) tbody tr:nth-child(1){height:100px}
  .price-card:nth-child(2) tbody tr:nth-child(2){height:88px}
  .price-card:nth-child(2) tbody tr:nth-child(3){height:104px}
  .price td b{line-height:32px}
  .price td small{line-height:14px}

  /* Trimming: notes */
  .notes{display:flex;flex-direction:column;align-items:center;margin-top:9px;padding:100px 16px 103px;text-align:center}
  .notes .pill-title{margin:0}
  .notes h3{width:371px;max-width:100%;margin:50px 0 0;padding:0;font-size:20px;line-height:30px}
  .note-grid{display:grid;grid-template-columns:1fr;gap:20px;width:370px;max-width:100%;margin:50px 0 0;padding:0 0 70px}
  .note-grid>div{display:flex;flex-direction:column;justify-content:center;width:100%;height:184px;padding:30px 20px 30px 130px;border:2px solid #c0dcf3;border-radius:20px;box-sizing:border-box}
  .note-grid .note-icon{left:40px;top:50%;width:60px;height:66px;transform:translateY(-50%)}
  .note-grid b{font-size:16px;line-height:24px}
  .note-grid p{margin-top:10px;font-size:12px;line-height:18px}
  .notes .notes__divider{bottom:auto;width:370px;max-width:100%;margin:50px 0 0}
  .notes .notes__actions{display:flex;flex-direction:column;align-items:center;gap:30px;width:100%;margin:50px 0 0}
  .notes .notes__actions .cta-btn{width:250px}

  /* Store footer: keep its desktop content unchanged while restoring
     the full-width mobile navigation and Figma vertical rhythm. */
  .site-footer--store .footer-panel{padding:92px 10px 97px}
  .site-footer--store .footer-card{padding:20px}
  .site-footer--store .footer-store-links{width:100%;gap:20px}
  .site-footer--store .footer-store-main,.site-footer--store .footer-store-services{width:100%;gap:20px}
  .site-footer--store .footer-brand--store{width:100%;padding:30px 0}
  .site-footer--store .footer-license{width:100%;margin-top:10px}
  .site-footer--store .footer-sns{margin-top:30px}
  .site-footer--lower .footer-panel{padding-bottom:107px}
}

/* Scale the 402px Figma hero proportionally on narrower screens. */
@media(min-width:403px) and (max-width:900px){
  /* The tablet copy column is narrow, but its lower hero ornament spans the viewport. */
  .front .home-hero__copy::before{
    left:calc(50% - 50vw);
    right:auto;
    width:100vw;
    background-size:100% 490px;
  }
}

@media(max-width:402px){
  .service-index,.service-detail{--lower-hero-scale:calc(100vw / 402px)}
  .service-index .lower-hero,.service-detail .lower-hero{height:calc(600px * var(--lower-hero-scale));overflow:hidden}
  .service-index .lower-hero::before,.service-detail .lower-hero::before{width:100%;height:95%;clip-path:none;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 402 570' preserveAspectRatio='none'%3E%3Cpath fill='%23dfeef8' d='M141.702 525.746C95.5 504.534 19.8587 520.723 0 553.093V0H402V525.746C349.5 592.119 253.116 576.895 141.702 525.746Z'/%3E%3C/svg%3E") center/100% 100% no-repeat}
  .service-index .lower-hero::after,.service-detail .lower-hero::after{width:100%;height:100%;background-image:url(assets/figma/lower-kv.jpg);background-position:calc(50% + 41.4px * var(--lower-hero-scale)) calc(-54px * var(--lower-hero-scale));background-size:calc(923.28px * var(--lower-hero-scale)) auto}
  .service-index .lower-hero__panel,.service-detail .lower-hero__panel{top:52.5%;height:24.5%}
  .service-index .lower-hero__panel::before,.service-detail .lower-hero__panel::before{height:91.84%}
  .service-index .lower-hero__panel::after,.service-detail .lower-hero__panel::after{top:4.76%;height:94.56%}
  .service-index .lower-hero__paw--1,.service-detail .lower-hero__paw--1{left:19.9%;top:82.17%;width:11.19%;height:7.5%}
  .service-index .lower-hero__paw--2,.service-detail .lower-hero__paw--2{left:8.96%;top:88.67%;width:12.19%;height:8.17%}
  .service-index .lower-hero__paw--3,.service-detail .lower-hero__paw--3{left:1.49%;top:62.17%;width:13.18%;height:8.83%}
  .service-index .lower-hero__paw--4,.service-detail .lower-hero__paw--4{left:12.69%;top:71.17%;width:10.7%;height:7.17%}
  .service-index .lower-hero__paw--5,.service-detail .lower-hero__paw--5{left:10.7%;top:53.67%;width:12.69%;height:8.5%}
  .service-index .lower-hero__paw--6,.service-detail .lower-hero__paw--6{left:-1%;top:79.33%;width:12.19%;height:8.17%}
  .service-detail .detail-intro{margin-top:calc(-27px * var(--lower-hero-scale,1))}
  .dg-si-hero-big,.dg-d-hero-big{right:calc(-29px * var(--lower-hero-scale));top:calc(-92px * var(--lower-hero-scale));width:calc(186px * var(--lower-hero-scale));height:calc(238px * var(--lower-hero-scale))}
}

@media(max-width:359px){
  .service-index .lower-hero__panel .lower-hero__label,.service-detail .lower-hero__panel .lower-hero__label{font-size:30px;line-height:48px;letter-spacing:6px;white-space:nowrap}
  .service-index .lower-hero__panel b,.service-detail .lower-hero__panel b{font-size:18px;letter-spacing:1.8px}
}

@media(max-width:388px){
  .service-detail .note-grid>div{
    height:auto;
    min-height:184px;
  }
}

@media(max-width:279px){
  .service-index .lower-hero__panel .lower-hero__label,.service-detail .lower-hero__panel .lower-hero__label{font-size:26px;letter-spacing:5.2px}
  .service-index .lower-hero__panel b,.service-detail .lower-hero__panel b{font-size:16px;letter-spacing:1.6px}
}

@media(min-width:600px){
  .service-index .lower-hero__panel::before,.service-index .lower-hero__panel::after,
  .service-detail .lower-hero__panel::before,.service-detail .lower-hero__panel::after{content:none;background:none}
}

/* Intermediate mobile widths: expand the 402px Figma hero to the viewport. */
@media(min-width:403px) and (max-width:599px){
  .service-index .lower-hero,.service-detail .lower-hero{width:100%;max-width:none;margin:0;overflow:hidden}
  .service-index .lower-hero::before,.service-detail .lower-hero::before{width:100%;clip-path:none;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 402 570' preserveAspectRatio='none'%3E%3Cpath fill='%23dfeef8' d='M141.702 525.746C95.5 504.534 19.8587 520.723 0 553.093V0H402V525.746C349.5 592.119 253.116 576.895 141.702 525.746Z'/%3E%3C/svg%3E") center top/100% 570px no-repeat}
  .service-index .lower-hero::after,.service-detail .lower-hero::after{width:100%;background-image:url(assets/figma/lower-kv.jpg);background-position:calc(50% + 41.4px) -54px;background-size:923.28px auto}
  .service-index .lower-hero__panel,.service-detail .lower-hero__panel{left:16px;width:calc(100% - 32px)}
  .service-index .lower-hero__panel::before,.service-detail .lower-hero__panel::before{width:calc(100% - 9px)}
  .service-index .lower-hero__panel::after,.service-detail .lower-hero__panel::after{width:calc(100% - 8px)}
}

/* Tablet: preserve roomy layouts without applying the 402px fixed rhythm. */
@media(min-width:600px) and (max-width:900px){
  .store-about{padding:100px 40px}
  .store-about .shop-map{width:430px;max-width:100%;height:400px}
  .store-about .shop-info{width:540px;max-width:100%}
  .instagram{padding:100px 30px 140px}
  .instagram .shop-insta-grid{grid-template-columns:repeat(4,1fr);gap:10px}
  .detail-stores .shop-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:30px;width:min(700px,100%);margin:40px auto 0}
  .detail-stores .store-card{width:100%}
  .price .price-tables{width:min(700px,100%);margin:40px auto 0}
  .notes .note-grid{width:min(700px,100%);margin:40px auto 0}
  .notes .notes__divider{bottom:auto;width:min(760px,100%);margin:50px auto 0}
  .site-footer .footer-card{width:min(700px,calc(100% - 40px))}

  .service-index .lower-hero,.service-detail .lower-hero{width:100%;max-width:none;height:600px;background:url(assets/figma/lower-kv.jpg) left -180px/1400px auto no-repeat;overflow:hidden}
  .service-index .lower-hero::before,.service-detail .lower-hero::before{display:none}
  .service-index .lower-hero::after,.service-detail .lower-hero::after{content:"";display:block;position:absolute;inset:0;width:auto;height:auto;background:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201440%20600'%20preserveAspectRatio='none'%3E%3Cpath%20fill='%23dfeef8'%20d='M0%20516.719C71.1359%20486.075%20298.272%20443.174%20637.728%20516.719C977.185%20590.264%201314.02%20464.237%201440%20392.03L1440%20600L0%20600Z'/%3E%3Cpath%20fill='%23fff'%20d='M0%20554.152C71.1357%20521.719%20168.133%20448.913%20507.59%20526.752C847.047%20604.59%201314.02%20630.574%201440%20554.152L1440%20600L0%20600Z'/%3E%3C/svg%3E") center/100% 100% no-repeat;clip-path:none;z-index:1}
  .service-index .lower-hero__panel-shape,.service-detail .lower-hero__panel-shape{display:block;left:0;top:185px;width:545px;height:275px}
  .service-index .lower-hero__panel,.service-detail .lower-hero__panel{left:0;top:196px;width:520px;height:250px;padding-left:60px;align-items:flex-start;text-align:left}
  .service-index .lower-hero__panel .lower-hero__label,.service-detail .lower-hero__panel .lower-hero__label{font-size:50px;line-height:56px;letter-spacing:10px}
  .service-index .lower-hero__panel b,.service-detail .lower-hero__panel b{font-size:24px;line-height:56px;letter-spacing:2.4px}
  .service-index .lower-hero__paw--1,.service-detail .lower-hero__paw--1{left:122px;top:441px;width:63px;height:55px}
  .service-index .lower-hero__paw--2,.service-detail .lower-hero__paw--2{left:40px;top:508px;width:65px;height:57px}
  .service-index .lower-hero__paw--3,.service-detail .lower-hero__paw--3{left:-21px;top:244px;width:67px;height:58px}
  .service-index .lower-hero__paw--4,.service-detail .lower-hero__paw--4{left:75px;top:329px;width:62px;height:54px}
  .service-index .lower-hero__paw--5,.service-detail .lower-hero__paw--5{left:48px;top:158px;width:66px;height:57px}
  .service-index .lower-hero__paw--6,.service-detail .lower-hero__paw--6{left:-27px;top:414px;width:65px;height:57px}
}

/* ============================================================
 * Front page section-boundary ornaments (Figma SP 1:61).
 * Keep these values below the phone breakpoint: tablet/desktop
 * retain their existing layout, and narrower phones scale the
 * 402px reference proportionally.
 * ============================================================ */
@media(max-width:599px){
  .front,.site-footer--front{--front-deco-scale:1}

  .front .deco-dots{
    background-image:radial-gradient(circle,#ffe17f 0 calc(2.5px * var(--front-deco-scale)),transparent calc(2.6px * var(--front-deco-scale)));
    background-position:calc(-5px * var(--front-deco-scale)) calc(-5px * var(--front-deco-scale));
    background-size:calc(15px * var(--front-deco-scale)) calc(15px * var(--front-deco-scale));
    transform-origin:0 0;
  }

  /* The SP waves are 402 × 50 in Figma, not the 180px desktop waves. */
  .front .deco-wave{
    height:calc(50px * var(--front-deco-scale));
    background-position:center;
    background-size:100% 100%;
  }
  .front .deco-wave--top{
    top:0;
    background-image:url(assets/figma/front-wave-top-sp.svg);
    transform:none;
  }
  .front .deco-wave--bottom{
    bottom:0;
    background-image:url(assets/figma/front-wave-bottom-sp.svg);
    transform:rotate(180deg);
  }
  .front section.blog>.deco-wave--top{
    background-image:url(assets/figma/front-wave-top-sp.svg);
  }
  .front section.blog>.deco-wave--bottom{
    background-image:url(assets/figma/front-wave-bottom-sp.svg);
    transform:rotate(180deg);
  }
  .front .services,.front section.blog{
    background:
      linear-gradient(
        to bottom,
        #fff 0 calc(50px * var(--front-deco-scale)),
        #eff7fc calc(50px * var(--front-deco-scale)) calc(100% - 48px * var(--front-deco-scale)),
        #fff calc(100% - 48px * var(--front-deco-scale)) 100%
      );
  }
  /* Services → News stays sky-blue up to the white wave. Keeping a flat
     white 50px strip here exposes a horizontal seam above the curve. */
  .front .services{
    background:
      linear-gradient(
        to bottom,
        #fff 0 calc(48px * var(--front-deco-scale)),
        #eff7fc calc(48px * var(--front-deco-scale)) 100%
      );
  }
  .front .services>.deco-wave--bottom{
    background-image:url(assets/figma/service-wave-white-bottom-sp.svg);
    transform:none;
  }

  /* Hero → About: dot-right 1:123, painted before the About content. */
  .front .dg-about-big{
    display:block;
    right:calc(-98.948px * var(--front-deco-scale));
    left:auto;
    top:calc(-80px * var(--front-deco-scale));
    width:calc(136.710px * var(--front-deco-scale));
    height:calc(136.712px * var(--front-deco-scale));
    transform:rotate(60.712deg);
  }
  .front .dg-about-sm{
    display:block;
    right:calc(-83.212px * var(--front-deco-scale));
    left:auto;
    top:calc(107.351px * var(--front-deco-scale));
    width:calc(54.684px * var(--front-deco-scale));
    height:calc(54.685px * var(--front-deco-scale));
    transform:rotate(112.092deg);
  }

  /* About → Services and News → Blog: identical left dots + right paws. */
  .front .dg-svctl-big,.front .dg-blogtl-big{
    left:calc(-71.289px * var(--front-deco-scale));
    top:calc(79.677px * var(--front-deco-scale));
    width:calc(119.602px * var(--front-deco-scale));
    height:calc(119.602px * var(--front-deco-scale));
    transform:rotate(-42.840deg);
  }
  .front .dg-svctl-sm,.front .dg-blogtl-sm{
    left:calc(74.463px * var(--front-deco-scale));
    top:calc(-15.112px * var(--front-deco-scale));
    width:calc(47.841px * var(--front-deco-scale));
    height:calc(47.841px * var(--front-deco-scale));
    transform:rotate(8.539deg);
  }
  .front .service-paw--one,.front .blog-paw--tr-a{
    right:calc(53.813px * var(--front-deco-scale));
    left:auto;
    top:calc(-16.006px * var(--front-deco-scale));
    width:calc(27.360px * var(--front-deco-scale));
    height:calc(23.746px * var(--front-deco-scale));
    transform:rotate(12.912deg);
    transform-origin:0 0;
  }
  .front .service-paw--two,.front .blog-paw--tr-b{
    right:calc(17.516px * var(--front-deco-scale));
    left:auto;
    top:calc(54.213px * var(--front-deco-scale));
    width:calc(27.360px * var(--front-deco-scale));
    height:calc(23.746px * var(--front-deco-scale));
    transform:rotate(-10.664deg);
    transform-origin:0 0;
  }

  /* Services → News: dot-right 1:977 is behind the 50px lower wave. */
  .front .dg-svcnews-big{
    display:block;
    right:calc(-92.948px * var(--front-deco-scale));
    left:auto;
    top:calc(-39px * var(--front-deco-scale));
    width:calc(136.710px * var(--front-deco-scale));
    height:calc(136.712px * var(--front-deco-scale));
    transform:rotate(60.712deg);
    z-index:0;
  }
  .front .dg-svcnews-sm{
    display:block;
    right:calc(-77.212px * var(--front-deco-scale));
    left:auto;
    top:calc(148.351px * var(--front-deco-scale));
    width:calc(54.684px * var(--front-deco-scale));
    height:calc(54.685px * var(--front-deco-scale));
    transform:rotate(112.092deg);
    z-index:0;
  }

  /* Services → News and Blog → Stores: four-paw trail 1:2750 / 1:4470. */
  .front .news-paw--one,.front .stores-paw--tl-1{
    left:calc(24.301px * var(--front-deco-scale));
    top:calc(-1.604px * var(--front-deco-scale));
    width:calc(26.064px * var(--front-deco-scale));
    height:calc(22.621px * var(--front-deco-scale));
    transform:rotate(16.327deg);
    transform-origin:0 0;
  }
  .front .news-paw--two,.front .stores-paw--tl-2{
    left:calc(66.020px * var(--front-deco-scale));
    top:calc(-35.825px * var(--front-deco-scale));
    width:calc(26.064px * var(--front-deco-scale));
    height:calc(22.621px * var(--front-deco-scale));
    transform:rotate(41.531deg);
    transform-origin:0 0;
  }
  .front .news-paw--three,.front .stores-paw--tl-3{
    left:calc(114.501px * var(--front-deco-scale));
    top:calc(8.091px * var(--front-deco-scale));
    width:calc(26.064px * var(--front-deco-scale));
    height:calc(22.621px * var(--front-deco-scale));
    transform:rotate(66.244deg);
    transform-origin:0 0;
  }
  .front .news-paw--four,.front .stores-paw--tl-4{
    left:calc(11.763px * var(--front-deco-scale));
    top:calc(-85.005px * var(--front-deco-scale));
    width:calc(26.064px * var(--front-deco-scale));
    height:calc(22.621px * var(--front-deco-scale));
    transform:rotate(4.470deg);
    transform-origin:0 0;
  }

  /* Blog → Stores: dot-right 1:3625. */
  .front .dg-blogstores-big{
    display:block;
    right:calc(-92.948px * var(--front-deco-scale));
    left:auto;
    top:calc(-114px * var(--front-deco-scale));
    width:calc(136.710px * var(--front-deco-scale));
    height:calc(136.712px * var(--front-deco-scale));
    transform:rotate(60.712deg);
    z-index:2;
  }
  .front .dg-blogstores-sm{
    display:block;
    right:calc(-77.212px * var(--front-deco-scale));
    left:auto;
    top:calc(73.351px * var(--front-deco-scale));
    width:calc(54.684px * var(--front-deco-scale));
    height:calc(54.685px * var(--front-deco-scale));
    transform:rotate(112.092deg);
    z-index:2;
  }

  /* Stores → Footer: use the footer pair only, avoiding a doubled grid. */
  .front .dg-storesbl-big,.front .dg-storesbl-sm{display:none}
  .front .stores-paw--br-a{
    right:calc(33.660px * var(--front-deco-scale));
    left:auto;
    top:auto;
    bottom:calc(9.390px * var(--front-deco-scale));
    width:calc(27.360px * var(--front-deco-scale));
    height:calc(23.746px * var(--front-deco-scale));
    transform:rotate(12.912deg);
    transform-origin:0 0;
  }
  .front .stores-paw--br-b{
    right:calc(-2.637px * var(--front-deco-scale));
    left:auto;
    top:auto;
    bottom:calc(-84.575px * var(--front-deco-scale));
    width:calc(27.360px * var(--front-deco-scale));
    height:calc(23.746px * var(--front-deco-scale));
    transform:rotate(-10.664deg);
    transform-origin:0 0;
  }

  .site-footer--front .footer-wave{
    height:calc(118.609px * var(--front-deco-scale));
  }
  .site-footer--front .footer-wave svg{display:none}
  .site-footer--front .footer-wave::after{
    content:"";
    position:absolute;
    z-index:1;
    left:0;
    right:0;
    top:calc(68.609px * var(--front-deco-scale));
    height:calc(50px * var(--front-deco-scale) + 2px);
    background:url(assets/figma/front-footer-wave-sp.svg) center/100% 100% no-repeat;
    pointer-events:none;
  }
  .site-footer--front .footer-dots--big{
    display:block;
    z-index:0;
    left:calc(-51.137px * var(--front-deco-scale));
    top:calc(36.643px * var(--front-deco-scale));
    width:calc(119.602px * var(--front-deco-scale));
    height:calc(119.602px * var(--front-deco-scale));
    transform:rotate(-42.840deg);
    transform-origin:0 0;
  }
  .site-footer--front .footer-dots--sm{
    display:block;
    z-index:0;
    left:calc(94.615px * var(--front-deco-scale));
    top:calc(-58.146px * var(--front-deco-scale));
    width:calc(47.841px * var(--front-deco-scale));
    height:calc(47.841px * var(--front-deco-scale));
    transform:rotate(8.539deg);
    transform-origin:0 0;
  }
  .site-footer--front .footer-dog{
    left:calc(117.261px * var(--front-deco-scale));
    top:calc(58.609px * var(--front-deco-scale));
    width:calc(100.001px * var(--front-deco-scale));
    transform:rotate(-10.388deg);
    transform-origin:50% 50%;
  }
  .site-footer--front .footer-bowl{
    left:calc(29.999px * var(--front-deco-scale));
    top:calc(68.609px * var(--front-deco-scale));
    width:calc(50px * var(--front-deco-scale));
  }
}

@media(max-width:408px){
  /* Keep the front-page service cards inside narrow phone viewports. */
  .front .services .service-grid{
    width:100%;
    min-width:0;
    overflow:visible;
  }
  .front .services .service-item{
    width:100%;
    min-width:0;
    max-width:100%;
  }
}

@media(max-width:402px){
  .front,.site-footer--front{--front-deco-scale:calc(100vw / 402px)}

  /* Keep the mobile hero copy centered inside the viewport. */
  .front .home-hero__copy{
    width:100%;
    max-width:none;
    box-sizing:border-box;
  }
}

@media(max-width:388px){
  .front .home-hero__copy h1{
    margin-left:16px;
    font-size:clamp(26px,8.48vw,33px);
    letter-spacing:.14em;
    text-align:left;
  }
}

/* ============================================================
 * 2026-07-24: SP hero photo + service-detail section boundaries.
 * All overrides stop below tablet width so the existing desktop
 * and tablet layouts remain unchanged.
 * ============================================================ */
@media(max-width:599px){
  /* Front hero: retain the source aspect ratio, enlarge by cropping,
     and reproduce the two-layer sky/white wave at the photo foot. */
  .front .home-hero__photo{
    overflow:hidden;
  }
  .front .home-hero__photo img{
    object-position:66% 22%;
    transform:scale(1.1);
    transform-origin:50% 42%;
  }
  .front .home-hero__photo::before,
  .front .home-hero__photo::after{
    content:"";
    position:absolute;
    left:0;
    right:0;
    bottom:-1px;
    pointer-events:none;
    background-position:center bottom;
    background-repeat:no-repeat;
    background-size:100% 100%;
  }
  .front .home-hero__photo::before{
    height:135px;
    z-index:1;
    background-image:var(--deco-wave-sky-bottom);
  }
  .front .home-hero__photo::after{
    height:90px;
    z-index:2;
    background-image:var(--deco-wave-white-bottom);
  }

  .service-detail{
    --detail-deco-scale:1;
  }
  .service-detail .deco-dots,
  .page-template-template-service-detail .site-footer--lower .footer-dots{
    background-image:radial-gradient(circle,#ffe17f 0 calc(2.5px * var(--detail-deco-scale)),transparent calc(2.6px * var(--detail-deco-scale)));
    background-position:calc(-5px * var(--detail-deco-scale)) calc(-5px * var(--detail-deco-scale));
    background-size:calc(15px * var(--detail-deco-scale)) calc(15px * var(--detail-deco-scale));
    transform-origin:0 0;
  }

  /* The section waves in the 402px Figma frame are 50px tall. */
  .service-detail .detail-features .deco-wave,
  .service-detail .price .deco-wave{
    height:calc(50px * var(--detail-deco-scale));
    background-position:center;
    background-size:100% 100%;
  }
  .service-detail .detail-features .deco-wave--top,
  .service-detail .price .deco-wave--top{
    background-color:#fff;
    background-image:url(assets/figma/front-wave-top-sp.svg);
  }
  .service-detail .detail-features .deco-wave--bottom,
  .service-detail .price .deco-wave--bottom{
    background-image:url(assets/figma/service-wave-white-bottom-sp.svg);
  }

  /* Intro/Stores -> sky sections: yellow pair on the left. */
  .service-detail .dg-d-ftl-big,
  .service-detail .dg-d-spbl-big{
    display:block;
    left:calc(-71.289px * var(--detail-deco-scale));
    top:calc(79.677px * var(--detail-deco-scale));
    width:calc(119.602px * var(--detail-deco-scale));
    height:calc(119.602px * var(--detail-deco-scale));
    transform:rotate(-42.84deg);
  }
  .service-detail .dg-d-ftl-sm,
  .service-detail .dg-d-spbl-sm{
    display:block;
    left:calc(74.463px * var(--detail-deco-scale));
    top:calc(-15.112px * var(--detail-deco-scale));
    width:calc(47.841px * var(--detail-deco-scale));
    height:calc(47.841px * var(--detail-deco-scale));
    transform:rotate(8.539deg);
  }

  /* The two light-blue paws at the right edge of those same waves. */
  .service-detail .detail-features::before,
  .service-detail .detail-features::after,
  .service-detail .price::before,
  .service-detail .price::after{
    content:"";
    position:absolute;
    display:block;
    z-index:2;
    width:calc(27.36px * var(--detail-deco-scale));
    height:calc(23.746px * var(--detail-deco-scale));
    right:calc(53.813px * var(--detail-deco-scale));
    top:0;
    background:#c0dcf3;
    -webkit-mask:url(assets/figma/paw.svg) center/contain no-repeat;
    mask:url(assets/figma/paw.svg) center/contain no-repeat;
    transform:rotate(12.912deg);
    transform-origin:0 0;
    pointer-events:none;
  }
  .service-detail .detail-features::after,
  .service-detail .price::after{
    right:calc(17.516px * var(--detail-deco-scale));
    top:calc(54.213px * var(--detail-deco-scale));
    transform:rotate(-10.664deg);
  }

  /* Features -> Stores: yellow pair on the right; no blue paw trail. */
  .service-detail .dg-d-fsbr-big,
  .service-detail .dg-d-pnbr-big{
    display:block;
    left:auto;
    right:calc(-92.948px * var(--detail-deco-scale));
    top:calc(-114px * var(--detail-deco-scale));
    width:calc(136.71px * var(--detail-deco-scale));
    height:calc(136.712px * var(--detail-deco-scale));
    transform:rotate(60.712deg);
    z-index:0;
  }
  .service-detail .dg-d-fsbr-sm,
  .service-detail .dg-d-pnbr-sm{
    display:block;
    left:auto;
    right:calc(-77.212px * var(--detail-deco-scale));
    top:calc(13.351px * var(--detail-deco-scale));
    width:calc(54.684px * var(--detail-deco-scale));
    height:calc(54.685px * var(--detail-deco-scale));
    transform:rotate(112.092deg);
    z-index:0;
  }
  .service-detail .detail-stores .dstores-paw{
    display:none;
  }

  /* Price -> Notes: the compact four-paw trail used in the SP design. */
  .service-detail .notes-paw{
    width:calc(26.064px * var(--detail-deco-scale));
    height:calc(22.621px * var(--detail-deco-scale));
    transform-origin:0 0;
  }
  .service-detail .notes-paw--one{
    left:calc(5px * var(--detail-deco-scale));
    top:calc(17px * var(--detail-deco-scale));
    transform:rotate(16.327deg);
  }
  .service-detail .notes-paw--two{
    left:calc(43px * var(--detail-deco-scale));
    top:calc(-17px * var(--detail-deco-scale));
    transform:rotate(41.531deg);
  }
  .service-detail .notes-paw--three{
    left:calc(85px * var(--detail-deco-scale));
    top:calc(29px * var(--detail-deco-scale));
    transform:rotate(66.244deg);
  }
  .service-detail .notes-paw--four{
    left:calc(-5px * var(--detail-deco-scale));
    top:calc(-69px * var(--detail-deco-scale));
    transform:rotate(4.47deg);
  }

  /* The Figma heading wraps after the first phrase at phone width. */
  .service-detail .detail-stores h3{
    width:300px;
    max-width:100%;
  }
  .service-detail .detail-stores .store-card__photo{
    height:179px;
    min-height:179px;
    flex:0 0 179px;
  }

  /* Service-detail footer: 318px ornament field + 1104px blue panel
     + 44px copyright, overlapping the preceding white section by 100px. */
  .page-template-template-service-detail .site-footer--lower{
    margin-top:-100px;
    overflow:hidden;
  }
  .page-template-template-service-detail .site-footer--lower .footer-wave{
    height:318px;
  }
  .page-template-template-service-detail .site-footer--lower .footer-wave svg{
    display:block;
    top:268px;
    bottom:auto;
    height:50px;
  }
  .page-template-template-service-detail .site-footer--lower .footer-dots--big{
    display:block;
    z-index:0;
    left:calc(-51.137px * var(--detail-deco-scale));
    top:calc(190px * var(--detail-deco-scale));
    width:calc(169.022px * var(--detail-deco-scale));
    height:calc(169.022px * var(--detail-deco-scale));
    background-image:radial-gradient(circle,#ffe17f 0 calc(3.5px * var(--detail-deco-scale)),transparent calc(3.6px * var(--detail-deco-scale)));
    transform:rotate(-42.84deg);
  }
  .page-template-template-service-detail .site-footer--lower .footer-dots--sm{
    display:block;
    z-index:0;
    left:calc(94.615px * var(--detail-deco-scale));
    top:calc(78px * var(--detail-deco-scale));
    width:calc(47.841px * var(--detail-deco-scale));
    height:calc(47.841px * var(--detail-deco-scale));
    transform:rotate(8.539deg);
  }
  .page-template-template-service-detail .site-footer--lower .footer-wave-paw{
    display:block;
    position:absolute;
    z-index:3;
    background:#c0dcf3;
  }
  .page-template-template-service-detail .site-footer--lower .footer-wave-paw--a{
    right:29px;
    top:191px;
    width:32px;
    height:29px;
    transform:rotate(12.912deg);
  }
  .page-template-template-service-detail .site-footer--lower .footer-wave-paw--b{
    right:-6px;
    top:261px;
    width:31px;
    height:28px;
    transform:rotate(-10.664deg);
  }
  .page-template-template-service-detail .site-footer--lower .footer-dog{
    left:115px;
    top:259px;
    width:111px;
  }
  .page-template-template-service-detail .site-footer--lower .footer-bowl{
    left:33px;
    top:269px;
    width:50px;
  }
  .page-template-template-service-detail .site-footer--lower .footer-panel{
    height:1104px;
    padding:100px 10px;
    box-sizing:border-box;
  }
  .page-template-template-service-detail .site-footer--lower .footer-card{
    width:382px;
    max-width:100%;
    height:904px;
    padding:20px;
    box-sizing:border-box;
  }
  .page-template-template-service-detail .site-footer--lower .footer-brand{
    width:100%;
    height:310px;
    margin:0 0 10px;
    padding:0 30px 50px;
    box-sizing:border-box;
  }
  .page-template-template-service-detail .site-footer--lower .footer-nav{
    width:100%;
    height:194px;
    margin:0 0 20px;
    padding:30px 0 0;
    box-sizing:border-box;
  }
  .page-template-template-service-detail .site-footer--lower .footer-nav li{
    margin:0;
  }
  .page-template-template-service-detail .site-footer--lower .footer-services{
    width:100%;
    height:210px;
    margin:0 0 10px;
    padding:0 0 30px;
    box-sizing:border-box;
  }
  .page-template-template-service-detail .site-footer--lower .footer-sns{
    width:100%;
    height:110px;
    padding:30px 0;
    box-sizing:border-box;
  }
  .page-template-template-service-detail .site-footer--lower .footer-cat{
    right:30px;
    top:385px;
  }
}

@media(max-width:402px){
  .service-detail,
  .page-template-template-service-detail .site-footer--lower{
    --detail-deco-scale:calc(100vw / 402px);
  }
  .service-detail .detail-stores .store-card__photo{
    height:calc(179px * var(--detail-deco-scale));
    min-height:calc(179px * var(--detail-deco-scale));
    flex-basis:calc(179px * var(--detail-deco-scale));
  }
}

@media(max-width:900px){
  /* Prevent the collapsed drawer from leaving a fixed 1px rule at y=61px. */
  .site-nav{
    border:0;
    box-shadow:none;
  }
}

/* ============================================================
 * Front hero (SP): Figma 48:3272, 402 × 913.
 * The photo is an overlapping masked layer, not a normal-flow
 * block below the copy. This removes the false gap around the copy
 * and keeps both lower curves continuous across the viewport.
 * ============================================================ */
@media(max-width:599px){
  .front{
    --home-hero-scale:1;
  }
  .front .home-hero{
    display:block;
    position:relative;
    height:calc(913px * var(--home-hero-scale));
    min-height:calc(913px * var(--home-hero-scale));
    padding:0;
    background:#fff;
    overflow:visible;
  }
  .front .home-hero::after{
    content:"";
    display:block;
    position:absolute;
    inset:0;
    z-index:0;
    pointer-events:none;
    background:url(assets/figma/home-hero-blue-back-sp.svg) center top/100% 100% no-repeat;
  }
  .front .home-hero .hero-paw{
    z-index:3;
  }
  .front .home-hero__copy{
    position:absolute;
    left:max(0px,calc((100% - 402px) / 2));
    top:0;
    z-index:auto;
    width:min(402px,100%);
    max-width:none;
    margin:0;
    padding:
      calc(120px * var(--home-hero-scale))
      calc(24px * var(--home-hero-scale))
      calc(46px * var(--home-hero-scale))
      calc(46px * var(--home-hero-scale));
    box-sizing:border-box;
    transform:none;
  }
  .front .home-hero__copy::before{
    left:0;
    right:0;
    top:auto;
    bottom:0;
    z-index:2;
    height:calc(490px * var(--home-hero-scale));
    background-size:100% 100%;
  }
  .front .home-hero__copy h1,
  .front .home-hero__copy .title-line,
  .front .home-hero__copy p{
    position:relative;
    z-index:4;
  }
  .front .home-hero__copy h1{
    margin-left:calc(16px * var(--home-hero-scale));
    font-size:calc(36px * var(--home-hero-scale));
    line-height:1.5;
    letter-spacing:.16em;
    -webkit-text-stroke:calc(6px * var(--home-hero-scale)) #fff;
  }
  .front .home-hero__copy .title-line{
    width:calc(301.761px * var(--home-hero-scale));
    max-width:100%;
    margin:
      calc(15px * var(--home-hero-scale))
      0
      calc(14.542px * var(--home-hero-scale))
      calc(4px * var(--home-hero-scale));
  }
  .front .home-hero__copy .title-line b{
    width:calc(20.763px * var(--home-hero-scale));
    height:calc(12.458px * var(--home-hero-scale));
  }
  .front .home-hero__copy p{
    width:calc(316px * var(--home-hero-scale));
    max-width:100%;
    font-size:calc(12px * var(--home-hero-scale));
    line-height:calc(22.148px * var(--home-hero-scale));
  }
  .front .home-hero__photo{
    display:block;
    position:absolute;
    left:0;
    top:calc(63px * var(--home-hero-scale));
    z-index:1;
    width:100%;
    height:calc(811px * var(--home-hero-scale));
    margin:0;
    overflow:hidden;
    -webkit-mask:url(assets/figma/home-hero-photo-mask-sp.svg) center/100% 100% no-repeat;
    mask:url(assets/figma/home-hero-photo-mask-sp.svg) center/100% 100% no-repeat;
  }
  .front .home-hero__photo img{
    position:absolute;
    left:0;
    top:calc(313px * var(--home-hero-scale));
    width:100%;
    height:calc(514px * var(--home-hero-scale));
    max-width:none;
    object-fit:cover;
    object-position:64% center;
    transform:none;
  }
  .front .home-hero__photo::before,
  .front .home-hero__photo::after{
    content:none;
    background:none;
  }
  .front .about{
    margin-top:calc(-37px * var(--home-hero-scale));
  }
}

@media(max-width:402px){
  .front{
    --home-hero-scale:calc(100vw / 402px);
  }
}

/* Keep the 180px tablet price wave below the final price card. */
@media(min-width:600px) and (max-width:900px){
  .service-detail .price{
    padding-bottom:180px;
  }

  /* Keep the first stores paw in the wave area, clear of the final feature copy. */
  .service-detail .detail-stores .dstores-paw--one{
    top:-112px;
  }
}

@media(max-width:599px){
  /* Figma uses one continuous yellow grid at the Features -> Stores boundary. */
  .service-detail .detail-stores .dg-d-fsbr-big{
    z-index:2;
  }
  .service-detail .detail-stores .dg-d-fsbr-sm{
    display:none;
  }
}

/* Keep the front SP hero waves above the following white section. */
@media(max-width:599px){
  .front .home-hero{
    z-index:1;
  }
  .front .about{
    z-index:0;
  }
}

/* At intermediate phone widths, align the 100vw copy panel with the viewport. */
@media(min-width:403px) and (max-width:599px){
  .front .home-hero__copy::before{
    left:calc(50% - 50vw);
    right:auto;
    width:100vw;
  }
}

/* Store detail SP hero: restore Figma's paw trails and blue-to-white wave. */
@media(max-width:599px){
  .store .store-hero{
    --store-sp-stage-height:min(101.244vw,407px);
    --store-sp-strip-height:min(6.716vw,27px);
    padding:64px 0 40px;
    isolation:isolate;
  }
  .store .store-hero::before{
    display:none;
  }
  .store .store-hero::after{
    content:"";
    display:block;
    position:absolute;
    left:0;
    top:64px;
    z-index:0;
    width:100%;
    height:calc(var(--store-sp-stage-height) + 190px);
    background:url(assets/figma/store-hero-blue-back-sp.svg) center/100% 100% no-repeat;
    pointer-events:none;
  }
  .store .store-hero__stage{
    position:relative;
    z-index:1;
    width:100%;
    height:var(--store-sp-stage-height);
    aspect-ratio:auto;
    padding:var(--store-sp-strip-height) 0 0;
    box-sizing:border-box;
    overflow:visible;
    border-radius:0;
    background:transparent;
  }
  .store .store-hero__stage>img.store-hero-img--dog{
    display:block;
    position:relative;
    left:0;
    top:0;
    z-index:2;
    width:100%;
    height:calc(var(--store-sp-stage-height) - var(--store-sp-strip-height));
    max-width:none;
    object-fit:cover;
    object-position:center center;
  }
  .store .store-hero__stage>img.store-hero-paw{
    display:block;
    position:absolute;
    z-index:3;
    max-width:none;
    height:auto;
    pointer-events:none;
  }
  .store .store-hero__stage>img.store-hero-paw--left{
    left:max(-110px,-27.363vw);
    top:min(59.702vw,240px);
    width:min(63.93vw,257px);
  }
  .store .store-hero__stage>img.store-hero-paw--right{
    left:auto;
    right:max(-136px,-33.831vw);
    top:max(-45px,-11.194vw);
    width:min(66.667vw,268px);
    -webkit-mask-image:radial-gradient(circle min(10.448vw,42px) at 25% 70%,transparent 0 96%,#000 100%);
    mask-image:radial-gradient(circle min(10.448vw,42px) at 25% 70%,transparent 0 96%,#000 100%);
  }
  .store .store-hero__copy{
    position:relative;
    z-index:4;
    padding:0 24px;
  }
  .store .store-hero__copy .store-hero-spark{
    left:calc(50% + 103px);
  }
  .store .store-hero__copy::before{
    content:none;
  }
  .store .store-hero__copy .title-line{
    width:calc(100% + 16px);
    max-width:370px;
    background:#fff;
    border-top:2px solid var(--blue);
    transform:translateX(-8px);
  }
}

/* Lock the page behind the SP/tablet drawer while keeping the drawer scrollable. */
@media(max-width:900px){
  html:has(.nav-toggle:checked),
  body:has(.nav-toggle:checked){
    overflow:hidden;
    overscroll-behavior:none;
  }
  .nav-toggle:checked ~ .site-nav{
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
  }
}

/* Use one continuous yellow grid at the Price -> Notes SP boundary. */
@media(max-width:599px){
  .service-detail .notes .dg-d-pnbr-big{
    z-index:2;
  }
  .service-detail .notes .dg-d-pnbr-sm{
    display:none;
  }
}

/* Service detail: one fluid desktop composition with fixed maximum widths. */
@media(min-width:901px){
  .service-detail .detail-features .feature-row{
    --detail-feature-media:min(44%,500px);
    left:50%;
    width:min(calc(100% - 80px),1140px);
    grid-template-columns:minmax(0,var(--detail-feature-media)) minmax(0,1fr);
    gap:50px;
    transform:translateX(-50%);
  }
  .service-detail .detail-features .feature-row img{
    width:100%;
    height:auto;
    aspect-ratio:5 / 3;
  }
  .service-detail .detail-features .feature-row--two{
    grid-template-columns:minmax(0,1fr) minmax(0,var(--detail-feature-media));
  }
  .service-detail .detail-features .feature-row--one .feature-no,
  .service-detail .detail-features .feature-row--three .feature-no{
    left:max(-57px,calc(20px + 50% - 50vw));
  }
  .service-detail .detail-features .feature-row--two .feature-no{
    left:calc(100% - var(--detail-feature-media) - 57px);
  }

  .service-detail .detail-stores .shop-grid{
    display:grid;
    left:50%;
    width:min(calc(100% - 40px),1200px);
    grid-template-columns:repeat(4,minmax(0,270px));
    gap:36px 29.3333px;
    justify-content:center;
    transform:translateX(-50%);
  }
  .service-detail .detail-stores .store-card{
    width:100%;
    max-width:270px;
    min-width:0;
    flex:none;
  }
  .service-detail .detail-stores .store-card__photo{
    height:auto;
    aspect-ratio:1 / 1;
  }
  .service-detail .detail-stores .store-card small{
    width:100%;
    margin-left:0;
    padding:10px 8px;
    box-sizing:border-box;
  }
  .service-detail .detail-stores .store-card__tags{
    margin-right:8px;
    margin-left:8px;
    gap:6px;
  }

  .service-detail .price .price-tables{
    left:50%;
    width:min(calc(100% - 40px),1168px);
    grid-template-columns:minmax(0,min(54.623%,638px)) minmax(0,1fr);
    gap:30px;
    transform:translateX(-50%);
  }

  .service-detail .notes .note-grid{
    left:50%;
    width:min(calc(100% - 80px),1140px);
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:30px;
    transform:translateX(-50%);
  }
  .service-detail .notes .note-grid>div{
    min-width:0;
  }
}

/* Service detail: restore breathing room between the stores lead and cards. */
@media(min-width:901px){
  .service-detail .detail-stores{
    height:1236px;
  }
  .service-detail .detail-stores .shop-grid{
    top:564px;
  }
  .service-detail .detail-stores .cta-btn{
    top:1115px;
  }
}

@media(min-width:600px) and (max-width:900px){
  .service-detail .detail-stores .shop-grid{
    margin-top:50px;
  }
}

/* ============================================================
 * サイトマップ（Figma 152:2513）
 * 既存ページへ影響させないため .sitemap-page 配下だけで完結させる。
 * ============================================================ */
.sitemap-page{
  min-height:780px;
  padding:158px 24px 170px;
  background:var(--sky);
}
.sitemap-page__head{
  margin:0 auto 94px;
  text-align:center;
}
.sitemap-page__head p,
.sitemap-page__head h1{
  margin:0;
}
.sitemap-page__head p{
  color:var(--blue);
  font-size:24px;
  font-weight:700;
  line-height:32px;
  letter-spacing:.04em;
}
.sitemap-page__head h1{
  margin-top:16px;
  color:#594f4c;
  font-size:40px;
  font-weight:700;
  line-height:1.4;
  letter-spacing:.12em;
}
.sitemap-page__card{
  width:min(640px,100%);
  margin:0 auto;
  padding:28px 40px 34px;
  border-radius:2px;
  background:#fff;
  box-shadow:0 8px 30px rgba(0,120,180,.04);
}
.sitemap-list,
.sitemap-list ul{
  margin:0;
  padding:0;
  list-style:none;
}
.sitemap-list{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.sitemap-list > li > a{
  display:inline-flex;
  align-items:center;
  gap:10px;
  color:#594f4c;
  font-size:18px;
  font-weight:500;
  line-height:32px;
}
.sitemap-list > li > a::before{
  content:"";
  width:9px;
  height:9px;
  flex:none;
  border-top:2px solid var(--blue);
  border-right:2px solid var(--blue);
  transform:rotate(45deg);
}
.sitemap-list ul{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:6px 22px;
  margin:7px 0 3px 22px;
}
.sitemap-list ul a{
  display:inline-flex;
  align-items:center;
  gap:8px;
  color:#594f4c;
  font-size:16px;
  font-weight:500;
  line-height:28px;
}
.sitemap-list ul a::before{
  content:"";
  width:5px;
  height:5px;
  flex:none;
  border-radius:50%;
  background:var(--yellow-deep);
}
.sitemap-list a:hover{
  color:var(--blue);
  opacity:1;
}

@media(max-width:900px){
  .sitemap-page{
    min-height:0;
    padding:126px 24px 110px;
  }
  .sitemap-page__head{
    margin-bottom:58px;
  }
  .sitemap-page__head p{
    font-size:18px;
    line-height:28px;
  }
  .sitemap-page__head h1{
    margin-top:10px;
    font-size:34px;
  }
}

@media(max-width:599px){
  .sitemap-page{
    padding:112px 17px 86px;
  }
  .sitemap-page__head{
    margin-bottom:42px;
  }
  .sitemap-page__head h1{
    font-size:30px;
    letter-spacing:.08em;
  }
  .sitemap-page__card{
    padding:24px 22px 28px;
    border-radius:10px;
  }
  .sitemap-list{
    gap:8px;
  }
  .sitemap-list > li > a{
    font-size:16px;
    line-height:28px;
  }
  .sitemap-list ul{
    grid-template-columns:1fr;
    gap:4px;
    margin-left:20px;
  }
  .sitemap-list ul a{
    font-size:14px;
    line-height:25px;
  }
}

/* Store detail SP: keep every service card inside the available column. */
@media(max-width:599px){
  .store .services--store .service-item{
    width:100%;
    max-width:100%;
    min-width:0;
    box-sizing:border-box;
  }
  .store .services--store .service-item strong,
  .store .services--store .service-item small{
    max-width:100%;
    overflow-wrap:anywhere;
  }
}

/* Let service-detail cards and all footer variants contract fluidly. */
@media(min-width:901px){
  .service-detail .notes .note-grid>div{
    height:auto;
    min-height:184px;
  }
  .site-footer--front .footer-card,
  .site-footer--lower .footer-card{
    width:min(calc(100% - 40px),1168px);
    grid-template-columns:minmax(0,361fr) minmax(0,220fr) minmax(0,317fr) minmax(90px,130fr);
  }
  .site-footer--store .footer-card{
    width:min(calc(100% - 40px),1168px);
    height:auto;
    min-height:599px;
    grid-template-columns:minmax(0,390fr) minmax(0,548fr) minmax(90px,110fr);
    grid-template-rows:auto minmax(0,1fr);
  }
  .site-footer--store .footer-license{
    width:100%;
    max-width:560px;
  }
  .site-footer--front .footer-sns,
  .site-footer--lower .footer-sns{
    padding-right:clamp(10px,calc(6.67vw - 50.1px),30px);
    padding-left:clamp(20px,calc(10vw - 70.1px),50px);
  }
  .site-footer--store .footer-sns{
    padding-right:clamp(10px,calc(6.67vw - 50.1px),30px);
    padding-left:clamp(20px,calc(10vw - 70.1px),50px);
  }
  .site-footer--front .footer-nav li,
  .site-footer--lower .footer-nav li{
    margin-bottom:clamp(16px,1.8vw,20px);
  }
}

/* ============================================================
 * お問い合わせ・会社概要・404
 * Figmaの本文を既存ヘッダー／フッターへ接続する下層ページ専用スタイル。
 * ============================================================ */
.contact-page,
.company-page,
.not-found-page{
  position:relative;
  padding:156px 24px 150px;
  background:var(--sky);
}
.lower-simple-head{
  margin:0 auto;
  text-align:center;
}
.lower-simple-head p,
.lower-simple-head h1{
  margin:0;
}
.lower-simple-head p{
  color:var(--blue);
  font-size:24px;
  font-weight:700;
  line-height:32px;
  letter-spacing:.04em;
}
.lower-simple-head h1{
  margin-top:16px;
  color:#594f4c;
  font-size:40px;
  font-weight:700;
  line-height:1.45;
  letter-spacing:.08em;
}

/* Contact */
.contact-page{
  min-height:1120px;
}
.contact-form{
  position:relative;
  display:flex;
  width:min(600px,100%);
  margin:54px auto 0;
  flex-direction:column;
  gap:30px;
}
.contact-form__field{
  display:flex;
  flex-direction:column;
  gap:6px;
}
.contact-form__field label{
  display:flex;
  align-items:center;
  gap:7px;
  color:#4a4a4a;
  font-size:16px;
  font-weight:500;
  line-height:24px;
}
.contact-form__paw{
  width:20px;
  height:18px;
  flex:none;
  background:var(--blue);
  -webkit-mask:url(assets/figma/paw.svg) center/contain no-repeat;
  mask:url(assets/figma/paw.svg) center/contain no-repeat;
}
.contact-form__required{
  margin-left:4px;
  padding:1px 7px;
  border-radius:999px;
  background:#f2ad38;
  color:#fff;
  font-size:11px;
  line-height:18px;
}
.contact-form input[type="text"],
.contact-form input[type="email"],
.contact-form input[type="tel"],
.contact-form textarea{
  width:100%;
  min-height:44px;
  margin:0;
  padding:10px 14px;
  border:1px solid var(--blue);
  border-radius:10px;
  outline:0;
  background:#fff;
  color:#4a4a4a;
  font:500 16px/1.5 var(--font);
  box-shadow:none;
}
.contact-form textarea{
  min-height:150px;
  resize:vertical;
}
.contact-form input::placeholder{
  color:#bfbfbf;
}
.contact-form input:focus,
.contact-form textarea:focus{
  border-color:var(--brand-700);
  box-shadow:0 0 0 3px rgba(0,159,230,.14);
}
.contact-form__privacy{
  display:flex;
  align-items:flex-start;
  justify-content:center;
  gap:9px;
  color:#594f4c;
  font-size:14px;
  font-weight:500;
  line-height:24px;
}
.contact-form__privacy input{
  width:18px;
  height:18px;
  margin-top:3px;
  accent-color:var(--blue);
}
.contact-form__privacy a{
  color:var(--blue);
  text-decoration:underline;
  text-underline-offset:3px;
}
.contact-form__submit{
  align-self:center;
  min-width:190px;
  min-height:52px;
  padding:12px 36px;
  border:0;
  border-radius:999px;
  background:var(--blue);
  color:#fff;
  font:700 18px/26px var(--font);
  cursor:pointer;
}
.contact-form__submit:hover{
  background:var(--brand-600);
}
.contact-form__notice{
  width:min(600px,100%);
  margin:38px auto -20px;
  padding:13px 18px;
  border-radius:10px;
  font-size:14px;
  font-weight:500;
  text-align:center;
}
.contact-form__notice--success{
  background:#e7f8ef;
  color:#207748;
}
.contact-form__notice--error{
  background:#fff1f1;
  color:#a33a3a;
}
.contact-form__trap{
  position:absolute;
  left:-10000px;
  width:1px;
  height:1px;
  overflow:hidden;
}
.contact-form__actions{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
}

/* ------------------------------------------------------------
 * Contact Form 7 互換
 *  CF7 が生成するラッパー span・応答領域・スピナーを、既存の
 *  .contact-form（flex column / gap:30px）へ馴染ませる。
 *  入力欄そのものは .contact-form input[...] の子孫セレクタが
 *  引き続き効くため、追加指定は不要。
 * ------------------------------------------------------------ */
/* 各コントロールを包む span。ブロック化して input の width:100% を効かせる */
.contact-form .wpcf7-form-control-wrap{
  display:block;
}
/* スクリーンリーダー用の応答領域は flex の隙間を作らないよう画面外へ */
.contact-form .screen-reader-response{
  position:absolute;
  left:-10000px;
  width:1px;
  height:1px;
  overflow:hidden;
}
/* 同意チェックボックス：CF7 は内側に label を生成するのでラッパーを透過させる */
.contact-form__privacy .wpcf7-form-control-wrap,
.contact-form__privacy .wpcf7-acceptance,
.contact-form__privacy .wpcf7-list-item{
  display:block;
  width:100%;
  margin:0;
}
.contact-form__privacy label{
  display:flex;
  align-items:flex-start;
  justify-content:center;
  gap:9px;
  cursor:pointer;
}
/* 送信中スピナーはボタン横に置き、行の高さを動かさない */
.contact-form .wpcf7-spinner{
  margin:0;
}
/* 入力エラー表示 */
.contact-form .wpcf7-not-valid-tip{
  margin-top:4px;
  color:#a33a3a;
  font-size:13px;
  font-weight:500;
}
.contact-form input.wpcf7-not-valid,
.contact-form textarea.wpcf7-not-valid{
  border-color:#d97070;
}
/* 送信結果メッセージ：自前の .contact-form__notice と見た目を揃える */
.contact-form .wpcf7-response-output{
  width:100%;
  margin:0;
  padding:13px 18px;
  border:0;
  border-radius:10px;
  font-size:14px;
  font-weight:500;
  text-align:center;
}
.contact-form.sent .wpcf7-response-output{
  background:#e7f8ef;
  color:#207748;
}
.contact-form.invalid .wpcf7-response-output,
.contact-form.unaccepted .wpcf7-response-output,
.contact-form.spam .wpcf7-response-output,
.contact-form.aborted .wpcf7-response-output,
.contact-form.failed .wpcf7-response-output{
  background:#fff1f1;
  color:#a33a3a;
}

/* Company */
.company-page{
  min-height:950px;
}
.company-page__card{
  width:min(1100px,100%);
  margin:104px auto 0;
  padding:70px 170px;
  background:#fff;
}
.company-table{
  width:100%;
  border-collapse:collapse;
  table-layout:fixed;
  color:#333;
  font-size:16px;
  font-weight:500;
  line-height:1.6;
  letter-spacing:.04em;
}
.company-table th,
.company-table td{
  min-height:67px;
  padding:20px;
  border-top:1px solid #dae0e0;
  border-bottom:1px solid #dae0e0;
  text-align:left;
  vertical-align:middle;
}
.company-table th{
  width:225px;
  background:#f7f7f7;
  font-weight:700;
}
.company-table td{
  background:#fff;
}

/* 404 */
.not-found-page{
  min-height:1780px;
}
.not-found-page__visual{
  width:510px;
  height:446px;
  margin:24px auto 0;
  object-fit:contain;
}
.not-found-page__latest{
  margin-top:-24px;
}
.not-found-page__latest h2{
  margin:0 0 34px;
  color:#594f4c;
  font-size:20px;
  font-weight:500;
  line-height:30px;
  text-align:center;
}
.not-found-grid{
  display:grid;
  width:min(1160px,100%);
  margin:0 auto;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:40px;
}
.not-found-card{
  min-width:0;
  overflow:hidden;
  border-radius:24px;
  background:#fff;
  box-shadow:0 4px 5px rgba(0,0,0,.2);
}
.not-found-card__image{
  display:block;
  height:240px;
  overflow:hidden;
  background:#fff;
}
.not-found-card__image img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.not-found-card__body{
  display:flex;
  min-height:290px;
  padding:22px 18px 18px;
  flex-direction:column;
}
.not-found-card h3{
  margin:0;
  color:#594f4c;
  font-size:20px;
  font-weight:700;
  line-height:1.5;
  letter-spacing:.01em;
}
.not-found-card__body>p{
  margin:16px 0 22px;
  color:#594f4c;
  font-size:15px;
  font-weight:500;
  line-height:1.7;
}
.not-found-card__foot{
  display:flex;
  margin-top:auto;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
.not-found-card__author{
  display:flex;
  min-width:0;
  align-items:center;
  gap:8px;
}
.not-found-card__author>img{
  width:44px;
  height:44px;
  flex:none;
  border-radius:50%;
  object-fit:cover;
}
.not-found-card__author>span{
  display:flex;
  min-width:0;
  flex-direction:column;
}
.not-found-card__author b{
  overflow:hidden;
  color:#202842;
  font-size:13px;
  line-height:18px;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.not-found-card__author time{
  color:rgba(30,30,30,.55);
  font-size:11px;
  line-height:15px;
}
.not-found-card__more{
  flex:none;
  padding:8px 14px;
  border-radius:8px;
  background:var(--blue);
  color:#fff;
  font-size:14px;
  font-weight:700;
  line-height:22px;
}
.not-found-page__home{
  display:flex;
  width:max-content;
  margin:52px auto 0;
  padding:12px 32px;
  border:2px solid var(--blue);
  border-radius:999px;
  background:#fff;
  color:var(--blue);
  font-size:16px;
  font-weight:700;
}

@media(max-width:900px){
  .contact-page,
  .company-page,
  .not-found-page{
    padding:126px 24px 110px;
  }
  .lower-simple-head p{
    font-size:18px;
    line-height:28px;
  }
  .lower-simple-head h1{
    margin-top:10px;
    font-size:34px;
  }
  .contact-page{
    min-height:0;
  }
  .contact-form{
    margin-top:48px;
  }
  .company-page{
    min-height:0;
  }
  .company-page__card{
    margin-top:64px;
    padding:42px;
  }
  .company-table th{
    width:180px;
  }
  .not-found-page{
    min-height:0;
  }
  .not-found-page__visual{
    width:min(440px,100%);
    height:auto;
  }
  .not-found-page__latest{
    margin-top:0;
  }
  .not-found-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:26px;
  }
  .not-found-card:last-child{
    grid-column:1 / -1;
    width:min(360px,100%);
    justify-self:center;
  }
}

@media(max-width:599px){
  .contact-page,
  .company-page,
  .not-found-page{
    padding:112px 17px 84px;
  }
  .lower-simple-head h1{
    font-size:30px;
    letter-spacing:.04em;
  }
  .contact-form{
    margin-top:40px;
    gap:24px;
  }
  .contact-form__field label{
    font-size:15px;
  }
  .contact-form input[type="text"],
  .contact-form input[type="email"],
  .contact-form input[type="tel"],
  .contact-form textarea{
    font-size:16px;
  }
  .company-page__card{
    margin-top:44px;
    padding:18px;
    border-radius:10px;
  }
  .company-table,
  .company-table tbody,
  .company-table tr,
  .company-table th,
  .company-table td{
    display:block;
    width:100%;
  }
  .company-table tr{
    margin-bottom:12px;
  }
  .company-table th,
  .company-table td{
    min-height:0;
    padding:13px 15px;
  }
  .company-table th{
    border-bottom:0;
  }
  .company-table td{
    overflow-wrap:anywhere;
  }
  .not-found-page__visual{
    width:min(360px,100%);
    margin-top:14px;
  }
  .not-found-page__latest h2{
    margin-bottom:26px;
    font-size:18px;
  }
  .not-found-grid{
    grid-template-columns:1fr;
    gap:24px;
  }
  .not-found-card:last-child{
    grid-column:auto;
    width:100%;
  }
  .not-found-card__image{
    height:220px;
  }
  .not-found-card__body{
    min-height:250px;
  }
}

/* ============================================================
 * プライバシーポリシー／対象下層ページとフッターの背景接続
 * ============================================================ */
/* .entry-page は page.php / search.php（専用テンプレートを持たないページ）用。
   プライバシーポリシーと同じ「下層シンプルページ」の見た目を共有する。 */
.privacy-page,
.entry-page{
  position:relative;
  min-height:800px;
  padding:156px 24px 150px;
  background:var(--sky);
}
.privacy-page__content,
.entry-page__content{
  width:min(1100px,100%);
  margin:80px auto 0;
  padding:56px 70px;
  background:#fff;
}
.privacy-page__content p,
.entry-page__content p{
  margin:0;
  color:#594f4c;
  font-size:16px;
  font-weight:500;
  line-height:1.8;
  letter-spacing:.04em;
}
@media(max-width:900px){
  .privacy-page,
  .entry-page{
    min-height:0;
    padding:126px 24px 110px;
  }
  .privacy-page__content,
  .entry-page__content{
    margin-top:64px;
    padding:42px;
  }
}

@media(max-width:599px){
  .privacy-page,
  .entry-page{
    padding:112px 17px 84px;
  }
  .privacy-page__content,
  .entry-page__content{
    margin-top:44px;
    padding:24px 20px;
    border-radius:10px;
  }
}

/* 固定ページ本文（ブロックエディタからの出力）と検索結果の最低限の体裁。 */
.entry-page__content > * + *{
  margin-top:1.4em;
}
.entry-page__content h2{
  font-size:26px;
  font-weight:700;
  line-height:1.5;
  letter-spacing:.06em;
}
.entry-page__content h3{
  font-size:20px;
  font-weight:700;
  line-height:1.6;
  letter-spacing:.06em;
}
.entry-page__content a{
  color:var(--blue);
  text-decoration:underline;
  text-underline-offset:3px;
}
.entry-page__content img{
  max-width:100%;
  height:auto;
}
.entry-page__content ul,
.entry-page__content ol{
  padding-left:1.4em;
  color:#594f4c;
  font-size:16px;
  line-height:1.8;
}
.entry-page__content li + li{
  margin-top:.4em;
}
.search-result{
  padding:24px 0;
  border-bottom:1px solid var(--line);
}
.search-result:first-of-type{
  padding-top:0;
}
.search-result__title{
  font-size:20px;
  font-weight:700;
  line-height:1.6;
}
.search-result__title a{
  color:var(--ink-strong);
  text-decoration:none;
}
.search-result__title a:hover{
  color:var(--blue);
}
.search-result__meta{
  margin-top:6px;
  color:var(--muted);
  font-size:14px;
}
/* wp_link_pages（本文をページ分割した時のページ送り）。 */
.entry-page__pages{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:32px;
  font-weight:700;
}
.entry-page__pages a{
  color:var(--blue);
}

/* single.php の前後記事ナビ。 */
.post-nav{
  display:flex;
  flex-wrap:wrap;
  gap:16px;
  margin-top:48px;
  padding-top:28px;
  border-top:1px solid var(--line);
}
.post-nav__link{
  flex:1 1 240px;
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:4px;
  padding:14px 18px;
  border:1px solid var(--sky-line);
  border-radius:var(--radius);
  background:var(--sky-2);
  color:var(--ink);
  text-decoration:none;
}
.post-nav__link:hover{
  border-color:var(--blue);
}
.post-nav__link span{
  color:var(--blue);
  font-size:13px;
  font-weight:700;
  letter-spacing:.08em;
}
.post-nav__link b{
  font-size:15px;
  font-weight:500;
  line-height:1.6;
  /* 長いタイトルでレイアウトを崩さないよう 2 行で省略する。 */
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  overflow:hidden;
}
.post-nav__link--next{
  text-align:right;
}

/* 視覚的には隠すが読み上げには残す（WordPress 慣例のクラス名）。 */
.screen-reader-text{
  position:absolute;
  width:1px;
  height:1px;
  margin:-1px;
  padding:0;
  border:0;
  clip-path:inset(50%);
  overflow:hidden;
  white-space:nowrap;
}
.search-form{
  display:flex;
  gap:10px;
  width:min(600px,100%);
  margin:0 auto 40px;
}
.search-form input[type="search"]{
  flex:1;
  min-height:44px;
  padding:10px 14px;
  border:1px solid var(--blue);
  border-radius:10px;
  outline:0;
  background:#fff;
  font:500 16px/1.5 var(--font);
}
.search-form input[type="search"]:focus{
  border-color:var(--brand-700);
  box-shadow:0 0 0 3px rgba(0,159,230,.14);
}
.search-form button{
  min-height:44px;
  padding:0 24px;
  border:0;
  border-radius:999px;
  background:var(--blue);
  color:#fff;
  font:700 16px/1 var(--font);
  cursor:pointer;
}
.search-form button:hover{
  background:var(--brand-600);
}

/* ============================================================
 * サービス詳細ページの可変セクション
 *  Figma のレイアウトは「特徴 3 件」「お願い 3 件」ぴったりに絶対配置で
 *  合わせてある。件数が 3 でないサービスでは破綻するため、そのときだけ
 *  流し込みレイアウトへ切り替える（3 件なら元の Figma 配置のまま）。
 * ============================================================ */
@media(min-width:901px){
  .detail-features--flow{
    height:auto;
    padding:150px 24px 160px;
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:100px;
    box-sizing:border-box;
  }
  .detail-features--flow .pill-title{
    position:relative;
    left:auto;
    top:auto;
    transform:none;
    margin:0;
  }
  .detail-features--flow .feature-row{
    position:relative;
    left:auto;
    top:auto;
    width:min(1140px,100%);
    margin:0;
  }
  /* Figma の 02 と同じく、偶数番目は画像を右に置いて交互配置にする。 */
  .detail-features--flow .feature-row:nth-of-type(even){
    grid-template-columns:1fr 500px;
  }
  .detail-features--flow .feature-row:nth-of-type(even) img{
    grid-column:2;
    grid-row:1;
  }
  .detail-features--flow .feature-row:nth-of-type(even) div{
    grid-column:1;
    grid-row:1;
  }
  .detail-features--flow .feature-row:nth-of-type(even) .feature-no{
    left:583px;
  }

  .notes--flow{
    height:auto;
    padding:150px 24px 120px;
    display:flex;
    flex-direction:column;
    align-items:center;
    box-sizing:border-box;
  }
  .notes--flow .pill-title{
    position:relative;
    left:auto;
    top:auto;
    transform:none;
    margin:0;
  }
  .notes--flow h3{
    margin:50px 0 0;
    padding-top:0;
  }
  .notes--flow .note-grid{
    position:static;
    left:auto;
    top:auto;
    width:min(1140px,100%);
    margin:50px 0 0;
    grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
  }
  .notes--flow .note-grid>div{
    height:auto;
    min-height:150px;
  }
  .notes--flow .divider,
  .notes--flow .notes__divider{
    position:static;
    left:auto;
    top:auto;
    bottom:auto;
    width:min(860px,100%);
    margin:56px auto 0;
  }
  .notes--flow .notes__actions{
    position:static;
    left:auto;
    right:auto;
    top:auto;
    margin:40px 0 0;
  }
}

/* ============================================================
 * 店舗（フランチャイズ）の料金表 .price--store
 *  本部の .price は Figma 準拠で高さ 1291px・絶対配置に固定されており、
 *  料金 4 行＋オプション 3 行にぴったり合わせてある。
 *  店舗ごとの料金は行数が変わるため、このクラスが付いたときだけ
 *  内容に合わせて伸びるレイアウトへ切り替える。
 * ============================================================ */
@media(min-width:901px){
  .price--store{
    height:auto;
    min-height:0;
    padding:150px 24px 160px;
    display:flex;
    flex-direction:column;
    align-items:center;
    box-sizing:border-box;
  }
  /* .pill-tail の位置基準を保ったまま、絶対配置から流し込みへ戻す。 */
  .price--store .pill-title{
    position:relative;
    left:auto;
    top:auto;
    transform:none;
    margin:0;
  }
  .price--store h3{
    margin:50px 0 0;
    padding-top:0;
  }
  .price--store>p{
    width:min(900px,100%);
    margin:16px 0 0;
  }
  .price--store .price-tables{
    position:static;
    left:auto;
    top:auto;
    width:min(1168px,100%);
    margin:50px 0 0;
    grid-template-columns:minmax(0,638px) minmax(0,500px);
    justify-content:center;
    align-items:start;
  }
}

/* どの店舗の料金かを示すラベル。 */
.price--store .price__store-name{
  width:auto;
  margin:28px 0 0;
  color:var(--blue);
  font-size:20px;
  font-weight:700;
  line-height:1.6;
  letter-spacing:.08em;
}

/* 行数が可変なので、行数前提の固定高さを全ブレークポイントで解除する。 */
.price--store .price-card,
.price--store .price-card:first-child,
.price--store .price-card:nth-child(2){
  height:auto;
}
.price--store table,
.price--store .price-card:first-child table,
.price--store .price-card:nth-child(2) table{
  height:auto;
}