:root{
  --bg:#f6f1e7;--paper:#fffdf8;--ink:#1f2a24;--sub:#5b6660;--line:#ded5c3;
  --green:#2f4a3a;--honey:#b7791f;--honey-soft:#f1e3c4;--band:#ece4d3;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:"Noto Sans JP",system-ui,sans-serif;font-size:16px;line-height:1.9;letter-spacing:.02em}
img{max-width:100%;height:auto;display:block}
a{color:var(--green)}
.wrap{max-width:1080px;margin:0 auto;padding:0 20px}
.narrow{max-width:780px}
h1,h2,h3{font-family:"Shippori Mincho",serif;line-height:1.45;font-weight:700;margin:0 0 .6em}
h1{font-size:clamp(28px,5vw,44px)}
h2{font-size:clamp(23px,3.4vw,30px)}
h3{font-size:19px}
p{margin:0 0 1em}
.pc{display:none}
@media(min-width:760px){.pc{display:inline}}

/* header */
.site-head{background:var(--paper);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:10}
.head-in{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:64px;flex-wrap:wrap}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink)}
.logo-mark{width:36px;height:36px;border:1.5px solid var(--honey);color:var(--honey);display:grid;place-items:center;font-family:"Shippori Mincho",serif;font-weight:700;font-size:15px}
.logo-mark{border-radius:4px}
.logo-txt{font-family:"Shippori Mincho",serif;font-weight:700;letter-spacing:.12em;font-size:16px}
.logo-txt em,.foot-logo em{font-style:normal;color:var(--honey)}
.gnav{display:flex;gap:4px 18px;flex-wrap:wrap;font-size:14px}
.gnav a{text-decoration:none;color:var(--sub);padding:4px 0;border-bottom:2px solid transparent}
.gnav a[aria-current]{color:var(--ink);border-color:var(--honey)}
@media(max-width:759px){
  .head-in{padding-top:10px;padding-bottom:6px}
  .gnav{width:100%;overflow-x:auto;flex-wrap:nowrap;white-space:nowrap;padding-bottom:4px;font-size:13px;gap:16px}
}

.crumbs{max-width:1080px;margin:0 auto;padding:14px 20px 0;font-size:13px;color:var(--sub)}
.crumbs a{color:var(--sub)}

