/* --------------------------------------------------------------------------
   ■ sec-company-message
   -------------------------------------------------------------------------- */
.sec-company-message {
  padding-block: var(--space-section-top-sm) 0;
  padding-inline: var(--content-padding-md);
}

.sec-company-message__inner {
  border-radius: 16px;
  padding: var(--content-padding-md) 200px 100px;
  background: url(../../images/bg_wave_white.webp) no-repeat right top / 56vw
    auto;
  background-color: var(--color-bg-base);
}
.sec-company-message__content {
  display: flex;
  flex-direction: column;
  gap: var(--space-56);
  max-width: var(--content-width-md);
  margin-inline: auto;
}

.message__body {
  display: flex;
  flex-direction: column;
  gap: var(--space-24);
}

.message__profile {
  display: flex;
  gap: var(--space-32);
  align-items: flex-start;
}

.message__photo {
  flex-shrink: 0;
  width: 230px;
  height: 230px;
  border-radius: 8px;
  overflow: hidden;
  background-color: var(--color-border-primary);
}

.message__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.message__text {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-12);
}

.message__name {
  display: flex;
  align-items: center;
  gap: var(--space-24);
  flex-wrap: wrap;
}

.message__role {
  font-size: var(--font-size-pc-md);
  font-weight: 700;
  line-height: 1.8;
  letter-spacing: var(--letter-spacing-pc-md);
  color: var(--color-text-high);
  white-space: nowrap;
}

.message__name-inner {
  display: flex;
  align-items: center;
  gap: var(--space-8);
}

.message__name-ja {
  font-size: 20px;
  font-weight: 700;
  line-height: 1.8;
  letter-spacing: 0.8px;
  color: var(--color-text-high);
  white-space: nowrap;
}

.message__name-en {
  font-size: var(--font-size-pc-sm);
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: var(--letter-spacing-pc-sm);
  color: var(--color-text-accent);
  white-space: nowrap;
}

@media (max-width: 768px) {
  .sec-company-message {
    padding-block: var(--space-section-top-sp-sm) 0;
    padding-inline: 0;
  }

  .sec-company-message__inner {
    border-radius: var(--radius-sp);
    padding: var(--space-36) var(--space-24);
    background-position: left top 16vw;
    background-size: 116vw;
  }
  .sec-company-message__content {
    gap: var(--space-32);
  }

  .message__profile {
    flex-direction: column;
    gap: var(--space-20);
  }

  .message__photo {
    width: 70%;
    height: 260px;
  }

  .message__name {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-4);
  }

  .message__body .body-lg {
    font-size: 18px;
    letter-spacing: 0.72px;
  }

  .message__text .body-md {
    font-size: var(--font-size-sp-md);
    letter-spacing: var(--letter-spacing-sp-md);
  }
}

/* --------------------------------------------------------------------------
   ■ sec-company-info
   -------------------------------------------------------------------------- */
.sec-company-info {
  background-color: var(--color-bg-light);
  padding-block: var(--space-section-top-sm) var(--space-section-bottom);
  padding-inline: var(--content-padding-x);
}

.sec-company-info__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-32);
  max-width: var(--content-width-md);
  margin-inline: auto;
}

.company-table {
  width: 100%;
  max-width: 624px;
}

.company-table__link {
  color: var(--color-text-high);
  text-decoration: underline;
  transition: color 0.2s ease;
}

.company-table__link:hover {
  color: var(--color-brand-primary);
}

.company-map {
  position: relative;
  width: 100%;
  max-width: 628px;
  height: 317px;
  overflow: hidden;
  border: 1px solid var(--color-border-primary);
}

.company-map iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

@media (max-width: 768px) {
  .sec-company-info {
    padding-block: var(--space-section-top-sp-sm) var(--space-section-bottom-sp);
    padding-inline: var(--content-padding-x-sp);
  }

  .company-table {
    max-width: 100%;
  }

  .company-map {
    max-width: 100%;
    aspect-ratio: 327 / 324;
    height: auto;
  }
}