/* ===== 1. 冒頭 ===== */
#top{position:relative;overflow:hidden;background:var(--ink);color:#fff}
#top>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 42%}
.hero-sh{position:absolute;inset:0;background:linear-gradient(90deg,rgba(12,12,12,.9) 0%,rgba(12,12,12,.76) 44%,rgba(12,12,12,.4) 76%,rgba(12,12,12,.3) 100%)}
.hero-fd{position:absolute;left:0;right:0;bottom:0;height:42%;background:linear-gradient(180deg,rgba(23,23,23,0) 0%,rgba(23,23,23,1) 100%)}
@media(max-width:820px){
  .hero-sh{background:linear-gradient(180deg,rgba(12,12,12,.74) 0%,rgba(12,12,12,.8) 55%,rgba(12,12,12,.88) 100%)}
}
.hero-in{position:relative;padding-block:clamp(72px,12vw,140px) clamp(80px,13vw,150px);min-height:clamp(480px,72vh,720px);display:flex;flex-direction:column;justify-content:center}
.hero-lab{font-size:clamp(14px,1.5vw,16px);font-weight:700;letter-spacing:.1em;display:flex;align-items:center;gap:12px;color:#fff;line-height:1.6}
.hero-lab s{width:28px;height:3px;background:var(--red);display:inline-block;flex:none;text-decoration:none}
/* D01：単語の途中で折り返さないよう、意味のまとまりごとに区切る */
.hero-lab .hl-t{min-width:0}
.hero-lab .hl-t > span{white-space:nowrap}
.hero-in h1{margin-top:22px;text-shadow:0 2px 24px rgba(0,0,0,.35)}
.hero-in .lede{color:#E6E8EA;max-width:46em;margin-top:24px}

/* ===== 2. 相談テーマ ===== */
.probs{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(310px,100%),1fr));gap:16px;margin-top:clamp(32px,4.4vw,44px)}
.pc{background:#fff;color:var(--ink);border-radius:var(--r);padding:clamp(22px,2.4vw,28px);display:flex;flex-direction:column;gap:14px}
.pc .who{
  align-self:flex-start;font-size:clamp(17px,1.8vw,20px);font-weight:800;line-height:1.3;
  padding:7px 14px;background:var(--ink);color:#fff;border-radius:4px;letter-spacing:.04em;
}
.pc .q{font-size:clamp(19px,2vw,22px);font-weight:700;line-height:1.55}
.pc .acts{margin-top:auto;display:flex;align-items:stretch;gap:10px;flex-wrap:wrap}
.pc .acts .btn{flex:1 1 auto;padding-inline:12px;font-size:14.5px}
.prob-foot{margin-top:clamp(26px,3vw,32px);display:flex;flex-wrap:wrap;gap:16px 24px;align-items:center}
.prob-foot p{flex:1 1 360px;min-width:0;font-size:16px;color:#DADDE0;line-height:1.85}

/* ===== 3. 支援内容 ===== */
.works{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line);margin-top:clamp(32px,4vw,40px)}
@media(max-width:760px){.works{grid-template-columns:1fr}}
.wk{background:#fff;padding:clamp(24px,2.8vw,34px);display:flex;flex-direction:column;gap:12px}
.wk .n{font-size:13px;font-weight:800;color:var(--red);letter-spacing:.14em}
.wk h3{font-size:clamp(20px,2.2vw,24px);font-weight:700;line-height:1.5}
.wk p{font-size:16px;color:var(--ink2);line-height:1.9}
.works-note{margin-top:clamp(26px,3vw,32px);display:flex;flex-wrap:wrap;gap:16px 32px}
.works-note p{flex:1 1 400px;min-width:0;font-size:16px;color:var(--ink2);line-height:1.9;padding-top:16px;border-top:2px solid var(--ink)}

/* ===== 4. 支援事例 ===== */
.cases{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(320px,100%),1fr));gap:clamp(20px,2.8vw,32px);margin-top:clamp(32px,4vw,40px)}
.case{display:flex;flex-direction:column;background:#fff;border-radius:var(--r);overflow:hidden;border:1px solid var(--line)}
.case .fig{aspect-ratio:16/10;border-radius:0;background:var(--sand3)}
.case-b{padding:clamp(22px,2.4vw,26px) clamp(22px,2.4vw,26px) 28px;display:flex;flex-direction:column;gap:12px}
.case .kind{font-size:13px;font-weight:700;color:var(--mute)}
.case h3{font-size:clamp(19px,2vw,22px);line-height:1.55;font-weight:700}
.case p.d{font-size:16px;color:var(--ink2);line-height:1.9}
.case .duty{margin-top:4px;padding-top:14px;border-top:1px solid var(--line);font-size:14.5px;color:var(--mute);line-height:1.8}

/* ===== 5. 私たちの考え方（MVV） ===== */
.mv{display:flex;flex-direction:column;gap:clamp(44px,6vw,72px);margin-top:clamp(32px,4vw,44px)}
.mv-b{display:flex;flex-wrap:wrap;gap:clamp(20px,3vw,48px)}
.mv-k{flex:0 1 340px;min-width:0}
/* ⑬ MISSION・VISION・VALUES のラベル。3つとも同じ大きさ。
   見え方の順番は 日本語見出し(h3) > このラベル > 本文 を保つこと */
.mv-k .en{font-size:clamp(19px,2.1vw,26px);font-weight:800;letter-spacing:.08em;color:var(--red);line-height:1.5;word-break:auto-phrase;line-break:strict}
.mv-c{flex:1 1 520px;min-width:0}
.mv-c h3{font-size:clamp(23px,3.1vw,38px);line-height:1.45;font-weight:700}
.mv-c .body{margin-top:clamp(20px,2.4vw,26px);display:flex;flex-direction:column;gap:1.5em}
.mv-c .body p{font-size:clamp(16px,1.5vw,18px);line-height:2.05;color:var(--ink2)}

.vals-wrap{margin-top:clamp(40px,5.5vw,72px)}
.vals-wrap > .en{font-size:clamp(19px,2.1vw,26px);font-weight:800;letter-spacing:.08em;color:var(--red);line-height:1.5;word-break:auto-phrase;line-break:strict}
.vals{margin-top:clamp(20px,2.4vw,28px);display:flex;flex-direction:column;gap:1px;background:var(--line);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.val{background:var(--sand);padding:clamp(26px,3.2vw,38px) clamp(20px,2.6vw,32px)}
.val .num{font-size:clamp(20px,2.7vw,30px);font-weight:800;line-height:1.5;letter-spacing:.01em}
.val .num i{font-style:normal;color:var(--red);margin-right:4px}
.val .en{margin-top:8px;font-size:14.5px;font-weight:700;letter-spacing:.06em;color:var(--mute)}
.val p{margin-top:16px;max-width:64em;font-size:16.5px;line-height:2;color:var(--ink2)}

/* 2つの循環の図 */
.cyc-scroll{margin-top:clamp(28px,3.4vw,40px);overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch}
.cyc{position:relative;min-width:1000px;aspect-ratio:1100/760;background:#fff;border-radius:16px;box-shadow:0 1px 0 var(--line2)}
.cyc>svg{position:absolute;inset:0;width:100%;height:100%}
.cyc .cn{position:absolute;transform:translate(-50%,-50%);width:14.6%;background:#fff;border:1px solid var(--ink);border-radius:8px;padding:10px 12px 11px;box-shadow:0 6px 18px rgba(23,23,23,.08)}
.cyc .cn-t{display:flex;align-items:baseline;gap:8px;font-size:15px;font-weight:700;line-height:1.35}
.cyc .cn-k{font-size:11px;font-weight:800;color:var(--red);letter-spacing:.08em;flex:none}
.cyc .cn-s{margin-top:4px;font-size:12px;color:var(--mute);line-height:1.45}
.cyc .cc{position:absolute;transform:translate(-50%,-50%);text-align:center;white-space:nowrap}
.cyc .cc-e{display:block;font-size:11.5px;font-weight:800;color:#8A8F95;letter-spacing:.16em}
.cyc .cc-n{display:block;margin-top:4px;font-size:24px;font-weight:800}
.cyc .cc-d{display:block;margin-top:2px;font-size:12px;color:var(--mute)}
.cyc .rib{position:absolute;transform:translate(-50%,-50%);white-space:nowrap;background:#fff;border:1.5px solid var(--red);border-radius:999px;padding:6px 14px;font-size:13px;font-weight:700;color:var(--red)}
.cyc .co{position:absolute;transform:translate(-50%,-50%);white-space:nowrap;text-align:center;background:var(--red);color:#fff;border-radius:12px;padding:8px 18px;font-weight:800;box-shadow:0 8px 20px rgba(201,42,35,.25)}
.cyc .co-e{display:block;font-size:10.5px;letter-spacing:.16em;opacity:.85}
.cyc .co-n{display:block;font-size:18px}
.cyc .edge{position:absolute;transform:translate(-50%,-50%);white-space:nowrap;font-size:12px;font-weight:700;color:var(--ink2);background:#fff;padding:2px 6px}
.cyc .fb{position:absolute;transform:translate(-50%,-50%);white-space:nowrap;font-size:11.5px;font-weight:700;color:var(--mute);line-height:1.5;text-align:center;background:#fff;padding:2px 4px;display:block}
.cyc .soc-l{position:absolute;font-size:11.5px;font-weight:800;color:#8A8F95;letter-spacing:.16em}
.cyc .soc{position:absolute;transform:translate(-50%,-50%);text-align:center;width:21%}
.cyc .soc-t{font-size:17px;font-weight:700;color:#fff;line-height:1.4}
.cyc .soc-s{margin-top:4px;font-size:12.5px;color:#C9CCD0;line-height:1.5}
.cyc-hint{display:none;margin-top:10px;font-size:13px;color:var(--mute)}
@media(max-width:1049px){.cyc-hint{display:block}}

/* ===== 6. 会社紹介・強み ===== */
.about{display:flex;flex-wrap:wrap;gap:clamp(32px,4.4vw,48px);align-items:flex-start}
.about .fig{flex:0 1 360px;min-width:0;aspect-ratio:4/5}
.about-t{flex:1 1 420px;min-width:0}
.about-t .who{margin-top:26px;padding-top:20px;border-top:1px solid var(--line);font-size:15px;color:var(--mute)}
.about-t .who b{display:block;margin-top:2px;font-size:clamp(19px,2vw,22px);font-weight:700;color:var(--ink)}
.strengths{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line);margin-top:clamp(36px,4.4vw,52px)}
@media(max-width:760px){.strengths{grid-template-columns:1fr}}
.st{background:#fff;padding:clamp(22px,2.6vw,30px);display:flex;flex-direction:column;gap:10px}
.st .n{font-size:13px;font-weight:800;color:var(--red);letter-spacing:.14em}
.st h3{font-size:clamp(17px,1.8vw,20px);font-weight:700;line-height:1.55}
.st p{font-size:15.5px;color:var(--ink2);line-height:1.9}

/* ===== 相談バンド ===== */
.band{background:var(--red);color:#fff}
.band-in{display:flex;flex-wrap:wrap;gap:24px 40px;align-items:center;padding-block:clamp(40px,5.2vw,56px)}
.band-t{flex:1 1 460px;min-width:0}
.band-t .t{font-size:clamp(24px,3.2vw,34px);font-weight:700;line-height:1.45}
.band-t p{margin-top:10px;font-size:clamp(16px,1.6vw,17px);line-height:1.8}
.band .btn-row{margin-top:0}

/* ===== 7. コラム ===== */
.cats{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(200px,100%),1fr));gap:12px;margin-top:clamp(32px,4vw,40px)}
.cat{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:20px;display:flex;flex-direction:column;gap:8px;transition:border-color .22s,transform .22s}
.cat:hover{border-color:var(--ink);transform:translateY(-2px)}
.cat .c1{font-size:13px;font-weight:700;color:var(--mute)}
.cat .c2{font-size:clamp(16px,1.7vw,18px);font-weight:700;line-height:1.5}
.cat .c3{margin-top:auto;font-size:12.5px;font-weight:700;color:var(--red)}
.cat .c3.soon{color:var(--mute)}
.col-wrap{display:flex;flex-wrap:wrap;gap:clamp(24px,3vw,32px);margin-top:clamp(32px,4vw,40px)}
.col-list{flex:1 1 520px;min-width:0}
.col-list .hd{font-size:15px;font-weight:700}
.col-list .ls{margin-top:12px;border-top:1px solid var(--ink)}
.col-list .ls a{display:flex;flex-direction:column;gap:4px;padding:18px 0;border-bottom:1px solid var(--line);transition:padding-left .22s}
.col-list .ls a:hover{padding-left:8px}
.col-list .c1{font-size:13px;color:var(--mute)}
.col-list .c2{font-size:clamp(16px,1.7vw,18px);font-weight:700;line-height:1.55}
.dl-card{flex:1 1 340px;min-width:0;background:var(--ink);color:#fff;border-radius:var(--r);padding:clamp(24px,3vw,32px);display:flex;flex-direction:column;gap:14px}
.dl-card .c1{font-size:13px;font-weight:700;color:#C9CCD0;letter-spacing:.06em}
.dl-card .c2{font-size:clamp(19px,2vw,22px);font-weight:700;line-height:1.55}
.dl-card p{font-size:15px;color:#DADDE0}
.dl-card .btn{margin-top:auto}