:root{
  --ivory:#fbf9f3; --tint:#f5f1e6; --green:#5e8c2f; --green-d:#4a7a22; --brown:#3b3630; --muted:#5f584e; --line:#e3dcc8; --card:#ffffff;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;color:var(--brown);background:var(--ivory);line-height:1.85;font-size:16px;font-weight:500;overflow-x:hidden}
img{display:block;max-width:100%;height:auto;border-radius:16px;object-fit:cover}
ul{list-style:none}
a{color:inherit}
.wrap{max-width:1040px;margin:0 auto;padding:0 20px}
.center{text-align:center}
.sp{display:inline}
.sec{padding:56px 0}
.sec-tint{background:var(--tint)}
h1,h2,h3{font-weight:700;line-height:1.5}
/* 見出しのみ明朝（本文・ボタン・注記はゴシックのまま） */
h1,h2,.voice .v1,.voice .v2,.since-h,.closing-h{font-family:"Noto Serif JP","Hiragino Mincho ProN","Yu Mincho",serif}
.hero h1{font-weight:600}
h2{font-size:clamp(21px,5.6vw,30px);margin-bottom:28px}
.small{font-size:14px;color:var(--muted)}
.muted{color:var(--muted)}
.note{margin-top:32px;color:var(--green-d);font-size:17px}
.accent{color:var(--green);font-weight:700}

/* hero */
.hero{padding:22px 0 44px;overflow:hidden;--bleed:20px}
.brand{font-size:20px;font-weight:700;line-height:1.4;margin-bottom:24px}
.brand img{width:min(240px,62vw);height:auto;border-radius:0;mix-blend-mode:multiply}
.brand small{display:block;font-size:11px;font-weight:400;color:var(--muted);margin-top:2px}
.hero-grid{display:grid;grid-template-columns:1.15fr 1fr;gap:14px;align-items:stretch}
.hero h1{font-size:clamp(22px,6.6vw,48px);font-weight:500;letter-spacing:.02em;white-space:nowrap}
.hero h1 .kana{font-size:.84em}
.hero .lead{margin-top:22px;font-size:clamp(12.5px,3.4vw,19px);line-height:1.9;white-space:nowrap}
.hero-text{position:relative;z-index:1;grid-column:1;grid-row:1;padding-top:18px}
.hero-pic{grid-column:2;grid-row:1/3;position:relative;width:calc(100% + 90px + var(--bleed));margin-left:-90px;margin-right:calc(-1 * var(--bleed));height:0;min-height:100%;
  -webkit-mask-image:linear-gradient(to bottom,#000 62%,transparent 100%);mask-image:linear-gradient(to bottom,#000 62%,transparent 100%)}
.hero-img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;object-position:62% 40%;border-radius:0;
  -webkit-mask-image:linear-gradient(to right,transparent 0,rgba(0,0,0,.25) 22%,#000 56%);
          mask-image:linear-gradient(to right,transparent 0,rgba(0,0,0,.25) 22%,#000 56%)}
.voice{grid-column:1/-1;grid-row:2;position:relative;z-index:1;margin-top:18px;text-align:center;color:#463d34;text-shadow:0 0 10px var(--ivory),0 0 18px var(--ivory)}
.voice span{display:block}
.voice .v1{font-size:clamp(19px,6vw,34px);font-weight:700;line-height:1.5;letter-spacing:.01em}
.voice .v2{font-size:clamp(16px,5vw,26px);font-weight:700;line-height:1.6}
.voice .v3{font-size:clamp(12px,3.4vw,16px);font-weight:500;line-height:1.7;margin-top:-2px;color:var(--muted)}
.circles{display:flex;gap:5px;margin-top:20px;width:max-content}
.circles li{flex:none;width:clamp(56px,16.5vw,96px);aspect-ratio:1/1;border-radius:50%;background:rgba(255,255,255,.94);border:1.5px solid var(--green);color:var(--green-d);display:flex;flex-direction:column;align-items:center;justify-content:center;font-weight:700;font-size:clamp(12.5px,3.7vw,17px);line-height:1.3;box-shadow:0 2px 8px rgba(70,61,52,.12)}
.sub{text-align:center;margin-top:22px;margin-bottom:22px;font-size:15px}

/* buttons */
.btn{display:flex;align-items:center;justify-content:center;gap:12px;min-height:56px;padding:12px 24px;background:var(--green);color:#fff;border-radius:999px;text-decoration:none;font-size:17px;font-weight:700;max-width:460px;margin:0 auto;transition:background .2s}
.btn:hover{background:var(--green-d)}
.btn span{font-size:22px;line-height:1}
.btn-outline{background:var(--card);color:var(--green-d);border:1.5px solid var(--green);margin-top:20px;font-size:15px}
.btn-outline:hover{background:var(--tint)}
.is-disabled{opacity:.45;pointer-events:none}
.is-pending{color:var(--muted);font-size:.92em}

/* worry */
.sec-worry{padding-top:48px}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.cards li{background:var(--card);border-radius:8px;border:1px solid var(--line);overflow:hidden}
.cards img{aspect-ratio:1/1;width:100%;border-radius:0}
.cards p{padding:12px 12px 16px;font-size:clamp(12px,3.3vw,15px);line-height:1.8}
/* 横長3行カード（写真は右端をカード色に溶かす） */
.cards-row{grid-template-columns:1fr;gap:12px;max-width:640px;margin:0 auto}
.rb{display:none}
.cards-row .rb{display:inline}
.cards-row li{display:grid;grid-template-columns:42% 1fr;align-items:stretch}
.cards-row img{aspect-ratio:auto;height:100%;min-height:104px;object-fit:cover;
  -webkit-mask-image:linear-gradient(to right,#000 55%,transparent 100%);mask-image:linear-gradient(to right,#000 55%,transparent 100%)}
.cards-row p{align-self:center;padding:14px 14px 14px 0;margin-left:-4%;position:relative;font-size:clamp(13.5px,3.8vw,17px);line-height:1.75;font-weight:500}

/* doubt */
.sec-doubt{background:#fff;padding-bottom:56px}
.doubt-lead{max-width:560px;margin:0 auto;font-size:clamp(17px,5vw,26px);line-height:1.8;font-weight:500;text-align:center;color:#463d34}
.doubt-mark{margin:32px auto 0;text-align:center;font-size:clamp(14px,4.1vw,22px);line-height:2.3;font-weight:500}
.doubt-mark span{display:block}
.doubt-mark span{background:linear-gradient(transparent 62%,#f6dba6 62%);display:table;margin:0 auto;padding:0 6px}
.band{background:var(--green);color:#fff;margin-top:36px;padding:16px 20px;text-align:center}
.band h2{margin:0;font-size:clamp(15px,4.4vw,26px);line-height:1.6;letter-spacing:.04em}
.checks{max-width:560px;margin:32px auto 0;display:grid;gap:14px}
.checks li{position:relative;padding-left:36px;font-size:clamp(14px,3.9vw,18px);line-height:1.7;font-weight:500}
.checks li::before{content:"";position:absolute;left:0;top:.12em;width:24px;height:24px;border-radius:6px;background:var(--green)}
.checks li::after{content:"";position:absolute;left:8px;top:.32em;width:8px;height:13px;border:solid #fff;border-width:0 3px 3px 0;transform:rotate(45deg)}

/* intro */
.sec-intro{padding:40px 0 44px;text-align:center;background:#fff;border-top:1px solid var(--line)}
.since-en2{font-size:13px;letter-spacing:.2em;color:var(--green);font-weight:700;margin-bottom:4px}
.since-h{font-size:clamp(22px,6.4vw,34px);color:var(--green-d);margin-bottom:18px;letter-spacing:.04em}
.since-h .num{font-size:1.45em;line-height:1;margin:0 2px;color:var(--green)}
.sec-intro p:not(.since-en2){font-size:clamp(14px,3.9vw,17px);line-height:1.9;margin-bottom:12px}
.sec-intro .em2{font-weight:700;color:var(--green-d);margin-top:4px;margin-bottom:0}

.intro-photo{width:100%;max-width:640px;height:auto;aspect-ratio:3/2;margin:28px auto 0;border-radius:12px}

/* since */
.since-s{letter-spacing:.12em;color:var(--green-d);font-weight:700;margin-left:4px}
.since{display:flex;align-items:center;justify-content:center;gap:12px;margin:0 auto 22px;padding:12px 16px;background:#fff;border:1.5px solid var(--green);border-radius:999px;width:max-content;max-width:100%}
.since-en{font-size:clamp(10.5px,2.9vw,13px);letter-spacing:.14em;color:var(--green);font-weight:700;border-right:1.5px solid var(--line);padding-right:12px}
.since-ja{font-size:clamp(15px,4.3vw,20px);font-weight:700;color:var(--green-d);letter-spacing:.04em}

/* consult */
.consult h2{margin-bottom:24px}
.consult-body{display:grid;grid-template-columns:.85fr 1.15fr;gap:16px;align-items:center}
.consult-body img{width:100%;aspect-ratio:4/5}
.consult-body img.owner-crop{aspect-ratio:440/650;max-width:none}
.owner-fig figcaption{font-size:clamp(11px,3vw,14px);line-height:1.6;margin-top:8px}
.em{font-size:clamp(13.5px,3.6vw,18px);margin-bottom:16px}
.consult .muted{font-size:clamp(11.5px,3.05vw,16px);margin-bottom:16px}
.bubble{display:inline-block;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:10px 14px;font-size:13px}
.closing .btn{margin-top:32px}

/* points */
.points{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;text-align:center;margin-top:8px}
.points svg{width:64px;height:64px;margin:0 auto 10px;fill:none;stroke:var(--green);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.points svg .solid{fill:var(--green);stroke:var(--green);stroke-width:1}
.points svg .vein{stroke:#fff;stroke-width:2.5;fill:none}
.points svg .smoke{stroke:var(--green);stroke-width:2.5}
.points svg .knock{fill:#fff;stroke:none}
.points h3{font-size:clamp(15px,4.2vw,19px);color:var(--green-d);margin-bottom:6px}
.points p span{display:inline-block;white-space:nowrap}
.points p{font-size:clamp(10.5px,2.95vw,14px);color:var(--muted);line-height:1.7}

/* products */
.products{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.products li{background:var(--card);border-radius:18px;padding:12px 12px 14px;text-align:center}
.products img{width:100%;aspect-ratio:4/3}
.products p{margin-top:12px;font-weight:600;color:var(--green-d);font-size:clamp(14px,3.8vw,18px)}
.products .desc{margin-top:8px;font-weight:400;font-size:clamp(12px,3.3vw,15px);color:var(--brown);line-height:1.7}
.products p small{display:block;font-weight:400;font-size:.72em;color:var(--muted);margin-top:2px}
.products+.small{margin-top:20px}

/* snack / smell */
.snack,.smell{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:center}
.snack-banner{width:100%;height:auto;margin-top:32px}
.snack h2{margin-bottom:14px;font-size:clamp(18px,4.8vw,30px);white-space:nowrap}
.big{font-size:clamp(18px,5vw,26px);color:var(--green-d);margin-bottom:18px;line-height:1.6}
.snack .muted{font-size:clamp(13px,3.5vw,16px)}
.snack figure img{width:100%;aspect-ratio:4/5}
figcaption{text-align:center;font-size:12px;color:var(--muted);margin-top:8px}
.smell h2{font-size:clamp(19px,5vw,28px)}
.smell .muted{margin-bottom:14px;font-size:clamp(13px,3.5vw,16px)}
.smell{grid-template-columns:1fr}
.smell img{width:100%;aspect-ratio:3/2}

/* voice */
.sec-voice{background:var(--tint)}
.review-banner{width:100%;height:auto;border-radius:12px;margin:0 auto}
.reviews{max-width:720px;margin:28px auto 0;display:grid;gap:16px}
.review{background:#e9dec6;border-radius:14px;padding:16px 16px 18px}
.rv-head{display:flex;align-items:center;flex-wrap:wrap;gap:6px 12px;margin-bottom:10px}
.av{width:44px;height:44px;flex:none}
.rv-dog{font-weight:700;font-size:clamp(14px,3.8vw,17px)}
.rv-title{font-weight:700;font-size:clamp(13.5px,3.7vw,16px);background:linear-gradient(transparent 58%,#f0be72 58%);padding:0 6px}
.review p{font-size:clamp(13.5px,3.6vw,16px);line-height:1.9;font-weight:500}
.rv-note{margin-top:18px}

/* faq */
.faq{max-width:720px;margin:0 auto;display:grid;gap:10px}
.faq details{background:var(--card);border:1px solid var(--line);border-radius:14px;overflow:hidden}
.faq summary{list-style:none;cursor:pointer;display:flex;gap:10px;align-items:flex-start;padding:16px 44px 16px 16px;position:relative;font-weight:700;font-size:clamp(14.5px,3.9vw,17px);line-height:1.6;min-height:56px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::before{content:"Q";flex:none;width:26px;height:26px;border-radius:50%;background:var(--green);color:#fff;font-size:14px;display:grid;place-items:center;line-height:1}
.faq summary::after{content:"";position:absolute;right:18px;top:50%;width:9px;height:9px;border-right:2px solid var(--green);border-bottom:2px solid var(--green);transform:translateY(-70%) rotate(45deg);transition:transform .2s}
.faq details[open] summary::after{transform:translateY(-30%) rotate(-135deg)}
.faq details p{padding:0 16px 18px 52px;color:var(--muted);font-size:clamp(13.5px,3.6vw,16px);line-height:1.85}

/* store */
.store-main{width:100%;aspect-ratio:3/2;margin-bottom:12px}
.store-photos{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.store-photos img{width:100%;aspect-ratio:4/3}
.store-card{margin-top:20px;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:24px 20px;text-align:center}
.store-card h3{font-size:20px}
.store-card dl{display:grid;grid-template-columns:auto 1fr;gap:8px 16px;text-align:left;max-width:520px;margin:20px auto 0;font-size:15px}
.store-card dt{color:var(--muted)}
.store-card dd a{text-decoration:underline}
[data-fill="hours"]{white-space:pre-line}
.pay{display:flex;flex-wrap:wrap;gap:6px}
.pay span{background:var(--tint);border-radius:6px;padding:2px 10px;font-size:13.5px;line-height:1.7;white-space:nowrap}
.map{margin-top:18px}
.map iframe{width:100%;height:260px;border:0;border-radius:12px}

.sns-lead{margin-top:24px;font-size:14px;color:var(--muted)}
.sns{display:grid;gap:12px;margin-top:10px}
.sns .btn{margin:0;width:100%;font-size:15px}
.btn-line{background:#06c755;color:#fff}
.btn-line:hover{background:#05a847}
.btn-insta{margin-top:0;background:linear-gradient(45deg,#f09433,#dc2743 55%,#bc1888);color:#fff;border:0}
.btn-insta:hover{background:linear-gradient(45deg,#d9822a,#c41f39 55%,#a3157a)}
.ico{width:22px;height:22px;flex:none}
.btn .ico{margin-right:-4px}
.f-sns{display:flex;gap:18px;margin:6px 0}
.f-sns a{display:inline-flex;align-items:center;gap:6px;text-decoration:none;font-weight:700}

/* footer */
footer{background:var(--green);color:#f1efe2;padding:40px 0 28px;font-size:14px}
footer p{margin-bottom:4px}
footer .is-pending{color:#f1efe2;opacity:.65}
.closing .closing-h{font-size:clamp(21px,6vw,32px);text-align:center;line-height:1.7;margin-bottom:24px}
footer .f-name{font-size:22px;font-weight:600;margin-bottom:8px}
footer a{color:#f1efe2}
footer .copy{margin-top:18px;font-size:12px;opacity:.7}

/* fixed bar */
body{padding-bottom:calc(72px + env(safe-area-inset-bottom))}
.fixbar{position:fixed;left:0;right:0;bottom:0;z-index:50;display:grid;grid-template-columns:1fr 1fr 1fr 1.3fr;gap:6px;padding:8px 8px calc(8px + env(safe-area-inset-bottom));background:rgba(255,255,255,.97);box-shadow:0 -2px 12px rgba(70,61,52,.14)}
.fixbar a{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:3px;min-height:52px;padding:0 2px;border-radius:12px;border:1.5px solid var(--green);color:var(--green-d);background:#fff;text-decoration:none;font-weight:700;font-size:clamp(11px,3vw,14px);white-space:nowrap}
.fixbar svg{width:15px;height:15px;fill:currentColor;flex:none}
.fixbar .fix-line{background:#06c755;border-color:#06c755;color:#fff}
.fixbar a.is-disabled{opacity:.4}

@media(min-width:768px){
  .fixbar a{gap:6px;font-size:15px}
  .fixbar svg{width:20px;height:20px}
  .fixbar{left:50%;right:auto;transform:translateX(-50%);width:min(560px,calc(100% - 32px));bottom:14px;border-radius:16px;padding:8px}
  body{padding-bottom:84px}
  .wrap{padding:0 32px}
  .sec{padding:84px 0}
  .sp{display:none}
  .hero-grid{gap:48px}
  .hero-text{padding-top:44px}
  .hero{--bleed:0px}
  .hero-grid{min-height:min(740px,64vw);grid-template-rows:1fr auto;row-gap:0}
  .hero-pic{width:min(calc(100% + 200px + var(--bleed)),580px);justify-self:end;margin-left:0}
  .hero-img{object-position:58% 30%}
  .voice{margin-top:0;padding-bottom:6px}
  .cards{gap:24px}
  .consult-body,.snack,.smell{gap:48px}
  .smell{grid-template-columns:1fr 1fr}
  .consult-body img,.snack figure img,.smell img{aspect-ratio:4/3}
  .consult-body img{aspect-ratio:4/5;max-width:420px}
  .points{gap:40px}
  .products{gap:28px}
  .store-photos{gap:24px}
  .store-main{aspect-ratio:2/1;margin-bottom:24px}
  .btn{font-size:18px}
}

@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}