@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;700&family=Poppins:wght@400;500;700&display=swap');

:root { color-scheme: light; --ink:#222; --blue:#1e65db; --brand:#172f63; --line:#ddd; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:24px; }
body { margin:0; color:var(--ink); background:#fff; font-family:'Poppins','Noto Sans JP',sans-serif; font-size:15px; line-height:2; }
img { display:block; max-width:100%; }
a { color:inherit; text-decoration:none; }
a:hover { color:var(--blue); }
a:focus-visible, summary:focus-visible { outline:3px solid var(--blue); outline-offset:6px; }
p,h1,h2,h3,ul,dl,dd,figure { margin:0; }
.visually-hidden { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; }
.skip-link { position:absolute; z-index:20; top:8px; left:8px; padding:8px 16px; background:#fff; transform:translateY(-180%); }
.skip-link:focus { transform:translateY(0); }
.site-header { min-height:98px; max-width:1480px; margin:auto; padding:14px 70px; display:flex; align-items:center; justify-content:space-between; gap:38px; }
.brand { display:flex; align-items:center; gap:12px; flex-shrink:0; }
.brand-symbol { width:48px; height:64px; object-fit:contain; }
.brand-wordmark { width:260px; height:56px; object-fit:cover; object-position:50% 47%; }
.desktop-nav { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:14px 30px; font-size:13px; font-weight:500; letter-spacing:1.3px; }
.mobile-menu { display:none; position:relative; }
.hero { position:relative; height:calc(100vw * .575); max-height:850px; overflow:hidden; border-radius:12px; }
.hero img { width:100%; height:100%; object-fit:cover; object-position:50% 50%; }
.hero::after { content:''; position:absolute; inset:0; background:linear-gradient(0deg, #ffffffb8 0%, #ffffff4d 30%, #ffffff00 60%); pointer-events:none; }
.hero-copy { position:absolute; z-index:1; left:clamp(30px,5.5vw,80px); right:30px; bottom:calc(clamp(30px,5vw,70px) + 130px); color:#122650; }
.hero-title { font-size:clamp(28px,2.8vw,40px); font-weight:700; line-height:1.5; letter-spacing:.04em; }
.hero-subtitle { margin-top:12px; font-size:14px; font-weight:400; line-height:1.6; letter-spacing:.04em; }
.section { padding:40px 60px; margin:80px auto 0; max-width:1480px; scroll-margin-top:24px; }
.section-title { font-size:36px; line-height:1.2; font-weight:700; letter-spacing:1.8px; text-align:center; }
.section-title::after { content:''; display:block; width:20px; height:1px; background:var(--ink); margin:14px auto 40px; }
.narrow { max-width:700px; margin:auto; }
.lead { font-size:18px; line-height:2; font-weight:700; margin-bottom:22px; }
.concept { margin-top:70px; }
.concept p:last-child { font-family:Arial,'Noto Sans JP',sans-serif; }
.image-strip { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); margin-top:80px; }
.image-strip img { width:100%; height:400px; object-fit:cover; }
.business-grid { list-style:none; padding:0; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:40px 20px; }
.business-grid img { width:100%; height:280px; object-fit:cover; border-radius:4px; margin-bottom:22px; }
.business-grid h3 { font-size:16px; line-height:2; font-weight:700; margin-bottom:6px; }
.business-grid p { font-size:13px; line-height:2; }
.news-list { list-style:none; padding:0; }
.news-item { display:grid; grid-template-columns:100px minmax(0,1fr); gap:20px; margin-bottom:32px; }
.news-item:last-child { margin-bottom:0; }
.news-item time { font-weight:500; }
.news-item p { margin-top:4px; font-size:13px; line-height:2; color:#555; }
.company-map { display:block; width:100%; height:400px; border:0; margin-bottom:60px; background:#fafafa; }
.company-details > div { display:grid; grid-template-columns:140px minmax(0,1fr); }
.company-details dt,.company-details dd { padding:16px 0; font-size:13px; line-height:24px; border-bottom:1px solid var(--line); overflow-wrap:anywhere; }
.company-details dt { border-color:var(--ink); padding-right:20px; }
.profile { margin-top:38px; padding-top:9px; padding-bottom:9px; }
.profile .profile-content { max-width:978px; margin:auto; }
.profile .profile-content > p:last-child { font-family:Arial,'Noto Sans JP',sans-serif; }
.identity { margin-top:14px; padding-top:89px; padding-bottom:0; }
.identity .section-title::after { margin-bottom:80px; }
.identity-row { max-width:968px; margin:auto; display:grid; grid-template-columns:minmax(0,700px) 180px; gap:68px; align-items:center; }
.identity-logo { width:180px; height:180px; object-fit:contain; }
.identity-divider { border:0; border-top:1px solid var(--ink); width:24px; margin:60px auto 32px; }
.shirosuke-row { max-width:968px; margin:auto; display:grid; grid-template-columns:160px minmax(0,1fr); align-items:center; gap:50px; }
.shirosuke-row img { width:160px; height:160px; object-fit:contain; }
.shirosuke-row figcaption { font-size:20px; text-align:center; }
.shirosuke-row .lead { letter-spacing:1px; }
.shirosuke-social { margin-top:16px; }
.shirosuke-social a { display:inline-block; color:var(--brand); text-decoration:underline; text-underline-offset:5px; }
.shirosuke-social a:hover { color:var(--blue); }
.site-footer { display:flex; justify-content:center; align-items:center; gap:26px; padding:75px 30px 40px; font-size:11px; letter-spacing:1px; }
.footer-logo { width:210px; height:40px; object-fit:cover; object-position:50% 47%; }
.site-footer small { font-size:11px; }
.legal { max-width:860px; padding:70px 40px; margin:auto; }
.legal h1 { font-size:32px; line-height:1.4; letter-spacing:1px; margin-bottom:42px; }
.legal h2 { font-size:20px; line-height:1.7; margin:36px 0 12px; }
.legal p,.legal ul { margin-bottom:16px; }
.legal ul { padding-left:1.5em; }
.back-link { display:inline-block; margin-top:32px; text-decoration:underline; text-underline-offset:5px; }
@media (max-width:1100px) {
  .site-header { padding-inline:30px; gap:22px; }
  .brand-wordmark { width:230px; }
  .desktop-nav { gap:10px 18px; font-size:12px; }
  .identity-row { gap:36px; }
}
@media (max-width:990px) {
  .desktop-nav { display:none; }
  .mobile-menu { display:block; }
  .mobile-menu summary { cursor:pointer; font-size:12px; letter-spacing:1px; padding:12px 4px; }
  .mobile-menu nav { position:absolute; right:0; top:100%; z-index:10; background:#fff; border:1px solid var(--line); padding:14px 24px; min-width:200px; box-shadow:0 10px 30px #0000000d; }
  .mobile-menu a { display:block; padding:8px 0; font-size:13px; letter-spacing:1px; }
  .section { padding-inline:40px; }
  .image-strip img { height:300px; }
  .identity-row { grid-template-columns:minmax(0,1fr) 150px; gap:30px; }
}
@media (max-width:690px) {
  .site-header { min-height:144px; padding:20px 24px 38px; position:relative; justify-content:center; }
  .brand-symbol { width:40px; height:52px; }
  .brand-wordmark { width:220px; height:48px; }
  .mobile-menu { position:absolute; right:24px; bottom:0; }
  .legal-header { flex-direction:column; gap:10px; padding-bottom:20px; }
  .hero { height:auto; aspect-ratio:4/3; border-radius:0; }
  .hero-copy { left:24px; right:24px; bottom:48px; }
  .hero-title { font-size:clamp(22px,6vw,26px); letter-spacing:.02em; }
  .hero-subtitle { margin-top:8px; font-size:12px; }
  .section { padding:40px 30px; margin-top:50px; }
  .section-title { font-size:28px; letter-spacing:1.4px; }
  .section-title::after { margin-top:14px; margin-bottom:40px; }
  .concept { margin-top:60px; }
  .concept p:last-child { line-height:2; }
  .image-strip { margin-top:50px; }
  .image-strip img { height:180px; }
  .business-grid { grid-template-columns:1fr; gap:40px; }
  .business-grid img { height:220px; }
  .business-grid h3 { font-size:16px; }
  .business-grid p { font-size:14px; }
  .news-item { grid-template-columns:1fr; gap:4px; margin-bottom:30px; }
  .news-item time { font-size:13px; }
  .company-map { height:300px; margin-bottom:40px; }
  .company-details > div { grid-template-columns:75px minmax(0,1fr); }
  .company-details dt { padding-right:12px; }
  .company-details dt,.company-details dd { padding-block:16px; }
  .profile { margin-top:20px; }
  .identity { margin-top:20px; }
  .identity .section-title::after { margin-bottom:40px; }
  .identity-row { display:flex; flex-direction:column; gap:24px; }
  .identity-logo { width:160px; height:160px; }
  .identity-divider { margin-top:40px; }
  .shirosuke-row { display:flex; flex-direction:column; gap:26px; }
  .shirosuke-row .lead { font-size:17px; }
  .site-footer { flex-wrap:wrap; gap:12px 16px; padding-top:40px; }
  .site-footer .footer-brand { flex-basis:100%; }
  .footer-logo { margin:auto; }
  .legal { padding:40px 24px; }
  .legal h1 { font-size:25px; }
  .legal h2 { font-size:18px; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }