@charset "utf-8";

/* ==================================================
 * ==================================================
 * company-page
 * ==================================================
 * ================================================== */
.company-page{
  --company-brand: var(--color-brand);
  --company-brand-dark: var(--color-brand-dark);
  --company-rule: rgba(0,0,0,.05);
  --company-rule-light: rgba(255,255,255,.15);
  --company-ease: cubic-bezier(.22,1,.36,1);
  
  min-width: 0;
}

/* ==================================================
 * ==================================================
 * company-hero
 * ==================================================
 * ================================================== */
.company-hero{
  --company-hero-min-height: min(60svh, max(40rem, 64vw));
  --company-hero-grid-size: max(4rem, 8vw);
  --company-hero-grid-offset: max(2rem, 4vw);
  
  display: grid;
  min-height: var(--company-hero-min-height);
  padding-top: var(--layout-header-height);
  position: relative;
  isolation: isolate;
  overflow: hidden;
}
.company-hero__grid{
  background-image:
    linear-gradient(to right, var(--company-rule) 1px, transparent 1px),
    linear-gradient(to bottom, var(--company-rule) 1px, transparent 1px);
  background-size:
    var(--company-hero-grid-size) 100%,
    100% var(--company-hero-grid-size);
  background-position:
    calc(50% + var(--company-hero-grid-offset)) 0,
    0 calc(50% + var(--company-hero-grid-offset));
  background-repeat: repeat-x, repeat-y;
  border-bottom: 1px solid var(--company-rule);
  position: absolute;
  inset: 0;
  z-index: -1;
  animation: company-hero-grid-enter 1800ms cubic-bezier(.22,1,.36,1) 120ms both;
}
.company-hero__inner{
  display: grid;
  width: min(100%, var(--layout-inner-width));
  min-height: calc(var(--company-hero-min-height) - var(--layout-header-height));
  padding-block: clamp(2rem, 4vw, 4rem);
  padding-inline: var(--layout-inner-padding);
  margin-inline: auto;
}
.company-hero__main{
  display: grid;
  min-width: 0;
}
.company-hero__content{
  display: grid;
  align-content: center;
  justify-items: center;
  column-gap: clamp(3rem, 6vw, 6rem);
  row-gap: clamp(2rem, 4vw, 4rem);
  min-width: 0;
  text-align: center;
}
.company-hero__head{
  display: grid;
  row-gap: clamp(1rem, 1.5vw, 1.5rem);
  width: min(100%, 48rem);
}
.company-hero__title-en{
  color: var(--company-accent-dark);
  font-size: var(--fs-2xs);
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0.2em;
  text-transform: uppercase;
}
.company-hero__title-ja{
  font-size: var(--fs-6xl);
  font-weight: 500;
  line-height: 1.2;
  letter-spacing: -0.02em;
}
.company-hero__body{
  display: grid;
  row-gap: clamp(1rem, 1.5vw, 1.5rem);
  width: min(100%, 32rem);
}
.company-hero__lead{
  font-size: var(--fs-3xl);
  font-weight: 500;
  line-height: 1.6;
}
.company-hero__text{
  color: rgba(0,0,0,.80);
}

/* ==================================================
 * company-hero responsive 1025px
 * ================================================== */
@media (min-width: 1025px){
  .company-hero__content{
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
    justify-items: stretch;
    text-align: left;
  }
  .company-hero__body{
    justify-self: center;
  }
}

/* ==================================================
 * company-hero keyframes
 * ================================================== */
@keyframes company-hero-grid-enter{
  from{ opacity: 0; clip-path: inset(50%); }
  to{ opacity: 1; clip-path: inset(0); }
}

/* ==================================================
 * company-hero reduced motion
 * ================================================== */
@media (prefers-reduced-motion: reduce){
  .company-hero__grid{
    animation: none;
  }
}

/* ==================================================
 * ==================================================
 * company-intro
 * ==================================================
 * ================================================== */
