/* Symbol Maker テーマの見た目 */
:root{color-scheme:light}
:root{
  --navy:#18364E;
  --deep:#0B1A28;
  --ink:#16202B;
  --paper:#FFFFFF;
  --sub:#F4F5F4;
  --rule:#E5E6E4;
  --rule-d:rgba(255,255,255,.14);
  --muted:#707C88;
  --mincho:"Shippori Mincho B1","Yu Mincho","YuMincho","Hiragino Mincho ProN","Noto Serif JP",serif;
  --gothic:"Zen Kaku Gothic New","Hiragino Kaku Gothic ProN","Hiragino Sans","Yu Gothic","YuGothic","Meiryo",sans-serif;
  --latin:"Inter","Helvetica Neue",Arial,sans-serif;
  --pad:48px;
  --ease:cubic-bezier(.19,.78,.28,1);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:var(--gothic);color:var(--ink);background:var(--paper);line-height:1.95;font-size:15.5px;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
li{list-style:none}
:focus-visible{outline:2px solid var(--navy);outline-offset:4px}
.wrap{max-width:1340px;margin:0 auto;padding:0 var(--pad)}
.narrow{max-width:900px;margin:0 auto;padding:0 var(--pad)}
/* ---------- header ---------- */
header{position:fixed;top:env(safe-area-inset-top,0px);left:0;right:0;z-index:100;transition:background .5s var(--ease),border-color .5s}
header{border-bottom:1px solid transparent}
header.solid{background:#fff;border-bottom-color:var(--rule)}
.hbar{display:flex;align-items:center;justify-content:space-between;height:94px;transition:height .45s var(--ease)}
header.solid .hbar{height:74px}
.logo{height:34px;width:auto;transition:filter .5s,height .45s var(--ease)}
header:not(.solid) .logo{filter:brightness(0) invert(1)}
header.solid .logo{height:29px}
.gnav{display:flex;align-items:center;gap:4px}
.gnav>li>a{position:relative;display:block;padding:10px 18px;font-size:14px;font-weight:500;letter-spacing:.06em;color:#fff;transition:color .5s}
header.solid .gnav>li>a{color:var(--ink)}
.gnav>li>a::after{content:"";position:absolute;left:18px;right:18px;bottom:4px;height:1px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .45s var(--ease)}
.gnav>li>a:hover::after,.gnav>li>a[aria-current]::after{transform:scaleX(1)}
.cta-h a{margin-left:18px;display:flex;align-items:center;gap:10px;background:var(--navy);color:#fff!important;padding:15px 30px;font-size:13.5px;letter-spacing:.06em;transition:background .3s}
.cta-h a::after{display:none!important}
.cta-h a:hover{background:var(--deep)}
header:not(.solid) .cta-h a{background:#fff;color:var(--navy)!important}
header:not(.solid) .cta-h a:hover{background:rgba(255,255,255,.82)}
.burger{display:none;background:none;border:1px solid rgba(255,255,255,.6);color:#fff;padding:10px 16px;font:inherit;font-size:12.5px;letter-spacing:.08em;cursor:pointer}
header.solid .burger{border-color:var(--rule);color:var(--navy)}
/* ---------- hero ---------- */
.hero{position:relative;height:100svh;min-height:600px;overflow:hidden;background:var(--deep)}
.hslide{position:absolute;inset:0;background-size:cover;background-position:center;opacity:0;transition:opacity 2s var(--ease);animation:kb 30s linear infinite}
.hslide.on{opacity:1}
@keyframes kb{0%{transform:scale(1.02)}100%{transform:scale(1.16)}}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(88deg,rgba(11,26,40,.9) 0%,rgba(11,26,40,.6) 45%,rgba(11,26,40,.18) 100%)}
.hero-in{position:relative;z-index:3;height:100%;display:flex;align-items:center}
.hero h1{font-family:var(--mincho);font-weight:800;color:#fff;font-size:clamp(40px,7.4vw,96px);line-height:1.26;letter-spacing:.07em}
.hero h1 b{display:block;overflow:hidden;font-weight:800}
.hero h1 b i{display:block;font-style:normal;transform:translateY(108%);animation:up 1.15s var(--ease) forwards}
.hero h1 b:nth-child(2) i{animation-delay:.14s}
.hero h1 b:nth-child(3) i{animation-delay:.28s}
@keyframes up{to{transform:translateY(0)}}
.hero p{margin-top:34px;color:rgba(255,255,255,.84);font-size:clamp(14px,1.35vw,16px);line-height:2.2;max-width:32em;opacity:0;animation:fd 1.2s ease .72s forwards}
@keyframes fd{to{opacity:1}}
.hero-foot{position:absolute;left:var(--pad);right:var(--pad);bottom:38px;z-index:4;display:flex;justify-content:space-between;align-items:flex-end;opacity:0;animation:fd 1.2s ease 1s forwards}
.hero-foot .sc{font-family:var(--latin);font-size:10.5px;letter-spacing:.24em;color:rgba(255,255,255,.62);display:flex;align-items:center;gap:14px}
.hero-foot .sc span{width:52px;height:1px;background:rgba(255,255,255,.3);position:relative;overflow:hidden;display:block}
.hero-foot .sc span::after{content:"";position:absolute;inset:0;background:#fff;animation:cue 2.4s var(--ease) infinite}
@keyframes cue{0%{transform:translateX(-100%)}55%,100%{transform:translateX(100%)}}
.hero-idx{display:flex;gap:10px}
.hero-idx b{width:40px;height:2px;background:rgba(255,255,255,.26);display:block;transition:background .6s}
.hero-idx b.on{background:#fff}
/* ---------- page head ---------- */
.phead{position:relative;background:var(--deep);color:#fff;overflow:hidden}
.phead-bg{position:absolute;inset:0;background-size:cover;background-position:center;opacity:.3}
.phead-in{position:relative;z-index:2;padding:200px 0 84px}
.phead .en{display:block;font-family:var(--latin);font-size:11px;letter-spacing:.3em;color:rgba(255,255,255,.62);margin-bottom:20px}
.phead h1{font-family:var(--mincho);font-size:clamp(32px,5.2vw,62px);font-weight:800;letter-spacing:.06em;line-height:1.35}
.phead p{margin-top:24px;font-size:14.5px;color:rgba(255,255,255,.78);line-height:2.1;max-width:40em}
.crumb{border-bottom:1px solid var(--rule);font-size:12px;color:var(--muted)}
.crumb ol{display:flex;gap:12px;align-items:center;height:52px;flex-wrap:wrap}
.crumb a:hover{color:var(--navy)}
.crumb li+li::before{content:"/";margin-right:12px;color:var(--rule)}
.crumb li{display:flex;align-items:center}
/* ---------- sections ---------- */
section{padding:140px 0}
.tint{background:var(--sub)}
.shead{margin-bottom:64px}
.shead .en{display:block;font-family:var(--latin);font-size:11px;letter-spacing:.3em;color:var(--muted);margin-bottom:22px}
.shead h2{font-family:var(--mincho);font-size:clamp(28px,4vw,50px);font-weight:600;color:var(--navy);letter-spacing:.05em;line-height:1.45}
.shead .lead{font-size:15px;color:var(--muted);line-height:2.15;max-width:40em;margin-top:24px}
.rv{opacity:0;transform:translateY(30px);transition:opacity 1.1s var(--ease),transform 1.1s var(--ease)}
.rv.in{opacity:1;transform:none}
.rv[data-d="1"]{transition-delay:.1s}
.rv[data-d="2"]{transition-delay:.2s}
.rv[data-d="3"]{transition-delay:.3s}
.rv[data-d="4"]{transition-delay:.4s}
.rv[data-d="5"]{transition-delay:.5s}
.clip{overflow:hidden}
.clip img{transform:scale(1.12);transition:transform 1.6s var(--ease)}
.clip.in img{transform:scale(1)}
/* statement */
/* about split */
.split{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}
/* services */
/* cases */
/* metrics */
/* posts */
/* buttons */
.btn{display:inline-flex;align-items:center;gap:16px;padding:19px 46px;font-size:14px;letter-spacing:.06em;border:1px solid var(--navy);transition:.4s var(--ease)}
.btn i{font-style:normal;transition:transform .4s var(--ease)}
.btn:hover i{transform:translateX(6px)}
.btn-navy{background:var(--navy);color:#fff}
.btn-navy:hover{background:var(--deep);border-color:var(--deep)}
.btn-line{color:var(--navy)}
.btn-line:hover{background:var(--navy);color:#fff}
.btn-w{background:#fff;color:var(--navy);border-color:#fff}
.btn-w:hover{background:transparent;color:#fff}
/* band */
.band{position:relative;overflow:hidden;background:var(--deep)}
.band-bg{position:absolute;inset:0;background-size:cover;background-position:center;opacity:.24}
.band-in{position:relative;z-index:2;padding:130px 0;text-align:center}
.band h2{font-family:var(--mincho);font-size:clamp(25px,3.8vw,46px);font-weight:800;color:#fff;letter-spacing:.07em;line-height:1.6}
.band p{font-size:14.5px;color:rgba(255,255,255,.8);margin:28px auto 0;line-height:2.2;max-width:40em}
.band .acts{margin-top:46px;display:flex;gap:16px;justify-content:center;flex-wrap:wrap}
/* footer */
footer{background:var(--deep);color:rgba(255,255,255,.66);padding:92px 0 42px;font-size:13.5px}
.fgrid{display:grid;grid-template-columns:330px 1fr;gap:72px}
footer .logo{filter:brightness(0) invert(1);height:32px}
.faddr{font-size:12.5px;line-height:2.15;color:rgba(255,255,255,.55);margin-top:28px}
.fmap{display:grid;grid-template-columns:repeat(4,1fr);gap:38px}
.fmap h3{font-family:var(--latin);font-size:11px;color:#fff;letter-spacing:.2em;padding-bottom:14px;border-bottom:1px solid var(--rule-d);margin-bottom:16px;font-weight:400}
.fmap li+li{margin-top:11px}
.fmap a{font-size:12.5px;color:rgba(255,255,255,.58)}
.fmap a:hover{color:#fff}
.fbot{margin-top:66px;padding-top:26px;border-top:1px solid var(--rule-d);display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;font-family:var(--latin);font-size:11px;color:rgba(255,255,255,.38);letter-spacing:.08em}
/* SNS のリンク（アーキテクト・フッター） */
.sns{display:flex;flex-wrap:wrap;gap:10px}
.sns-a{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;border:1px solid var(--rule);border-radius:50%;color:var(--navy);transition:background .25s var(--ease),color .25s var(--ease),border-color .25s var(--ease)}
.sns-a svg{display:block;width:16px;height:16px;fill:currentColor}
.sns-a:hover,.sns-a:focus-visible{background:var(--navy);border-color:var(--navy);color:#fff}
.rich .m-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 24px;margin:0 0 24px}
.rich .m-head .m-name{margin-bottom:0}
.rich .m-head .sns{margin:0}
.fbot .sns--footer{gap:2px;margin:-10px -10px -10px 0;align-self:center}
.sns--footer .sns-a{width:36px;height:36px;border:0;color:rgba(255,255,255,.6)}
.sns--footer .sns-a:hover,.sns--footer .sns-a:focus-visible{background:none;color:#fff}
.sns--footer .sns-a:focus-visible{outline-color:#fff}
@media(max-width:760px){
  .rich .m-head .sns{gap:8px}
  .rich .m-head .sns-a{width:38px;height:38px}
}
/* rich (下層) */
.rich h2{font-family:var(--mincho);font-size:clamp(22px,3vw,32px);font-weight:600;color:var(--navy);letter-spacing:.04em;line-height:1.6;margin:78px 0 24px}
.rich h3{font-size:17.5px;font-weight:700;color:var(--navy);margin:44px 0 12px}
.rich p{font-size:15.5px;line-height:2.25;margin-bottom:20px}
.dl{border-top:1px solid var(--rule)}
.dl>div{display:grid;grid-template-columns:210px 1fr;gap:30px;padding:24px 8px;border-bottom:1px solid var(--rule)}
.dl dt{font-size:13.5px;font-weight:500;color:var(--navy);letter-spacing:.04em}
.dl dd{font-size:15px;line-height:2}
.filters{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:44px}
.filters button{background:none;border:1px solid var(--rule);color:var(--muted);font:inherit;font-size:13px;letter-spacing:.04em;padding:11px 24px;cursor:pointer;transition:.3s}
.filters button:hover{border-color:var(--navy);color:var(--navy)}
.filters button.on{background:var(--navy);border-color:var(--navy);color:#fff}
.hide{display:none!important}
.pager{display:flex;justify-content:space-between;gap:20px;margin-top:80px;padding-top:30px;border-top:1px solid var(--rule);font-size:13.5px;flex-wrap:wrap}
.pager a{color:var(--navy)}
.flowrow{display:grid;grid-template-columns:130px 1fr;gap:44px;padding:46px 0;border-bottom:1px solid var(--rule)}
.flowrow .n{font-family:var(--latin);font-size:46px;font-weight:300;color:var(--navy);line-height:1;letter-spacing:-.02em;opacity:.34}
.flowrow h3{font-size:19px;font-weight:700;color:var(--navy)}
.flowrow p{font-size:14.5px;color:var(--muted);margin-top:12px;line-height:2.1}
/* responsive */
@media(max-width:1180px){
:root{--pad:34px}
  .fgrid{grid-template-columns:1fr;gap:52px}
  .fmap{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:900px){
:root{--pad:22px}
  .gnav{display:none}
  .burger{display:block}
  .hbar{height:70px}
  header.solid .hbar{height:62px}
  .logo{height:26px}
  header.solid .logo{height:24px}
  .hero{height:86svh}
  .hero-foot{bottom:26px}
  .hero-foot .sc{display:none}
  section{padding:76px 0}
  .shead{margin-bottom:38px}
  .split{grid-template-columns:1fr;gap:34px}
  .dl>div{grid-template-columns:1fr;gap:6px}
  .phead-in{padding:130px 0 54px}
  .flowrow{grid-template-columns:70px 1fr;gap:22px;padding:32px 0}
  .flowrow .n{font-size:30px}
  .band-in{padding:80px 0}
  .fbot{flex-direction:column;gap:12px}
  .fbot .sns--footer{margin:-4px 0 -4px -10px;align-self:flex-start}
}
@media(prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .rv{opacity:1;transform:none}
  .hero h1 b i{transform:none}
  .hero p,.hero-foot{opacity:1}
  .clip img{transform:none}
}
/* ===== v5 additions ===== */
/* ===== v6 ===== */
.deliv{background:var(--deep);color:#fff;padding:40px 38px}
.deliv h3{font-family:var(--latin);font-size:11px;letter-spacing:.2em;color:rgba(255,255,255,.6);font-weight:400;margin-bottom:26px}
.deliv .dv{padding:18px 0;border-top:1px solid var(--rule-d)}
.deliv .dv:first-of-type{border-top:0;padding-top:0}
.deliv b{font-family:var(--latin);font-size:13px;letter-spacing:.06em;color:#fff}
.deliv span{display:block;font-size:13px;color:rgba(255,255,255,.7);line-height:1.95;margin-top:8px}
@media(max-width:900px){
  .deliv{padding:28px 24px}
}
/* v11: v4のサービスカード復活 */
.case{border:1px solid var(--rule);background:#fff;padding:30px 32px;transition:border-color .35s,box-shadow .35s}
.case:hover{border-color:var(--navy);box-shadow:0 14px 34px rgba(14,35,56,.09)}
.ctag{display:inline-block;font-size:12px;font-weight:500;color:var(--navy);border:1px solid var(--navy);padding:3px 11px;letter-spacing:.04em}
.case h3{font-family:var(--mincho);font-size:20.5px;font-weight:600;color:var(--navy);margin:15px 0 9px;line-height:1.6}
.cnums{display:flex;gap:44px;flex-wrap:wrap;margin-top:22px;padding-top:20px;border-top:1px solid var(--rule)}
.cnum b{display:block;font-family:var(--mincho);font-size:31px;font-weight:800;color:var(--navy);line-height:1.25}
.cnum b small{font-size:.48em;margin-left:2px}
.cnum>span{display:block;font-size:12.5px;color:var(--muted);margin-top:5px}
.cnum b .cnt{display:inline;font:inherit;color:inherit}
@media(max-width:760px){
  .case{padding:24px 22px}
  .cnums{gap:30px}
}
/* v16: 数字バンド（v4の復活）とヘッダー可読性 */
/* v19: SPでの画像高さ調整 */
@media(max-width:900px){
  .svc-media{height:132px!important}
  .cnums{gap:26px}
  .cnum b{font-size:27px}
}
/* v20: ABOUTのスライド／取扱業務の区切り */
.svc-sec{padding:54px 0;border-top:1px solid var(--rule)}
.svc-sec:first-of-type{border-top:0}
.svc-sec .split{gap:48px;align-items:center}
@media(max-width:900px){
  .svc-sec{padding:34px 0}
  .svc-sec .split{gap:20px}
}
/* v21: 取扱業務ページの再設計 */
.svc-wrap{max-width:1340px;margin:0 auto;padding:0 var(--pad);display:grid;grid-template-columns:220px 1fr;gap:64px;align-items:start}
.svc-nav{position:sticky;top:116px;padding-top:64px}
.svc-nav p{font-family:var(--latin);font-size:11px;letter-spacing:.24em;color:var(--muted);margin-bottom:18px}
.svc-nav li{border-top:1px solid var(--rule)}
.svc-nav li:last-child{border-bottom:1px solid var(--rule)}
.svc-nav a{display:block;padding:13px 2px;font-size:14px;color:var(--muted);transition:.3s var(--ease)}
.svc-nav a:hover{color:var(--navy);padding-left:8px}
.svc-nav a.cur{color:var(--navy);font-weight:700}
.svc-body .wrap{max-width:none;padding:0}
.svc-row{display:grid;grid-template-columns:1fr 1fr;gap:44px;align-items:center}
.svc-txt h2{font-family:var(--mincho);font-size:clamp(23px,2.9vw,33px);font-weight:600;color:var(--navy);letter-spacing:.04em;line-height:1.5}
.svc-txt p{font-size:15px;line-height:2.2;color:var(--ink);margin:18px 0 28px}
.svc-media{height:auto;aspect-ratio:16/10;overflow:hidden}
.svc-media img{width:100%;height:100%;object-fit:cover}
@media(max-width:1080px){
  .svc-wrap{grid-template-columns:1fr;gap:0}
  .svc-nav{display:none}
}
@media(max-width:760px){
  .svc-row{grid-template-columns:1fr;gap:18px}
  .svc-media{aspect-ratio:16/7;height:auto!important}
  .svc-txt p{margin:14px 0 22px}
}
/* ===== v22 ===== */
/* ナビが折り返さないように */
.gnav{flex-wrap:nowrap}
.gnav>li>a{white-space:nowrap;padding:10px 14px;font-size:13.5px}
.cta-h a{margin-left:12px;padding:14px 22px;font-size:13px;white-space:nowrap}
@media(min-width:1101px) and (max-width:1340px){
  .gnav>li>a{padding:10px 9px;font-size:12.5px}
  .cta-h a{padding:12px 16px;font-size:12px}
}
/* ヒーロー：左下に寄せ、ヘッダーと重ならないようにする */
.hero-bottom{align-items:flex-end!important;padding-bottom:clamp(72px,11vh,132px)}
.hero-bottom .wrap{padding-top:120px}
/* ABOUT：ロゴの積み木を線画にした帯 */
/* 共創事例：横並び＋横スクロール */
/* コラム：noteのヘッダー画像つきカード */
.ngrid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.ncard{display:block;border:1px solid var(--rule);background:#fff;overflow:hidden;transition:transform .45s var(--ease),box-shadow .45s,border-color .45s}
.ncard:hover{transform:translateY(-5px);box-shadow:0 16px 36px rgba(14,35,56,.12);border-color:var(--navy)}
.ncard figure{height:172px;overflow:hidden;background:var(--sub)}
.ncard img{width:100%;height:100%;object-fit:cover;transition:transform 1s var(--ease)}
.ncard:hover img{transform:scale(1.07)}
.nb{padding:20px 22px 24px}
.nb time{font-family:var(--latin);font-size:12px;color:var(--muted);letter-spacing:.07em}
.nb h3{font-size:16px;font-weight:500;color:var(--navy);line-height:1.75;margin:8px 0 14px}
.nb .ext{font-size:12.5px;color:var(--muted)}
.ncard:hover .nb .ext{color:var(--navy)}
@media(max-width:1080px){
  .ngrid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:760px){
  .ngrid{grid-template-columns:1fr}
}
/* ===== v23 ===== */
/* ヒーロー：高さを固定せず、内容に応じて伸ばす（ヘッダーと重ならない） */
.hero{height:auto!important;min-height:100svh;display:flex;align-items:flex-end}
.hero-in{position:relative;z-index:3;width:100%;height:auto!important;display:block;
  padding-top:clamp(118px,15vh,190px);padding-bottom:clamp(72px,10vh,128px)}
.hero h1{font-size:clamp(34px,6.2vw,76px);line-height:1.2}
.hero p{margin-top:28px;font-size:clamp(13.5px,1.15vw,15.5px);line-height:2.05;max-width:30em}
.hero-foot{bottom:26px}
@media(max-height:760px){
  .hero{min-height:0}
  .hero h1{font-size:clamp(30px,4.6vw,56px)}
  .hero-in{padding-top:118px;padding-bottom:64px}
  .hero-foot{display:none}
}
/* ABOUT：写真も図像も置かず、本人の言葉だけを組む */
/* ===== v24: ヒーローの横位置を確実に左へ固定 ===== */
.hero-in{display:block!important;width:100%!important;align-items:initial!important}
.hero-in>.wrap{width:100%!important;max-width:1340px!important;margin:0 auto!important;
  padding-left:var(--pad)!important;padding-right:var(--pad)!important;padding-top:0!important;
  text-align:left!important}
.hero h1,.hero p{margin-left:0!important;margin-right:auto!important;text-align:left!important}
.hero h1 b,.hero h1 b i{text-align:left!important}
/* ===== v25: 需要者視点の構成 ===== */
:root{--paper2:#F7F6F3}
.tint{background:var(--paper2)}
/* 「こんな状態」カード */
/* 3段階 */
/* 費用 */
/* ===== v26: トップを索引として組む ===== */
.idx-sec{padding:96px 0}
.idx-row{display:grid;grid-template-columns:270px 1fr;gap:60px;align-items:start}
.idx-head{position:sticky;top:120px}
.idx-head .en{display:block;font-family:var(--latin);font-size:11px;letter-spacing:.3em;color:var(--muted);margin-bottom:18px}
.idx-head h2{font-family:var(--mincho);font-size:clamp(24px,3vw,34px);font-weight:600;color:var(--navy);letter-spacing:.05em;line-height:1.5}
.idx-all{display:inline-flex;align-items:center;gap:10px;margin-top:26px;font-size:13.5px;color:var(--navy);border-bottom:1px solid var(--rule);padding-bottom:4px}
.idx-all i{font-style:normal;transition:transform .35s var(--ease)}
.idx-all:hover i{transform:translateX(6px)}
.sl{border-top:1px solid var(--rule)}
.sl li{border-bottom:1px solid var(--rule)}
.sl a{display:grid;grid-template-columns:230px 1fr 30px;gap:28px;align-items:center;padding:24px 4px;transition:padding .4s var(--ease),background .4s}
.sl a:hover{background:var(--paper2);padding-left:16px;padding-right:16px}
.sl-t{font-family:var(--mincho);font-size:19px;font-weight:600;color:var(--navy);letter-spacing:.03em}
.sl-d{font-size:13.5px;color:var(--muted);line-height:1.9}
.sl-a{justify-self:end;color:var(--navy);font-size:15px;transition:transform .35s var(--ease)}
.sl a:hover .sl-a{transform:translateX(5px)}
.cl a{grid-template-columns:150px 1fr 30px}
.cl-tag{font-size:12px;color:var(--muted);border:1px solid var(--rule);padding:3px 10px;text-align:center;letter-spacing:.03em}
.cl-t{font-size:15.5px;color:var(--navy);line-height:1.8}
.cl time{font-family:var(--latin);font-size:12.5px;color:var(--muted);letter-spacing:.07em}
.cinfo dl{border-top:1px solid var(--rule)}
.cinfo dl>div{display:grid;grid-template-columns:150px 1fr;gap:24px;padding:20px 4px;border-bottom:1px solid var(--rule)}
.cinfo dt{font-size:13.5px;font-weight:500;color:var(--navy)}
.cinfo dd{font-size:15px;line-height:1.9}
@media(max-width:1000px){
  .idx-row{grid-template-columns:1fr;gap:28px}
  .idx-head{position:static}
}
@media(max-width:760px){
  .idx-sec{padding:58px 0}
  .sl a{grid-template-columns:1fr 26px;gap:6px 14px}
  .sl-t{grid-column:1}
  .sl-d{grid-column:1}
  .sl-a{grid-row:1;grid-column:2}
  .cl a{grid-template-columns:1fr 26px}
  .cinfo dl>div{grid-template-columns:1fr;gap:4px}
}
[data-go],[data-dead],[data-anchor]{cursor:pointer}
/* ヘッダー：スクロール後は半透明（背後が透けて見える） */
header.solid{background:rgba(255,255,255,.80)!important}
@media(min-width:1101px){
  header.solid{backdrop-filter:saturate(1.4) blur(10px)}
}
/* ハンバーガー */
.burger{display:none;position:relative;width:44px;height:38px;background:transparent;border:1px solid var(--rule);cursor:pointer;padding:0;z-index:420}
.burger span{position:absolute;left:11px;right:11px;height:1.5px;background:var(--navy);transition:.3s var(--ease)}
.burger span:nth-child(1){top:13px}
.burger span:nth-child(2){top:18.5px}
.burger span:nth-child(3){top:24px}
body.nav-open .burger span:nth-child(1){top:18.5px;transform:rotate(45deg)}
body.nav-open .burger span:nth-child(2){opacity:0}
body.nav-open .burger span:nth-child(3){top:18.5px;transform:rotate(-45deg)}
/* 覆い（ドロワーの外側） */
@media(max-width:1100px){
  .burger{display:block}
  .sm.sm-site header{position:fixed;top:env(safe-area-inset-top,0px);left:0;right:0;background:rgba(255,255,255,.94);border-bottom:1px solid var(--rule)}
  .sm.sm-site header .logo{filter:none!important;height:25px}
  .sm.sm-site .hbar{height:60px}
  .sm.sm-site .hero,.sm.sm-site .phead{margin-top:60px}
/* 右から出る幅320pxのドロワー。画面全体は覆わない */
  .sm.sm-site .gnav{display:flex;position:fixed;top:0;right:0;bottom:0;width:78%;max-width:320px;
    z-index:410;flex-direction:column;align-items:stretch;justify-content:flex-start;
    background:var(--paper);padding:78px 22px 34px;gap:0;overflow-y:auto;
    box-shadow:-18px 0 44px rgba(11,26,40,.16);
    transform:translateX(100%);transition:transform .34s var(--ease);}
  body.nav-open.sm.sm-site .gnav{transform:none}
  .sm.sm-site .gnav>li{height:auto}
  .sm.sm-site .gnav>li>a{color:var(--ink)!important;padding:17px 2px;font-size:15.5px;border-bottom:1px solid var(--rule);height:auto;display:block}
  .sm.sm-site .gnav>li>a::after{display:none}
  .sm.sm-site .gnav .cta-h a{margin:24px 0 0;justify-content:center;background:var(--navy)!important;color:#fff!important;padding:16px;border:0}
}
@media(min-width:1101px){
  .burger{display:none}
}
/* ===== v28 ===== */
.ov-sec{padding:104px 0}
.ov{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center}
.ov-txt .en{display:block;font-family:var(--latin);font-size:11px;letter-spacing:.3em;color:var(--muted);margin-bottom:20px}
.ov-txt h2{font-family:var(--mincho);font-size:clamp(24px,3.2vw,40px);font-weight:600;color:var(--navy);letter-spacing:.05em;line-height:1.55}
.ov-txt p{font-size:15px;line-height:2.2;color:var(--ink);margin-top:26px}
.ov-txt .ov-sub{font-size:13.5px;color:var(--muted);line-height:2.05}
.ov-img{height:clamp(260px,34vw,430px)}
.ov-img img{width:100%;height:100%;object-fit:cover}
.sl a{grid-template-columns:96px 190px 1fr 30px}
.cl a{grid-template-columns:150px 1fr 30px}
@media(max-width:1000px){
  .ov{grid-template-columns:1fr;gap:28px}
  .ov-img{height:240px}
}
@media(max-width:760px){
  .ov-sec{padding:58px 0}
  .sl a{grid-template-columns:76px 1fr 26px;gap:8px 14px}
  .sl-t{grid-column:2}
  .sl-d{grid-column:2}
  .sl-a{grid-row:1;grid-column:3;align-self:center}
  .cl a{grid-template-columns:1fr 26px}
}
/* ===== v29 ===== */
.sl a{grid-template-columns:58px 190px 1fr 30px;gap:24px}
.sl-ic{width:58px;height:58px;display:flex;align-items:center;justify-content:center;
  border:1px solid var(--rule);background:#fff;transition:border-color .4s var(--ease),background .4s}
.sl-ic svg{width:34px;height:34px;fill:none;stroke:var(--navy);stroke-width:1.6;
  stroke-linecap:round;stroke-linejoin:round}
.sl a:hover .sl-ic{border-color:var(--navy);background:var(--paper2)}
.cinfo{display:grid;grid-template-columns:1fr 210px;gap:56px;align-items:center}
.cinfo-main{min-width:0}
.cmark{margin:0}
.cmark img{width:100%;height:auto;display:block;mix-blend-mode:multiply}
@media(max-width:1000px){
  .cinfo{grid-template-columns:1fr;gap:34px}
  .cmark{order:-1;max-width:168px;margin:0 auto}
}
@media(max-width:760px){
  .sl a{grid-template-columns:46px 1fr 26px;gap:10px 14px}
  .sl-ic{grid-row:span 2;width:46px;height:46px;align-self:start}
  .sl-ic svg{width:27px;height:27px}
  .sl-t{grid-column:2}
  .sl-d{grid-column:2}
  .sl-a{grid-row:1;grid-column:3;align-self:center}
}
/* ===== v31 ===== */
@media(min-width:1101px){
  .logo{height:clamp(38px,3.3vw,48px)}
  header.solid .logo{height:clamp(32px,2.8vw,40px)}
}
@media(max-width:1100px){
  .sm.sm-site header .logo{height:29px}
}
.sl.cl a{grid-template-columns:150px 1fr 30px;gap:28px}
.sl.cl .cl-t{grid-column:auto}
@media(max-width:760px){
  .sl.cl a{grid-template-columns:1fr 26px;gap:8px 14px}
  .sl.cl .cl-tag{grid-column:1;grid-row:1;justify-self:start}
  .sl.cl .cl-t{grid-column:1;grid-row:2}
  .sl.cl .sl-a{grid-column:2;grid-row:1 / span 2;align-self:center}
}
.rich .rich-en{display:block;font-family:var(--latin);font-size:11px;letter-spacing:.3em;color:var(--muted);margin:84px 0 14px}
.member+.member{margin-top:80px;padding-top:80px;border-top:1px solid var(--rule)}
.case{padding:34px 40px 36px}
.case h3{margin:15px 0 0}
.case-cols{display:grid;grid-template-columns:1fr 1fr;gap:40px;margin-top:24px;padding-top:24px;border-top:1px solid var(--rule)}
.case-sec h4,.case-res h4{display:flex;align-items:center;gap:10px;font-size:12.5px;font-weight:700;letter-spacing:.14em;color:var(--navy);margin-bottom:12px}
.case-sec h4::before,.case-res h4::before{content:"";width:18px;height:1px;background:currentColor}
.case-sec p{font-size:14px;line-height:2;color:var(--ink)}
.case-res{margin-top:28px;background:var(--paper2);padding:24px 28px 26px;display:grid;grid-template-columns:auto 1fr;column-gap:44px;row-gap:4px;align-items:center}
.case-res h4{grid-column:1 / -1}
.case-res .cnums{margin:0;padding:0;border:0;gap:36px;flex-wrap:nowrap}
.case-res .cnum{max-width:230px}
.case-res.nores{grid-template-columns:1fr}
.case-res.nores .cnum{max-width:none}
.case-res p{font-size:14px;line-height:1.95;color:var(--ink)}
@media(max-width:900px){
  .case-cols{grid-template-columns:1fr;gap:24px}
  .case-res{grid-template-columns:1fr;row-gap:14px}
  .case-res .cnums{flex-wrap:wrap;gap:26px}
}
@media(max-width:760px){
  .case{padding:26px 22px 28px}
  .case-res{padding:20px 18px 22px}
}
.cform{border-top:1px solid var(--navy)}
.cf-row{display:grid;grid-template-columns:230px 1fr;gap:28px;padding:22px 4px;border-bottom:1px solid var(--rule);align-items:start}
.cf-row label{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:14px;font-weight:500;color:var(--navy);padding-top:14px;letter-spacing:.03em}
.cform em{font-style:normal;font-size:11px;font-weight:500;color:#fff;background:var(--navy);padding:2px 8px;letter-spacing:.06em;line-height:1.6}
.cf-in input,.cf-in textarea{width:100%;padding:14px 16px;border:1px solid var(--rule);background:#fff;font:inherit;font-size:15px;color:var(--ink);border-radius:0;transition:border-color .3s;-webkit-appearance:none;appearance:none}
.cf-in input:focus,.cf-in textarea:focus{outline:0;border-color:var(--navy)}
.cf-in input::placeholder,.cf-in textarea::placeholder{color:#A9B1B8}
.cf-row.err input,.cf-row.err textarea{border-color:#B4443A}
.cf-err{display:block;font-size:12.5px;color:#B4443A;margin-top:8px}
.cf-note{margin-top:40px;padding:24px 26px;background:var(--paper2);font-size:13px;line-height:2;color:var(--ink)}
.cf-note a,.cf-agree a{color:var(--navy);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.cf-agree{display:flex;justify-content:center;align-items:center;gap:12px;margin-top:34px;font-size:14.5px}
.cf-agree label{display:flex;align-items:center;gap:10px;cursor:pointer}
.cf-agree input{width:18px;height:18px;accent-color:var(--navy);margin:0}
.cf-submit{text-align:center;margin-top:28px}
.cf-submit .btn{min-width:260px;justify-content:center;cursor:pointer;font:inherit;font-size:14px}
.cf-submit .btn[disabled]{opacity:.35;cursor:not-allowed}
@media(max-width:760px){
  .cf-row{grid-template-columns:1fr;gap:10px;padding:18px 0}
  .cf-row label{padding-top:0}
  .cf-note{padding:20px 18px;font-size:12.5px}
  .cf-agree{font-size:14px}
  .cf-submit .btn{width:100%;min-width:0}
}
.narrow .cinfo{grid-template-columns:1fr 170px;gap:48px}
@media(max-width:1000px){
  .narrow .cinfo{grid-template-columns:1fr;gap:30px}
}
.member.has-photo{display:grid;grid-template-columns:minmax(260px,380px) 1fr;gap:64px;align-items:start}
.m-photo{aspect-ratio:4/5;background:var(--paper2)}
.m-photo img{width:100%;height:100%;object-fit:cover;object-position:50% 20%}
.m-main .deliv{margin-top:44px}
@media(max-width:900px){
  .member.has-photo{grid-template-columns:1fr;gap:30px}
  .m-photo{max-width:400px}
}
@media(min-width:901px){
  .member.has-photo{align-items:stretch;grid-template-columns:minmax(280px,400px) 1fr}
  .m-photo{aspect-ratio:auto;align-self:stretch;min-height:460px;position:relative}
  .m-photo img{position:absolute;inset:0}
}
.m-main .deliv{margin-top:36px;padding:30px 34px 32px}
.deliv .dv-row{display:flex;justify-content:space-between;align-items:baseline;gap:6px 24px;flex-wrap:wrap}
.deliv .dv-row .dv-meta{margin-top:0;white-space:nowrap}
.m-main .deliv .dv{padding:16px 0}
.m-main .deliv .dv:first-of-type{padding-top:0}
.m-main .deliv h3{margin-bottom:20px}
.deliv .seg{display:inline-block;margin:0;color:inherit}
@media(max-width:480px){
  .band h2{font-size:23px;letter-spacing:.05em}
}
@media(max-width:1100px){
  .sm.sm-site .gnav{box-shadow:none!important;visibility:hidden;transition:transform .34s var(--ease),visibility 0s linear .34s!important}
  body.nav-open.sm.sm-site .gnav{box-shadow:-18px 0 44px rgba(11,26,40,.16)!important;visibility:visible;transition:transform .34s var(--ease),visibility 0s!important}
}
/* =========================================================
 * WordPress テーマとしての追加
 * ========================================================= */
/* 管理バー（ログイン中だけ表示）の分だけヘッダーを下げる */
.admin-bar header{top:32px}
@media(max-width:782px){
  .admin-bar header{top:46px}
}
@media(max-width:600px){
  #wpadminbar{position:fixed}
}
/* 本文へ移動（キーボード操作用） */
.skip-link{position:absolute;left:-9999px;top:0;z-index:1000;background:var(--navy);color:#fff;padding:12px 18px;font-size:14px}
.skip-link:focus{left:12px;top:12px}
.screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px);white-space:nowrap}
/* 私たちについて：Mission / Value のラベル */
.rich > .rich-en:first-child{margin-top:0}
.rich .rich-en + h2{margin-top:0}
/* アーキテクト */
.rich .m-name{margin-top:0;border-left:0;padding-left:0;font-size:clamp(26px,3.4vw,36px)}
.rich .m-role{font-size:13px;color:var(--muted);margin-top:-10px}
.member .split{align-items:start}
/* コラム：note へのリンク */
.note-more{margin-top:48px}
.note-empty{font-size:14.5px;color:var(--muted);line-height:2;padding:28px 0;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
/* 共創事例：領域が複数ある場合も絞り込めるように */
.cases{display:grid;gap:26px}
/* お問い合わせ */
.cf-hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
.cf-alert{margin-bottom:28px;padding:16px 20px;border:1px solid #B4443A;color:#B4443A;font-size:14px;background:#fff}
.cf-agree-wrap{text-align:center}
.cf-agree-wrap .cf-err{text-align:center}
.cf-thanks{text-align:center;padding:40px 0 20px}
.cf-thanks h2{font-family:var(--mincho);font-size:clamp(22px,3vw,30px);font-weight:600;color:var(--navy);letter-spacing:.05em}
.cf-thanks p{margin-top:22px;font-size:15px;line-height:2.1}
.cf-thanks .btn{margin-top:40px}
/* 一般的なページ（プライバシーポリシーなど）の本文 */
.entry ul,.entry ol{margin:18px 0 18px 1.4em;line-height:2}
.entry li+li{margin-top:4px}
.entry a{color:var(--navy);text-decoration:underline;text-underline-offset:3px}
.entry table{width:100%;border-collapse:collapse;margin:24px 0;font-size:14px}
.entry th,.entry td{border:1px solid var(--rule);padding:12px 14px;text-align:left;vertical-align:top}
.entry th{background:var(--paper2);font-weight:500;color:var(--navy)}
.entry img{height:auto;margin:24px 0}
.entry blockquote{border-left:2px solid var(--navy);padding:4px 0 4px 20px;margin:24px 0;color:var(--muted)}
.entry > h2:first-child{margin-top:0}
.nf-actions{margin-top:48px}
/* ページ内リンクで移動したとき、見出しが固定ヘッダーに隠れないように */
.case,.svc-sec,#flow,.member,#contact-form{scroll-margin-top:110px}
/* 一覧にカーソルを合わせても文字が動かないように（背景だけを左右に広げて表示する） */
.sl a{position:relative;isolation:isolate;transition:none}
.sl a::before{content:"";position:absolute;top:0;bottom:0;left:-16px;right:-16px;background:var(--paper2);opacity:0;transition:opacity .35s var(--ease);z-index:-1;pointer-events:none}
.sl a:hover{background:none;padding-left:4px;padding-right:4px}
.sl a:hover::before{opacity:1}
.tint .sl a::before{background:#fff}

/* カーソルを合わせたとき、背景が行の外側へ少し広がって現れる（文字は動かさない） */
.sl a::before{transform:scaleX(.94);transform-origin:center;transition:opacity .3s var(--ease),transform .5s var(--ease)}
.sl a:hover::before{transform:scaleX(1)}

/* 交互の背景色：紺に寄せたごく淡い青みの灰色（温かみのある灰色から変更） */
:root{--paper2:#F3F6F9;--sub:#F3F6F9}
.sm.sm-site a.sm-link{color:var(--navy);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;transition:opacity .2s}
.sm.sm-site a.sm-link:hover{opacity:.65}
.sm.sm-site a.sm-url{word-break:break-all}
/* ===== v1.0.4: トップの写真を、スマホでも画面の高さいっぱいに表示する ===== */
/* 画面の高さが低い端末（スマホの多く）で写真が内容の高さまで縮み、下の About が見えていたのを直す。
   スマホ・タブレットは上部のヘッダー（60px）の分を差し引いた高さにする。
   文章が画面に収まらないときは、これまでどおり内容に合わせて伸びる。 */
.sm.sm-site .hero{min-height:100vh;min-height:100svh}
.sm.sm-site .hero-foot{display:flex}
@media(max-width:1100px){
  .sm.sm-site .hero{min-height:calc(100vh - 60px);min-height:calc(100svh - 60px)}
}
/* ===== v1.0.6: コラム（note）のサムネイルを切らずに表示する ===== */
/* note の見出し画像は横:縦 = 1.91:1（800×419 など）。枠をその比率にして、文字の入った画像が欠けないようにする */
.sm.sm-site .ncard figure{height:auto;aspect-ratio:800/419}
.sm.sm-site .ncard:hover img{transform:scale(1.03)}
/* ===== v1.0.6: 「SCROLL」を下向きの動きにする（横に動くと、横から何か出てくるように見えるため） ===== */
/* 写真の上の文章と重ならないよう、画面下の中央に置く（パソコンのみ表示） */
@media(min-width:901px){
  .sm.sm-site .hero-foot{justify-content:flex-end}
  .sm.sm-site .hero-foot .sc{position:absolute;left:50%;bottom:0;transform:translateX(-50%)}
}
.sm.sm-site .hero-foot .sc{flex-direction:column;align-items:center;gap:12px;padding-left:.24em}
.sm.sm-site .hero-foot .sc span{width:1px;height:46px}
.sm.sm-site .hero-foot .sc span::after{animation:sm-cue-down 2.4s var(--ease) infinite}
@keyframes sm-cue-down{0%{transform:translateY(-100%)}55%,100%{transform:translateY(100%)}}
@media(prefers-reduced-motion:reduce){
  .sm.sm-site .hero-foot .sc span::after{animation:none;transform:none;opacity:.6}
}