/* ==========================================================================
   キャリアパス(careerpath) — /careerpath/index.php 専用
   ========================================================================== */

.page-careerpath main {
  max-width: none;
  margin: 0;
  padding: 0;
}

/* --- ヒーロー --- */
.careerpath-hero {
  position: relative;
  width: 100%;
  aspect-ratio: 2562 / 940;
  overflow: hidden;
}

.careerpath-hero img {
  display: block;
  width: 100%;
  height: auto;
}

.careerpath-hero__inner {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: min(var(--width-content), 100% - 40px);
}

.careerpath-hero__inner > * {
  position: absolute;
  left: 0;
  width: 100%;
  margin: 0;
  color: var(--color-bg);
}

.careerpath-hero__en {
  top: 20.7%;
  font-family: var(--font-base); /* Noto Sans JP Regular */
  font-size: 1.5625rem; /* 25px */
  font-weight: var(--font-weight-normal);
}

.careerpath-hero__title {
  top: 28.3%;
  font-family: var(--font-base); /* Noto Sans JP Medium */
  font-size: 3.75rem; /* 60px */
  font-weight: var(--font-weight-medium);
}

.careerpath-hero__lead {
  top: 54.0%;
  font-family: var(--font-round); /* Zen Maru Gothic Bold */
  font-size: 1.4375rem; /* 23px */
  font-weight: var(--font-weight-bold);
  line-height: 2.05; /* 行送り45px相当 */
  letter-spacing: 0.05em;
}

/* --- Coming soon エリア --- */
.careerpath-comingsoon {
  height: 704px;
  box-sizing: border-box;
  padding-top: 286.5px;
  text-align: center;
  background: var(--color-bg);
}

.careerpath-comingsoon__text {
  margin: 0;
  color: var(--color-primary);
  font-size: 3.875rem; /* 62px */
  font-weight: var(--font-weight-medium);
  letter-spacing: 0.1em;
}

/* ==========================================================================
   SP(max-width: 768px)
   ========================================================================== */
@media (max-width: 768px) {
  .careerpath-hero {
    aspect-ratio: 751 / 956;
  }

  /* SPは全要素センタリング(PCは左寄せ) */
  .careerpath-hero__inner {
    left: 0;
    transform: none;
    width: 100%;
    box-sizing: border-box;
    padding-inline: 20px;
    text-align: center;
  }

  .careerpath-hero__en {
    top: 22.8%;
    font-size: 0.9375rem; /* 15px */
  }

  .careerpath-hero__title {
    top: 26.8%;
    font-size: 1.4375rem; /* 23px */
  }

  .careerpath-hero__lead {
    top: 36.3%;
    font-size: 1rem; /* 16px */
    line-height: 1.75; /* 行送り28px相当 */
  }

  .careerpath-comingsoon {
    height: 286px;
    padding-top: 127px;
  }

  .careerpath-comingsoon__text {
    font-size: 1.5rem; /* 24px */
  }
}