@charset "utf-8";
/* =========================================================
   たぬ吉剪定 デモサイト
   カラーは 13_Web構成.md 第5章（G5選定シート）に準拠。色相は変更しない。
   #8CC63F の面には必ず #1A1A1A を載せる（白文字は 2.1:1 で不合格のため使用禁止）
   ========================================================= */

:root{
  /* --- 色 --- */
  --white:#FFFFFF;
  --ink:#1A1A1A;
  --green-pale:#8CC63F;   /* 面・淡：文字は #1A1A1A のみ */
  --green:#5A8126;        /* 文字・ボタン地：白文字 4.6:1 */
  --green-dark:#41601B;   /* ホバー：白文字 7.3:1 */
  --blue-pale:#7FB5D5;    /* 面・淡：文字は #1A1A1A */
  --blue:#377DA6;         /* 副見出し・リンク */
  --bg-green:#F4F9EC;
  --bg-blue:#EFF6FA;
  --line:#E3E7DC;
  --ink-mute:#4A4A4A;

  /* --- 余白・形 --- */
  --wrap:1120px;
  --gutter:24px;
  --sec:96px;
  --radius:8px;
  --shadow:0 2px 8px rgba(0,0,0,.06);

  /* --- 速度（150-200 / 400-700 / 1000ms 以上の3種のみ） --- */
  --t-fast:180ms;
  --t-mid:600ms;
  --t-slow:1200ms;

  --header-h:84px;
}

*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;}
body{
  margin:0;
  font-family:"Noto Sans JP","Hiragino Sans","Yu Gothic","Meiryo",sans-serif;
  font-size:17px;           /* 最低ライン。現行サイトからの最大の改善点 */
  line-height:1.9;
  color:var(--ink);
  background:var(--white);
  font-feature-settings:"palt";
}
@media (min-width:768px){ body{font-size:18px;} }
@media (prefers-reduced-motion:reduce){ html{scroll-behavior:auto;} }

img{max-width:100%;height:auto;display:block;}
a{color:var(--blue);}
h1,h2,h3,h4{line-height:1.5;margin:0 0 .6em;font-weight:700;}
h1{font-size:clamp(30px,5.2vw,46px);line-height:1.4;}
h2{font-size:clamp(24px,3.6vw,31px);}
h3{font-size:clamp(19px,2.2vw,22px);}
p{margin:0 0 1.4em;}
ul{margin:0 0 1.4em;padding-left:1.3em;}
li{margin-bottom:.4em;}

/* 本文の1行の最大幅：40文字前後 */
.prose{max-width:40em;}
.prose-center{max-width:40em;margin-left:auto;margin-right:auto;}

.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--gutter);}
.section{padding:var(--sec) 0;}
@media (max-width:767px){ :root{--sec:64px;} }

.bg-green{background:var(--bg-green);}
.bg-blue{background:var(--bg-blue);}

.lede{font-size:1.06em;color:var(--ink-mute);}
.sub{color:var(--blue);font-weight:700;letter-spacing:.06em;font-size:.86em;margin:0 0 .5em;}

/* 見出し下線（#8CC63F は面ではなく線として使用） */
.h-line{position:relative;padding-bottom:.5em;}
.h-line::after{content:"";position:absolute;left:0;bottom:0;width:64px;height:5px;background:var(--green-pale);border-radius:3px;}
.h-line.is-center::after{left:50%;transform:translateX(-50%);}
.head-center{text-align:center;}

/* =========================================================
   ヘッダー（全ページ・全スクロール位置で電話ボタンを表示し続ける）
   ========================================================= */
