/* pages/company.css: 会社概要ページ専用（リード・VISION/MISSION/VALUE・代表メッセージ・会社データ）。
   下層の読み込み順で sub-common の後。sub-common の共通宣言を上書きする場合がある。 */
.lead-block {
  padding-top: 72px;
}

/* 会社概要ページは page-hero 直下の区切り線を置かないため、その分上の余白を詰める */
.lead-block.lead-block--flush {
  padding-top: 32px;
}

.lead-block__title {
  max-width: 1000px;
  margin-bottom: 34px;
  font: 700 clamp(28px, 3.55vw, 48px)/1.55 var(--display);
  letter-spacing: .045em;
}

.lead-block__copy {
  max-width: 1180px;
  margin-bottom: 0;
  font-size: 15px;
  line-height: 2.2;
}

.lead-block__copy + .lead-block__copy {
  margin-top: 12px;
}

.approach-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 50px;
}

.approach-card {
  min-height: 360px;
  padding: 38px 40px;
  background: #fff;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: left;
}

.approach-card__en {
  margin-bottom: 22px;
  font: 700 16px/1.4 var(--latin);
  letter-spacing: .08em;
  color: var(--c-cyan);
}

.approach-card__icon {
  width: 100px;
  height: 98px;
  object-fit: contain;
  margin-bottom: 20px;
}

.approach-card__title {
  width: 100%;
  margin-bottom: 18px;
  text-align: center;
  font: 700 24px/1.5 var(--display);
}

.approach-card__copy {
  margin-bottom: 0;
  font-size: 14px;
  line-height: 2;
}

.strength-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 49px;
}

.strength-card {
  min-height: 404px;
  padding: 38px 20px 28px;
  background: #fff;
  text-align: center;
}

.strength-card__icon {
  width: 120px;
  height: 100px;
  margin: 0 auto 30px;
  object-fit: contain;
}

.strength-card__title {
  margin-bottom: 22px;
  font: 700 24px/1.6 var(--display);
}

.strength-card__copy {
  margin-bottom: 0;
  text-align: left;
  font-size: 14px;
  line-height: 2;
}

.company-foundation {
  padding-bottom: 0;
}

.company-foundation__panel {
  padding: 60px;
  background: #fff;
}

.vision-title {
  margin-bottom: 24px;
  font: 700 clamp(38px, 5.2708vw, 72px)/1.16 var(--latin);
  letter-spacing: .02em;
}

.vision-copy {
  margin-bottom: 54px;
  font-size: 16px;
  line-height: 2;
}

/* カード上端に11.6pxはみ出す番号のぶん、グリッド上に padding-top を確保している
   （グレー地の高さ204px・列間51px・行間41.6px はデザイン実測値） */
.mission-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 41.6px 51px;
  padding-top: 11.6px;
}

.mission-card {
  position: relative;
  min-height: 204px;
  padding: 20px 30.7px 22px;
  background: #f7f7f7;
}

/* 番号はカード内に収めず、グレー地の上端をまたぐ位置に置く */
.mission-card__num {
  position: absolute;
  left: 32.59px;
  top: -11.6px;
  margin: 0;
  font: 700 36px/25px var(--latin);
  letter-spacing: 0;
  color: var(--c-cyan);
}

.mission-card__title {
  margin-bottom: 12px;
  font: 700 clamp(16px, 1.9vw, 24px)/1.5 var(--display);
}

.mission-card__copy {
  margin-bottom: 0;
  font-size: 16px;
  line-height: 1.5;
}

.foundation-rule {
  margin: 44px 0;
  border-top: 1px dashed #041a44;
}

.value-block {
  margin-top: 58px;
  padding-top: 42px;
  border-top: 1px dashed #041a44;
}

.value-block__title {
  margin-bottom: 26px;
  font: 700 clamp(22px, 2.6354vw, 36px)/1.6 var(--display);
  letter-spacing: .035em;
}

.value-block__copy {
  margin-bottom: 0;
  font-size: 16px;
  line-height: 2.05;
}

/* 写真374.4 + 余白100.6 + テキスト771 = 1246px（デザイン実測値） */
.message-layout {
  display: grid;
  grid-template-columns: 374.4px 1fr;
  gap: 100.6px;
  align-items: start;
}