/* hero */
.hero{border-bottom:1px solid var(--line)}
.hero-in{display:grid;gap:32px;padding-top:56px;padding-bottom:56px;align-items:center}
@media(min-width:860px){.hero-in{grid-template-columns:1.05fr 1fr}}
.eyebrow{font-family:"Shippori Mincho",serif;color:var(--honey);letter-spacing:.2em;font-size:13px;text-transform:uppercase;margin-bottom:.8em}
.lead{color:var(--sub);font-size:17px}
.hero-act{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}
.hero-img{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.hero-img img{background:var(--paper);border:1px solid var(--line);border-radius:6px}
.hero-img img:last-child{margin-top:40px}

/* buttons */
.btn{display:inline-block;padding:11px 22px;border:1px solid var(--ink);color:var(--ink);text-decoration:none;font-size:14px;font-weight:500;border-radius:2px;background:transparent}
.btn-dark{background:var(--green);border-color:var(--green);color:#fff}
.btn-buy{background:var(--honey);border-color:var(--honey);color:#fff}
.tag-wait{display:inline-block;font-size:13px;color:var(--sub);border:1px dashed var(--line);padding:8px 14px;border-radius:2px}

/* sections */
.sec{padding-top:64px;padding-bottom:64px}
.sec-num{font-family:"Shippori Mincho",serif;font-size:44px;line-height:1;color:var(--honey);margin:0 0 6px;opacity:.75}
.sec-lead{color:var(--sub);margin-bottom:28px}
.band{background:var(--band)}
.more{margin-top:20px;font-size:15px}

/* product cards */
.pgrid{display:grid;gap:22px}
@media(min-width:760px){.pgrid{grid-template-columns:repeat(3,1fr)}.pgrid.two{grid-template-columns:repeat(2,1fr)}}
.pcard{background:var(--paper);border:1px solid var(--line);border-radius:6px;overflow:hidden;display:flex;flex-direction:column}
.pcard-img{display:block;background:#efece6;border-bottom:1px solid var(--line)}
.pcard-body{padding:18px 18px 20px;display:flex;flex-direction:column;flex:1}
.pcard-en{font-family:"Shippori Mincho",serif;color:var(--honey);font-size:13px;letter-spacing:.12em;margin:0}
.pcard h3{font-size:22px;margin:.1em 0 .5em}
.pcard h3 a{color:var(--ink);text-decoration:none}
.pcard-ing{font-size:14px;color:var(--sub);flex:1}
.pcard-ing b{display:block;color:var(--ink);font-size:12px;letter-spacing:.1em}
.pcard-act{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.pcard-act .btn{padding:9px 16px}

/* tables */
.tbl-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--line);border-radius:6px;background:var(--paper)}
.tbl{border-collapse:collapse;width:100%;font-size:14px;min-width:560px}
.tbl th,.tbl td{padding:12px 14px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.tbl thead th{background:var(--green);color:#fff;font-weight:500;white-space:nowrap}
.tbl tbody th{font-weight:500;background:#faf6ee;white-space:nowrap}
.tbl tr:last-child>*{border-bottom:none}
.cmp td{min-width:170px}

/* steps */
.steps{list-style:none;padding:0;margin:0;display:grid;gap:14px;counter-reset:s}
.steps li{counter-increment:s;background:var(--paper);border:1px solid var(--line);border-left:4px solid var(--honey);padding:16px 18px 16px 60px;position:relative;border-radius:4px}
.steps li::before{content:counter(s);position:absolute;left:18px;top:14px;font-family:"Shippori Mincho",serif;font-size:26px;color:var(--honey)}
.steps b{display:block}
.steps span{color:var(--sub);font-size:15px}

/* faq */
.faq details{background:var(--paper);border:1px solid var(--line);border-radius:4px;margin-bottom:10px}
.faq summary{cursor:pointer;padding:14px 44px 14px 18px;font-weight:500;list-style:none;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:18px;top:10px;font-size:22px;color:var(--honey)}
.faq details[open] summary::after{content:"−"}
.faq details p{padding:0 18px 16px;margin:0;color:var(--sub)}

/* product page */
.phero{border-bottom:1px solid var(--line)}
.phero-in{display:grid;gap:28px;padding-top:32px;padding-bottom:48px;align-items:center}
@media(min-width:860px){.phero-in{grid-template-columns:1fr 1fr}}
.phero img{background:var(--paper);border:1px solid var(--line);border-radius:6px}
.spec{display:grid;grid-template-columns:8.5em 1fr;border-top:1px solid var(--line);margin:0 0 28px}
.spec dt,.spec dd{padding:12px 0;border-bottom:1px solid var(--line);margin:0}
.spec dt{color:var(--sub);font-size:14px}
@media(max-width:520px){.spec{grid-template-columns:1fr}.spec dt{border-bottom:none;padding-bottom:0}}
.back{margin:0}
.back img{border-radius:6px;border:1px solid var(--line)}
figcaption{font-size:13px;color:var(--sub);margin-top:8px}
.small{font-size:13px;color:var(--sub);margin-top:12px}
.caution{background:var(--paper);border:1px solid var(--line);border-radius:6px;padding:20px 22px}
.caution h3{font-size:17px}
.caution ul{margin:0;padding-left:1.2em;color:var(--sub);font-size:15px}

/* buy */
.buybox{background:var(--paper);border:2px solid var(--honey);border-radius:8px;padding:24px 20px}
.buy-grid{display:grid;gap:12px}
@media(min-width:640px){.buy-grid{grid-template-columns:repeat(3,1fr)}}
.buy{display:flex;flex-direction:column;gap:2px;text-decoration:none;color:var(--ink);border:1px solid var(--line);border-radius:6px;padding:16px;background:var(--bg)}
.buy:hover{border-color:var(--honey)}
.buy-l{font-family:"Shippori Mincho",serif;font-size:20px;font-weight:700}
.buy-p{font-size:22px;font-weight:700;color:var(--honey)}
.buy-p small{font-size:12px;color:var(--sub);font-weight:400}
.buy-n{font-size:12px;color:var(--sub)}
.buy-go{margin-top:8px;background:var(--honey);color:#fff;text-align:center;padding:9px;border-radius:4px;font-size:14px;font-weight:500}

.vs{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:24px}
.vs>div{background:var(--paper);border:1px solid var(--line);border-radius:6px;padding:16px}
.vs figure{margin:0}
.vs img{border:1px solid var(--line);border-radius:6px;background:var(--paper)}

/* footer */
.site-foot{background:var(--green);color:#dfe6e1;padding:48px 0 24px;margin-top:40px;font-size:14px}
.foot-in{display:grid;gap:24px}
@media(min-width:760px){.foot-in{grid-template-columns:1.3fr 1fr}}
.site-foot nav{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.site-foot a{color:#fff;text-decoration:none}
.foot-logo{font-family:"Shippori Mincho",serif;font-size:18px;letter-spacing:.12em;color:#fff}
.foot-note{font-size:12px;color:#b9c6be;margin-top:24px}
.copy{text-align:center;font-size:12px;color:#b9c6be;margin:16px 0 0}
.nw{display:inline-block}
