:root{
  --ink:#1c1a17; --brown:#6b4a2f;
  --line:#ddd5c9; --paper:#fff; --cream:#faf7f2; --sand:#f3ede3;
  --green:#06c755; --max:1120px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;color:var(--ink);background:var(--paper);
  font-family:"Hiragino Kaku Gothic ProN","Hiragino Sans","Yu Gothic",YuGothic,"Noto Sans JP",sans-serif;
  line-height:1.85;font-size:16px;-webkit-font-smoothing:antialiased}
h1,h2,h3,.serif{font-family:"Hiragino Mincho ProN","Yu Mincho",YuMincho,"Noto Serif JP",serif;font-weight:600;line-height:1.45}
img{max-width:100%;display:block}
a{color:var(--brown)}
.wrap{max-width:var(--max);margin:0 auto;padding:0 20px}
.eyebrow{letter-spacing:.28em;font-size:12px;color:var(--brown);text-transform:uppercase;margin:0 0 10px;font-family:Georgia,serif}
section{padding:84px 0}
.sec-head{margin-bottom:40px}
.sec-head h2{font-size:clamp(26px,4vw,38px);margin:0 0 12px}
.sec-head p{color:#4c463f;margin:0}
.alt{background:var(--cream)}
/* header */
.site-header{position:fixed;inset:0 0 auto 0;z-index:60;background:rgba(255,255,255,.96);border-bottom:1px solid var(--line);backdrop-filter:blur(6px)}
.header-in{max-width:var(--max);margin:0 auto;padding:0 20px;height:72px;display:flex;align-items:center;gap:28px}
.logo{font-family:"Hiragino Mincho ProN","Yu Mincho",serif;font-size:24px;font-weight:700;color:var(--ink);text-decoration:none;white-space:nowrap}
.logo small{display:block;font-family:inherit;font-size:10.5px;font-weight:400;color:#6d675e;letter-spacing:.02em}
.logo .dot{color:var(--brown)}
.main-nav{display:flex;gap:22px;margin-left:auto}
.main-nav a{color:var(--ink);text-decoration:none;font-size:14px;white-space:nowrap}
.main-nav a:hover{color:var(--brown)}
.header-tel{text-align:right;line-height:1.3;white-space:nowrap}
.header-tel a{font-family:Georgia,serif;font-size:19px;color:var(--ink);text-decoration:none;font-weight:700}
.header-tel span{display:block;font-size:11px;color:#6d675e}
.btn{display:inline-block;background:var(--ink);color:#fff;text-decoration:none;padding:14px 26px;border:none;cursor:pointer;font-size:15px;border-radius:2px;text-align:center}
.btn:hover{opacity:.88}
.btn-brown{background:var(--brown)}
.btn-line{background:var(--green)}
.btn-ghost{background:transparent;color:var(--ink);border:1px solid var(--ink)}
.btn-head{padding:11px 20px}
body{padding-top:72px}
/* hero */
.hero{position:relative;color:#fff;padding:0;min-height:520px;display:flex;align-items:flex-end;
  background:#3a332a center/cover no-repeat}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(20,16,10,.62),rgba(20,16,10,.15) 60%,transparent)}
.hero-in{position:relative;z-index:1;width:100%;max-width:var(--max);margin:0 auto;padding:110px 20px 56px}
.hero .eyebrow{color:#e9dcc8}
.hero h1{font-size:clamp(34px,6vw,58px);margin:0 0 18px}
.hero p.lead{font-size:clamp(16px,2.4vw,20px);margin:0 0 8px}
.hero .sub{color:#f0e9dd;margin:0 0 30px}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap;align-items:center}
.hero-actions .text-link{color:#fff}
.hero-facts{display:flex;gap:0;flex-wrap:wrap;margin-top:44px;border-top:1px solid rgba(255,255,255,.35)}
.hero-facts div{padding:16px 28px 4px 0;margin-right:28px}
.hero-facts span{display:block;font-size:12px;letter-spacing:.14em;color:#e9dcc8}
.hero-facts strong{font-size:19px;font-family:"Hiragino Mincho ProN",serif}
.hero-note{font-size:12px;color:#e9dcc8;margin-top:14px}
/* service hero */
.svc-hero{padding:56px 0 64px;background:var(--cream);border-bottom:1px solid var(--line)}
.crumb{font-size:13px;color:#6d675e;margin:0 0 26px}
.crumb a{color:#6d675e;text-decoration:none}
.svc-hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:44px;align-items:center}
.svc-hero h1{font-size:clamp(28px,4.4vw,44px);margin:0 0 16px}
.svc-hero .lead-copy{color:#4c463f;margin:0 0 22px}
.svc-hero figure{margin:0}
.svc-hero figcaption{font-size:12.5px;color:#6d675e;margin-top:8px}
.area-only{display:inline-block;border:1px solid var(--brown);color:var(--brown);padding:3px 12px;font-size:13px;border-radius:999px;margin-left:10px;vertical-align:middle}
.toc{background:#fff;border:1px solid var(--line);padding:22px 26px;margin:44px 0 0}
.toc h3{margin:0 0 10px;font-size:16px}
.toc ol{margin:0;padding-left:20px;columns:2;column-gap:40px}
.toc a{text-decoration:none;color:var(--ink)}
/* cards & grids */
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:22px}
.card{border:1px solid var(--line);background:#fff;text-decoration:none;color:var(--ink);display:block}
.card img{aspect-ratio:4/3;object-fit:cover;width:100%}
.card .card-in{padding:16px 18px 18px}
.card h3{margin:0;font-size:18px}
.card .num{color:var(--brown);font-family:Georgia,serif;font-size:13px;letter-spacing:.15em}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.req-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.req,.opt,.prep,.check-item,.flow-step{background:#fff;border:1px solid var(--line);padding:22px}
.req h3,.prep h3{margin:6px 0 8px;font-size:18px}
.req p,.opt p,.prep p{margin:0;color:#4c463f}
.num{color:var(--brown);font-family:Georgia,serif;letter-spacing:.15em;font-size:13px}
.opt h3{margin:6px 0 8px;font-size:19px}
.opt dl{margin:14px 0 0}
.opt dt{font-weight:700;font-size:13.5px;color:var(--brown);margin-top:10px}
.opt dd{margin:2px 0 0;color:#4c463f}
.note-box{background:var(--sand);border-left:4px solid var(--brown);padding:22px 26px;margin-top:26px}
.note-box h3{margin:0 0 8px;font-size:19px}
.note-box p{margin:0;color:#4c463f}
.involves{display:grid;grid-template-columns:1fr 1fr;gap:0 34px}
.involves div{border-bottom:1px solid var(--line);padding:14px 0}
.involves h3{font-size:17px;margin:0 0 4px;font-family:inherit;font-weight:700}
.involves p{margin:0;color:#4c463f}
.checks{display:grid;grid-template-columns:1fr 1fr;gap:0 34px}
.check-item{border:none;border-bottom:1px solid var(--line);padding:16px 0;background:transparent}
.check-item h3{font-size:17px;margin:0 0 4px;font-family:inherit;font-weight:700}
.check-item p{margin:0;color:#4c463f}
.flow-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.flow-step .num{font-size:15px}
.flow-step h3{margin:6px 0 8px;font-size:17px}
.flow-step p{margin:0;color:#4c463f;font-size:14.5px}
.prep-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:22px}
/* reference */
.ref-item{margin-bottom:64px}
.ref-item:last-child{margin-bottom:0}
.ref-head{display:flex;align-items:baseline;gap:16px;flex-wrap:wrap}
.ref-head .num{font-size:15px}
.ref-head h3{font-size:clamp(21px,3vw,27px);margin:0}
.ref-desc{color:#4c463f;max-width:760px}
.ba{position:relative;max-width:860px}
.ba img{width:100%;aspect-ratio:16/10;object-fit:cover}
.ba .ba-tag{position:absolute;left:14px;bottom:14px;background:rgba(20,16,10,.78);color:#fff;padding:4px 14px;font-size:13px;letter-spacing:.1em}
.ba-toggle{display:flex;gap:10px;margin:14px 0}
.ba-toggle button,.tab-btn{border:1px solid var(--ink);background:#fff;color:var(--ink);padding:9px 20px;cursor:pointer;font-size:14px;border-radius:2px}
.ba-toggle button[aria-pressed="true"],.tab-btn[aria-selected="true"]{background:var(--ink);color:#fff}
.ref-caution{font-size:14px;color:#4c463f;max-width:860px}
.ai-note{font-size:13px;color:#6d675e;margin-top:26px}
/* faq */
.faq-item{border-bottom:1px solid var(--line)}
.faq-item summary{cursor:pointer;padding:18px 4px;font-weight:700;list-style:none;display:flex;justify-content:space-between;gap:16px}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:"＋";color:var(--brown)}
.faq-item[open ] summary::after{content:"−"}
.faq-item .faq-a{padding:0 4px 20px;color:#4c463f}
.faq-item .faq-a p{margin:0}
/* about */
.about-table{width:100%;border-collapse:collapse;background:#fff}
.about-table th,.about-table td{border-bottom:1px solid var(--line);padding:14px 16px;text-align:left;vertical-align:top}
.about-table th{width:180px;background:var(--cream);font-weight:700;white-space:nowrap}
/* contact */
.contact{background:var(--cream)}
.contact h2{font-size:clamp(25px,4vw,36px)}
.mini-steps{display:flex;gap:10px;flex-wrap:wrap;margin:20px 0}
.mini-steps span{border:1px solid var(--brown);color:var(--brown);border-radius:999px;padding:4px 16px;font-size:13.5px}
.info-box{background:#fff;border:1px solid var(--line);padding:18px 22px;margin:14px 0}
.info-box strong{display:block;margin-bottom:4px}
.info-box p{margin:0;color:#4c463f}
.free-banner{font-family:"Hiragino Mincho ProN",serif;font-size:19px;color:var(--brown);margin:14px 0}
.tabs{display:flex;gap:10px;flex-wrap:wrap;margin:30px 0 22px}
.direct-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.direct-card{background:#fff;border:1px solid var(--line);padding:24px;text-decoration:none;color:var(--ink);display:block}
.direct-card h3{margin:0 0 6px;font-size:18px}
.direct-card .big{font-family:Georgia,serif;font-size:21px;font-weight:700}
.direct-card p{margin:4px 0 0;color:#4c463f;font-size:14px}
.builder{background:#fff;border:1px solid var(--line);padding:28px}
.builder label{display:block;font-weight:700;margin:20px 0 6px}
.builder label:first-child{margin-top:0}
.builder .hint{font-weight:400;font-size:13px;color:#6d675e;display:block}
.builder input[type=text],.builder input[type=email],.builder textarea,.builder select{
  width:100%;border:1px solid #bdb2a2;border-radius:2px;padding:11px 12px;font:inherit;background:#fff}
.builder textarea{line-height:1.7}
.builder details{border:1px solid var(--line);padding:14px 18px;margin-top:20px}
.builder summary{cursor:pointer;font-weight:700}
.ref-notice{background:#fdf3e3;border:1px solid #d9a441;padding:14px 18px;margin-bottom:18px;font-size:14.5px}
.ref-notice button{margin-left:10px}
.send-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:22px}
.field-error{color:#b3261e;font-size:13.5px;margin:4px 0 0;display:none}
.confirm-block,.done-block{background:var(--cream);border:1px solid var(--brown);padding:22px;margin-top:22px}
.confirm-block dl{margin:0 0 14px}
.confirm-block dt{font-weight:700;font-size:13px;color:var(--brown)}
.confirm-block dd{margin:2px 0 12px;white-space:pre-wrap}
.done-block h3{margin:0 0 8px}
.form-note{font-size:13.5px;color:#4c463f}
/* other services nav */
.svc-nav{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:10px}
.svc-nav a{border:1px solid var(--line);padding:12px 16px;text-decoration:none;color:var(--ink);background:#fff}
.svc-nav a.current{border-color:var(--brown);color:var(--brown);font-weight:700}
.prev-next{display:flex;justify-content:space-between;gap:16px;margin-top:26px;flex-wrap:wrap}
/* footer */
.site-footer{background:#211d18;color:#e9e2d6;padding:64px 0 40px;margin-top:0}
.site-footer a{color:#e9e2d6;text-decoration:none}
.site-footer .logo{color:#fff}
.site-footer .logo small{color:#b9b0a0}
.footer-grid{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:36px}
.site-footer h4{margin:0 0 12px;font-size:14px;letter-spacing:.12em;color:#cbbaa0}
.site-footer ul{list-style:none;margin:0;padding:0}
.site-footer li{margin:6px 0;font-size:14.5px}
.footer-bottom{border-top:1px solid #453e34;margin-top:40px;padding-top:20px;font-size:12.5px;color:#b9b0a0;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
/* mobile bottom bar */
.mobile-bar{display:none}
@media (max-width:820px){
  .main-nav,.header-tel{display:none}
  .header-in{height:64px;gap:14px}
  body{padding-top:64px}
  .logo{font-size:20px}
  section{padding:58px 0}
  .svc-hero-grid,.grid-2,.req-grid,.involves,.checks{grid-template-columns:1fr}
  .grid-3,.grid-4,.flow-steps,.direct-grid,.footer-grid{grid-template-columns:1fr}
  .toc ol{columns:1}
  .mobile-bar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:70;gap:8px;
    padding:8px 8px calc(8px + env(safe-area-inset-bottom));background:rgba(255,255,255,.97);border-top:1px solid var(--line)}
  .mobile-bar a{flex:1;text-align:center;color:#fff;text-decoration:none;padding:12px 4px;font-size:14.5px;font-weight:700;border-radius:2px}
  .mobile-bar .mb-tel{background:var(--brown)}
  .mobile-bar .mb-line{background:var(--green)}
  .mobile-bar .mb-mail{background:var(--ink)}
  body{padding-bottom:76px}
}