*{margin:0;padding:0;box-sizing:border-box}
:root{
--bg:#f7f9fc;
--text:#1e2a3a;
--muted:#5d6c81;
--line:#dbe3ee;
--brand:#2f63ff;
--brand-2:#1ea2ff;
--dark:#0f1724;
}
html{scroll-behavior:auto}
body{font-family:Segoe UI,Microsoft YaHei,sans-serif;background:var(--bg);color:var(--text);line-height:1.7}
.wrap{width:min(1280px,94%);margin:0 auto}
header{
position:sticky;top:0;z-index:20;
background:rgba(255,255,255,.88);
backdrop-filter:blur(8px);
border-bottom:1px solid var(--line);
}
.nav{display:flex;align-items:center;justify-content:space-between;min-height:72px;padding:10px 0}
.logo{
display:flex;
align-items:baseline;
flex-wrap:wrap;
gap:12px 16px;
font-weight:700;
font-size:22px;
color:var(--dark);
text-decoration:none;
line-height:1;
}
.logo-en{
color:var(--brand);
font-family:"Times New Roman","Georgia","YuMincho","Hiragino Mincho ProN",serif;
font-size:clamp(22px,2.6vw,30px);
font-style:italic;
font-weight:700;
letter-spacing:.5px;
white-space:nowrap;
}
.logo-jp{
color:var(--dark);
font-family:"Hiragino Kaku Gothic ProN","Yu Gothic","Meiryo","Segoe UI",sans-serif;
font-size:clamp(18px,2.35vw,26px);
font-weight:700;
letter-spacing:.5px;
white-space:nowrap;
}
nav{display:flex;gap:18px;flex-wrap:wrap;justify-content:flex-end}
nav a{color:var(--text);text-decoration:none;font-size:14px;position:relative;padding:6px 0}
nav a::after{content:"";position:absolute;left:0;bottom:0;width:100%;height:2px;background:linear-gradient(90deg,var(--brand),var(--brand-2));transform:scaleX(0);transform-origin:right;transition:transform .25s ease}
nav a:hover::after{transform:scaleX(1);transform-origin:left}
nav a[aria-current="page"]{color:var(--brand);font-weight:700}
nav a[aria-current="page"]::after{transform:scaleX(1)}
.hero{
padding:88px 0 70px;
background:radial-gradient(circle at 12% 10%,rgba(47,99,255,.12),transparent 36%),radial-gradient(circle at 86% 15%,rgba(30,162,255,.1),transparent 34%);
border-bottom:1px solid var(--line);
}
.hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:28px;align-items:center}
.hero-visual{
background:rgba(255,255,255,.65);
border:1px solid var(--line);
border-radius:16px;
padding:14px;
box-shadow:0 10px 30px rgba(15,23,36,.06);
}
.hero-visual img{
display:block;
width:100%;
height:auto;
border-radius:12px;
}
.hero-side{display:grid;gap:14px}
.section-visual{
margin-top:18px;
background:#fff;
border:1px solid var(--line);
border-radius:14px;
padding:12px;
}
.section-visual img{display:block;width:100%;height:auto;border-radius:10px}
.top-banner{
padding:0 0 14px;
overflow:hidden;
}
.top-banner img{
display:block;
width:100vw;
max-width:100%;
height:280px;
border:0;
border-radius:0;
object-fit:cover;
object-position:center;
}
.top-visual{
position:relative;
overflow:hidden;
}
.top-visual img{
display:block;
width:100vw;
max-width:100%;
height:280px;
object-fit:cover;
object-position:center;
}
.top-visual-logo{
position:absolute;
left:clamp(16px,4vw,56px);
top:18px;
z-index:2;
display:flex;
align-items:baseline;
gap:12px 16px;
text-decoration:none;
padding:6px 10px;
border-radius:10px;
background:rgba(255,255,255,.78);
backdrop-filter:blur(2px);
}
.top-visual-logo .logo-en{font-size:clamp(24px,3vw,36px)}
.top-visual-logo .logo-jp{font-size:clamp(20px,2.6vw,32px)}
.top-visual-logo--arc{
left:0;
top:0;
width:100%;
height:100%;
padding:0;
border-radius:0;
background:transparent;
backdrop-filter:none;
display:block;
}
.top-visual-logo--arc svg{
display:block;
width:100%;
height:100%;
}
.top-visual-logo--arc .arc-en{
fill:#ffffff;
font-family:"Times New Roman","Georgia","YuMincho","Hiragino Mincho ProN",serif;
font-size:58px;
font-style:italic;
font-weight:700;
letter-spacing:.6px;
}
.top-visual-logo--arc .arc-jp{
fill:#2f6aba;
font-family:"Hiragino Kaku Gothic ProN","Yu Gothic","Meiryo","Segoe UI",sans-serif;
font-size:46px;
font-weight:700;
letter-spacing:.4px;
}
.top-visual-slogan{
position:absolute;
left: 72%;
right:auto;;
top:clamp(20px,15%,48px);
z-index:2;
max-width:min(420px,42vw);
text-align:left;
color:#2f6aba;
font-family:"Hiragino Kaku Gothic ProN","Yu Gothic","Meiryo","Segoe UI",sans-serif;
font-size:clamp(14px,1.55vw,18px);
font-weight:600;
line-height:1.65;
letter-spacing:.04em;
text-shadow:0 3px 10px rgba(255,255,255,.9);
}
.top-visual-slogan p{
margin:0 0 5px;
}
.top-visual-slogan p:nth-child(1){
margin-left:2em;
}
.top-visual-slogan p:nth-child(2){
margin-left:-0.5em;
}
.top-visual-slogan p:nth-child(3){
margin-left:-3.75em;
}
.top-visual-slogan p:last-child{
margin-bottom:0;
}
.top-visual-slogan__kanji{
font-size:1.5em;
color:#5ea5de;
}
.index-nav-bar{
position:relative;
z-index:30;
background:#80b6e4;
border-top:0;
border-bottom:0;
overflow:visible;
/* 二级下拉宽度（与主导航按钮宽度无关，仅改此处） */
--index-nav-dropdown-width:138px;
--index-nav-dropdown-offset-x:0px;
}
.index-nav-bar .wrap,
.index-nav-bar__inner{overflow:visible}
.index-nav{overflow:visible}
.index-nav-bar__inner{
display:flex;
align-items:center;
flex-wrap:wrap;
column-gap:60px;
row-gap:8px;
}
.index-nav-bar__inner .index-nav{
flex:1 1 0;
justify-content:center;
min-width:0;
width:auto;
max-width:100%;
}
.index-nav-aside{
flex:0 0 auto;
margin-left:auto;
align-self:center;
color:rgba(255,255,255,.95);
font-size:13px;
line-height:1.35;
white-space:nowrap;
padding:4px 2px;
text-decoration:underline;
text-decoration-color:rgba(255,255,255,.42);
text-underline-offset:3px;
transition:color .2s ease,text-decoration-color .2s ease;
}
.index-nav-aside:hover{
color:#fff;
text-decoration-color:rgba(255,255,255,.88);
}
.index-nav-aside[aria-current="page"]{
font-weight:700;
color:#fff;
text-decoration-color:rgba(255,255,255,.78);
cursor:default;
}
.index-nav{
display:flex;
width:100%;
gap:10px;
flex-wrap:wrap;
justify-content:center;
align-items:center;
padding:8px 0 8px;
}
.index-nav > a,
.index-nav-item__trigger{
flex:1 1 150px;
max-width:220px;
min-width:132px;
text-align:center;
color:rgba(255,255,255,.92);
text-decoration:none;
font-size:14px;
position:relative;
padding:10px 18px;
background:linear-gradient(180deg,#58a4ea,#4d98e0);
clip-path:polygon(10% 0,100% 0,90% 100%,0 100%);
transition:transform .2s ease,filter .2s ease;
box-sizing:border-box;
}
.index-nav-megamenu{
position:relative;
flex:1 1 150px;
max-width:220px;
min-width:132px;
z-index:41;
}
.index-nav-megamenu::after{
content:"";
display:none;
position:absolute;
left:0;
top:100%;
width:var(--index-nav-dropdown-width,200px);
height:72px;
transform:translateX(var(--index-nav-dropdown-offset-x,0px));
z-index:40;
}
.index-nav-megamenu:hover::after,
.index-nav-megamenu:focus-within::after{
display:block;
}
.index-nav-item{
position:relative;
width:100%;
}
.index-nav-item__trigger{
display:block;
width:100%;
border:none;
cursor:pointer;
font-family:inherit;
}
/* .index-nav-item__trigger::after{
content:"";
display:inline-block;
width:0;
height:0;
margin-left:6px;
vertical-align:middle;
border-left:4px solid transparent;
border-right:4px solid transparent;
border-top:5px solid rgba(255,255,255,.92);
} */
.index-nav-megamenu.is-open .index-nav-item__trigger::after{
transform:rotate(180deg);
}
.index-nav-item--active .index-nav-item__trigger,
.index-nav-item__trigger[aria-current="page"]{
color:#ffffff;
font-weight:700;
background:linear-gradient(180deg,#2f92ea,#1f83da);
}
.index-nav-dropdown{
display:flex;
flex-direction:column;
align-items:stretch;
position:absolute;
left:0;
right:auto;
top:100%;
width:var(--index-nav-dropdown-width,200px);
min-width:var(--index-nav-dropdown-width,200px);
max-width:var(--index-nav-dropdown-width,200px);
margin:0;
padding:4px 0 8px;
box-sizing:border-box;
transform:translateX(var(--index-nav-dropdown-offset-x,0px));
list-style:none;
background:linear-gradient(180deg,#4d98e0 0%,#4490d8 100%);
clip-path:none;
border:1px solid rgba(255,255,255,.32);
border-top:none;
border-radius:0 0 4px 4px;
box-shadow:0 10px 18px rgba(15,23,36,.12);
opacity:0;
visibility:hidden;
pointer-events:none;
z-index:49;
transition:opacity .22s ease,visibility .22s ease,background .2s ease,transform .22s ease;
}
.index-nav-dropdown::before{
display:none;
}
.index-nav-megamenu:hover .index-nav-dropdown,
.index-nav-megamenu:focus-within .index-nav-dropdown,
.index-nav-megamenu.is-open .index-nav-dropdown{
opacity:1;
visibility:visible;
pointer-events:auto;
background:linear-gradient(180deg,#72b3ef 0%,#72b3ef 100%);
box-shadow:0 10px 18px rgba(15,23,36,.12);
}
.index-nav-dropdown li{
margin:0;
padding:0;
width:100%;
}
.index-nav-dropdown a{
display:block;
width:100%;
padding:9px 16px;
font-size:13px;
line-height:1.4;
text-align:center;
color:rgba(255,255,255,.94);
text-decoration:none;
white-space:nowrap;
background:transparent;
clip-path:none;
flex:none;
min-width:0;
max-width:none;
border:none;
border-bottom:1px solid rgba(255,255,255,.12);
transition:background .15s ease,color .15s ease;
}
.index-nav-dropdown li:last-child a{
border-bottom:none;
}
.index-nav-dropdown a::before{display:none}
.index-nav-dropdown a:hover{
  background: rgba(13, 20, 223, 0.3);
color:#fff;
filter:none;
transform:none;
}
.index-nav-dropdown a[aria-current="page"]{
font-weight:700;
color:#fff;
background:rgba(255,255,255,.18);
}
.index-nav-megamenu:hover .index-nav-item__trigger,
.index-nav-megamenu:focus-within .index-nav-item__trigger{
position:relative;
z-index:51;
}
@media (prefers-reduced-motion:reduce){
.index-nav-dropdown{transition:none}
}
.index-nav > a::before,
.index-nav-item__trigger::before{
content:"";
position:absolute;
inset:1px;
border:1px solid rgba(255,255,255,.38);
clip-path:inherit;
transform:scaleX(0);
transform-origin:right;
transition:transform .25s ease;
pointer-events:none;
}
.index-nav > a:hover::before,
.index-nav-item__trigger:hover::before{transform:scaleX(1);transform-origin:left}
.index-nav > a:hover{filter:brightness(1.06);transform:translateY(-1px)}
.index-nav > a[aria-current="page"]{
color:#ffffff;
font-weight:700;
background:linear-gradient(180deg,#2f92ea,#1f83da);
}
.index-nav > a[aria-current="page"]::before{transform:scaleX(1)}
.index-nav-megamenu:hover .index-nav-item__trigger,
.index-nav-megamenu:focus-within .index-nav-item__trigger,
.index-nav-megamenu--active .index-nav-item__trigger{
color:#fff;
font-weight:700;
background:linear-gradient(180deg,#2f92ea,#1f83da);
filter:none;
transform:none;
}
.index-nav-megamenu:hover .index-nav-item__trigger::before,
.index-nav-megamenu:focus-within .index-nav-item__trigger::before,
.index-nav-megamenu--active .index-nav-item__trigger::before{transform:scaleX(1)}
.home-legacy{
display:grid;
grid-template-columns:minmax(160px,.95fr) minmax(320px,1.35fr) minmax(140px,.75fr);
gap:18px;
align-items:stretch;
}
.home-legacy__media{
border:1px solid var(--line);
border-radius:14px;
overflow:hidden;
background:#fff;
}
.home-legacy__media img{
display:block;
width:100%;
height:100%;
object-fit:cover;
}
.home-legacy__media--left img{object-position:18% 45%}
.home-legacy__media--right img{object-position:82% 55%}
.home-legacy__text{
border:1px solid var(--line);
border-radius:14px;
background:#fff;
padding:22px 22px 18px;
}
.home-legacy__text p{
color:#203047;
font-size:15px;
line-height:1.95;
text-align:justify;
text-justify:inter-ideograph;
}
.home-legacy__text p + p{margin-top:16px}
.home-zigzag{padding:56px 0 72px}
.home-zigzag__intro{margin:0 0 26px}
.home-zigzag__intro h2{margin-bottom:8px}
.home-zigzag__rows{display:grid;gap:22px}
.zigzag{
display:grid;
grid-template-columns:minmax(240px,.95fr) minmax(320px,1.05fr);
gap:18px;
align-items:stretch;
padding:18px;
border:1px solid var(--line);
border-radius:16px;
background:#fff;
}
.zigzag--reverse{direction:rtl}
.zigzag--reverse > *{direction:ltr}
.zigzag__art{
border:1px solid var(--line);
border-radius:14px;
overflow:hidden;
background:#f7f9fc;
min-height:220px;
}
.zigzag__art img{
display:block;
width:100%;
height:100%;
min-height:220px;
object-fit:cover;
}
.zigzag__body{
display:flex;
flex-direction:column;
gap:12px;
justify-content:center;
padding:6px 4px;
}
.zigzag__kicker{
font-size:13px;
color:var(--brand);
font-weight:700;
letter-spacing:.06em;
}
.zigzag__title{
font-size:22px;
line-height:1.25;
margin:0;
}
.zigzag__text{
color:var(--muted);
font-size:15px;
line-height:1.85;
}
.zigzag__text p + p{margin-top:12px}
.zigzag__actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:6px}
.eyebrow{font-size:13px;color:var(--brand);font-weight:600;letter-spacing:.08em}
h1{font-size:42px;line-height:1.2;margin:10px 0 14px}
.hero p{color:var(--muted);max-width:620px}
.actions{display:flex;gap:12px;margin-top:24px;flex-wrap:wrap}
.btn{display:inline-block;padding:11px 22px;border-radius:999px;text-decoration:none;font-size:14px;font-weight:600;transition:transform .2s ease}
.btn:hover{transform:translateY(-2px)}
.btn-primary{background:linear-gradient(90deg,var(--brand),var(--brand-2));color:#fff}
.btn-ghost{border:1px solid var(--line);color:var(--text);background:#fff}
.hero-card{background:#fff;border:1px solid var(--line);border-radius:14px;padding:22px}
.hero-card li{margin:8px 0;color:var(--muted)}
.section{padding:72px 0}
.section.page-top{padding-top:96px}
.title{font-size:30px;margin-bottom:8px}
.sub{font-size:14px;color:var(--muted);margin-bottom:24px}
.panel{background:#fff;border:1px solid var(--line);border-radius:14px;padding:24px}
.grid{display:grid;grid-template-columns:repeat(2,minmax(260px,1fr));gap:18px}
.card{background:#fff;border:1px solid var(--line);border-radius:12px;padding:20px}
.card h3{margin-bottom:8px}
.card p{color:var(--muted)}
.kv{display:grid;grid-template-columns:180px 1fr;gap:12px 16px}
.kv dt{color:#667891}
.kv dd{color:#203047}
.timeline{display:grid;gap:12px}
.timeline .item{background:#fff;border:1px solid var(--line);border-radius:10px;padding:14px 16px}
.timeline .item time{font-weight:700;color:var(--brand);margin-right:10px}
.cta{
background:linear-gradient(120deg,#0f1724,#1c3357);
color:#eaf0ff;border-radius:16px;padding:28px
}
.cta p{opacity:.9}
.cta .btn-ghost{border-color:#3f5f95;color:#fff;background:#ffffff12}
footer{padding:26px 0;border-top:1px solid var(--line);color:#708097;font-size:13px}
.section.company-page,
.section.greeting-page,
.section.business-page,
.section.recruit-page,
.section.access-page,
.section.privacy-page,
.section.partner-page{
position:relative;
background:
radial-gradient(ellipse 72% 42% at 18% 0%,rgba(47,99,255,.09),transparent 52%),
radial-gradient(ellipse 60% 38% at 88% 8%,rgba(30,162,255,.07),transparent 48%),
var(--bg);
}
.company-page,
.greeting-page,
.business-page,
.recruit-page,
.access-page,
.privacy-page,
.partner-page{
font-family:"Hiragino Kaku Gothic ProN","Yu Gothic","Meiryo","Segoe UI",sans-serif;
}
.company-page .title,
.greeting-page .title,
.business-page .title,
.recruit-page .title,
.access-page .title,
.privacy-page .title,
.partner-page .title{letter-spacing:.02em}
.company-page .sub,
.greeting-page .sub,
.business-page .sub,
.recruit-page .sub,
.access-page .sub,
.privacy-page .sub,
.partner-page .sub{
margin-bottom:28px;
padding-left:14px;
border-left:3px solid var(--brand);
color:var(--muted);
}
.greeting-layout{
display:grid;
grid-template-columns:minmax(0,280px) minmax(0,1fr);
gap:28px 40px;
align-items:start;
}
@media (max-width:720px){
.greeting-layout{grid-template-columns:1fr}
.greeting-layout__figure{text-align:center}
.greeting-layout__figure img{margin-inline:auto}
}
.greeting-layout__figure{
margin:0;
}
.greeting-policy-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  border-radius: 8px;
  overflow: hidden;
}
@media (max-width: 720px) {
  .greeting-policy-grid { grid-template-columns: 1fr; }
}
.greeting-policy-left {
  background: #f7f9fc; 
  padding: 1.25rem 1.5rem;
}
.greeting-policy-headline {
  font-size: clamp(1.1rem, 2.2vw, 1.45rem);
  font-weight: 800;
  color: #1e3a6e;
  line-height: 1.5;
  margin-bottom: 1rem;
  /* 白色外发光 */
  text-shadow:
    0 0 4px #fff,
    0 0 10px rgba(255, 255, 255, 0.95),
    0 0 18px rgba(255, 255, 255, 0.85),
    0 0 28px rgba(255, 255, 255, 0.6);
}
.greeting-policy-left p:not(.greeting-policy-headline) {
  font-size: 0.9rem;
  color: #333;
  line-height: 1.85;
  margin: 0.4em 0;
}
.greeting-policy-right {
  list-style: none;
  margin: 0;
  padding: 1.25rem 1.5rem;
  background: #f7f9fc; 
  color: #000000;
  line-height: 2;
}
.greeting-policy-right li {
  margin-bottom: 0.5em;
}
.greeting-kanji {
  display: inline-block;
  position: relative;
  font-size: 1.6em;
  font-weight: 700;
  color: #5ea5de; /* 或 #2a6fa8 */
  margin-right: 0.15em;
  vertical-align: baseline;
  /* 蓝色光晕 */
  text-shadow:
    -8px 0 8px #65baff67,
    -8px 0 16px rgba(129, 215, 246, 0.9),
    -8px 0 28px rgba(100, 190, 255, 0.7),
    -8px 0 42px rgba(80, 170, 255, 0.45);
}
/* 可选：背后更大一圈光 */
.greeting-kanji::before {
  content: "";
  position: absolute;
  inset: -0.35em -0.25em;
  background: radial-gradient(circle, rgba(129, 215, 246, 0.55) 0%, transparent 70%);
  z-index: -1;
  border-radius: 50%;
}
.greeting-layout__figure img{
display:block;
width:100%;
max-width:280px;
height:auto;
border-radius:14px;
border:1px solid var(--line);
}
.greeting-divider{
border:0;
border-top:1px solid var(--line);
margin:0 0 20px;
max-width:12em;
}
.greeting-body p{
margin-bottom:1em;
color:var(--text);
line-height:1.9;
}
.greeting-body h3{
font-size:18px;
margin:28px 0 12px;
color:var(--dark);
}
.greeting-philosophy{
margin:8px 0 0;
padding-left:1.35em;
line-height:1.85;
}
.greeting-philosophy li{margin-bottom:.65em}
.greeting-signature{
margin-top:1.75em;
font-weight:600;
text-align:right;
color:var(--dark);
}
.greeting-signature__company,
.greeting-signature__name{
display:block;
}
.recruit-lead{
font-size:15px;
line-height:1.85;
color:var(--text);
margin-bottom:10px;
max-width:72ch;
}
.recruit-section-title{
font-size:18px;
font-weight:700;
margin:22px 0 14px;
color:var(--dark);
}
.access-map-wrap{
margin-top:22px;
border-radius:16px;
overflow:hidden;
border:1px solid var(--line);
box-shadow:0 12px 40px rgba(15,23,36,.07);
background:#f0f2f5;
}
.access-map-wrap--figure{
margin:22px 0 0;
padding:0;
}
.access-map-row{
display:flex;
gap:1px;
align-items:stretch;
background:var(--line);
}
.access-map-col{
flex:1 1 0;
min-width:0;
aspect-ratio:664/540;
background:#f0f2f5;
display:flex;
align-items:center;
justify-content:center;
overflow:hidden;
}
.access-map-col img{
display:block;
width:100%;
height:100%;
object-fit:contain;
}
.access-map-col--google{
position:relative;
}
.access-googlemap-shell{
position:relative;
width:100%;
height:100%;
align-self:stretch;
}
.access-googlemap-fullscreen-btn{
position:absolute;
top:10px;
right:10px;
z-index:2;
display:flex;
align-items:center;
justify-content:center;
width:40px;
height:40px;
margin:0;
padding:0;
border:none;
border-radius:10px;
background:rgba(255,255,255,.92);
color:#1a1f2e;
box-shadow:0 2px 12px rgba(15,23,36,.18);
cursor:pointer;
transition:background .15s ease,box-shadow .15s ease;
}
.access-googlemap-fullscreen-btn:hover{
background:#fff;
box-shadow:0 4px 16px rgba(15,23,36,.22);
}
.access-googlemap-fullscreen-btn:focus-visible{
outline:2px solid #2f63ff;
outline-offset:2px;
}
.access-googlemap-fullscreen-btn__icon--exit{
display:none;
}
.access-googlemap-fullscreen-btn.is-fullscreen .access-googlemap-fullscreen-btn__icon--enter{
display:none;
}
.access-googlemap-fullscreen-btn.is-fullscreen .access-googlemap-fullscreen-btn__icon--exit{
display:block;
}
.access-googlemap-shell:fullscreen,
.access-googlemap-shell:-webkit-full-screen{
width:100%;
height:100%;
background:#e8eaed;
}
.access-googlemap-shell:fullscreen .access-googlemap-embed,
.access-googlemap-shell:-webkit-full-screen .access-googlemap-embed{
width:100%;
height:100%;
min-height:0;
}
.access-googlemap-embed{
display:block;
width:100%;
height:100%;
min-height:280px;
border:0;
}
.access-googlemap-fullscreen-dialog{
box-sizing:border-box;
width:100vw;
max-width:100vw;
height:100vh;
max-height:100vh;
margin:0;
padding:0;
border:none;
background:#e8eaed;
}
.access-googlemap-fullscreen-dialog::backdrop{
background:rgba(10,14,20,.75);
}
.access-googlemap-fullscreen-dialog__close{
position:absolute;
top:12px;
right:12px;
z-index:2;
display:flex;
align-items:center;
justify-content:center;
width:44px;
height:44px;
margin:0;
padding:0;
border:none;
border-radius:10px;
background:rgba(255,255,255,.92);
color:#1a1f2e;
font-size:28px;
line-height:1;
cursor:pointer;
box-shadow:0 2px 12px rgba(15,23,36,.18);
}
.access-googlemap-fullscreen-dialog__close:hover{
background:#fff;
}
.access-googlemap-embed--dialog{
width:100%;
height:100%;
min-height:0;
}
@media (max-width:720px){
.access-map-row{flex-direction:column}
.access-map-col{flex:none;width:100%}
}
.privacy-layout{
display:flex;
flex-wrap:wrap;
justify-content:center;
align-items:flex-start;
gap:28px 32px;
}
.privacy-doc{
flex:1 1 min(900px,100%);
max-width:900px;
margin:0;
background:#fff;
border:1px solid var(--line);
border-radius:18px;
padding:28px 30px 32px;
box-shadow:0 12px 40px rgba(15,23,36,.06);
font-size:15px;
line-height:1.85;
color:var(--text);
}
.privacy-mark{
flex:0 0 auto;
align-self:flex-start;
padding-top:8px;
}
.privacy-mark img{
display:block;
width:120px;
height:auto;
}
@media (max-width:1020px){
.privacy-mark{
width:100%;
text-align:center;
padding-top:0;
}
.privacy-mark img{margin-inline:auto}
}
.privacy-doc > p:first-of-type{
margin-top:0;
margin-bottom:1.25em;
}
.privacy-doc h3{
font-size:16px;
font-weight:700;
color:var(--dark);
margin:1.65em 0 .65em;
letter-spacing:.02em;
}
.privacy-doc h3:first-of-type{margin-top:0}
.privacy-doc h4{
font-size:15px;
font-weight:700;
margin:1.1em 0 .4em;
color:#1a3050;
}
.privacy-doc p{margin:.5em 0}
.privacy-doc ol,.privacy-doc ul{
margin:.4em 0 .8em;
padding-left:1.35em;
}
.privacy-doc li{margin:.25em 0}
.privacy-doc .privacy-ol-plain{list-style:none;padding-left:0}
.privacy-doc .privacy-ol-plain > li{margin:.85em 0}
.privacy-doc .privacy-inquiry{
margin-top:2em;
padding-top:1.25em;
border-top:1px solid var(--line);
}
.privacy-doc .privacy-inquiry h3{
font-size:15px;
margin-top:0;
}
.privacy-doc .privacy-handling-title{
text-align:center;
font-size:18px;
font-weight:700;
margin:2.2em 0 1em;
color:var(--dark);
}
.privacy-doc .privacy-meta{
font-size:14px;
line-height:1.75;
margin:.75em 0;
}
.privacy-doc .privacy-dates{
display:flex;
flex-wrap:wrap;
gap:12px 28px;
justify-content:flex-end;
margin:1em 0 0;
font-size:14px;
color:var(--muted);
}
.partner-layout{
display:grid;
grid-template-columns:1fr;
gap:22px;
align-items:start;
}
.partner-side{
background:#fff;
border:1px solid var(--line);
border-radius:16px;
padding:18px 16px;
box-shadow:0 10px 28px rgba(15,23,36,.05);
}
.partner-side h3{
font-size:16px;
margin:0 0 12px;
color:var(--dark);
}
.partner-side-link{
color:#cb6d00;
text-decoration:underline;
font-size:14px;
}
.partner-main .title{margin-bottom:8px}
.partner-main .sub{margin-bottom:22px}
.partner-form-card{
background:#fff;
border:1px solid var(--line);
border-radius:16px;
padding:22px;
box-shadow:0 12px 36px rgba(15,23,36,.06);
}
.partner-form{
display:grid;
grid-template-columns:1fr;
gap:8px;
}
.partner-form label{
font-size:14px;
font-weight:600;
color:#2b3b50;
margin-top:8px;
}
.partner-form input:not([type="checkbox"]),
.partner-form select,
.partner-form textarea{
width:100%;
border:1px solid #ccd5e2;
border-radius:8px;
padding:9px 10px;
font-size:14px;
font-family:inherit;
background:#fff;
}
.partner-form textarea{resize:vertical;min-height:180px}
.partner-form input:focus,
.partner-form select:focus,
.partner-form textarea:focus{
outline:none;
border-color:var(--brand);
box-shadow:0 0 0 3px rgba(47,99,255,.12);
}
.partner-form .field-error{
min-height:1.1em;
margin:2px 0 0;
font-size:12px;
line-height:1.35;
color:#d93025;
}
.privacy-consent{
margin-top:14px;
padding:14px 14px 12px;
border:1px solid #d7deea;
border-radius:10px;
background:#fbfcff;
}
.privacy-consent legend{
padding:0 6px;
font-size:14px;
font-weight:700;
color:#2b3b50;
}
.required-badge{
display:inline-block;
padding:1px 6px;
border-radius:4px;
background:#d64b43;
color:#fff;
font-size:11px;
font-weight:700;
vertical-align:baseline;
}
.privacy-consent-check{
display:inline-flex;
align-items:center;
gap:6px;
margin:2px 0 10px;
font-weight:500;
color:#2b3b50;
cursor:pointer;
}
.privacy-consent-check input{
width:16px;
height:16px;
margin:0;
accent-color:var(--brand);
box-shadow:none;
flex:0 0 auto;
}
.privacy-consent p{
margin:.35em 0;
font-size:14px;
line-height:1.65;
color:#4d5f78;
}
.privacy-consent a{
color:#2f63ff;
text-decoration:none;
word-break:break-all;
}
.privacy-consent a:hover{text-decoration:underline}
.partner-form .is-invalid{
border-color:#d93025;
box-shadow:0 0 0 3px rgba(217,48,37,.12);
}
.partner-form-actions{
display:flex;
flex-wrap:wrap;
gap:10px;
margin-top:14px;
}
.partner-confirm-card{
background:#fff;
border:1px solid var(--line);
border-radius:16px;
padding:14px;
box-shadow:0 12px 36px rgba(15,23,36,.06);
}
.partner-confirm-card .company-profile-table{
width:100%;
}
.partner-confirm-card .company-profile-table td{
white-space:pre-wrap;
}
.sendButton{
display:inline-block;
padding:9px 16px;
font-size:14px;
cursor:pointer;
text-align:center;
text-decoration:none;
color:#fff;
background-color:rgb(50 102 204);
border:none;
border-radius:8px;
}
.sendButton:hover{background-color:#f07800}
.sendButton:active{background-color:#d16900;transform:translateY(1px)}
@media (max-width:880px){
.partner-layout{grid-template-columns:1fr}
}
.business-services{
display:grid;
gap:22px;
margin-bottom:40px;
}
.service-card{
background:#fff;
border:1px solid var(--line);
border-radius:18px;
padding:24px 26px 26px;
box-shadow:0 14px 44px rgba(15,23,36,.06);
border-top:3px solid var(--brand);
}
.service-card h3{
font-size:20px;
margin-bottom:12px;
color:var(--dark);
}
.service-card__body{
font-size:15px;
line-height:1.85;
color:var(--text);
margin-bottom:18px;
}
.service-card__tech h4{
font-size:13px;
font-weight:700;
letter-spacing:.06em;
color:var(--muted);
text-transform:none;
margin-bottom:10px;
}
.tech-lines{margin:0}
.tech-lines dt{
font-size:12px;
font-weight:700;
color:var(--brand);
margin-top:12px;
margin-bottom:6px;
}
.tech-lines dt:first-child{margin-top:0}
.tech-lines dd{margin:0}
.tech-tags{display:flex;flex-wrap:wrap;gap:6px 8px}
.tech-tags--block{margin-bottom:4px}
.service-card__tech h4 + .tech-tags + h4{margin-top:16px}
.tech-tag{
display:inline-block;
font-size:12px;
line-height:1.3;
padding:5px 11px;
border-radius:999px;
background:rgba(47,99,255,.09);
color:#1a3054;
border:1px solid rgba(47,99,255,.16);
}
.business-block-title{
font-size:22px;
margin:40px 0 16px;
color:var(--dark);
letter-spacing:.02em;
}
.business-block-title:first-of-type{margin-top:8px}
.business-domains{
padding:22px 24px 26px;
}
.domains-system__head{
font-size:17px;
font-weight:700;
margin-bottom:16px;
padding-bottom:12px;
border-bottom:2px solid rgba(47,99,255,.2);
color:var(--dark);
}
.domains-system__grid{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:16px;
}
.domain-branch{
background:linear-gradient(180deg,#f7f9ff,#f2f5fc);
border:1px solid var(--line);
border-radius:14px;
padding:14px 16px 16px;
}
.domain-branch h4{
font-size:14px;
font-weight:700;
margin-bottom:10px;
color:#1e3a5f;
}
.domain-branch ul{
margin:0;
padding-left:1.15em;
font-size:14px;
line-height:1.65;
color:var(--text);
}
.domain-branch li{margin:4px 0}
.domains-bpo{
margin-top:18px;
padding:18px 20px;
background:linear-gradient(135deg,rgba(47,99,255,.06),rgba(30,162,255,.04));
border:1px solid var(--line);
border-radius:14px;
}
.domains-bpo h3{
font-size:16px;
font-weight:700;
margin-bottom:8px;
color:var(--dark);
}
.domains-bpo p{margin:0;font-size:14px;line-height:1.7;color:var(--text)}
.tech-expertise{
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:18px;
padding:22px 24px 26px;
background:linear-gradient(165deg,#fffbf2,#fff4e0);
border:1px solid rgba(230,200,140,.45);
border-radius:18px;
box-shadow:0 12px 36px rgba(120,90,40,.08);
}
.tech-expertise__col h4{
font-size:14px;
font-weight:700;
margin-bottom:12px;
color:#5c4518;
letter-spacing:.04em;
}
.tech-expertise__col ul{
margin:0;
padding-left:1.1em;
font-size:14px;
line-height:1.75;
color:#2a2418;
}
.tech-expertise__col li{margin:3px 0}
@media (max-width:720px){
.domains-system__grid{grid-template-columns:1fr}
.tech-expertise{grid-template-columns:1fr}
}
.company-panel{
background:transparent;
border:none;
box-shadow:none;
padding:0;
}
.company-sheet{
overflow-x:auto;
background:#fff;
border:1px solid var(--line);
border-radius:18px;
box-shadow:0 14px 48px rgba(15,23,36,.07);
}
.company-sheet + .company-sheet{margin-top:22px}
.company-philosophy-block,
.company-policy-block{
padding:26px 28px 30px;
}
.company-philosophy-list{
margin:0;
padding:0;
}
.company-philosophy-item{
display:grid;
grid-template-columns:5em 1fr;
gap:12px 24px;
padding:18px 0;
border-bottom:1px solid var(--line);
}
.company-philosophy-item:first-child{padding-top:0}
.company-philosophy-item:last-child{
padding-bottom:0;
border-bottom:none;
}
.company-philosophy-item dt{
margin:0;
font-weight:700;
font-size:16px;
color:var(--dark);
}
.company-philosophy-item dd{
margin:0;
line-height:1.9;
color:var(--text);
}
.company-policy-headline{
margin:0 0 16px;
font-size:clamp(1.1rem,2.2vw,1.4rem);
font-weight:800;
color:#1e3a6e;
line-height:1.5;
}
.company-policy-body{
margin:0;
line-height:1.9;
color:var(--text);
}
@media (max-width:560px){
.company-philosophy-item{
grid-template-columns:1fr;
gap:8px;
}
.company-philosophy-block,
.company-policy-block{padding:20px 18px 22px}
}
.company-profile-table,.company-list-table{
width:100%;
border-collapse:collapse;
border:none;
font-size:15px;
color:var(--text);
}
.company-profile-table th,.company-profile-table td,
.company-list-table th,.company-list-table td{
border:none;
border-bottom:1px solid var(--line);
padding:15px 18px;
vertical-align:top;
}
.company-profile-table tr:last-child th,
.company-profile-table tr:last-child td,
.company-list-table tr:last-child th,
.company-list-table tr:last-child td{border-bottom:none}
.company-profile-table th{
width:10.5em;
background:linear-gradient(165deg,rgba(47,99,255,.1) 0%,rgba(30,162,255,.06) 100%);
color:#152238;
text-align:center;
font-weight:700;
font-size:13px;
letter-spacing:.06em;
border-right:1px solid var(--line);
}
.company-profile-table td{
background:#fff;
text-align:left;
line-height:1.75;
}
.company-profile-table tr:nth-child(even) td{background:#f8fafc}
.company-list-table th{
width:10.5em;
background:linear-gradient(180deg,#f4f7fc,#eef2f9);
color:var(--dark);
text-align:left;
font-weight:700;
font-size:13px;
letter-spacing:.03em;
border-right:1px solid var(--line);
}
.company-list-table td{
background:#fff;
text-align:left;
line-height:1.65;
}
.company-list-table ul{margin:0;padding-left:1.2em;list-style-type:disc}
.company-list-table li{margin:5px 0;break-inside:avoid}
.company-list-table li.company-list-note{list-style:none}
@media (min-width:720px){
.company-list-table td ul{
column-count:2;
column-gap:36px;
}
}
@media (max-width:880px){
.company-list-table td ul{column-count:1}
.hero-grid,.grid{grid-template-columns:1fr}
h1{font-size:34px}
nav{gap:14px}
.kv{grid-template-columns:1fr}
.hero-visual{order:2}
.home-legacy{grid-template-columns:1fr}
.home-legacy__media{min-height:220px}
.home-legacy__media--right{order:3}
.home-legacy__text{order:2}
.zigzag{grid-template-columns:1fr}
.zigzag--reverse{direction:ltr}
.top-visual-logo{
left:12px;
top:10px;
gap:8px 10px;
padding:4px 8px;
}
.top-visual-logo--arc{
left:0;
top:0;
padding:0;
}
.top-visual-logo--arc .arc-en{font-size:46px}
.top-visual-logo--arc .arc-jp{font-size:18px}
.index-nav{gap:8px}
.index-nav > a,
.index-nav-item__trigger{min-width:116px;max-width:none;padding:9px 10px;font-size:13px}
.index-nav-megamenu{min-width:116px;max-width:none}
.index-nav-aside{font-size:12px}
}
.footer-bar{
display:flex;
gap:14px;
flex-wrap:wrap;
justify-content:center;
align-items:center;
}
.footer-bar a{
color:inherit;
text-decoration:underline;
}
@media (max-width:640px){
.wrap{width:min(1280px,92%)}
.section{padding:48px 0}
.section.page-top{padding-top:64px}
.title{font-size:24px}
.sub{font-size:13px;margin-bottom:20px}
.top-visual img,
.top-banner img{height:clamp(160px,42vw,220px)}
.top-visual-slogan{
right:10px;
top:10px;
max-width:54%;
font-size:11px;
line-height:1.55;
}
.top-visual-slogan p:nth-child(1){
margin-left:2.4em;
}
.top-visual-slogan p:nth-child(2){
margin-left:1.2em;
}
.top-visual-slogan p:nth-child(3){
margin-left:0;
}
.index-nav-bar__inner{
flex-direction:column;
align-items:stretch;
column-gap:0;
row-gap:10px;
padding:10px 0;
}
.index-nav-bar__inner .index-nav{
flex:none;
width:100%;
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:8px;
padding:0;
}
.index-nav > a,
.index-nav-item__trigger{
flex:none;
min-width:0;
max-width:none;
width:100%;
padding:10px 8px;
font-size:12px;
clip-path:polygon(8% 0,100% 0,92% 100%,0 100%);
}
.index-nav-megamenu{
flex:none;
min-width:0;
max-width:none;
width:100%;
grid-column:1 / -1;
}
@media (max-width:640px){
.index-nav-megamenu::after{display:none!important}
.index-nav-dropdown{
display:flex;
flex-direction:column;
align-items:stretch;
position:static;
top:auto;
width:var(--index-nav-dropdown-width,200px);
max-width:100%;
margin:0;
padding:4px 0 6px;
box-sizing:border-box;
transform:translateX(var(--index-nav-dropdown-offset-x,0px));
clip-path:none;
border:1px solid rgba(255,255,255,.28);
border-top:none;
border-radius:0 0 4px 4px;
box-shadow:0 4px 12px rgba(15,23,36,.1);
}
.index-nav-dropdown::before{
display:none;
}
.index-nav-megamenu:hover .index-nav-dropdown,
.index-nav-megamenu:focus-within .index-nav-dropdown{
opacity:0;
visibility:hidden;
pointer-events:none;
background:linear-gradient(180deg,#4d98e0 0%,#4490d8 100%);
}
.index-nav-megamenu.is-open .index-nav-dropdown{
opacity:1;
visibility:visible;
pointer-events:auto;
background:linear-gradient(180deg,#2f92ea 0%,#1f83da 100%);
}
.index-nav-dropdown a{
padding:11px 14px;
border-bottom:1px solid rgba(255,255,255,.14);
}
.index-nav-dropdown li:last-child a{border-bottom:none}
}
.index-nav-aside{
width:100%;
margin-left:0;
text-align:center;
white-space:normal;
font-size:12px;
padding:8px 4px;
}
.home-zigzag{padding:40px 0 52px}
.zigzag{padding:14px}
.zigzag__title{font-size:20px}
.zigzag__art img{min-height:180px}
.privacy-doc{padding:20px 16px 24px;font-size:14px}
.privacy-doc h3{font-size:15px}
.service-card{padding:18px 16px 20px}
.service-card h3{font-size:18px}
.business-block-title{font-size:19px;margin-top:28px}
.business-domains{padding:16px}
.tech-expertise{padding:16px 14px 18px}
.partner-form-card{padding:16px}
.partner-form input:not([type="checkbox"]),
.partner-form select,
.partner-form textarea{font-size:16px}
.company-profile-table,
.company-list-table,
.company-profile-table tbody,
.company-list-table tbody{display:block}
.company-profile-table tr,
.company-list-table tr{
display:block;
border-bottom:1px solid var(--line);
}
.company-profile-table tr:last-child,
.company-list-table tr:last-child{border-bottom:none}
.company-profile-table th,
.company-profile-table td,
.company-list-table th,
.company-list-table td{
display:block;
width:100%;
box-sizing:border-box;
border-right:none;
}
.company-profile-table th,
.company-list-table th{
text-align:left;
padding:12px 16px 6px;
border-bottom:none;
}
.company-profile-table td,
.company-list-table td{padding:4px 16px 14px}
.company-sheet{overflow-x:visible;-webkit-overflow-scrolling:touch}
footer{padding:20px 0;font-size:12px}
.footer-bar{
flex-direction:column;
gap:8px;
text-align:center;
}
.greeting-body p,
.greeting-policy li{overflow-wrap:anywhere}
.btn{padding:12px 20px;min-height:44px;font-size:15px}
.privacy-consent-check input{width:20px;height:20px}
.access-map-wrap{margin-top:16px}
.panel{padding:18px 16px}
}
@media (max-width:480px){
.title{font-size:22px}
.index-nav > a,
.index-nav-item__trigger{font-size:12px;padding:11px 6px}
.index-nav-dropdown a{font-size:12px;padding:10px 12px}
.tech-tag{font-size:11px;padding:4px 9px}
.top-visual-logo--arc .arc-en{font-size:38px}
.top-visual-logo--arc .arc-jp{font-size:15px}
.privacy-mark img{width:100px}
}