.company-page {
  --company-space: clamp(104px, 10vw, 176px);
  --company-ink: #000;
  --company-paper: #fff;
  --company-accent: var(--service-accent, #f4511e);
  color: var(--company-ink);
  background: var(--company-paper);
  font: 15px/2.1 "Helvetica Neue", Arial, "Noto Sans JP", "Yu Gothic", Meiryo, sans-serif;
  font-feature-settings: "palt";
  -webkit-font-smoothing: antialiased;
}
.company-page *, .company-page *::before, .company-page *::after { box-sizing: border-box; }
.company-page h1, .company-page h2, .company-page h3, .company-page h4, .company-page p, .company-page figure, .company-page dl, .company-page dd { margin: 0; }
.company-page a { color: inherit; text-decoration: none; }
.company-page a:focus-visible { outline: 2px solid currentColor; outline-offset: 6px; }
.company-page section[id] { scroll-margin-top: 120px; }
.company-container { width: min(100% - var(--gutter, 5vw) * 2, var(--content-width, 1440px)); margin-inline: auto; }
.company-section { margin-top: var(--company-space); }
.company-hero { padding-top: 32px; }
.company-hero-top { display: flex; justify-content: space-between; align-items: center; gap: 24px; }
.company-kicker { font-size: 14px; font-weight: 700; letter-spacing: .12em; }
.company-kicker > span { width: 7px; height: 7px; margin-right: 9px; display: inline-block; border-radius: 50%; background: var(--company-accent); vertical-align: 2px; }
.company-breadcrumb { display: flex; gap: 16px; font-size: 14px; }
.company-breadcrumb a:hover { text-decoration: underline; text-underline-offset: 5px; }
.company-page .company-display { margin: 48px 0 36px; font-size: clamp(76px, 9.7vw, 156px); font-weight: 700; font-style: italic; letter-spacing: -.055em; line-height: 1.05; }
.company-display > span { color: var(--company-accent); }
.company-hero-grid { display: grid; grid-template-columns: 1.15fr 1fr; align-items: end; gap: 72px; }
.company-hero h1 { font-size: clamp(32px, 3.5vw, 56px); font-weight: 700; letter-spacing: .02em; line-height: 1.65; }
.company-hero h1 > span { color: var(--company-accent); }
.company-intro { max-width: 540px; line-height: 2.1; letter-spacing: .015em; }
.company-page-nav { display: flex; align-items: center; gap: 24px; margin-top: 56px; padding: 24px 0; border-block: 1px solid #000; }
.company-page-nav a { display: flex; align-items: center; justify-content: space-between; gap: 40px; min-height: 44px; font-size: 14px; font-weight: 700; }
.company-page-nav a:not(:last-child) { padding-right: 24px; border-right: 1px solid #000; }
.company-page-nav a > span { color: var(--company-accent); transition: transform .3s var(--ease); }
.company-page-nav a:hover > span { transform: translateY(3px); }
.company-heading > p { font-size: clamp(38px, 3.62vw, 52px); font-style: italic; font-weight: 700; line-height: 1.15; letter-spacing: -.035em; }
.company-heading > h2 { font-size: 24px; line-height: 1.6; font-weight: 500; margin-top: 16px; letter-spacing: .02em; }
.company-message-grid { display: grid; grid-template-columns: .75fr 1.25fr; gap: clamp(56px, 8vw, 128px); margin-top: 56px; align-items: start; }
.company-portrait { max-width: 440px; }
.company-portrait > div { overflow: hidden; border-radius: 32px; background: #fff; }
.company-portrait img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover; object-position: center top; }
.company-portrait figcaption { margin-top: 24px; display: flex; flex-direction: column; gap: 6px; font-size: 14px; line-height: 1.6; }
.company-portrait strong { font-size: 24px; font-weight: 700; letter-spacing: .1em; }
.company-portrait figcaption > span[lang] { letter-spacing: .04em; }
.company-message-copy > h3 { font-size: clamp(28px, 2.8vw, 40px); line-height: 1.65; font-weight: 700; letter-spacing: .04em; margin-bottom: 32px; }
.company-message-copy > p { margin-top: 24px; line-height: 2.2; letter-spacing: .025em; }
.company-philosophy { background: var(--company-accent); color: #fff; padding-block: 88px 104px; border-radius: 64px; }
.company-philosophy .company-heading { margin-bottom: 64px; }
.company-principle { display: grid; grid-template-columns: .75fr 1.25fr; gap: clamp(56px, 8vw, 128px); padding-block: 48px; border-top: 1px solid #fff; }
.company-principle-label { display: flex; gap: 24px; align-items: baseline; }
.company-principle-label > span { font-size: 16px; font-weight: 700; font-style: italic; }
.company-principle-label > h3 { font-size: 28px; font-style: italic; font-weight: 700; line-height: 1.4; }
.company-principle-main { font-size: clamp(28px, 3.1vw, 44px); line-height: 1.65; font-weight: 700; letter-spacing: .04em; }
.company-principle .company-principle-detail { margin-top: 24px; line-height: 2.1; }
.company-philosophy .company-principle-detail, .company-philosophy .company-value p, .company-philosophy .company-value span, .company-philosophy .company-principle-label > span { color: #fff; }
.company-value { padding-block: 28px; border-top: 1px solid #fff; }
.company-value:first-child { border: 0; padding-top: 0; }
.company-value:last-child { padding-bottom: 0; }
.company-value > div { display: flex; align-items: baseline; flex-wrap: wrap; gap: 12px 24px; }
.company-value h4 { font-size: 26px; font-weight: 700; line-height: 1.5; letter-spacing: .06em; }
.company-value span { font-size: 14px; font-style: italic; font-weight: 700; }
.company-value p { margin-top: 12px; }
.company-purpose { padding-bottom: 0; }
.company-purpose .company-principle-detail:first-child { margin-top: 0; }
.company-equation { font-size: clamp(30px, 3.4vw, 48px); font-weight: 700; letter-spacing: .05em; margin-block: 16px 32px !important; line-height: 1.6; }
.company-equation > span { display: inline-block; margin-inline: 8px; }
.company-purpose-end { margin-top: 36px !important; padding-top: 32px; border-top: 1px solid #fff; color: #fff; font-size: 20px; font-weight: 700; line-height: 2; letter-spacing: .03em; }
.company-profile-grid { display: grid; grid-template-columns: .75fr 1.25fr; gap: clamp(56px, 8vw, 128px); }
.company-info { border-top: 1px solid #000; }
.company-info > div { display: grid; grid-template-columns: minmax(144px, .8fr) minmax(0, 1.3fr); gap: 24px; padding-block: 28px; border-bottom: 1px solid #000; }
.company-info dt { font-size: 14px; font-weight: 700; line-height: 1.9; }
.company-info dd { font-size: 15px; line-height: 1.9; overflow-wrap: anywhere; }
.company-info a:hover { text-decoration: underline; text-underline-offset: 5px; }
.company-contact { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: end; margin-bottom: var(--company-space); padding-top: 64px; border-top: 1px solid #000; }
.company-contact h2 { margin-top: 24px; font-size: clamp(40px, 4.5vw, 64px); font-weight: 700; letter-spacing: .03em; line-height: 1.55; }
.company-contact > div > p:not(.company-kicker) { margin-bottom: 32px; }
.company-page .company-button { display: flex; justify-content: space-between; align-items: center; gap: 28px; width: min(100%, 320px); min-height: 56px; padding: 14px 16px 14px 24px; border: 1px solid #000; border-radius: 999px; background: #fff; color: #000; font-size: 14px; font-weight: 700; transition: background .3s var(--ease), color .3s var(--ease); }
.company-button > span { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: var(--company-accent); color: #fff; transition: transform .3s var(--ease), background .3s var(--ease), color .3s var(--ease); }
.company-button svg { width: 12px; height: 12px; fill: none; stroke: currentColor; stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }
.company-page .company-button:hover { background: var(--company-accent); color: #fff; }
.company-button:hover > span { transform: translateX(3px); background: #fff; color: var(--company-accent); }
.company-download { display: inline-flex; align-items: center; gap: 24px; font-size: 14px; min-height: 44px; margin-top: 16px; border-bottom: 1px solid #000; }
.company-download:hover { border-color: var(--company-accent); }
.company-mobile { display: none; }
@media (max-width: 1100px) {
  .company-hero-grid, .company-message-grid, .company-principle, .company-profile-grid { gap: 48px; }
  .company-hero-grid { grid-template-columns: 1.1fr 1fr; }
  .company-hero h1 { font-size: 32px; }
  .company-desktop { display: none; }
  .company-info > div { grid-template-columns: 1fr; gap: 8px; }
}
@media (max-width: 760px) {
  .company-hero { padding-top: 24px; }
  .company-hero-top { align-items: start; }
  .company-breadcrumb { gap: 10px; }
  .company-kicker { letter-spacing: .06em; }
  .company-page .company-display { font-size: clamp(64px, 15vw, 108px); margin-block: 48px 28px; }
  .company-hero-grid, .company-message-grid, .company-principle, .company-profile-grid, .company-contact { grid-template-columns: minmax(0, 1fr); gap: 32px; }
  .company-hero h1 { font-size: clamp(25px, 6.8vw, 40px); letter-spacing: .01em; line-height: 1.7; }
  .company-intro { margin-top: 0; }
  .company-page-nav { margin-top: 32px; gap: 12px; padding-block: 12px; flex-wrap: wrap; }
  .company-page-nav a { flex: 1 1 auto; gap: 12px; font-size: 14px; }
  .company-page-nav a:not(:last-child) { padding-right: 12px; border: 0; }
  .company-heading > h2 { font-size: 20px; }
  .company-message-grid { margin-top: 36px; }
  .company-portrait { display: grid; grid-template-columns: minmax(100px, .8fr) 1fr; gap: 24px; align-items: end; max-width: none; }
  .company-portrait > div { border-radius: 24px; }
  .company-portrait figcaption { margin: 0; padding-bottom: 8px; }
  .company-portrait strong { font-size: 22px; }
  .company-message-copy > h3 { font-size: 27px; }
  .company-philosophy { border-radius: 32px; padding-block: 56px; }
  .company-philosophy .company-heading { margin-bottom: 40px; }
  .company-principle { padding-block: 32px; gap: 24px; }
  .company-principle-label { gap: 16px; }
  .company-principle-label > h3 { font-size: 24px; }
  .company-principle-main { font-size: clamp(25px, 6.9vw, 36px); letter-spacing: .015em; }
  .company-principle-detail { font-size: 15px; }
  .company-purpose { padding-bottom: 0; }
  .company-equation { font-size: 31px; letter-spacing: 0; }
  .company-equation > span { margin-inline: 4px; }
  .company-purpose-end { font-size: 18px; }
  .company-value h4 { font-size: 24px; }
  .company-profile .company-heading > p br { display: none; }
  .company-profile .company-heading > p { max-width: 100%; }
  .company-info > div { padding-block: 24px; }
  .company-contact { padding-top: 40px; gap: 32px; }
  .company-contact h2 { font-size: 40px; }
  .company-mobile { display: initial; }
}
@media (max-width: 360px) {
  .company-page .company-display { font-size: 56px; }
  .company-breadcrumb { display: none; }
  .company-profile .company-heading > p { font-size: 34px; }
  .company-message-copy > h3 { font-size: 24px; }
  .company-equation { font-size: 28px; }
}
@media (prefers-reduced-motion: reduce) {
  .company-page *, .company-page *::before, .company-page *::after { transition: none !important; scroll-behavior: auto; }
}