/* 画像を枠の138.2%に拡大し左上にずらして、デザインデータのマスクと同じ範囲を見せる。
   右カラムを読む間、写真は sticky で追従する */
.message-photo {
  position: sticky;
  top: 40px;
  align-self: start;
  width: 100%;
  aspect-ratio: 374.4 / 509.4;
  overflow: hidden;
}

.message-photo img {
  position: absolute;
  left: -17.1902%;
  top: -14.4315%;
  width: 138.2051%;
  max-width: none;
  height: auto;
}

.message-copy p {
  margin-bottom: 18px;
  font-size: 14px;
  line-height: 2.05;
}

.message-sign {
  margin: 24px 0 42px;
  text-align: right;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.8;
}

.message-sign strong {
  display: block;
  font: 700 24px/1.6 var(--display);
}

.profile-title {
  margin-bottom: 20px;
  font: 700 28px/1.5 var(--display);
  color: var(--c-cyan);
}

.data-list {
  margin-bottom: 0;
  border-bottom: 1px dashed #041a44;
  display: grid;
  grid-template-columns: 190px 1fr;
}

.data-list > dt,
.data-list > dd {
  margin: 0;
  padding: 18px 0;
  border-top: 1px dashed #041a44;
  font-size: 14px;
  line-height: 1.85;
}

.data-list > dt {
  padding-right: 24px;
  font-weight: 700;
}

/* 先頭行の上には罫線を引かない（罫線は各行の下側のみ） */
.data-list > dt:first-of-type,
.data-list > dd:first-of-type {
  padding-top: 0;
  border-top: 0;
}

.outline-table {
  margin-bottom: 0;
}

.outline-table > dt,
.outline-table > dd {
  padding-block: 22px;
  font-size: 14px;
}

.partner-groups {
  display: grid;
  gap: 30px;
}

.partner-group {
  padding: 34px 40px;
  background: #fff;
}

.partner-group__title {
  margin-bottom: 22px;
  font: 700 20px/1.5 var(--display);
  color: var(--c-cyan);
}

.partner-list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px 48px;
  font-size: 14px;
}

@media (min-width: 768px) {
  /* PCの本文は16pxを基準にそろえる */
  .lead-block__copy,
  .approach-card__copy,
  .strength-card__copy,
  .vision-copy,
  .mission-card__copy,
  .value-block__copy,
  .message-copy p,
  .data-list > dt,
  .data-list > dd,
  .outline-table > dt,
  .outline-table > dd,
  .partner-list {
    font-size: 16px;
  }
}

@media (max-width: 1000px) {
  .approach-grid,
  .strength-grid {
    gap: 20px;
  }

  .message-layout {
    grid-template-columns: 32% 1fr;
    gap: 40px;
  }
}

@media (max-width: 767px) {
  .lead-block {
    padding-top: 42px;
  }

  .lead-block.lead-block--flush {
    padding-top: 20px;
  }

  .lead-block__title {
    font-size: 27px;
    line-height: 1.6;
  }

  .lead-block__copy {
    font-size: 14px;
    line-height: 2;
  }

  .approach-grid,
  .strength-grid,
  .mission-grid {
    grid-template-columns: 1fr;
    gap: 18px;
  }

  .approach-card {
    min-height: auto;
    padding: 32px 28px;
  }

  .partner-list {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .strength-card {
    min-height: auto;
    padding: 30px 24px;
  }

  .company-foundation__panel {
    padding: 32px 24px;
  }

  .vision-title {
    font-size: 38px;
  }

  .mission-grid {
    gap: 22px;
  }

  .message-layout {
    grid-template-columns: 1fr;
    gap: 32px;
  }

  /* SPは追従（sticky）を解除する。static にすると中の absolute の img の基準が祖先に飛んで写真が消えるため relative にし、
     PCの top:40px が残って本文に重ならないよう top も 0 に戻す */
  .message-photo {
    position: relative;
    top: 0;
    width: min(78%, 340px);
    margin-inline: auto;
  }

  .data-list {
    grid-template-columns: 1fr;
  }

  .data-list > dt {
    padding: 15px 0 2px;
  }

  .data-list > dd {
    padding: 0 0 15px;
    border-top: 0;
  }

  .partner-group {
    padding: 26px 20px;
  }
}