.header{
  position:fixed;top:0;left:0;right:0;z-index:100;
  background:rgba(255,255,255,.96);
  border-bottom:1px solid var(--line);
}
.header__inner{
  max-width:var(--wrap);margin:0 auto;padding:0 var(--gutter);
  height:var(--header-h);display:flex;align-items:center;gap:16px;
  transition:height var(--t-fast) ease-out;
}
.header.is-small .header__inner{height:64px;}
.logo{display:flex;flex-direction:column;text-decoration:none;color:var(--ink);line-height:1.25;flex-shrink:0;}
.logo__ja{font-size:20px;font-weight:700;letter-spacing:.02em;}
.logo__en{font-size:11px;letter-spacing:.14em;color:var(--green);font-weight:700;}
.nav{margin-left:auto;display:flex;gap:22px;}
.nav a{color:var(--ink);text-decoration:none;font-size:15px;font-weight:500;position:relative;padding:4px 0;white-space:nowrap;}
.nav a::after{content:"";position:absolute;left:0;bottom:0;width:100%;height:2px;background:var(--green);transform:scaleX(0);transform-origin:left;transition:transform var(--t-fast) ease-out;}
.nav a:hover::after,.nav a:focus-visible::after{transform:scaleX(1);}
.nav a[aria-current="page"]{color:var(--green);font-weight:700;}
.nav a[aria-current="page"]::after{transform:scaleX(1);}

.tel-btn{
  display:flex;align-items:center;gap:8px;flex-shrink:0;
  background:var(--green);color:var(--white);text-decoration:none;
  padding:9px 16px;border-radius:var(--radius);font-weight:700;
  transition:background var(--t-fast) ease-out;
}
.tel-btn:hover{background:var(--green-dark);}
.tel-btn img{width:20px;height:20px;flex-shrink:0;}
.tel-btn__num{font-size:17px;letter-spacing:.02em;line-height:1.2;}
.tel-btn__lbl{display:block;font-size:11px;font-weight:500;letter-spacing:.08em;opacity:.92;}

.nav-toggle{display:none;background:none;border:1px solid var(--line);border-radius:var(--radius);width:44px;height:44px;cursor:pointer;padding:0;align-items:center;justify-content:center;flex-direction:column;gap:5px;}
.nav-toggle span{display:block;width:20px;height:2px;background:var(--ink);}

@media (max-width:1000px){
  .nav{position:fixed;top:64px;left:0;right:0;background:var(--white);border-bottom:1px solid var(--line);flex-direction:column;gap:0;padding:8px var(--gutter) 16px;display:none;}
  .nav.is-open{display:flex;}
  .nav a{padding:14px 0;border-bottom:1px solid var(--line);font-size:17px;}
  .nav-toggle{display:flex;order:3;}
  .header__inner{gap:10px;}
  .tel-btn{margin-left:auto;}
}
@media (max-width:520px){
  .tel-btn__num{font-size:15px;}
  .tel-btn{padding:8px 12px;}
  .logo__ja{font-size:17px;}
}

.main{padding-top:var(--header-h);}

/* =========================================================
   ボタン
   ========================================================= */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  padding:16px 28px;border-radius:var(--radius);text-decoration:none;
  font-weight:700;font-size:17px;line-height:1.4;cursor:pointer;
  border:2px solid transparent;transition:background var(--t-fast) ease-out,border-color var(--t-fast) ease-out,color var(--t-fast) ease-out;
  min-height:52px;text-align:center;
}
.btn--primary{background:var(--green);color:var(--white);}
.btn--primary:hover{background:var(--green-dark);}
.btn--ghost{background:var(--white);color:var(--green);border-color:var(--green);}
.btn--ghost:hover{background:var(--bg-green);}
.btn--on-dark{background:var(--white);color:var(--green);}
.btn--on-dark:hover{background:var(--bg-green);}
.btn--outline-light{background:transparent;color:var(--white);border-color:var(--white);}
.btn--outline-light:hover{background:rgba(255,255,255,.14);}
.btn--sm{padding:11px 18px;font-size:15px;min-height:44px;}
.btn img{width:20px;height:20px;}
.btn-row{display:flex;flex-wrap:wrap;gap:14px;}
.btn-row.is-center{justify-content:center;}

:where(a,button,input,select,textarea,summary):focus-visible{
  outline:3px solid var(--blue);outline-offset:2px;border-radius:4px;
}

/* =========================================================
   ヒーロー
   ========================================================= */
