/* =====================================================================
   実績ページ（一覧・記事）共通のスタイル
   ===================================================================== */
:root{--f-head:"Kiwi Maru","Zen Maru Gothic",serif;--w-head:500;--f-min:"Hina Mincho",serif;--w-min:400;
--f-body:"Zen Maru Gothic","Hiragino Maru Gothic ProN","Hiragino Sans",sans-serif;
--navy:#102B45;--ocean:#25627A;--teal:#38877E;--mint:#3fb59c;--cool:#F2F6F8;--coral:#FF714F;--bg:#FFFFFF;--fg:#102B45;--mute:#3e566b;--line:#c2d3de;
--ac:var(--teal);--gut:48px;--ease:cubic-bezier(.2,.85,.2,1);color-scheme:light;box-sizing:border-box;padding-top:env(safe-area-inset-top,0px)}
*{box-sizing:border-box}
html{scroll-padding-top:110px}
body{margin:0;background:var(--bg);color:var(--fg);font:500 16px/1.95 var(--f-body);-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit}.ink{fill:currentColor}.accent{fill:var(--coral)}
img{max-width:100%;height:auto;display:block}
.en{font-family:Quicksand,var(--f-body);font-weight:700;letter-spacing:.16em;text-transform:uppercase}
.wrap{position:relative;z-index:2;max-width:1200px;margin:0 auto;padding:0 var(--gut)}
:focus-visible{outline:3px solid var(--coral);outline-offset:3px;border-radius:8px}
[hidden]{display:none!important}

