
:root{
  --bg:#f6f8fb; --white:#fff; --ink:#0f1b24; --sub:#5d6a73; --mute:#8b969d;
  --acc:#003ae5; --acc-d:#002aa8; --acc-l:#e8efff; --acc2:#10a6fb; --acc3:#1fd9ff; --line:rgba(15,27,36,.10);
  --jp:"Noto Sans JP",system-ui,sans-serif;
  --w:1200px;
}
*{box-sizing:border-box;margin:0;padding:0}
body{background:var(--bg);color:var(--ink);font-family:var(--jp);line-height:1.9;-webkit-font-smoothing:antialiased;overflow-x:hidden;font-size:16px}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
.wrap{width:var(--w);margin:0 auto;position:relative}


header{position:sticky;top:0;z-index:20;background:linear-gradient(180deg,rgba(255,255,255,.62),rgba(236,243,255,.38));-webkit-backdrop-filter:blur(20px) saturate(185%);backdrop-filter:blur(20px) saturate(185%);border-bottom:1px solid rgba(255,255,255,.7);box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 10px 30px -18px rgba(0,58,229,.28)}
header::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;background:linear-gradient(90deg,rgba(0,58,229,0),rgba(0,58,229,.35) 20%,rgba(16,166,251,.45) 50%,rgba(31,217,255,.35) 80%,rgba(31,217,255,0));pointer-events:none}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){header{background:rgba(250,252,255,.95)}}
header .wrap{display:flex;align-items:center;height:78px}
.logo{display:flex;align-items:center;gap:12px;font-weight:700;letter-spacing:.18em;font-size:15px}
.logo svg{width:30px;height:30px}
.logo img{display:block;height:26px;width:auto}
footer .logo img{height:30px}
.logo .ai{color:var(--acc)}
nav.g{display:flex;gap:30px;margin-left:72px;font-size:14px;color:var(--sub)}
nav.g a.on{color:var(--ink);font-weight:500}
.hbtn{margin-left:auto;display:flex;gap:12px;align-items:center}
.btn{display:inline-flex;align-items:center;gap:14px;height:52px;padding:0 26px;border-radius:0;font-size:15px;font-weight:500;border:1px solid var(--ink);transition:.2s}
.btn.dark{background:var(--ink);color:#fff}
.btn.line{background:transparent;color:var(--ink);border-color:rgba(15,27,36,.25)}
.btn.sm{height:44px;padding:0 20px;font-size:14px}
.btn .ar{font-size:16px}


.mark{color:var(--acc-d);background:linear-gradient(transparent 62%,var(--acc-l) 62%)}
.sec{padding:140px 0;position:relative}
.sec.white{background:var(--white)}
.lab{font-size:14px;color:var(--acc-d);font-weight:500;margin-bottom:18px}
.h2{font-size:36px;line-height:1.6;font-weight:700;letter-spacing:.01em}
.h2.c{text-align:center}
.lead{font-size:16px;color:var(--sub);margin-top:24px;max-width:760px}
.lead.c{text-align:center;margin-left:auto;margin-right:auto}


.figs{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:56px;margin-top:72px}
.fig .k{font-size:15px;font-weight:500}
.fig .v{font-size:44px;font-weight:700;letter-spacing:-.01em;line-height:1.3;margin-top:8px}
.fig .v small{font-size:16px;font-weight:500;margin-left:4px}
.fig p{font-size:13px;color:var(--sub);margin-top:8px;line-height:1.8}


.card{background:var(--white);border-radius:0;box-shadow:0 20px 50px -30px rgba(15,27,36,.25)}


.biz{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:64px}
.biz .card{overflow:hidden;display:flex;flex-direction:column}
.biz .ph{aspect-ratio:4/3;background:#eef1ee;overflow:hidden}
.biz .ph img{width:100%;height:100%;object-fit:cover}
.biz .bd{padding:30px 30px 34px;display:flex;flex-direction:column;flex:1}
.biz h3{font-size:24px;font-weight:700}
.biz .t{font-size:15px;font-weight:500;margin-top:10px;line-height:1.7}
.biz p{font-size:14px;color:var(--sub);margin-top:14px;line-height:1.9}
.biz ul{list-style:none;margin-top:16px;font-size:13px;color:var(--sub)}
.biz li{padding:7px 0;border-top:1px solid var(--line)}
.more{margin-top:auto;padding-top:22px;font-size:14px;font-weight:500;color:var(--acc-d)}


.cases{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:56px}
.case .ph{aspect-ratio:16/10;background:linear-gradient(135deg,#eef2f8,#e1e8f2);border-radius:0;display:flex;align-items:center;justify-content:center;color:var(--mute);font-size:13px}
.case h3{font-size:18px;font-weight:700;margin-top:18px;line-height:1.6}
.case .meta{font-size:13px;color:var(--sub);margin-top:8px}
.case .meta b{color:var(--acc-d);font-weight:500}


.news{margin-top:48px;border-top:1px solid var(--line)}
.news a{display:grid;grid-template-columns:140px 120px 1fr 30px;align-items:center;padding:26px 8px;border-bottom:1px solid var(--line);font-size:15px}
.news time{color:var(--sub);font-size:14px}
.news .cat{font-size:13px;color:var(--acc-d)}


.phead{padding:120px 0 80px;position:relative;overflow:hidden}
.phead .crumb{font-size:13px;color:var(--mute)}
.phead h1{font-size:46px;font-weight:700;margin-top:18px;letter-spacing:.01em}
.phead .h2{margin-top:36px}
.phead .cloud{position:absolute;right:-120px;top:-60px;width:620px;opacity:.9;pointer-events:none}


.two{display:grid;grid-template-columns:360px 1fr;gap:80px}
.two .side{position:sticky;top:120px;align-self:start}
.two .side h2{font-size:26px;font-weight:700;line-height:1.6}


table.co{width:100%;border-collapse:collapse;font-size:15px}
table.co th{width:200px;text-align:left;font-weight:500;padding:22px 0;border-bottom:1px solid var(--line);vertical-align:top}
table.co td{padding:22px 0;border-bottom:1px solid var(--line);color:var(--ink);line-height:2}


.cta{padding:130px 0;text-align:center;position:relative;overflow:hidden}
.cta .h2{font-size:32px}
.cta .bt{display:flex;gap:16px;justify-content:center;margin-top:44px}


footer{background:var(--ink);color:#c9d1d5;padding:90px 0 40px;font-size:13px}
footer .top{display:grid;grid-template-columns:1.4fr 2fr;gap:80px}
footer .logo{color:#fff}
footer .addr{margin-top:26px;line-height:2}
footer .cols{display:grid;grid-template-columns:repeat(4,1fr);gap:30px}
footer .cols b{display:block;color:#fff;font-size:15px;font-weight:500;margin-bottom:12px}
footer .cols a{display:block;padding:4px 0;color:#aab4b9}
footer .sns{display:flex;flex-wrap:wrap;white-space:nowrap;gap:8px 22px;margin-top:26px;color:#aab4b9}
footer .marks{display:flex;gap:12px;margin-top:22px}
footer .marks span{padding:0;font-size:11px;line-height:1.5;text-align:left}
footer .bottom{display:flex;justify-content:space-between;margin-top:70px;padding-top:26px;border-top:1px solid rgba(255,255,255,.12);color:#8b969d;font-size:12px}


h1,h2,h3,h4,.lead,.mark,p,li,dd,dt,figcaption,.btn,a{word-break:auto-phrase;line-break:strict}
h1,h2,h3,h4{text-wrap:balance}
p,li,dd{text-wrap:pretty}


.btn.dark,.btn.grad{background:linear-gradient(115deg,#003ae5 0%,#1563f0 38%,#10a6fb 72%,#1fd9ff 100%);background-size:180% 100%;background-position:0 0;color:#fff;border:0;box-shadow:0 10px 24px -12px rgba(0,58,229,.6),inset 0 1px 0 rgba(255,255,255,.25);transition:background-position .45s ease,transform .2s ease,box-shadow .2s ease}
.btn.dark:hover,.btn.grad:hover{background-position:100% 0;transform:translateY(-1px);box-shadow:0 14px 30px -12px rgba(16,166,251,.7),inset 0 1px 0 rgba(255,255,255,.3)}
.btn.dark .ar,.btn.grad .ar{transition:transform .2s ease}
.btn.dark:hover .ar,.btn.grad:hover .ar{transform:translateX(3px)}
.btn.line:not(.fcta){background:linear-gradient(#fff,#fff) padding-box,linear-gradient(115deg,#003ae5,#10a6fb 60%,#1fd9ff) border-box;border:1px solid transparent;color:var(--acc-d)}
.btn.line:not(.fcta):hover{background:linear-gradient(#f2f6ff,#f2f6ff) padding-box,linear-gradient(115deg,#003ae5,#10a6fb 60%,#1fd9ff) border-box}

.textlink{display:inline-flex;align-items:center;gap:10px;font-size:15px;font-weight:600;color:var(--acc-d);padding:6px 2px;background:linear-gradient(90deg,#003ae5,#10a6fb,#1fd9ff) no-repeat 0 100%/0 2px;transition:background-size .3s ease}
.textlink:hover{background-size:100% 2px}
.textlink .ar{transition:transform .2s ease}.textlink:hover .ar{transform:translateX(4px)}
@media (prefers-reduced-motion:reduce){.btn.dark,.btn.grad,.textlink,.btn .ar,.textlink .ar{transition:none}}

footer .bottom span{word-break:keep-all;overflow-wrap:anywhere}

/* アイコンは札で囲わない。アイコンそのものに厚みと影を付け、カードの上の縁に半分かける。
   下半分だけカードと同じ白を敷き、カードの枠の線がアイコンの後ろを通らないようにする */
.s3 .c .bub,main .nums .bub,.fa .bub,.fv-biz .bub,svg.ic{
  background:linear-gradient(to bottom,transparent 50%,#fff 50%)!important;border:0!important;border-radius:0!important;
  box-shadow:none!important;transform:none!important;color:var(--acc)!important;padding:0!important}
.s3 .c.ans .bub{background:linear-gradient(to bottom,transparent 50%,#f2f8ff 50%)!important}
.fv-biz .bub{background:linear-gradient(to bottom,transparent 50%,rgba(255,255,255,.9) 50%)!important}
main .feat dt .ic{background:none!important;border:0!important;box-shadow:none!important;transform:none!important;color:var(--acc)!important}
.s3 .c .bub svg,main .nums .bub svg,.fa .bub svg,.fv-biz .bub svg,svg.ic,main .feat dt .ic svg{
  filter:drop-shadow(0 1.5px 0 #002aa8) drop-shadow(0 8px 9px rgba(0,58,229,.35))}
.s3 .c .bub svg,main .nums .bub svg,.fv-biz .bub svg{width:34px!important;height:34px!important}
main .feat dt .ic svg{width:26px!important;height:26px!important}

/* PC だけで効かせる改行（11/1 のご指摘：見出しの改行位置） */
@media (min-width:901px){br.pcbr{display:inline!important}}
@media (max-width:900px){br.pcbr{display:none}}
/* フッターの採用情報の項目を折り返さない（11/1 のご指摘の反映） */
footer .cols a{white-space:nowrap}
@media (min-width:1081px){footer .cols{grid-template-columns:repeat(4,auto);justify-content:space-between;gap:48px}}