.hero{position:relative;overflow:hidden;background:var(--bg-green);}
.hero__bg{position:absolute;inset:0;}
.hero__bg img{width:100%;height:100%;object-fit:cover;}
.hero__bg::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,rgba(255,255,255,.94) 0%,rgba(255,255,255,.88) 42%,rgba(255,255,255,.35) 72%,rgba(255,255,255,.1) 100%);}
.hero__inner{position:relative;z-index:2;max-width:var(--wrap);margin:0 auto;padding:96px var(--gutter) 108px;}
.hero__body{max-width:660px;}
.hero h1{font-size:clamp(32px,6vw,52px);letter-spacing:-.01em;margin-bottom:.4em;}
.hero h1 .num{color:var(--green);}
.hero__lead{font-size:clamp(16px,2vw,19px);max-width:34em;margin-bottom:1.8em;}
.hero__note{margin-top:22px;font-size:14px;color:var(--ink-mute);}
@media (max-width:767px){
  .hero__bg::after{background:linear-gradient(180deg,rgba(255,255,255,.95) 0%,rgba(255,255,255,.9) 60%,rgba(255,255,255,.6) 100%);}
  .hero__inner{padding:56px var(--gutter) 72px;}
}

/* 葉が舞う装飾（Lottie の代替：CSS アニメーション） */
.leaves{position:absolute;top:0;right:0;width:min(38%,420px);height:100%;z-index:1;pointer-events:none;overflow:hidden;}
.leaf{position:absolute;width:16px;height:16px;background:var(--green-pale);opacity:.5;border-radius:0 100% 0 100%;animation:leafFall 14s linear infinite;}
.leaf:nth-child(1){left:12%;animation-delay:0s;}
.leaf:nth-child(2){left:38%;width:12px;height:12px;animation-delay:-4.5s;animation-duration:17s;background:var(--green);opacity:.35;}
.leaf:nth-child(3){left:63%;width:19px;height:19px;animation-delay:-9s;animation-duration:15.5s;}
.leaf:nth-child(4){left:84%;width:13px;height:13px;animation-delay:-12.5s;animation-duration:18s;background:var(--green);opacity:.3;}
@keyframes leafFall{
  0%{transform:translateY(-12%) rotate(0deg);opacity:0;}
  12%{opacity:.5;}
  88%{opacity:.4;}
  100%{transform:translateY(105vh) rotate(300deg);opacity:0;}
}
.scroll-cue{position:absolute;left:50%;bottom:18px;z-index:3;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:6px;color:var(--green);font-size:12px;letter-spacing:.14em;font-weight:700;}
/* 同時に動く要素を2つまでに保つため、矢印は静止（動くのはヒーローの葉2枚のみ） */
.scroll-cue span{display:block;width:1px;height:34px;background:var(--green);opacity:.55;}

/* =========================================================
   概算シミュレーター（主役層）
   ========================================================= */
.sim{background:var(--bg-blue);}
.sim__pinwrap{padding:64px 0;}
.sim__inner{max-width:var(--wrap);margin:0 auto;padding:0 var(--gutter);}
.sim__head{text-align:center;margin-bottom:26px;}
.sim__head h2{margin-bottom:.3em;}
.sim__head p{margin:0;color:var(--ink-mute);font-size:.95em;}

.sim__steps{display:flex;justify-content:center;gap:10px;margin:0 0 30px;padding:0;list-style:none;flex-wrap:wrap;}
.sim__steps li{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:700;color:var(--ink-mute);opacity:.5;transition:opacity var(--t-fast) ease-out;margin:0;}
.sim__steps li::before{content:attr(data-n);display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--white);border:2px solid var(--line);font-size:13px;color:var(--ink);}
.sim__steps li.is-active{opacity:1;color:var(--ink);}
.sim__steps li.is-active::before{background:var(--green-pale);border-color:var(--green-pale);color:var(--ink);}
.sim__steps li.is-done::before{background:var(--green);border-color:var(--green);color:var(--white);content:"\2713";}
.sim__steps li:not(:last-child)::after{content:"";width:22px;height:2px;background:var(--line);}

.sim__panels{position:relative;}
.sim__panel{display:none;}
.sim__panel.is-active{display:block;}
.sim__panel h3{text-align:center;font-size:clamp(20px,2.6vw,26px);margin-bottom:1em;}

.sim__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}
@media (max-width:860px){ .sim__grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:480px){ .sim__grid{grid-template-columns:1fr;} }