/* ヘッダー（読み進み具合のバー付き） */
.hd{position:fixed;inset:0 0 auto;z-index:30;padding-top:env(safe-area-inset-top,0px);background:rgba(255,255,255,.93);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 10px 30px -20px rgba(16,43,69,.35)}
.hd .wrap{max-width:1320px;height:80px;display:flex;justify-content:space-between;align-items:center;gap:16px}
.hd svg{height:56px;width:auto;display:block}
.hl{display:flex;align-items:center;gap:22px;font-size:.86rem}
.hl a{text-decoration:none}.hl a:hover{color:var(--coral)}
.hbtn{padding:10px 20px;border-radius:99px;background:var(--coral);color:#fff!important;font-weight:700}.hbtn:hover{background:var(--navy)}
.pg{position:absolute;left:0;bottom:0;height:3px;width:100%;background:var(--line)}
.pg::after{content:"";position:absolute;inset:0;background:var(--coral);transform:scaleX(var(--p,0));transform-origin:left}

/* ふわっと現れる */
.rv{opacity:0;transform:translateY(30px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.rv.in{opacity:1;transform:none}

/* 共通パーツ */
.lb::before{content:"";display:block;width:12px;height:12px;border-radius:50%;background:var(--coral);margin-bottom:14px}
.lb small{display:block;margin-top:6px;font:700 .8rem var(--f-body);letter-spacing:.2em;color:var(--mute)}
.tags{display:flex;flex-wrap:wrap;gap:6px;margin:0;padding:0;list-style:none}
.tags li{padding:3px 12px;border-radius:99px;background:var(--cool);font-size:.76rem;font-weight:700}
.go{display:inline-flex;justify-content:center;align-items:center;gap:10px;padding:17px 32px;border:0;border-radius:99px;background:var(--coral);color:#fff;font:700 1rem var(--f-body);letter-spacing:.04em;text-decoration:none;cursor:pointer;transition:background .3s,transform .3s var(--ease)}
.go:hover{background:#ff5a33;transform:translateY(-2px)}
.go i{font-style:normal;transition:transform .35s var(--ease)}.go:hover i{transform:translateX(5px)}
.sub{display:inline-flex;align-items:center;gap:8px;padding:15px 26px;border-radius:99px;border:1.5px solid currentColor;text-decoration:none;font-weight:700;transition:.3s}
.sub:hover{background:#fff;color:var(--navy)}
@keyframes morph{50%{border-radius:42% 58% 38% 62%/58% 42% 58% 42%}100%{border-radius:58% 42% 55% 45%/48% 58% 42% 52%}}
.bl{position:absolute;border-radius:46% 54% 50% 50%/52% 46% 54% 48%;animation:morph 14s ease-in-out infinite alternate;pointer-events:none}

/* ========== 一覧 ========== */
.lt{position:relative;overflow:hidden;padding:170px 0 70px;background:linear-gradient(180deg,#eef6fb,#fff)}
.lt .b1{right:-8vw;top:-6vw;width:30vw;height:28vw;background:linear-gradient(200deg,#8fd6f0,#3a9cc0 45%,#25627A)}
.lt .b2{right:22vw;bottom:-10vw;width:16vw;height:16vw;background:linear-gradient(145deg,#8ee6cf,#3fb59c 45%,#38877E)}
.lt h1{margin:18px 0 0;font-family:var(--f-min);font-weight:var(--w-min);font-size:clamp(34px,5vw,80px);line-height:1.4;letter-spacing:.06em}
.lt .lead{max-width:36em;margin:22px 0 0}
.flt{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 34px}
.flt button{font:700 .88rem var(--f-body);padding:8px 18px;border-radius:99px;border:1.5px solid var(--line);background:#fff;color:var(--fg);cursor:pointer;transition:all .25s var(--ease)}
.flt button:hover{border-color:var(--teal)}
.flt button[aria-pressed="true"]{background:var(--navy);border-color:var(--navy);color:#fff}
.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:56px 40px;padding-bottom:120px}
.card{display:flex;flex-direction:column;text-decoration:none;transition-delay:calc(var(--k,0)*90ms)}
.card.big{grid-column:1/3;display:grid;grid-template-columns:1.35fr 1fr;gap:0 44px;align-items:center}
.card .im{position:relative;overflow:hidden;border-radius:22px;background:var(--cool);aspect-ratio:1000/690}
.card .im img{width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease)}
.card:hover .im img{transform:scale(1.04)}
.card .im::after{content:"記事を読む →";position:absolute;right:16px;bottom:16px;padding:9px 16px;border-radius:99px;background:var(--coral);color:#fff;font-size:.82rem;font-weight:700;opacity:0;transform:translateY(8px);transition:.4s var(--ease)}
.card:hover .im::after,.card:focus-visible .im::after{opacity:1;transform:none}
.card .tx{padding-top:22px}
.card.big .tx{padding-top:0}
.card .mt{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;font-size:.8rem;color:var(--mute);font-weight:700}
.card h2{margin:10px 0 2px;font-family:var(--f-min);font-weight:var(--w-min);font-size:clamp(26px,2.8vw,40px);line-height:1.4;letter-spacing:.06em}
.card.big h2{font-size:clamp(32px,3.8vw,56px)}
.card .cl{margin:0;font-family:var(--f-head);font-size:1.1rem}
.card .sm{margin:12px 0 14px;color:var(--mute);font-size:.94rem}
.card.next .im{display:grid;place-items:center;border:2px dashed var(--line);background:#fff}
.card.next .im p{margin:0;text-align:center;font-family:var(--f-min);font-size:clamp(20px,2vw,28px);line-height:1.7}
.card.next .im::after{content:"相談してみる →"}
.empty{grid-column:1/-1;color:var(--mute)}

/* ========== 記事 ========== */
.at{position:relative;overflow:hidden;padding:150px 0 0}
.at .b1{right:-10vw;top:-4vw;width:34vw;height:30vw;opacity:.9;background:var(--acg)}
.crumb{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 26px;padding:0;list-style:none;font-size:.8rem;color:var(--mute)}
.crumb li+li::before{content:"/";margin-right:8px;color:var(--line)}
.crumb a{text-decoration:none}.crumb a:hover{color:var(--coral)}
.at .kind{display:inline-flex;align-items:center;gap:10px;font-size:.8rem;font-weight:700;color:var(--ac)}
.at .kind::before{content:"";width:28px;height:2px;background:currentColor}
.at h1{margin:14px 0 0;font-family:var(--f-min);font-weight:var(--w-min);font-size:clamp(44px,8vw,128px);line-height:1.2;letter-spacing:.06em}
.at .cl{margin:10px 0 0;font-family:var(--f-head);font-size:clamp(20px,2vw,28px)}
.at .tags{margin-top:18px}
.hero{position:relative;margin:56px 0 0;padding:36px;border-radius:32px;background:var(--acl)}
.hero img{border-radius:12px;width:100%}
.facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;margin:-1px 0 0;border-top:1.5px solid var(--line);border-bottom:1.5px solid var(--line)}
.facts div{padding:22px 20px 22px 0}
.facts div+div{padding-left:20px;border-left:1px dashed var(--line)}
.facts dt{font-size:.74rem;color:var(--mute);letter-spacing:.12em;font-weight:700}
.facts dd{margin:6px 0 0;font-weight:700;line-height:1.6;word-break:break-word}
.facts a{color:var(--ac)}
.body{display:grid;grid-template-columns:220px minmax(0,1fr);gap:0 60px;padding-top:90px;padding-bottom:40px}
.toc{position:sticky;top:120px;align-self:start;margin:0;padding:0;list-style:none;font-size:.86rem}
.toc a{display:flex;gap:10px;padding:8px 0;text-decoration:none;color:var(--mute);transition:color .3s}
.toc a span{font:700 .74rem Quicksand,sans-serif;color:var(--line);transition:color .3s}
.toc a.on{color:var(--fg)}.toc a.on span{color:var(--coral)}
.sec{padding:0 0 80px}
.sec .no{font:700 .8rem Quicksand,sans-serif;letter-spacing:.2em;color:var(--ac)}
.sec h2{margin:8px 0 22px;font-family:var(--f-head);font-weight:var(--w-head);font-size:clamp(26px,2.8vw,40px);line-height:1.45}
.sec p{margin:0 0 1.2em;max-width:40em}
.quote{margin:30px 0;padding:26px 30px;border-radius:0 22px 22px 0;border-left:4px solid var(--ac);background:var(--acl);font-family:var(--f-min);font-size:clamp(20px,2vw,26px);line-height:1.7;letter-spacing:.04em}
.dec{display:grid;gap:16px;margin:0;padding:0;list-style:none;counter-reset:d}
.dec li{position:relative;padding:26px 28px 24px 84px;border-radius:22px;border:1.5px solid var(--line);background:#fff;counter-increment:d}
.dec li::before{content:counter(d,decimal-leading-zero);position:absolute;left:26px;top:22px;font:700 1.8rem Quicksand,sans-serif;color:var(--ac)}
.dec h3{margin:0 0 6px;font-family:var(--f-head);font-weight:var(--w-head);font-size:1.25rem;line-height:1.5}
.dec p{margin:0;color:var(--mute)}
.role{display:flex;flex-wrap:wrap;gap:10px;margin:0;padding:0;list-style:none}
.role li{padding:10px 18px;border-radius:14px;background:var(--acl);font-weight:700}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin:0 0 18px}
.stat{padding:24px 26px;border-radius:22px;background:var(--navy);color:#fff}
.stat b{display:block;font:700 clamp(34px,3.6vw,52px)/1.1 Quicksand,sans-serif}
.stat b small{font:700 1rem var(--f-body);margin-left:4px}
.stat span{display:block;margin-top:8px;font-size:.88rem;opacity:.85}
.note{font-size:.8rem;color:var(--mute)}
.soon{padding:26px 28px;border-radius:22px;border:2px dashed var(--line);color:var(--mute)}
.soon b{display:block;color:var(--fg);font-family:var(--f-head);font-weight:var(--w-head);font-size:1.2rem;margin-bottom:4px}
.cta{margin:20px 0 0;padding:48px;border-radius:32px;background:var(--navy);color:#fff;display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap}
.cta p{margin:0;font-family:var(--f-head);font-weight:var(--w-head);font-size:clamp(20px,2.2vw,30px);line-height:1.5}
.cta p small{display:block;font-family:var(--f-body);font-size:.9rem;opacity:.8;margin-top:4px}
.cta .bt{display:flex;flex-wrap:wrap;gap:12px}
.nx{display:grid;grid-template-columns:1fr 1fr;gap:16px;padding-top:60px;padding-bottom:110px}
.nx a{display:block;padding:24px 28px;border-radius:22px;border:1.5px solid var(--line);text-decoration:none;transition:border-color .3s,transform .3s var(--ease)}
.nx a:hover{border-color:var(--coral);transform:translateY(-3px)}
.nx small{display:block;font-size:.76rem;color:var(--mute);font-weight:700}
.nx b{font-family:var(--f-min);font-weight:400;font-size:1.4rem;letter-spacing:.06em}
.nx a.r{text-align:right}

footer{background:#0b2034;color:rgba(255,255,255,.75);padding:44px 0 calc(36px + env(safe-area-inset-bottom,0px));font-size:.8rem}
footer .wrap{display:flex;justify-content:space-between;flex-wrap:wrap;gap:16px;max-width:1320px}

@media (max-width:900px){
  .grid{grid-template-columns:1fr;gap:48px}.card.big{grid-column:auto;display:flex}.card.big .tx{padding-top:22px}
  .body{grid-template-columns:1fr}.toc{display:none}
  .facts{grid-template-columns:1fr 1fr}.facts div:nth-child(3){padding-left:0;border-left:0}
  .facts div:nth-child(n+3){border-top:1px dashed var(--line)}
}
@media (max-width:760px){:root{--gut:24px}.hd .wrap{height:68px}.hd svg{height:44px}.hl .tl{display:none}
  .lt{padding:120px 0 50px}.at{padding:110px 0 0}.at h1{font-size:12vw}.card h2,.card.big h2{font-size:7.2vw}.hero{padding:12px;border-radius:20px;margin-top:36px}
  .dec li{padding:22px 20px 20px 64px}.dec li::before{left:18px;font-size:1.4rem}
  .cta{padding:30px 22px}.nx{grid-template-columns:1fr}.nx a.r{text-align:left}.body{padding-top:60px}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.rv{opacity:1;transform:none}}

/* 日本語の見出しを、言葉の切れ目で改行（対応ブラウザのみ） */
h1,h2,h3,.cp,.lead,.sub p,.cta p{word-break:auto-phrase;text-wrap:pretty}

/* 通じる課題 */
.iss{margin:30px 0 0;padding:22px 26px;border-radius:22px;background:var(--acl)}
.iss .il{margin:0 0 12px;font-weight:700;font-size:.9rem;color:var(--ac)}
.iss .il small{display:block;margin-top:2px;font-weight:500;color:var(--mute);font-size:.84rem}
.iss ol{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:0;padding:0;list-style:none;counter-reset:i}
.iss li{position:relative;padding:14px 16px 14px 46px;border-radius:14px;background:#fff;font-family:var(--f-head);font-size:1.02rem;line-height:1.5;counter-increment:i}
.iss li::before{content:counter(i);position:absolute;left:14px;top:14px;display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--ac);color:#fff;font:700 .76rem Quicksand,sans-serif}
@media (max-width:760px){.iss{padding:18px}.iss ol{grid-template-columns:1fr}}
/* 数字と担当の切り分け */
.cause{margin:22px 0 0;padding:20px 24px;border-radius:18px;border:1.5px solid var(--line);background:#fff}
.cause p{margin:0 0 .6em;font-size:.94rem}.cause p:last-child{margin:0}
.cause b{display:block;margin-bottom:4px;color:var(--ac)}
.cause strong{background:linear-gradient(transparent 62%,var(--acl) 62%)}