:root{--ink:#14171c;--body:#3b4048;--mute:#767b84;--paper:#f6f4ef;--white:#fff;--rule:#e2ddd3;--rule2:#c9c2b4;--accent:#005bac;--navy:#0f1d33;
--serif:'Noto Serif JP',serif;--en:'Cormorant Garamond',serif}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{font-family:'Noto Sans JP',sans-serif;color:var(--body);background:var(--white);line-height:1.8;letter-spacing:.04em;word-break:auto-phrase}
a{color:inherit;text-decoration:none}
svg{display:block}
ul,ol{list-style:none}
.eye{position:relative;overflow:hidden;background:#0b1626;margin:0}
.eye svg{width:100%;height:100%}
.eye img{display:block;width:100%;height:100%;object-fit:cover}
.logo{display:flex;align-items:baseline;gap:12px;color:var(--ink)}
.logo svg{display:block;width:auto;flex:none}
.logo small{font-size:11px;color:var(--mute);letter-spacing:.06em}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:14px;background:var(--accent);color:#fff;font-weight:700;letter-spacing:.08em}
.btn span{font-family:var(--en);font-size:1.3em;line-height:1}
.tag{display:inline-block;font-size:11px;font-weight:700;color:#fff;background:var(--cc);padding:2px 8px;letter-spacing:.06em;line-height:1.6}
.tag.o{background:transparent;color:var(--cc);padding:0}
.ser{font-size:11px;font-weight:700;color:var(--cc);letter-spacing:.04em}
.date{font-family:var(--en);font-size:14px;color:var(--mute);letter-spacing:.06em}
.ttl{font-family:var(--serif);font-weight:700;color:var(--ink);line-height:1.6}
.meta{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.chip{display:inline-block;font-size:12px;font-weight:500;color:var(--ink);border:1px solid var(--rule2);padding:1px 9px;background:var(--white)}
.new{font-family:var(--en);font-size:12px;font-weight:600;color:#c0452c;letter-spacing:.1em}
.c-pm{--cc:#005bac}.c-tech{--cc:#0d7a7a}.c-biz{--cc:#a8741a}.c-new{--cc:#c0452c}.c-know{--cc:#56702a}.c-ai{--cc:#5b3f99}.c-car{--cc:#1d2b44}
.w{width:1200px;margin:0 auto}
.util{background:var(--navy);color:#c9d1dc;font-size:12px}
.util .w{display:flex;justify-content:space-between;height:32px;align-items:center}
.util a{color:#fff}
.mast .w{display:flex;align-items:center;height:92px}
.mast .logo svg{height:26px}
.mast .tools{margin-left:auto;display:flex;align-items:center;gap:22px;font-size:13px;color:var(--ink)}
.mast .op{font-size:12px;color:var(--mute)}
.search{display:flex;align-items:center;gap:10px;width:260px;height:42px;border:1px solid var(--rule2);padding:0 14px;color:var(--mute);font-size:13px}
.search::before{content:"";width:13px;height:13px;border:1.6px solid var(--mute);border-radius:50%;flex:none}
.mast .btn{height:44px;padding:0 22px;font-size:14px}
.gnav{background:var(--ink)}
.gnav .w{display:flex;height:50px;align-items:stretch}
.gnav a{display:flex;align-items:center;padding:0 20px;color:#e9ebee;font-size:14px;font-weight:500;position:relative}
.gnav a::after{content:"";position:absolute;left:20px;right:20px;bottom:0;height:3px;background:var(--cc,transparent)}
.gnav a.home{padding-left:0}.gnav a.home::after{left:0}
.gnav a.rec{margin-left:auto;color:#fff;font-weight:700;background:var(--accent);padding:0 22px}
.gnav a.rec::after{display:none}
.tick{border-bottom:1px solid var(--rule)}
.tick .w{display:flex;align-items:center;gap:18px;height:46px;font-size:13px;overflow:hidden;white-space:nowrap}
.tick .lab{flex:none;background:var(--cc);color:#fff;font-weight:700;font-size:12px;padding:3px 10px}
.tick .date{font-size:13px}
.tick a{color:var(--ink);font-weight:500}
.tick i{font-style:normal;color:var(--rule2)}
/* ピックアップ＋右の募集枠 */
.top{padding:32px 0 56px}
.top .w{display:grid;grid-template-columns:1fr 340px;gap:40px}
.pick{display:grid;grid-template-columns:1.55fr 1fr;grid-template-rows:1fr 1fr;gap:14px;height:520px}
.pick a{position:relative;display:block;overflow:hidden;color:#fff}
.pick a:first-child{grid-row:1/3}
.pick .eye{position:absolute;inset:0}
.pick .cap{position:absolute;left:0;right:0;bottom:0;padding:70px 26px 24px;background:linear-gradient(transparent,rgba(5,10,20,.88))}
.pick .ttl{color:#fff;font-size:18px;margin-top:8px;line-height:1.55}
.pick a:first-child .ttl{font-size:28px;line-height:1.5;margin-top:12px}
.pick a:first-child .cap{padding:120px 32px 30px}
.pick p{font-size:14px;color:#d6dbe3;margin-top:10px;line-height:1.8}
.pick .date{color:#c3cad5}
.pick .lab{position:absolute;top:0;left:0;background:#fff;color:var(--ink);font-size:12px;font-weight:700;padding:5px 12px;letter-spacing:.1em}
.recbox{background:var(--navy);color:#c9d1dc;padding:30px 28px 28px;position:relative;overflow:hidden}
.recbox::before{content:"";position:absolute;right:-60px;top:-60px;width:220px;height:220px;border:1px solid rgba(255,255,255,.12);border-radius:50%;box-shadow:0 0 0 30px rgba(255,255,255,.03),0 0 0 60px rgba(255,255,255,.025)}
.recbox .k{font-size:12px;font-weight:700;color:#8fc0f0;letter-spacing:.12em}
.recbox h1,.recbox .rh{font-family:var(--serif);font-weight:700;font-size:22px;color:#fff;line-height:1.65;margin:12px 0 16px;position:relative}
.recbox dl{border-top:1px solid rgba(255,255,255,.16);font-size:13px}
.recbox dl div{display:grid;grid-template-columns:64px 1fr;padding:8px 0;border-bottom:1px solid rgba(255,255,255,.16)}
.recbox dt{color:#8e9aab}.recbox dd{color:#fff;font-weight:500}
.recbox .btn{width:100%;height:52px;margin-top:20px;font-size:15px}
.recbox .sub{display:block;text-align:center;font-size:13px;color:#fff;margin-top:12px;text-decoration:underline;text-underline-offset:4px}
.side h2,.box h2{font-size:15px;font-weight:900;color:var(--ink);letter-spacing:.08em;padding-bottom:10px;border-bottom:3px solid var(--ink);margin-top:34px}
.rank li a{display:grid;grid-template-columns:30px 76px 1fr;gap:12px;padding:14px 0;border-bottom:1px solid var(--rule);align-items:start}
.rank i{font-family:var(--en);font-style:normal;font-size:28px;line-height:1;color:var(--ink)}
.rank li:nth-child(-n+3) i{color:var(--accent)}
.rank .eye{aspect-ratio:1/1}
.rank .ttl{font-size:13px;line-height:1.6;margin-top:3px}
/* 区切り見出し */
.hd2{display:flex;align-items:baseline;gap:16px;border-bottom:1px solid var(--rule);padding-bottom:12px;margin-bottom:26px;position:relative}
.hd2::before{content:"";position:absolute;left:0;bottom:-1px;width:64px;height:3px;background:var(--cc,var(--ink))}
.hd2 h2{font-family:var(--serif);font-weight:900;font-size:26px;color:var(--ink);letter-spacing:.06em}
.hd2 small{font-size:13px;color:var(--mute)}
.hd2 a{margin-left:auto;font-size:13px;font-weight:500;color:var(--ink)}
.hd2 a::after{content:" →"}
.sec{padding:64px 0}
.sec.g{background:var(--paper)}
/* 新着：4列 */
.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:36px 28px}
.card .eye{aspect-ratio:16/10}
.card .meta{margin-top:14px}
.card .ttl{font-size:16px;margin-top:8px}
.card .ser{display:block;margin-top:6px}
/* カテゴリー別：本文＋右の柱 */
.two{display:grid;grid-template-columns:1fr 300px;gap:56px}
.catblk+.catblk{margin-top:64px}
.catblk .body{display:grid;grid-template-columns:1.1fr 1fr;gap:32px}
.catblk .lead .eye{aspect-ratio:16/10}
.catblk .lead .ttl{font-size:21px;margin-top:14px}
.catblk .lead p{font-size:14px;margin-top:8px}
.catblk ul li a{display:grid;grid-template-columns:128px 1fr;gap:16px;padding:0 0 18px;margin-bottom:18px;border-bottom:1px solid var(--rule)}
.catblk ul li:last-child a{border-bottom:0;margin-bottom:0}
.catblk ul .eye{aspect-ratio:16/10}
.catblk ul .ttl{font-size:15px;margin-top:4px}
.side{position:sticky;top:20px;align-self:start}
.side h2:first-child{margin-top:0}
.catlist li a{display:flex;align-items:center;gap:12px;padding:13px 0;border-bottom:1px solid var(--rule);font-size:14px;font-weight:500;color:var(--ink)}
.catlist li a::before{content:"";width:10px;height:10px;background:var(--cc);flex:none}
.catlist small{font-size:11px;color:var(--mute);font-weight:400}
.catlist li a::after{content:"→";margin-left:auto;color:var(--mute)}
.mini{margin-top:34px;border:1px solid var(--ink);padding:24px 22px;background:#fff}
.mini b{display:block;font-family:var(--serif);font-size:17px;color:var(--ink);line-height:1.6}
.mini p{font-size:13px;margin:8px 0 16px}
.mini .btn{width:100%;height:46px;font-size:14px}
/* AIニュース：紫の帯 */
.ainews{background:#1d1236;color:#d9d2ea}
.ainews .hd2{border-color:rgba(255,255,255,.15)}
.ainews .hd2 h2,.ainews .hd2 a{color:#fff}
.ainews .hd2 small{color:#a99cc8}
.ainews .body{display:grid;grid-template-columns:520px 1fr;gap:48px}
.ainews .lead .eye{aspect-ratio:16/10}
.ainews .lead .ttl{color:#fff;font-size:22px;margin-top:16px}
.ainews .lead p{font-size:14px;margin-top:8px}
.ainews ol li a{display:grid;grid-template-columns:110px 1fr;gap:20px;padding:22px 0;border-bottom:1px solid rgba(255,255,255,.14)}
.ainews ol li:first-child a{padding-top:0}
.ainews .date{color:#a99cc8;font-size:16px}
.ainews ol .ttl{color:#fff;font-size:17px}
/* キャリアチェンジ特集 */
.career{background:var(--paper)}
.career .intro{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:end;margin-bottom:36px}
.career .k{font-size:13px;font-weight:700;color:var(--accent);letter-spacing:.12em}
.career h2{font-family:var(--serif);font-weight:900;font-size:36px;color:var(--ink);line-height:1.5;margin-top:10px}
.career .intro p{font-size:15px;line-height:2}
.series{display:grid;grid-template-columns:1fr 1fr;gap:28px}
.series>div{background:#fff;border-top:4px solid var(--ink)}
.series .head{display:grid;grid-template-columns:1fr 200px;min-height:170px}
.series .head .eye{height:100%;min-height:170px}.series .head .eye svg{position:absolute;inset:0}
.series .head div{padding:26px 28px}
.series .head small{font-size:12px;font-weight:700;color:var(--mute);letter-spacing:.1em}
.series .head b{display:block;font-family:var(--serif);font-weight:900;font-size:24px;color:var(--ink);line-height:1.5;margin-top:6px}
.series .head span{display:block;font-size:13px;margin-top:8px}
.series ol{padding:6px 28px 18px}
.series ol li a{display:grid;grid-template-columns:44px 1fr;padding:14px 0;border-top:1px solid var(--rule)}
.series ol i{font-family:var(--en);font-style:normal;font-size:20px;color:var(--rule2)}
.series ol .ttl{font-size:15px}
/* 案件の例 */
.why{background:var(--navy);color:#c9d1dc}
.why-in{display:grid;grid-template-columns:460px 1fr;gap:80px;align-items:start}
.why .k{font-size:13px;font-weight:700;color:#8fc0f0;letter-spacing:.12em}
.why h2{font-family:var(--serif);font-weight:900;font-size:34px;line-height:1.6;color:#fff;margin:14px 0 20px}
.why p{font-size:15px;line-height:2}
.why ol li{display:grid;grid-template-columns:64px 1fr;padding:28px 0;border-bottom:1px solid rgba(255,255,255,.14)}
.why ol li:first-child{border-top:1px solid rgba(255,255,255,.14)}
.why ol i{font-family:var(--en);font-style:normal;font-size:34px;line-height:1;color:#8fc0f0}
.why ol b{display:block;font-family:var(--serif);font-weight:700;font-size:21px;color:#fff;line-height:1.5}
.why ol span{display:block;font-size:14px;line-height:1.95;margin-top:8px}
.cases li{display:grid;grid-template-columns:72px 1fr 360px 170px;align-items:center;gap:24px;padding:26px 0;border-bottom:1px solid var(--rule)}
.cases li:first-child{border-top:1px solid var(--rule)}
.cases .no{font-family:var(--en);font-size:40px;line-height:1;color:var(--rule2)}
.cases h3{font-family:var(--serif);font-weight:700;font-size:20px;color:var(--ink)}
.cases p{font-size:14px;margin-top:4px}
.cases .cm{font-size:13px;line-height:1.9;display:grid;grid-template-columns:auto 1fr;column-gap:14px}
.cases .cm b{color:var(--mute);font-weight:500}
.cases .roles{display:flex;gap:6px;margin-top:6px}
.cases .go{justify-self:end;font-size:13px;font-weight:700;color:var(--accent);border-bottom:1px solid var(--accent)}
.note{font-size:12px;color:var(--mute);margin-top:16px}
.flowrow{margin-top:72px}
.flowrow>div:first-child{display:flex;align-items:baseline;gap:28px;margin-bottom:28px}
.flowrow h3{font-family:var(--serif);font-weight:900;font-size:24px;color:var(--ink);line-height:1.6}
.flowrow p{font-size:14px;margin-top:12px}
.flow{display:grid;grid-template-columns:repeat(5,1fr);border-top:1px solid var(--ink)}
.flow li{position:relative;padding:24px 22px 0 0}
.flow li::before{content:"";position:absolute;top:-5px;left:0;width:9px;height:9px;background:var(--accent)}
.flow i{font-family:var(--en);font-style:normal;font-size:15px;color:var(--mute);letter-spacing:.1em}
.flow b{display:block;font-family:var(--serif);font-weight:700;font-size:17px;color:var(--ink);margin:2px 0 6px}
.flow span{font-size:13px;line-height:1.85}
.cta{background:var(--accent);color:#dbe8f6}
.cta .w{display:grid;grid-template-columns:1fr auto;align-items:center;gap:40px;padding:64px 0}
.cta h2{font-family:var(--serif);font-weight:900;font-size:32px;color:#fff;line-height:1.6}
.cta p{font-size:15px;margin-top:10px}
.cta .btn{height:64px;padding:0 48px;font-size:16px;background:#fff;color:var(--accent)}
.ft{background:var(--ink);color:#9aa1ab;font-size:12px;padding:48px 0 32px}
.ft .cols{display:grid;grid-template-columns:1fr 1fr 1fr;gap:40px;padding-bottom:32px;border-bottom:1px solid #2b3038}
.ft .logo{color:#fff}.ft .logo svg{height:21px}.ft .logo small{color:#9aa1ab}
.ft p{margin-top:12px;line-height:1.9}
.ft h4{color:#fff;font-size:13px;margin-bottom:10px}
.ft ul{display:grid;grid-template-columns:1fr 1fr;gap:6px 16px;font-size:13px;color:#c9ced5}
.ft .bot{display:flex;justify-content:space-between;padding-top:22px}

a,button,summary,select,label,input{-webkit-tap-highlight-color:rgba(0,91,172,.16)}
button,summary,select,label,input[type=radio],input[type=checkbox],input[type=submit]{cursor:pointer}
a,button,.btn,.ttl,.eye img,.eye svg{transition:background-color .15s,color .15s,opacity .15s,filter .15s,border-color .15s}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
@media (hover:hover){
.btn:hover,button:hover{filter:brightness(.82)}
.btn.g:hover{filter:none;background:var(--ink);color:#fff}
a:where(:not(.btn,.logo,.ic)):hover{color:var(--accent);text-decoration:underline;text-underline-offset:.25em;text-decoration-thickness:1px}
a:where(:has(.ttl,.eye)):hover{text-decoration:none}
a:hover .ttl{color:var(--accent);text-decoration:underline;text-underline-offset:.25em;text-decoration-thickness:1px}
a:hover .eye img,a:hover .eye svg{opacity:.75}
.pick a:hover .ttl,.ainews a:hover .ttl{color:#fff}
.logo:hover,.ic:hover{opacity:.6}
.gnav a:hover{background:rgba(255,255,255,.12);color:#fff;text-decoration:none}
.gnav a.rec:hover{background:var(--accent);filter:brightness(.82)}
.more:hover{background:var(--ink);color:#fff;text-decoration:none}
.pager a:hover{border-color:var(--ink);text-decoration:none}
.tags a:hover{background:var(--rule)}
.msearch:hover{border-color:var(--ink)}
summary:hover,label:hover{color:var(--accent)}
.recbox .sub:hover,.agree a:hover{text-decoration-thickness:2px;opacity:.75}
.ch label:hover span{border-color:var(--accent);color:var(--accent)}
.ch label:hover input:checked+span{color:#fff;filter:brightness(.85)}
.fi select:hover,.fi textarea:hover,.fi input:hover{border-color:var(--ink)}
.f.bad select:hover,.f.bad textarea:hover,.f.bad input:hover{border-color:#c0452c}
}
.btn:active,button:active{filter:brightness(.72)}
.btn.g:active{filter:none;background:var(--ink);color:#fff}
a:where(:not(.btn,.logo)):active{background-color:rgba(0,91,172,.08)}
a:active .ttl{color:var(--accent);text-decoration:underline;text-underline-offset:.25em;text-decoration-thickness:1px}
a:active .eye img,a:active .eye svg{opacity:.7}
.pick a:active .ttl,.ainews a:active .ttl{color:#fff}
.logo:active,.ic:active{opacity:.5}
.gnav a:active{background:rgba(255,255,255,.18)}
.gnav a.rec:active{background:var(--accent);filter:brightness(.72)}
.more:active{background:var(--ink);color:#fff}
summary:active,label:active{color:var(--accent)}
.recbox .sub:active,.agree a:active{text-decoration-thickness:2px;opacity:.6}
.ch label:active span{background:rgba(0,91,172,.1);border-color:var(--accent);color:var(--accent)}
.ch label:active input:checked+span{background:var(--accent);color:#fff;filter:brightness(.75)}
.fi select:active{border-color:var(--accent);background-color:#eef4fb}