.opt{
  background:var(--white);border:2px solid var(--line);border-radius:var(--radius);
  padding:20px 16px;cursor:pointer;text-align:center;font-family:inherit;
  font-size:16px;font-weight:700;color:var(--ink);line-height:1.6;
  display:flex;flex-direction:column;align-items:center;gap:10px;min-height:120px;justify-content:center;
  transition:border-color var(--t-fast) ease-out,background var(--t-fast) ease-out;
}
.opt img{width:38px;height:38px;}
.opt small{display:block;font-weight:500;font-size:13px;color:var(--ink-mute);}
.opt:hover{border-color:var(--green-pale);background:var(--bg-green);}
.opt.is-selected{border-color:var(--green);background:var(--bg-green);}
.opt.is-selected::after{content:"選択中";font-size:12px;font-weight:700;color:var(--white);background:var(--green);border-radius:20px;padding:2px 10px;letter-spacing:.04em;}

.sim__amounts{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;}
.amt{
  background:var(--white);border:2px solid var(--line);border-radius:var(--radius);
  padding:16px 26px;font-family:inherit;font-size:19px;font-weight:700;color:var(--ink);
  cursor:pointer;min-width:112px;min-height:56px;
  transition:border-color var(--t-fast) ease-out,background var(--t-fast) ease-out;
}
.amt:hover{border-color:var(--green-pale);background:var(--bg-green);}
.amt.is-selected{border-color:var(--green);background:var(--bg-green);}
.sim__chosen{text-align:center;margin:0 0 1.2em;font-size:15px;color:var(--ink-mute);}
.sim__chosen b{color:var(--ink);}

.result{text-align:center;}
.result__label{font-size:15px;color:var(--ink-mute);margin:0 0 .2em;}
.result__fig{
  font-weight:700;color:var(--green);line-height:1.15;
  font-size:clamp(38px,8.4vw,58px);letter-spacing:-.02em;
  display:flex;align-items:baseline;justify-content:center;gap:2px;flex-wrap:wrap;
}
.result__fig .unit{font-size:19px;font-weight:700;}
.result__fig .tilde{font-size:.62em;}
.result__notes{
  max-width:40em;margin:22px auto 0;padding:16px 20px;
  background:var(--white);border:1px solid var(--line);border-left:5px solid var(--blue-pale);
  border-radius:var(--radius);text-align:left;
}
.result__notes p{margin:0 0 .45em;font-size:14.5px;line-height:1.8;color:var(--ink-mute);}
.result__notes p:last-child{margin-bottom:0;}
.result .btn-row{margin-top:24px;}
.sim__back{background:none;border:none;color:var(--blue);font-family:inherit;font-size:15px;cursor:pointer;text-decoration:underline;padding:8px;margin-top:16px;}

/* 768px 未満：ピン留めを解除し、縦積みで順に操作 */
@media (max-width:767px){
  .sim__pinwrap{padding:48px 0;}
  .sim__panel{display:block;margin-bottom:34px;}
  .sim__panel.is-locked{display:none;}
  .sim__steps{display:none;}
}

/* =========================================================
   悩み別カード
   ========================================================= */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;}
@media (max-width:900px){ .cards{grid-template-columns:repeat(2,1fr);} }
@media (max-width:600px){ .cards{grid-template-columns:1fr;} }
.card{
  background:var(--white);border:1px solid var(--line);border-radius:var(--radius);
  overflow:hidden;display:flex;flex-direction:column;box-shadow:var(--shadow);
}
.card__media{aspect-ratio:4/3;overflow:hidden;}
.card__media img{width:100%;height:100%;object-fit:cover;}
.card__body{padding:20px;display:flex;flex-direction:column;flex:1;}
.card__body h3{margin-bottom:.5em;font-size:19px;}
.card__body p{font-size:15.5px;line-height:1.8;color:var(--ink-mute);margin-bottom:1em;}
.card__price{
  margin-top:auto;display:inline-flex;align-items:baseline;gap:4px;
  background:var(--bg-green);border-radius:var(--radius);padding:8px 12px;
  font-weight:700;color:var(--green);font-size:19px;align-self:flex-start;margin-bottom:16px;
}
.card__price small{font-size:13px;color:var(--ink);font-weight:500;}
.card .btn{width:100%;}

