:root{
  --ink:#20261e;
  --ink-2:#4a5147;
  --paper:#f4f2ec;
  --paper-2:#eae6da;
  --green:#2f6b4f;
  --green-d:#24523c;
  --orange:#b8531c;
  --line:#d4cfbe;
  --white:#fffdf8;
  --fs-s:14px;
  --fs-b:16px;
  --fs-m:18px;
  --fs-l:22px;
  --fs-xl:30px;
  --fs-h:clamp(34px,5vw,52px);
  --s4:4px;--s8:8px;--s12:12px;--s16:16px;--s24:24px;--s32:32px;--s48:48px;--s64:64px;
  --wrap:1280px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-family:"PingFang SC","Hiragino Sans GB","Source Han Sans SC","Microsoft YaHei",sans-serif;
  background:var(--paper);
  color:var(--ink);
  font-size:var(--fs-b);
  line-height:1.75;
}
img{max-width:100%}
a{color:var(--green-d);text-decoration-thickness:1px;text-underline-offset:3px}
a:hover{color:var(--orange)}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid var(--orange);outline-offset:2px}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--s24)}
h1,h2,h3{font-weight:700;letter-spacing:.02em;line-height:1.3}
h1{font-size:var(--fs-h);letter-spacing:.04em;margin-bottom:var(--s16)}
h2{font-size:var(--fs-xl)}
h3{font-size:var(--fs-m);font-weight:600}
p{max-width:70ch}
/* header */
.site-header{border-bottom:2px solid var(--ink);background:var(--paper)}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;gap:var(--s24);padding-top:var(--s16);padding-bottom:var(--s16);flex-wrap:wrap}
.brand img{display:block;height:32px;width:auto}
.nav{list-style:none;display:flex;flex-wrap:wrap;gap:var(--s24)}
.nav a{display:inline-block;padding:var(--s4) 0;font-size:var(--fs-s);letter-spacing:.08em;color:var(--ink);text-decoration:none;border-bottom:2px solid transparent}
.nav a:hover,.nav a[aria-current="page"]{color:var(--green-d);border-bottom-color:var(--orange)}
/* breadcrumb */
.breadcrumb{font-size:12px;letter-spacing:.06em;color:var(--ink-2);padding:var(--s16) 0;border-bottom:1px solid var(--line);display:flex;gap:var(--s8)}
.breadcrumb a{color:var(--ink-2)}
/* hero */
.hero{border-bottom:1px solid var(--line)}
.hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:var(--s48);padding-top:var(--s64);padding-bottom:var(--s64);align-items:center}
.kicker{font-size:var(--fs-s);letter-spacing:.24em;color:var(--orange);font-weight:600;margin-bottom:var(--s16)}
.hero h1{font-size:var(--fs-h);font-weight:800;letter-spacing:.02em}
.lede{color:var(--ink-2);font-size:var(--fs-m);margin-top:var(--s16)}
.hero-actions{margin-top:var(--s32);display:flex;gap:var(--s16);flex-wrap:wrap}
.hero-fig img{width:100%;height:auto;display:block;border:1px solid var(--ink)}
.hero-fig figcaption{font-size:var(--fs-s);color:var(--ink-2);margin-top:var(--s8);letter-spacing:.06em}
/* buttons */
.btn{display:inline-block;padding:12px 24px;border:1px solid var(--ink);color:var(--ink);text-decoration:none;font-size:var(--fs-b);letter-spacing:.04em;background:var(--white)}
.btn:hover{background:var(--paper-2);color:var(--ink);text-decoration:none}
.btn-primary{background:var(--green-d);border-color:var(--green-d);color:var(--white)}
.btn-primary:hover{background:var(--green);color:var(--white)}
/* band */
.band{background:var(--green-d);color:var(--white)}
.band-line{max-width:none;padding:var(--s12) 0;font-size:var(--fs-s);letter-spacing:.14em;text-align:center}
/* sections */
.section{padding:var(--s64) 0}
.section-alt{background:var(--paper-2);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.sec-head{display:flex;align-items:baseline;gap:var(--s16);margin-bottom:var(--s32);border-bottom:2px solid var(--ink);padding-bottom:var(--s12)}
.sec-head .no{font-size:var(--fs-m);letter-spacing:.2em;color:var(--orange);font-weight:700}
.cols3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s32)}
.cap h3{border-left:3px solid var(--orange);padding-left:var(--s12);margin-bottom:var(--s12)}
/* items 9-grid contract */
.items{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.item{background:var(--white);border:1px solid var(--line);padding:var(--s16)}
.item img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;display:block}
.item h2{font-size:var(--fs-l);margin:var(--s16) 0 var(--s8)}
.item p{font-size:var(--fs-b)}
.item ul{list-style:none;margin-top:var(--s12)}
.item li{font-size:var(--fs-s);color:var(--ink-2);padding:var(--s4) 0;border-top:1px dashed var(--line)}
.item li::before{content:"— "}
@media(max-width:760px){.items{grid-template-columns:minmax(0,1fr)}}
.more{margin-top:var(--s32);letter-spacing:.04em}
/* steps */
.steps{list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s32);counter-reset:st}
.steps li{border-top:2px solid var(--ink);padding-top:var(--s16)}
.step-no{display:inline-block;font-size:var(--fs-m);font-weight:700;color:var(--orange);letter-spacing:.1em;margin-bottom:var(--s8)}
.steps-v{grid-template-columns:1fr;gap:var(--s24)}
.steps-v li{border-top:none;border-left:2px solid var(--ink);padding:0 0 0 var(--s24)}
.steps p{font-size:var(--fs-s);color:var(--ink-2)}
/* faq */
.faq details{border-bottom:1px solid var(--line);max-width:70ch}
.faq summary{cursor:pointer;font-size:var(--fs-m);font-weight:600;padding:var(--s16) 0;list-style-position:outside}
.faq summary::marker{color:var(--orange)}
.faq p{color:var(--ink-2);padding-bottom:var(--s16)}
/* cta */
.cta{background:var(--green-d);color:var(--white);padding:var(--s64) 0;text-align:left}
.cta h2{color:var(--white);margin-bottom:var(--s12)}
.cta p{color:var(--white);opacity:.92;margin-bottom:var(--s16)}
.cta .btn{border-color:var(--white);color:var(--white);background:transparent}
.cta .btn:hover{background:rgba(255,255,255,.12);color:var(--white)}
.cta .btn-primary{background:var(--orange);border-color:var(--orange);color:var(--white)}
/* page variants */
.page-head{padding:var(--s48) 0;border-bottom:1px solid var(--line)}
.page-head .lede{max-width:70ch}
.split{padding:var(--s48) 0}
.split-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:var(--s48);align-items:start}
.split-fig img{width:100%;height:auto;display:block;border:1px solid var(--ink)}
.split-text h2{font-size:var(--fs-l);margin:var(--s32) 0 var(--s12)}
.split-text h2:first-of-type{margin-top:var(--s16)}
.contact-band{border-bottom:1px solid var(--line)}
.contact-band .wrap{display:grid;grid-template-columns:1fr 1fr;gap:var(--s48);padding-top:var(--s48);padding-bottom:var(--s48)}
.contact-mail{margin-top:var(--s24);font-size:var(--fs-m);font-weight:600}
.contact-fig{margin-top:var(--s32)}
.contact-fig img{width:100%;height:auto;display:block;border:1px solid var(--line)}
.faq-page{margin:var(--s48) 0}
.article{padding:var(--s48) 0;max-width:820px}
.article h1{border-bottom:2px solid var(--ink);padding-bottom:var(--s16)}
.article h2{margin:var(--s48) 0 var(--s16);border-left:4px solid var(--orange);padding-left:var(--s12)}
.article p{margin-bottom:var(--s16);max-width:72ch}
/* table */
.spec-table{width:100%;border-collapse:collapse;margin:var(--s24) 0;background:var(--white)}
.spec-table th,.spec-table td{border:1px solid var(--line);padding:var(--s12);font-size:var(--fs-s);text-align:left;vertical-align:top}
.spec-table thead th{background:var(--paper-2);letter-spacing:.08em}
.spec-table tbody tr:nth-child(even){background:var(--paper)}
/* footer */
.site-footer{border-top:2px solid var(--ink);background:var(--paper);padding:var(--s32) 0}
.site-footer p{font-size:var(--fs-s);color:var(--ink-2)}
.site-footer nav{margin-top:var(--s12)}
.site-footer nav a{margin-right:var(--s8)}
/* responsive */
@media(max-width:900px){
  .hero-grid,.cols3,.split-grid,.contact-band .wrap,.steps{grid-template-columns:minmax(0,1fr)}
  .section{padding:var(--s48) 0}
  .site-header .wrap{flex-direction:column;align-items:flex-start}
}
@media(min-width:901px) and (max-width:1100px){
  .steps{grid-template-columns:repeat(2,minmax(0,1fr))}
}