.company-intro{
  --company-intro-shadow: 0 4px 16px var(--color-shadow-dark);
  --company-intro-border: 1px solid var(--color-border-light);
  --company-intro-stage-height: min(180svh, max(120svh, 128vw));
  --company-intro-media-shift: 0px;
  --company-intro-media-scale: 1;
  --company-intro-media-scrim-side: linear-gradient(90deg, rgba(0,0,0,.05) 0%, rgba(0,0,0,.20) 45%, rgba(0,0,0,.48) 100%);
  --company-intro-media-scrim-bottom: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.25) 100%);

  position: relative;
}
.company-intro__main{
  position: relative;
}
.company-intro__frame{
  width: 100vw;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 50%;
  overflow: hidden;
  z-index: 0;
  transform: translateX(-50%);
}
.company-intro__media{
  position: absolute;
  inset: -10svh 0;
}
.company-intro__media::after{
  content: "";
  background:
    var(--company-intro-media-scrim-side),
    var(--company-intro-media-scrim-bottom);
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.company-intro__image{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.company-intro__content{
  text-shadow: var(--company-intro-shadow);
  display: grid;
  align-content: center;
  justify-items: end;
  row-gap: clamp(1.5rem, 2vw, 2rem);
  width: min(100%, var(--layout-inner-width));
  min-height: var(--company-intro-stage-height);
  padding-top: calc(var(--layout-header-height) + var(--space-panel-block));
  padding-bottom: calc(env(safe-area-inset-bottom) + var(--space-panel-block));
  padding-inline: var(--layout-inner-padding);
  margin-inline: auto;
  position: relative;
  z-index: 1;
}
.company-intro__head{
  display: grid;
  row-gap: clamp(1rem, 1.5vw, 1.5rem);
  width: min(100%, 32rem);
}
.company-intro__title-en{
  color: var(--company-accent);
  font-size: var(--fs-2xs);
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0.2em;
  text-transform: uppercase;
}
.company-intro__title-ja{
  font-size: var(--fs-4xl);
  font-weight: 500;
  line-height: 1.4;
  letter-spacing: -0.02em;
}

/* ==================================================
 * company-intro items
 * ================================================== */
.company-intro__items{
  display: grid;
  grid-template-columns: minmax(7rem, max-content) max-content max-content;
  column-gap: clamp(1.5rem, 2vw, 2rem);
  width: fit-content;
  max-width: 100%;
  position: relative;
}
.company-intro__item{
  display: grid;
  grid-template-columns: subgrid;
  grid-column: 1 / -1;
  align-items: end;
  padding-block: clamp(1rem, 2vw, 2rem);
  position: relative;
}
.company-intro__item::before,
.company-intro__items::after{
  content: "";
  border-top: var(--company-intro-border);
  position: absolute;
  right: 0;
  left: 0;
  pointer-events: none;
}
.company-intro__item::before{
  top: 0;
}
.company-intro__items::after{
  bottom: 0;
}
.company-intro__item-head{
  grid-column: 1;
  padding-right: 0.5rem;
}
.company-intro__item-title{
  font-size: var(--fs-sm);
  font-weight: 500;
  line-height: 1;
}
.company-intro__item-body{
  display: grid;
  grid-template-columns: subgrid;
  grid-column: 2 / -1;
  align-items: baseline;
}
.company-intro__item-value{
  font-family: var(--font-en-sans);
  font-size: clamp(2rem, 4vw, 4rem);
  font-weight: 500;
  font-variant-numeric: tabular-nums;
  line-height: 1;
  letter-spacing: -0.02em;
  white-space: nowrap;
  grid-column: 1;
  justify-self: end;
}
.company-intro__item-unit{
  font-size: var(--fs-sm);
  font-weight: 500;
  line-height: 1;
  white-space: nowrap;
  grid-column: 2;
  justify-self: start;
}

/* ==================================================
 * company-intro motion
 * ================================================== */
.company-page.is-company-intro-ready .company-intro__media{
  transform: translate3d(0, var(--company-intro-media-shift), 0) scale(var(--company-intro-media-scale));
  will-change: transform;
}
.company-page.is-company-intro-ready .company-intro__head{
  opacity: var(--company-intro-head-opacity, 0);
  transform: translate3d(0, var(--company-intro-head-offset, 2rem), 0);
  will-change: opacity, transform;
}
.company-page.is-company-intro-ready .company-intro__item-head,
.company-page.is-company-intro-ready .company-intro__item-body{
  opacity: var(--company-intro-item-opacity, 0);
  transform: translate3d(0, var(--company-intro-item-offset, 2rem), 0);
  will-change: opacity, transform;
}
.company-page.is-company-intro-ready .company-intro__items::after{
  opacity: var(--company-intro-items-border-progress, 0);
  transform: scaleX(var(--company-intro-items-border-progress, 0));
  transform-origin: right center;
  will-change: opacity, transform;
}
.company-page.is-company-intro-ready .company-intro__item::before{
  opacity: var(--company-intro-item-border-progress, 0);
  transform: scaleX(var(--company-intro-item-border-progress, 0));
  transform-origin: right center;
  will-change: opacity, transform;
}

/* ==================================================
 * company-intro responsive 768px
 * ================================================== */
@media (min-width: 768px){
  .company-intro__items{
    grid-template-columns: minmax(10rem, max-content) max-content max-content;
    width: max-content;
  }
}

/* ==================================================
 * company-intro reduced motion
 * ================================================== */
@media (prefers-reduced-motion: reduce){
  .company-page.is-company-intro-ready .company-intro__media{
    transform: none;
    will-change: auto;
  }
  .company-page.is-company-intro-ready .company-intro__head,
  .company-page.is-company-intro-ready .company-intro__item-head,
  .company-page.is-company-intro-ready .company-intro__item-body{
    opacity: 1;
    transform: none;
    will-change: auto;
  }
  .company-page.is-company-intro-ready .company-intro__items::after,
  .company-page.is-company-intro-ready .company-intro__item::before{
    opacity: 1;
    transform: none;
    will-change: auto;
  }
}

/* ==================================================
 * ==================================================
 * company-philosophy
 * ==================================================
 * ================================================== */
.company-philosophy__inner{
  display: grid;
  row-gap: clamp(2rem, 4vw, 4rem);
}
.company-philosophy__header{
  display: grid;
  row-gap: clamp(1rem, 1.5vw, 1.5rem);
  text-align: center;
}
.company-philosophy__title-en{
  color: var(--company-brand-dark);
  font-size: var(--fs-xs);
  font-weight: 600;
  line-height: 1;
  letter-spacing: .2em;
}
.company-philosophy__title-ja{
  font-size: var(--fs-6xl);
  font-weight: 500;
  line-height: 1.2;
  letter-spacing: -.02em;
}
.company-philosophy__main{
  display: grid;
  row-gap: clamp(3rem, 4vw, 4rem);
}
.company-philosophy__media{
  width: min(100%, clamp(20rem, 40vw, 40rem));
  margin-inline: auto;
}
.company-philosophy__image{
  width: 100%;
  aspect-ratio: 4 / 5;
  object-fit: cover;
}

.company-philosophy__content{
  display: grid;
  justify-self: center;
  row-gap: clamp(8rem, 14vw, 14rem);
  width: min(100%, 40rem);
}
.company-philosophy__group-content{
  display: grid;
}
.company-philosophy__group--management .company-philosophy__group-content{
  row-gap: clamp(3.5rem, 6vw, 6rem);
}
.company-philosophy__group--conduct .company-philosophy__group-content{
  row-gap: clamp(1rem, 1.5vw, 1.5rem);
}
.company-philosophy__group-title{
  font-size: var(--fs-2xl);
  font-weight: 500;
  line-height: 1.4;
  letter-spacing: -.02em;
}
.company-philosophy__items--management{
  display: grid;
  row-gap: clamp(3rem, 4vw, 4rem);
}
.company-philosophy__items--management .company-philosophy__item{
  display: flex;
  align-items: start;
  column-gap: clamp(1.5rem, 3vw, 3rem);
}
.company-philosophy__items--management .company-philosophy__item-number{
  color: var(--company-accent-color);
  flex: 0 0 2.5rem;
  padding-top: .5rem;
}
.company-philosophy__items--management .company-philosophy__item-number::after{
  content: "";
  background: currentColor;
  display: block;
  width: 1.5rem;
  height: 1px;
  margin-top: 1rem;
  opacity: .55;
}
.company-philosophy__items--management .company-philosophy__item-body{
  display: grid;
  flex: 1 1 auto;
  row-gap: 1.25rem;
  min-width: 0;
}
.company-philosophy__item-title{
  font-size: var(--fs-5xl);
  font-weight: 500;
  line-height: 1;
  letter-spacing: -.02em;
}
.company-philosophy__items--management .company-philosophy__item-text{
}
.company-philosophy__items--conduct{
  border-top: 1px solid var(--company-rule-color);
}
.company-philosophy__items--conduct .company-philosophy__item{
  display: flex;
  align-items: start;
  column-gap: clamp(1rem, 2vw, 2rem);
  border-bottom: 1px solid var(--company-rule);
}
.company-philosophy__item-number{
  color: var(--company-muted-color);
  font-family: var(--font-en-sans);
  font-size: var(--fs-2xs);
  font-weight: 500;
  font-variant-numeric: tabular-nums;
  line-height: 1.4;
}
.company-philosophy__items--conduct .company-philosophy__item-number{
  flex: 0 0 2.5rem;
}
.company-philosophy__items--conduct .company-philosophy__item-body{
  flex: 1 1 auto;
  min-width: 0;
}
.company-philosophy__items--conduct .company-philosophy__item-text{
  color: var(--color-fg-base);
  font-size: var(--fs-lg);
  font-weight: 500;
}

/* ==================================================
 * company-philosophy responsive 1025px
 * ================================================== */
@media (min-width: 1025px){
  .company-philosophy__header{
    text-align: left;
  }
  .company-philosophy__main{
    grid-template-columns: minmax(20rem, .72fr) minmax(0, 1.28fr);
    column-gap: clamp(3rem, 6vw, 6rem);
  }
  .company-philosophy__media-sticky{
    position: sticky;
    top: calc(var(--layout-header-height) + clamp(2rem, 4vw, 4rem));
  }
  .company-philosophy__content{
    justify-self: end;
  }
  .company-philosophy__group--conduct .company-philosophy__group-content{
    grid-template-columns: minmax(9rem, .38fr) minmax(0, 1.62fr);
    column-gap: clamp(3rem, 6vw, 6rem);
    align-items: start;
  }
}
/* ==================================================
 * ==================================================
 * company-message
 * ==================================================
 * ================================================== */
.company-message__inner{
  display: grid;
  row-gap: clamp(2rem, 4vw, 4rem);
}
.company-message__header{
  display: grid;
  row-gap: clamp(1rem, 1.5vw, 1.5rem);
  text-align: center;
}
.company-message__title-en{
  color: var(--company-brand-dark);
  font-size: var(--fs-xs);
  font-weight: 600;
  line-height: 1;
  letter-spacing: .2em;
}
.company-message__title-ja{
  font-size: var(--fs-5xl);
  font-weight: 500;
  line-height: 1.2;
  letter-spacing: -.02em;
}
.company-message__main{
  display: grid;
  row-gap: clamp(3rem, 4vw, 4rem);
}
.company-message__media{
  width: min(100%, clamp(20rem, 40vw, 40rem));
  margin-inline: auto;
}
.company-message__image{
  width: 100%;
  aspect-ratio: 4 / 5;
  object-fit: cover;
}
.company-message__content{
  display: grid;
  justify-self: center;
  row-gap: clamp(1.5rem, 2vw, 2rem);
  width: min(100%, 40rem);
}
.company-message__title{
  font-size: var(--fs-3xl);
  font-weight: 500;
  line-height: 1.6;
  letter-spacing: -.02em;
  text-align: center;
}
.company-message__body{
  display: grid;
  row-gap: clamp(1rem, 1.5vw, 1.5rem);
}
.company-message__lead{
  font-size: var(--fs-xl);
  font-weight: 500;
}
.company-message__text{
  display: grid;
  row-gap: clamp(1rem, 1.5vw, 1.5rem);
}
.company-message__signature{
  display: flex;
  align-items: baseline;
  justify-content: flex-end;
  column-gap: clamp(1rem, 1.5vw, 1.5rem);
}
.company-message__role{
  font-size: var(--fs-xs);
}
.company-message__name{
  font-size: var(--fs-xl);
  font-weight: 500;
}

/* ==================================================
 * company-message responsive 1025px
 * ================================================== */
@media (min-width: 1025px){
  .company-message__header{
    text-align: left;
  }
  .company-message__main{
    grid-template-columns: minmax(20rem, .72fr) minmax(0, 1.28fr);
    column-gap: clamp(3rem, 6vw, 6rem);
  }
  .company-message__content{
    justify-self: end;
  }
  .company-message__title{
    text-align: left;
  }
}


/* ==================================================
 * ==================================================
 * company-identity
 * ==================================================
 * ================================================== */
.company-identity__inner{
  display: grid;
  row-gap: clamp(2rem, 4vw, 4rem);
}
.company-identity__header{
  display: grid;
  row-gap: clamp(1rem, 1.5vw, 1.5rem);
  text-align: center;
}
.company-identity__title-en{
  font-size: var(--fs-xs);
  font-weight: 600;
  line-height: 1;
  letter-spacing: .2em;
}
.company-identity__title-ja{
  font-size: var(--fs-5xl);
  font-weight: 500;
  line-height: 1.2;
  letter-spacing: -.02em;
}
.company-identity__main{
  display: grid;
  row-gap: clamp(3rem, 4vw, 4rem);
}
.company-identity__media{
  width: min(100%, clamp(20rem, 40vw, 40rem));
  margin-inline: auto;
}
.company-identity__mark{
  background:
    radial-gradient(
      circle at 50% 50%,
      rgba(48,206,236,.10),
      transparent 62%
    ),
    rgba(255,255,255,.025);
  display: grid;
  place-items: center;
  width: 100%;
  aspect-ratio: 1;
  padding: clamp(3rem, 7vw, 7rem);
  border: 1px solid var(--company-rule-color-light);
  position: relative;
  isolation: isolate;
  overflow: hidden;
}
.company-identity__mark::before,
.company-identity__mark::after{
  content: "";
  border: 1px solid var(--company-rule-color-light);
  border-radius: 50%;
  position: absolute;
  inset: 12%;
  z-index: -1;
}
.company-identity__mark::after{
  inset: 26%;
}
.company-identity__mark > svg{
  display: block;
  width: 100%;
  height: auto;
}
.company-identity__content{
  display: grid;
  justify-self: center;
  row-gap: clamp(1.5rem, 2vw, 2rem);
  width: min(100%, 40rem);
}
.company-identity__title{
  font-size: var(--fs-3xl);
  font-weight: 500;
  line-height: 1.6;
  letter-spacing: -.02em;
  text-align: center;
}
.company-identity__body{
  display: grid;
  row-gap: clamp(1rem, 1.5vw, 1.5rem);
}
.company-identity__lead{
  font-size: var(--fs-xl);
  font-weight: 500;
}
.company-identity__text{
  display: grid;
  row-gap: clamp(1rem, 1.5vw, 1.5rem);
}

/* ==================================================
 * company-identity responsive 1025px
 * ================================================== */
@media (min-width: 1025px){
  .company-identity__header{
    text-align: left;
  }
  .company-identity__main{
    grid-template-columns: minmax(20rem, .72fr) minmax(0, 1.28fr);
    column-gap: clamp(3rem, 6vw, 6rem);
  }
  .company-identity__content{
    justify-self: end;
  }
  .company-identity__title{
    text-align: left;
  }
}
/* ==================================================
 * ==================================================
 * company-profile
 * ==================================================
 * ================================================== */
.company-profile{
  --company-profile-media-viewport-width: 100%;
  --company-profile-media-viewport-offset-x: 0px;
  --company-profile-media-scale: 1;
  --company-profile-media-translate-x: 0px;

  display: grid;
  gap: clamp(4rem, 8vw, 8rem);
}
.company-profile__visual{
  width: 100%;
  min-width: 0;
}
.company-profile__media{
  aspect-ratio: 4 / 3;
  width: 100%;
  min-width: 0;
  overflow: hidden;
}
.company-page.is-company-profile-media-ready .company-profile__media{
  width: var(--company-profile-media-viewport-width);
  margin-left: var(--company-profile-media-viewport-offset-x);
}
.company-profile__media-inner{
  width: 100%;
  height: 100%;
  transform-origin: left center;
  will-change: transform;
}
.company-page.is-company-profile-media-ready .company-profile__media-inner{
  transform: translate3d(var(--company-profile-media-translate-x), 0, 0) scale(var(--company-profile-media-scale));
}
.company-profile__image{
  width: 100%;
  height: auto;
  object-fit: cover;
}
.company-profile__frame{
  background: var(--color-bg-base);
  padding: clamp(1.5rem, 5vw, 5rem);
  box-shadow: 0 1rem 4rem rgba(0,0,0,.05);
}
.company-profile__caption{
  color: var(--company-muted-color);
  font-family: var(--font-en-sans);
  font-size: var(--fs-2xs);
  font-weight: 600;
  line-height: 1;
  letter-spacing: .16em;
  text-transform: uppercase;
  padding-bottom: clamp(2rem, 4vw, 4rem);
}
.company-profile__list{
  border-bottom: 1px solid var(--company-rule-color);
}
.company-profile__item{
  display: grid;
  gap: .75rem;
  padding-block: clamp(1.75rem, 3vw, 3rem);
  border-top: 1px solid var(--company-rule-color);
}
.company-profile__term{
  color: var(--company-muted-color);
  font-size: var(--fs-xs);
  font-weight: 500;
  line-height: 1.6;
}
.company-profile__description{
  font-size: var(--fs-md);
  line-height: 2;
}

/* ==================================================
 * company-profile responsive 768px
 * ================================================== */
@media (min-width: 768px){
  .company-profile__item{
    grid-template-columns: minmax(8rem, 26%) minmax(0, 1fr);
    gap: clamp(2rem, 6vw, 6rem);
  }
}

/* ==================================================
 * company-profile responsive 1025px
 * ================================================== */
@media (min-width: 1025px){
  .company-profile__frame{
    width: min(100%, 78rem);
    margin-left: auto;
  }
  .company-profile__term{
    font-size: var(--fs-sm);
  }
  .company-profile__description{
    font-size: var(--fs-lg);
  }
}

/* ==================================================
 * ==================================================
 * company-history
 * ==================================================
 * ================================================== */
.company-history{
  display: grid;
  gap: clamp(4rem, 8vw, 8rem);
  min-width: 0;
}
.company-history__intro{
  display: grid;
  align-content: start;
  gap: clamp(2rem, 4vw, 4rem);
  min-width: 0;
}
.company-history__intro-lead{
  color: var(--company-muted-color);
  font-size: var(--fs-md);
  line-height: 2;
  max-width: 34rem;
}
.company-history__range{
  color: rgba(0,0,0,.08);
  font-family: var(--font-en-sans);
  font-size: clamp(3rem, 7vw, 7rem);
  font-weight: 700;
  line-height: .85;
  letter-spacing: -.055em;
  white-space: nowrap;
}
.company-history__stage{
  min-width: 0;
  position: relative;
}
.company-history__viewport{
  min-width: 0;
  position: relative;
}
.company-history__timeline{
  display: grid;
  gap: clamp(5rem, 12vw, 9rem);
  min-width: 0;
  position: relative;
}
.company-history__item{
  display: grid;
  align-content: center;
  gap: clamp(2rem, 5vw, 4rem);
  min-width: 0;
  position: relative;
}
.company-history__time{
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: .5rem 1rem;
}
.company-history__year{
  font-family: var(--font-en-sans);
  font-size: clamp(2.5rem, 5vw, 5rem);
  font-weight: 500;
  font-variant-numeric: tabular-nums;
  line-height: .8;
  letter-spacing: -.04em;
}
.company-history__era{
  color: var(--company-muted-color);
  font-size: var(--fs-2xs);
  line-height: 1.4;
}
.company-history__content{
  display: grid;
  gap: 1.25rem;
  min-width: 0;
}
.company-history__lead{
  font-size: clamp(1.375rem, 2.4vw, 2.25rem);
  font-weight: 500;
  line-height: 1.6;
  letter-spacing: -.02em;
}
.company-history__text{
  color: var(--company-muted-color);
  width: min(100%, 42rem);
  font-size: var(--fs-md);
  line-height: 2.1;
}
.company-history__media{
  background: var(--color-bg-placeholder);
  width: 100%;
  aspect-ratio: 3 / 2;
  position: relative;
  overflow: hidden;
}
.company-history__image{
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.company-history__shade{
  display: none;
}

/* ==================================================
 * company-history enhanced
 * ================================================== */
.company-page.is-company-history-ready .company-history__stage{
  height: calc(100svh + var(--company-history-travel, 0px));
}
.company-page.is-company-history-ready .company-history__viewport{
  width: 100%;
  height: 100svh;
  position: sticky;
  top: 0;
  isolation: isolate;
  overflow: hidden;
}
.company-page.is-company-history-ready .company-history__timeline{
  gap: clamp(4rem, 8svh, 7rem);
  width: 100%;
  padding-block: max(28svh, 10rem) max(38svh, 14rem);
  position: absolute;
  top: 0;
  left: 0;
  transform: translate3d(0, var(--company-history-track-y, 0px), 0);
  will-change: transform;
  z-index: 1;
}
.company-page.is-company-history-ready .company-history__item{
  min-height: 72svh;
}
.company-page.is-company-history-ready .company-history__shade{
  display: block;
  width: 100%;
  height: min(30svh, 18rem);
  position: absolute;
  left: 0;
  pointer-events: none;
  z-index: 2;
}
.company-page.is-company-history-ready .company-history__shade--top{
  background: linear-gradient(
    to bottom,
    var(--color-bg-base) 0%,
    var(--color-bg-base) 12%,

    rgba(255,255,255,.82) 42%,
    rgba(255,255,255,0) 100%
  );
  top: 0;
}
.company-page.is-company-history-ready .company-history__shade--bottom{
  background: linear-gradient(
    to top,
    var(--color-bg-base) 0%,
    var(--color-bg-base) 12%,
    rgba(255,255,255,.82) 42%,
    rgba(255,255,255,0) 100%
  );
  bottom: 0;
}

/* ==================================================
 * company-history responsive 768px
 * ================================================== */
@media (min-width: 768px){
  .company-history__item{
    grid-template-columns: minmax(10rem, .34fr) minmax(0, .66fr);
  }
  .company-history__media{
    grid-column: 1 / -1;
  }
}

/* ==================================================
 * company-history responsive 1025px
 * ================================================== */
@media (min-width: 1025px){
  .company-history{
    grid-template-columns: minmax(20rem, .8fr) minmax(0, 1.2fr);
    align-items: start;
  }
  .company-history__intro{
    position: sticky;
    top: calc(var(--layout-header-height) + 2rem);
  }
  .company-history__timeline{
    gap: clamp(6rem, 10svh, 10rem);
  }
  .company-history__item{
    grid-template-columns: minmax(11rem, .32fr) minmax(0, .68fr);
    gap: clamp(2.5rem, 4vw, 4.5rem);
  }
  .company-history__media{
    grid-column: 1 / -1;
  }
  .company-page.is-company-history-ready .company-history__timeline{
    padding-block: max(30svh, 12rem) max(40svh, 16rem);
  }
  .company-page.is-company-history-ready .company-history__item{
    min-height: 78svh;
  }
}

/* ==================================================
 * company-history reduced motion
 * ================================================== */
@media (prefers-reduced-motion: reduce){
  .company-page.is-company-history-ready .company-history__stage{
    height: auto;
  }
  .company-page.is-company-history-ready .company-history__viewport{
    height: auto;
    position: relative;
    overflow: visible;
  }
  .company-page.is-company-history-ready .company-history__timeline{
    padding-block: 0;
    position: relative;
    transform: none;
    will-change: auto;
  }
  .company-page.is-company-history-ready .company-history__item{
    min-height: 0;
  }
  .company-page.is-company-history-ready .company-history__shade{
    display: none;
  }
}

/* ==================================================
 * ==================================================
 * company-access
 * ==================================================
 * ================================================== */
.company-access{
  --company-rule-color: var(--company-rule-color-light);
  --company-muted-color: var(--company-muted-color-light);
  display: grid;
  gap: clamp(4rem, 8vw, 8rem);
}
.company-access__layout{
  display: grid;
  gap: clamp(2rem, 5vw, 5rem);
}
.company-access__map{
  background: rgba(255,255,255,.06);
  min-height: clamp(22rem, 60vw, 42rem);
  position: relative;
  overflow: hidden;
}
.company-access__map::after{
  content: "";
  border: 1px solid var(--company-rule-color-light);
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.company-access__iframe{
  display: block;
  width: 100%;
  height: 100%;
  min-height: inherit;
  border: 0;
  filter: grayscale(1) contrast(.9) brightness(.82);
  transition: filter 600ms var(--company-ease);
}
.company-access__map:hover .company-access__iframe,
.company-access__map:focus-within .company-access__iframe{
  filter: grayscale(.15) contrast(.95) brightness(.92);
}
.company-access__content{
  display: grid;
  align-content: start;
  gap: clamp(2rem, 4vw, 4rem);
  padding-top: clamp(1rem, 2vw, 2rem);
}
.company-access__name{
  font-size: clamp(1.75rem, 3vw, 3rem);
  font-weight: 500;
  line-height: 1.4;

}
.company-access__address{
  color: var(--company-muted-color-light);
  display: grid;
  gap: 1.5rem;
  font-size: var(--fs-sm);
  line-height: 2;
}
.company-access__tel{
  color: var(--color-white);

}
.company-access__link{
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
  width: min(100%, 22rem);
  padding-block: 1rem;
  font-size: var(--fs-sm);
  font-weight: 500;
}
.company-access__link-icon{
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  width: 1.5rem;
  height: 1.5rem;
}
.company-access__link-icon > svg{
  width: 100%;
  height: 100%;
}

/* ==================================================
 * company-access responsive 1025px
 * ================================================== */
@media (min-width: 1025px){
  .company-access__layout{
    grid-template-columns: minmax(0, 1.4fr) minmax(20rem, .6fr);
    align-items: stretch;
  }
  .company-access__content{
    padding: clamp(2rem, 4vw, 4rem) 0 clamp(2rem, 4vw, 4rem) clamp(1rem, 2vw, 2rem);
  }
}

/* ==================================================
 * ==================================================
 * company-contact
 * ==================================================
 * ================================================== */
.company-contact{
  color: var(--color-white);
  background:
    radial-gradient(circle at 82% 20%, rgba(48,206,236,.13), transparent 30%),
    var(--color-bg-deep);
}
.company-contact__link{
  display: grid;
  gap: clamp(3rem, 6vw, 6rem);
  min-height: clamp(28rem, 58vw, 48rem);
  padding: clamp(4rem, 8vw, 8rem) var(--layout-inner-padding);
  border-top: 1px solid var(--company-rule-color-light);
  border-bottom: 1px solid var(--company-rule-color-light);
  position: relative;
  isolation: isolate;
  overflow: hidden;
}
.company-contact__link::before{
  content: "";
  background: var(--color-white);
  position: absolute;
  inset: 0;
  z-index: -1;
  transform: scaleY(0);
  transform-origin: bottom;
  transition: transform 650ms var(--company-ease);
}
.company-contact__link:hover,
.company-contact__link:focus-visible{
  color: var(--color-fg-base);
}
.company-contact__link:hover::before,
.company-contact__link:focus-visible::before{
  transform: scaleY(1);
}
.company-contact__meta{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
  align-self: start;
  padding-bottom: 1rem;
  border-bottom: 1px solid currentColor;
}
.company-contact__label{
  font-family: var(--font-en-sans);
  font-size: var(--fs-xs);
  font-weight: 600;
  line-height: 1;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.company-contact__text{
  font-size: var(--fs-2xs);
  line-height: 1.4;
  letter-spacing: .12em;
}
.company-contact__message{
  align-self: end;
  font-size: clamp(2.75rem, 8vw, 8rem);
  font-weight: 500;
  line-height: 1.15;
  letter-spacing: -.045em;
  text-wrap: balance;
}
.company-contact__icon{
  display: grid;
  place-items: center;
  width: clamp(4rem, 8vw, 8rem);
  height: clamp(4rem, 8vw, 8rem);
  border: 1px solid currentColor;
  border-radius: 50%;
  position: absolute;
  right: var(--layout-inner-padding);
  bottom: clamp(4rem, 8vw, 8rem);
  transform: rotate(0);
  transition: transform 500ms var(--company-ease);
}
.company-contact__link:hover .company-contact__icon,
.company-contact__link:focus-visible .company-contact__icon{
  transform: rotate(-45deg);
}
.company-contact__icon > svg{
  width: 42%;
  height: 42%;
}

/* ==================================================
 * company-contact responsive 768px
 * ================================================== */
@media (min-width: 768px){
  .company-contact__link{
    padding-left: max(
      var(--layout-inner-padding),
      calc((100vw - var(--layout-inner-width)) / 2 + var(--layout-inner-padding))
    );
    padding-right: max(
      var(--layout-inner-padding),
      calc((100vw - var(--layout-inner-width)) / 2 + var(--layout-inner-padding))
    );
  }
  .company-contact__message{
    width: min(75%, 70rem);
  }
  .company-contact__icon{
    right: max(
      var(--layout-inner-padding),
      calc((100vw - var(--layout-inner-width)) / 2 + var(--layout-inner-padding))
    );
  }
}

/* ==================================================
 * ==================================================
 * company-interlude
 * ==================================================
 * ================================================== */
.company-interlude__media{
  --company-interlude-media-scale-start: .88;
  --company-interlude-media-scale: var(--company-interlude-media-scale-start);
  width: 100%;
  overflow: hidden;
}
.company-interlude__media-inner{
  width: 100%;
  transform: scale(var(--company-interlude-media-scale));
  transform-origin: center;
  will-change: transform;
}
.company-interlude__image{
  width: 100%;
  height: auto;
}

/* ==================================================
 * company-interlude responsive 768px
 * ================================================== */
@media (min-width: 768px){
  .company-interlude__media{
    --company-interlude-media-scale-start: .68;
  }
}
/* ==================================================
 * company focus
 * ================================================== */
.company-access__link:focus-visible,
.company-contact__link:focus-visible{
  outline: 2px solid var(--company-accent-color);
  outline-offset: 4px;
}



/* ==================================================
 * company reduced motion
 * ================================================== */
@media (prefers-reduced-motion: reduce){
  .company-interlude__media-inner{
    transform: none;
    will-change: auto;
  }
  .company-access__iframe,
  .company-contact__link::before,
  .company-contact__icon{
    transition: none;
  }
}
