@charset "UTF-8";
.about-page .page { overflow: clip; }
.about-page .shell { width: min(calc(100% - 96px), 1180px); margin: 0 auto; }
.about-page .breadcrumbs { padding-top: 28px; color: #728096; font-size: 12px; }
.about-page .breadcrumbs ol { display:flex; list-style:none; gap:12px; padding:0; margin:0; }
.about-page .breadcrumbs li { display:flex; gap:12px; }
.about-page .breadcrumbs li + li::before { content:"/"; color:#b9c7da; }
.about-hero { display:grid; grid-template-columns:minmax(0,1fr) 350px; gap:70px; padding-top:70px; padding-bottom:78px; border-bottom:1px solid #dbe6f4; }
.about-hero h1 { font-size:clamp(46px,6vw,82px); line-height:1.12; letter-spacing:-2px; margin:18px 0 18px; color:#0c1d35; }
.about-hero-subtitle { max-width:620px; color:#526985; font-size:22px; line-height:1.8; }
.about-hero-aside { align-self:end; padding:20px 0 2px 26px; border-left:2px solid #cfe0ff; }
.about-hero-aside span { display:block; color:#7795bc; font:10px/1.5 Arial,sans-serif; letter-spacing:2px; }
.about-hero-aside strong { display:block; color:#173e6c; font-size:18px; line-height:1.8; margin:12px 0 20px; }
.about-hero-aside a,.about-inline-link { display:inline-flex; align-items:center; gap:12px; color:#0961ff; font-size:13px; }
.about-hero-aside svg,.about-inline-link svg { width:17px; height:17px; }
.about-intro { padding-top:75px; padding-bottom:78px; }
.about-section-label { display:flex; align-items:center; gap:15px; color:#6a85ac; font-size:12px; letter-spacing:1px; }
.about-section-label i { width:48px; height:1px; background:#c8d8ed; }
.about-intro-grid { display:grid; grid-template-columns:1.05fr .95fr; gap:90px; margin-top:28px; align-items:end; }
.about-intro h2,.about-story h2,.about-services h2,.about-cases h2,.about-region-band h2 { color:#0d1d34; font-size:clamp(30px,4vw,52px); line-height:1.45; letter-spacing:-1.2px; margin:0; }
.about-intro-grid p { color:#667990; font-size:17px; line-height:2; margin:0; }
.about-story { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(320px,.9fr); gap:74px; align-items:center; padding-bottom:108px; }
.about-story-photo { overflow:hidden; border-radius:14px; background:#edf4fb; }
.about-story-photo img { display:block; width:100%; aspect-ratio:1.25; object-fit:cover; }
.about-story-copy h2 { font-size:clamp(30px,3.2vw,43px); margin:15px 0 22px; }
.about-rich-text { color:#64768d; font-size:16px; line-height:2.05; }
.about-rich-text p { margin:0 0 16px; }
.about-inline-link { margin-top:20px; }
.about-services,.about-cases { padding:78px 0 96px; border-top:1px solid #dbe6f4; }
.about-section-heading { display:flex; justify-content:space-between; gap:50px; align-items:end; }
.about-section-heading h2 { font-size:clamp(28px,3.4vw,44px); margin-top:12px; }
.about-section-heading > p { max-width:350px; color:#78899e; font-size:14px; line-height:1.9; margin:0; }
.about-service-list { display:grid; grid-template-columns:repeat(3,1fr); margin-top:45px; border-top:1px solid #dbe6f4; }
.about-service-list > div { padding:25px 28px 12px 0; border-bottom:1px solid #dbe6f4; }
.about-service-list > div + div { padding-left:28px; border-left:1px solid #dbe6f4; }
.about-service-list span { color:#0961ff; font-size:13px; }
.about-service-list strong { display:block; color:#182c49; font-size:19px; margin:18px 0 10px; }
.about-service-list p { color:#7a8ba0; font-size:13px; line-height:1.9; margin:0; }
.about-case-grid { display:grid; grid-template-columns:repeat(12,1fr); gap:18px; margin-top:42px; }
.about-case { grid-column:span 4; margin:0; }
.about-case:nth-child(1) { grid-column:span 7; }
.about-case:nth-child(2) { grid-column:span 5; }
.about-case:nth-child(3),.about-case:nth-child(4) { grid-column:span 4; }
.about-case-image { width:100%; aspect-ratio:1.35; overflow:hidden; border-radius:11px; background:#eaf2fb; }
.about-case:nth-child(1) .about-case-image { aspect-ratio:1.65; }
.about-case img { width:100%; height:100%; object-fit:cover; display:block; transition:transform .35s ease; }
.about-case:hover img { transform:scale(1.03); }
.about-case figcaption { display:flex; justify-content:space-between; gap:12px; margin-top:10px; color:#426184; font-size:12px; }
.about-case figcaption span { color:#9aabc0; }
.about-region-band { display:grid; grid-template-columns:1fr 1fr; gap:80px; margin-bottom:90px; padding:58px 64px; border-radius:16px; background:linear-gradient(120deg,#e9f5ff,#dceaff); }
.about-region-band h2 { font-size:clamp(29px,3.6vw,46px); }
.about-region-band p { color:#55708f; font-size:16px; line-height:2; margin:0 0 25px; }
.about-region-band .button { display:inline-flex; align-items:center; gap:12px; }
.about-region-band .button svg { width:18px; height:18px; }
.sitemap-hero { padding:70px 0 65px; border-bottom:1px solid #dbe6f4; }
.sitemap-hero h1 { font-size:clamp(38px,5vw,64px); margin:17px 0; color:#0c1d35; }
.sitemap-hero p:last-child { color:#718299; font-size:16px; line-height:1.9; }
.sitemap-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; padding-top:55px; padding-bottom:90px; }
.sitemap-group { padding:25px 26px 28px; border:1px solid #dbe6f4; border-radius:12px; background:#fbfdff; }
.sitemap-group h2 { color:#16375d; font-size:21px; margin:0 0 17px; }
.sitemap-group ul { list-style:none; margin:0; padding:0; display:grid; gap:10px; }
.sitemap-group a { color:#6d7e93; font-size:14px; line-height:1.7; }
.sitemap-group a:hover { color:#0961ff; }
@media (max-width:900px) { .about-page .shell { width:calc(100% - 64px); } .about-hero { grid-template-columns:1fr; gap:30px; } .about-hero-aside { max-width:480px; } .about-intro-grid,.about-story,.about-region-band { grid-template-columns:1fr; gap:35px; } .about-service-list { grid-template-columns:1fr; } .about-service-list > div + div { border-left:0; padding-left:0; } .about-case:nth-child(n) { grid-column:span 6; } .sitemap-grid { grid-template-columns:1fr 1fr; } }
@media (max-width:600px) { .about-page .shell { width:calc(100% - 40px); } .about-hero { padding-top:40px; padding-bottom:48px; } .about-hero h1 { font-size:47px; } .about-hero-subtitle { font-size:17px; } .about-intro { padding-top:48px; padding-bottom:55px; } .about-intro h2,.about-story h2 { font-size:30px; } .about-intro-grid { gap:22px; } .about-story { padding-bottom:60px; } .about-services,.about-cases { padding:53px 0 65px; } .about-section-heading { display:block; } .about-section-heading > p { margin-top:18px; } .about-case:nth-child(n) { grid-column:span 12; } .about-case:nth-child(1) .about-case-image { aspect-ratio:1.35; } .about-region-band { margin-bottom:55px; padding:32px 24px; gap:25px; } .sitemap-hero { padding:45px 0 40px; } .sitemap-grid { grid-template-columns:1fr; padding-top:35px; padding-bottom:60px; } }