/* =========================================================
   料金セクション（青の帯）
   ========================================================= */
.price-band{position:relative;overflow:hidden;}
.price-band__bg{position:absolute;inset:0;}
.price-band__bg img{width:100%;height:100%;object-fit:cover;}
.price-band__bg::after{content:"";position:absolute;inset:0;background:rgba(127,181,213,.82);}
.price-band__inner{position:relative;z-index:2;}

.ptable{width:100%;border-collapse:collapse;background:var(--white);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);}
.ptable th,.ptable td{padding:16px 18px;border-bottom:1px solid var(--line);text-align:left;font-size:16.5px;}
.ptable thead th{background:var(--bg-green);font-size:14px;letter-spacing:.04em;color:var(--ink);}
.ptable tbody tr:last-child th,.ptable tbody tr:last-child td{border-bottom:none;}
.ptable td.num{text-align:right;font-weight:700;color:var(--green);white-space:nowrap;font-size:18px;}
.ptable td.num small{color:var(--ink);font-weight:500;font-size:13px;}
.ptable tbody th{font-weight:700;}
@media (max-width:600px){
  .ptable th,.ptable td{padding:13px 12px;font-size:15px;}
  .ptable td.num{font-size:16px;}
}
.table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;}

/* アコーディオン */
.acc{border:1px solid var(--line);border-radius:var(--radius);background:var(--white);margin-bottom:12px;overflow:hidden;}
.acc__btn{
  width:100%;background:none;border:none;font-family:inherit;font-size:18px;font-weight:700;color:var(--ink);
  padding:20px 22px;display:flex;align-items:center;justify-content:space-between;gap:14px;cursor:pointer;text-align:left;line-height:1.6;
}
.acc__btn:hover{background:var(--bg-green);}
.acc__mark{flex-shrink:0;width:26px;height:26px;display:grid;place-items:center;border-radius:50%;background:var(--bg-green);color:var(--green);font-weight:700;transition:transform var(--t-fast) ease-out;}
.acc__btn[aria-expanded="true"] .acc__mark{transform:rotate(45deg);}
.acc__panel{padding:0 22px 22px;}
.acc__panel p:last-child{margin-bottom:0;}

/* =========================================================
   施工の記録
   ========================================================= */
.gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
@media (max-width:900px){ .gallery{grid-template-columns:repeat(2,1fr);} }
@media (max-width:520px){ .gallery{grid-template-columns:1fr;} }
.gallery--2col{grid-template-columns:repeat(2,1fr);}
@media (max-width:700px){ .gallery--2col{grid-template-columns:1fr;} }
.shot figure{margin:0;}
.shot__frame{aspect-ratio:4/3;overflow:hidden;border-radius:var(--radius);box-shadow:var(--shadow);}
.shot__frame img{width:100%;height:100%;object-fit:cover;transition:transform var(--t-mid) ease-out;}
.shot:hover .shot__frame img{transform:scale(1.05);}
.shot figcaption{margin-top:10px;font-size:15px;font-weight:700;}
.ai-note{display:block;font-size:12.5px;color:var(--ink-mute);font-weight:500;margin-top:2px;line-height:1.6;}

/* =========================================================
   人物・代表
   ========================================================= */
.split{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:48px;align-items:center;}
@media (max-width:860px){ .split{grid-template-columns:1fr;gap:28px;} }
.split--rev .split__media{order:2;}
@media (max-width:860px){ .split--rev .split__media{order:0;} }
.split__media figure{margin:0;}
.badges{display:flex;flex-wrap:wrap;gap:8px;padding:0;margin:0 0 1.4em;list-style:none;}
.badges li{background:var(--bg-green);color:var(--green);border:1px solid var(--green-pale);border-radius:20px;padding:5px 14px;font-size:13.5px;font-weight:700;margin:0;}
.meta-list{margin:0 0 1.4em;padding:0;list-style:none;}
.meta-list li{display:flex;gap:10px;font-size:15.5px;margin-bottom:.4em;}
.meta-list b{flex-shrink:0;min-width:5.2em;color:var(--ink-mute);font-weight:500;}

/* =========================================================
   CTA 帯
   ========================================================= */
