.list-hero,.detail-hero,.article-hero{background:#252e54;color:#fff}
.list-hero{padding:52px 0 56px}
.list-hero h1,.detail-hero h1{font-size:clamp(30px,3.6vw,46px);line-height:1.45;margin:0 0 18px}
.list-hero .eyebrow,.detail-hero .eyebrow{color:#d0b77c}
.list-hero .label,.detail-hero .label{color:#a2d5d1}
.list-hero .lead,.detail-hero .lead{color:#d0dbea;font-size:15px;margin:0}
.sample-note{font-size:11px;color:#8a93a3;margin:0 0 10px}
.related-head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:22px}
.related-head h2{font-size:24px;margin:0}
.textlink{color:#147f82;font-weight:700;font-size:14px}
.actions{display:flex;gap:22px;align-items:center;flex-wrap:wrap;margin-top:26px}
.actions .button{margin-left:0}
@media(max-width:760px){.list-hero{padding:38px 0 40px}.related-head{flex-direction:column;align-items:flex-start}}

.case-count{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #e1e6ec;padding-bottom:14px;margin-bottom:26px}
.case-count p{margin:0;font-size:13px;color:#5d6577}.case-count b{font-size:22px;color:#252e54;margin-right:3px}
.case-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.case-card{background:#fff;border:1px solid #dfe5eb;border-bottom:2px solid #147f82;box-shadow:0 10px 28px rgba(37,46,84,.045);transition:.2s}
.case-card:nth-child(3n+2){border-bottom-color:#a47d31}.case-card:nth-child(3n){border-bottom-color:#7581a8}
.case-card:hover{transform:translateY(-3px);box-shadow:0 18px 40px rgba(37,46,84,.1)}
.case-card a{display:flex;flex-direction:column;height:100%;color:inherit}
.case-visual{aspect-ratio:870/420;position:relative;overflow:hidden;background-color:#e9edf2;background-size:cover;background-position:center;background-repeat:no-repeat}
.profile-logo{display:block;max-height:44px;max-width:180px;width:auto;margin:0 0 12px;background:#fff;padding:6px}
.case-logo{position:absolute;left:14px;top:14px;background:rgba(255,255,255,.96);padding:7px 10px;box-shadow:0 6px 18px rgba(18,31,53,.12);max-width:58%}
.case-logo img{display:block;max-height:30px;max-width:100%;width:auto}
.case-company{font-size:12px !important;color:#7b8396 !important;margin-top:10px !important}
.case-pending{border-style:dashed;border-bottom:2px dashed #b8c0cc;box-shadow:none}.case-pending:hover{transform:none;box-shadow:none}
.pending-visual{display:grid;place-items:center;background:#f1f3f7}.pending-visual span{font:700 15px Arial;letter-spacing:.2em;color:#9aa3b5}
.hero-company{color:#fff;font-weight:700;margin:18px 0 0;font-size:14px;display:flex;flex-wrap:wrap;gap:6px 18px}
.hero-company span{color:#d0b77c;font-weight:600}
.case-article h2.q{font-size:18px;line-height:1.7;color:#252e54;margin:34px 0 12px;padding-left:14px;border-left:3px solid #147f82}
.case-article h2.q:first-child{margin-top:0}
.case-article p{margin:0 0 1.2em;line-height:2;color:#33405a}
.case-top{margin:0 0 34px;padding:0 2%}.case-top img{max-width:98%;height:auto;display:block}   /* 今のサイトと同じ余白・大きさ */
.case-top.c img{max-width:100%;margin:0 auto}
.detail-hero h1{max-width:none;text-wrap:balance}.detail-hero h1 .ph{display:inline-block}
@media(max-width:640px){.detail-hero h1{font-size:24px;line-height:1.55}}.detail-hero .lead{max-width:820px}
.case-block{overflow:hidden;margin:0 0 30px;padding:0 2% 30px;border-bottom:1px solid #e6eaef}   /* 左右の余白2%は今のサイトと同じ */
.case-block:last-child{border-bottom:0}
/* 文字の色は今のサイトの事例記事に合わせる（阪本さん・10/23）。本文 #002c46、質問 #2e4ba3（太字・一回り大きく）
   大きさは、サイト全体で文字を大きくする方針に合わせて本文16px（今のサイトは14px）。質問・小見出しは本文より一回り大きく */
.case-block h3{font-size:19px;line-height:1.6;color:#002c46;margin:0 0 18px;font-weight:700}
.case-block p{margin:0 0 1.1em;line-height:2;color:#002c46;font-size:16px}
.case-block strong.q{display:block;font-size:19px;color:#2e4ba3;font-weight:700;margin:1.4em 0 .4em;line-height:1.7}
.case-block p:first-child strong.q,.case-block h3+p strong.q{margin-top:0}
.case-block p.fl,.case-block p.fr{max-width:100%;margin-top:4px}   /* 写真は元の大きさのまま（今のサイトと同じ） */
.case-block p.fl{float:left;margin-right:28px}.case-block p.fr{float:right;margin-left:28px}
.case-block p.c{text-align:center;clear:both}
.case-block img{max-width:100%;height:auto;vertical-align:top}
.case-block br.clr{clear:both;display:block;content:"";height:0}
@media(max-width:640px){.case-block p.fl,.case-block p.fr{float:none;width:100%;margin:0 0 16px}}
.case-photos{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin:8px 0 26px}
.case-photos img{width:100%;height:auto;display:block;border:1px solid #e1e6ec}
.profile-name{font-weight:700;color:#252e54;margin:0 0 8px}
.profile{font-size:13px;line-height:1.9;color:#33405a;margin-bottom:24px;word-break:break-all}.profile a{color:#147f82}
.mock-logo{position:absolute;left:16px;top:16px;display:flex;align-items:center;gap:9px;padding:7px 12px 7px 8px;background:rgba(255,255,255,.95);color:#252e54;box-shadow:0 6px 18px rgba(18,31,53,.12)}
.mock-logo i{display:grid;place-items:center;width:26px;height:26px;background:#147f82;color:#fff;font:700 13px Arial;font-style:normal}
.case-card:nth-child(3n+2) .mock-logo i,.detail-visual .mock-logo i{background:#a47d31}.case-card:nth-child(3n) .mock-logo i{background:#5d688e}
.mock-logo span{font:700 11px Arial;letter-spacing:.12em}
.case-body{padding:24px 26px 26px;display:flex;flex-direction:column;flex:1}
.case-tag{color:#147f82;font-size:12px;font-weight:700;margin:0}
.case-body h3{font-size:19px;line-height:1.65;margin:12px 0 10px;color:#252e54}
.case-body p:not(.case-tag){font-size:13px;line-height:1.85;color:#5d6577;margin:0}
.case-more{margin-top:auto;padding-top:18px;color:#147f82;font-size:13px;font-weight:700}
.mock-note{font-size:11px;color:#8a93a3;margin-top:18px}
.list-cta h2{font-size:clamp(24px,2.6vw,32px);line-height:1.55}
.detail-hero{padding:48px 0 52px}
.detail-hero-inner{display:grid;grid-template-columns:1.15fr .85fr;gap:48px;align-items:center}
.detail-visual{border-bottom:3px solid #a47d31}
.case-detail-layout{max-width:964px;padding-top:56px;padding-bottom:70px}   /* 中身の幅900px＝今のサイトの本文と同じ */
.case-profile{margin-top:10px;padding:6px 2% 0}
.case-profile .profile-name{font-size:19px;font-weight:700;color:#000;margin:0 0 6px}
.case-profile .profile{font-size:15px;line-height:2;color:#002c46;white-space:pre-wrap;word-break:break-all}.case-profile .profile a{color:#2e4ba3}
.case-pager{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:16px;margin-top:48px;padding-top:28px;border-top:1px solid #e1e6ec;font-size:14px}
.case-pager a{color:#002c46}.case-pager a:last-child{text-align:right}
.case-pager .to-list{background:#002c46;color:#fff;padding:8px 26px}
.case-section{padding:0 0 30px;margin-bottom:30px;border-bottom:1px solid #e6eaef}
.case-section h2{font-size:20px;color:#252e54;margin:0 0 12px;padding-left:14px;border-left:3px solid #147f82}
.case-section p{margin:0;line-height:2;color:#33405a}
.case-facts{position:sticky;top:100px;background:#f5f7f9;padding:26px;border-top:3px solid #252e54}
.case-facts h2{font-size:14px;margin:0 0 12px;color:#252e54}
.case-facts dl{display:grid;grid-template-columns:82px 1fr;gap:8px 12px;margin:0 0 24px;font-size:13px}
.case-facts dt{color:#7b8396}.case-facts dd{margin:0;color:#25304a;font-weight:600}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:24px}
.chips a{font-size:12px;padding:6px 10px;background:#fff;border:1px solid #d5dce5;color:#252e54}
.case-facts .button{width:100%}
@media(max-width:960px){.case-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.detail-hero-inner,.case-detail-layout{grid-template-columns:1fr}.case-facts{position:static}}
@media(max-width:640px){.case-grid{grid-template-columns:1fr}}