.cta{position:relative;overflow:hidden;}
.cta__bg{position:absolute;inset:0;}
.cta__bg img{width:100%;height:100%;object-fit:cover;}
.cta__bg::after{content:"";position:absolute;inset:0;background:rgba(65,96,27,.86);}
.cta__inner{position:relative;z-index:2;text-align:center;color:var(--white);padding:76px 0;}
.cta__inner h2{color:var(--white);}
.cta__inner p{color:rgba(255,255,255,.94);max-width:40em;margin:0 auto 1.8em;}
.cta__btns{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;}
.cta__line{margin-top:18px;font-size:14px;color:rgba(255,255,255,.9);}

/* 電話アイコンの揺れ（Lottie の代替：CSS アニメーション） */
.wobble{display:inline-block;animation:wobble 2.6s ease-in-out infinite;transform-origin:50% 80%;}
@keyframes wobble{0%,72%,100%{transform:rotate(0);}78%{transform:rotate(-8deg);}84%{transform:rotate(8deg);}90%{transform:rotate(-4deg);}}

/* =========================================================
   お問い合わせ 3導線
   ========================================================= */
.contact-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
@media (max-width:860px){ .contact-cards{grid-template-columns:1fr;} }
.ccard{
  background:var(--white);border:1px solid var(--line);border-top:5px solid var(--blue-pale);
  border-radius:var(--radius);padding:28px 24px;text-align:center;box-shadow:var(--shadow);
  display:flex;flex-direction:column;align-items:center;
}
.ccard__icon{width:52px;height:52px;margin-bottom:12px;}
.ccard h3{margin-bottom:.3em;font-size:19px;}
.ccard__val{font-size:clamp(23px,3.4vw,28px);font-weight:700;color:var(--green);text-decoration:none;letter-spacing:.01em;display:block;margin-bottom:.2em;line-height:1.35;word-break:break-all;}
a.ccard__val:hover{color:var(--green-dark);text-decoration:underline;}
.ccard p{font-size:14.5px;color:var(--ink-mute);margin:0;}
.ccard__foot{margin-top:auto;padding-top:14px;}

/* =========================================================
   フォーム（見た目のみ・実送信なし）
   ========================================================= */
.form{max-width:720px;margin:0 auto;}
.field{margin-bottom:24px;}
.field label{display:block;font-weight:700;font-size:16px;margin-bottom:8px;}
.req{background:var(--green-pale);color:var(--ink);font-size:12px;font-weight:700;border-radius:4px;padding:2px 8px;margin-left:8px;vertical-align:2px;letter-spacing:.04em;}
.opt-mark{background:var(--line);color:var(--ink);font-size:12px;font-weight:700;border-radius:4px;padding:2px 8px;margin-left:8px;vertical-align:2px;}
.field input,.field select,.field textarea{
  width:100%;font-family:inherit;font-size:17px;line-height:1.7;color:var(--ink);
  padding:14px 16px;border:2px solid var(--line);border-radius:var(--radius);background:var(--white);
  transition:border-color var(--t-fast) ease-out;min-height:52px;
}
.field input:hover,.field select:hover,.field textarea:hover{border-color:var(--blue-pale);}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--blue);outline:none;}
.field textarea{min-height:150px;resize:vertical;}
.field .help{font-size:14px;color:var(--ink-mute);margin:6px 0 0;}
.form__note{background:var(--bg-blue);border:1px solid var(--line);border-radius:var(--radius);padding:16px 20px;font-size:14.5px;color:var(--ink-mute);line-height:1.8;margin-bottom:26px;}
.form__note p{margin:0;}

/* =========================================================
   注記ボックス
   ========================================================= */
.note{background:var(--bg-blue);border-left:5px solid var(--blue-pale);border-radius:var(--radius);padding:20px 24px;margin:0 0 24px;}
.note p:last-child{margin-bottom:0;}
.note--green{background:var(--bg-green);border-left-color:var(--green-pale);}
.note h3{font-size:18px;margin-bottom:.4em;}

/* 屋号の由来：八相縁起 */
.omens{display:grid;grid-template-columns:repeat(2,1fr);gap:10px 24px;padding:0;margin:0 0 1.4em;list-style:none;}
@media (max-width:600px){ .omens{grid-template-columns:1fr;} }
.omens li{display:flex;gap:10px;font-size:15.5px;line-height:1.75;margin:0;}
.omens b{flex-shrink:0;color:var(--green);min-width:3.2em;}

/* 協力業者 */
.partners{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
@media (max-width:900px){ .partners{grid-template-columns:repeat(2,1fr);} }
@media (max-width:560px){ .partners{grid-template-columns:1fr;} }
.partner{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:22px;box-shadow:var(--shadow);}
.partner h3{font-size:18px;margin-bottom:.2em;}
.partner__co{font-size:13.5px;color:var(--blue);font-weight:700;margin:0 0 .7em;}
.partner p{font-size:15px;color:var(--ink-mute);margin:0;line-height:1.8;}

/* 会社概要テーブル */
.spec{width:100%;border-collapse:collapse;background:var(--white);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;}
.spec th,.spec td{padding:16px 20px;border-bottom:1px solid var(--line);text-align:left;font-size:16.5px;vertical-align:top;}
.spec th{background:var(--bg-green);width:11em;font-weight:700;}
.spec tr:last-child th,.spec tr:last-child td{border-bottom:none;}
@media (max-width:640px){
  .spec th,.spec td{display:block;width:auto;padding:12px 16px;border-bottom:none;}
  .spec th{background:var(--bg-green);}
  .spec td{border-bottom:1px solid var(--line);}
}

/* ページ見出し */
.phead{background:var(--bg-green);padding:56px 0 52px;border-bottom:1px solid var(--line);}
.phead h1{margin-bottom:.3em;}
.phead p{margin:0;color:var(--ink-mute);max-width:40em;}
.crumbs{font-size:13.5px;color:var(--ink-mute);margin:0 0 1em;}
.crumbs a{color:var(--blue);}
.crumbs span{margin:0 .5em;opacity:.6;}

/* =========================================================
   フッター
   ========================================================= */
.footer{background:var(--ink);color:rgba(255,255,255,.86);padding:60px 0 0;font-size:15.5px;}
.footer a{color:rgba(255,255,255,.86);text-decoration:none;}
.footer a:hover{color:var(--white);text-decoration:underline;}
.footer__grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:40px;padding-bottom:40px;}
@media (max-width:820px){ .footer__grid{grid-template-columns:1fr;gap:30px;} }
.footer h2{font-size:19px;color:var(--white);margin-bottom:.5em;}
.footer__en{font-size:11px;letter-spacing:.14em;color:var(--green-pale);font-weight:700;display:block;margin-bottom:1.2em;}
.footer h3{font-size:14px;color:var(--green-pale);letter-spacing:.08em;margin-bottom:.9em;}
.footer ul{list-style:none;padding:0;margin:0;}
.footer li{margin-bottom:.55em;}
.footer address{font-style:normal;line-height:1.9;}
.footer__demo{border-top:1px solid rgba(255,255,255,.18);padding:22px 0 28px;font-size:13.5px;line-height:1.85;color:rgba(255,255,255,.78);}
.footer__copy{font-size:13px;color:rgba(255,255,255,.6);padding-bottom:26px;}

/* =========================================================
   404
   ========================================================= */
.err{text-align:center;padding:110px 0 120px;}
.err h1{margin-bottom:.5em;}
.err p{max-width:38em;margin:0 auto 2em;color:var(--ink-mute);}

/* =========================================================
   基礎層アニメーション（JS 無効・GSAP 未読込でも必ず見える状態を保つ）
   ========================================================= */
html.js-anim .reveal{opacity:0;transform:translateY(28px);}
@media (prefers-reduced-motion:reduce){
  html.js-anim .reveal{opacity:1!important;transform:none!important;}
  .leaf,.scroll-cue span,.wobble{animation:none!important;}
  *,*::before,*::after{transition-duration:.001ms!important;animation-duration:.001ms!important;animation-iteration-count:1!important;}
}

.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}
.skip{position:absolute;left:-9999px;top:0;z-index:200;background:var(--green);color:var(--white);padding:12px 20px;border-radius:0 0 var(--radius) 0;}
.skip:focus{left:0;}
