/* front-page
================================================ */

/* Front Page Opening Video Overlay
================================================ */
.front-video-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: auto;
  background-color: #000;
  z-index: 999999;
  opacity: 1;
  visibility: visible;
  transition:
    opacity 1s ease,
    visibility 1s ease;
}

.front-video-overlay.is-hidden {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.front-video-overlay__video {
  width: 100%;
  height: 100vh;
  object-fit: cover;
}

.header__inner {
  position: relative;
  background-color: #fff;
  z-index: 11 !important;
}

.footer__inner {
  position: relative;
  z-index: 11 !important;
}

.front-page {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  margin: 0;
  padding: 0;
  z-index: 10;
  position: relative;
  overflow-x: clip;
  background: linear-gradient(
    90deg,
    var(--color-hd-contrast-lightest) 0%,
    var(--color-hd-contrast-lighter) 18%,
    var(--color-hd-contrast-light) 37%,
    var(--color-hd-contrast-dark) 56%,
    var(--color-hd-contrast-darker) 76%,
    var(--color-hd-contrast-darkest) 100%
  );
}

.front-bg {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 1;
  z-index: 10;
  display: block;
  background-image: url("../../images/front/background.png");
  background-repeat: no-repeat;
  background-position: center;
}

/* Hero group (sticky hero + background image)
================================================ */
.front-hero-group {
  display: flex;
  flex-direction: column;
  gap: min(calc(150 / 1366 * 100vw), 150px);
  align-items: flex-start;
  position: relative;
  z-index: 11;
  width: 100%;
}

/* Section: Hero (sticky)
================================================ */
.front-hero {
  position: sticky;
  top: 0;
  z-index: 10;
  width: 100%;
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #e4e7f1;
}

.front-hero__inner {
  text-align: center;
}

.front-hero__title {
  font-size: min(calc(50 / 1366 * 100vw), 50px);
  color: var(--color-text);
  line-height: 1.4;
  font-weight: 700;
}

/* Section: Background image
================================================ */
.front-hero-image {
  position: relative;
  width: 100%;
  height: 100vh;
  z-index: 11;
}

.front-hero-image__bg {
  width: 100%;
  height: 100%;
  background-color: #e4e7f1;
  background-image: url("../../images/front/front_hero_bg.svg");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

/* Section: Intro
================================================ */
.front-intro {
  position: relative;
  width: 100%;
  height: 100vh;
}

.front-intro__bg {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-color: #e4e7f1;
  background-image: url("../../images/front/front_hero_bg.svg");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.front-intro__inner {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
  padding: min(calc(150 / 1366 * 100vw), 150px) 0 min(calc(25 / 1366 * 100vw), 25px);
}

.front-intro__badges {
  display: flex;
  flex-direction: column;
  gap: min(calc(15 / 1366 * 100vw), 15px);
  align-items: flex-start;
}

.front-intro__label {
  padding-left: min(calc(100 / 1366 * 100vw), 100px);
  font-size: min(calc(14 / 1366 * 100vw), 14px);
  color: #000;
  line-height: 1.4;
  font-weight: 600;
}

.front-intro__badge {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: min(calc(30 / 1366 * 100vw), 30px) min(calc(50 / 1366 * 100vw), 50px) min(calc(30 / 1366 * 100vw), 30px)
    min(calc(100 / 1366 * 100vw), 100px);
  border-radius: 0 10px 10px 0;
}

.front-intro__badge-text {
  font-size: min(calc(35 / 1366 * 100vw), 35px);
  color: #fff;
  font-weight: 700;
  line-height: 1.4;
}

.front-intro__nav {
  display: flex;
  gap: min(calc(10 / 1366 * 100vw), 10px);
  padding: 0 min(calc(100 / 1366 * 100vw), 100px);
  width: 100%;
}

.front-intro__nav-btn {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: min(calc(30 / 1366 * 100vw), 30px);
  border-radius: 10px;
  text-decoration: none;
}

.front-intro__nav-btn span {
  font-size: min(calc(24 / 1366 * 100vw), 24px);
  color: #fff;
  font-weight: 700;
  text-align: center;
  line-height: 1.4;
}

/* Section: About Us
================================================ */
.front-about {
  position: relative;
  z-index: 1;
  width: 100%;
  background-color: #e4e7f1;
  border-radius: 0 0 10px 10px;
  padding: min(calc(100 / 1366 * 100vw), 100px);
}

.front-about__inner {
  display: flex;
  flex-direction: column;
  gap: min(calc(50 / 1366 * 100vw), 50px);
}

.front-about__header {
  display: flex;
  align-items: flex-end;
  gap: min(calc(10 / 1366 * 100vw), 10px);
}

.front-about__title-group {
  display: flex;
  gap: min(calc(20 / 1366 * 100vw), 20px);
  align-items: flex-end;
}

.front-about__title-icon {
  width: min(calc(60 / 1366 * 100vw), 60px);
  height: min(calc(30 / 1366 * 100vw), 30px);
  flex-shrink: 0;
}

.front-about__title-icon img {
  width: 100%;
  height: 100%;
  display: block;
}

.front-about__title-en {
  font-family: var(--font-family-en);
  font-size: min(calc(40 / 1366 * 100vw), 40px);
  color: var(--color-text);
  line-height: 0.76;
  font-weight: 700;
  margin: 0;
}

.front-about__title-ja {
  font-size: min(calc(18 / 1366 * 100vw), 18px);
  color: var(--color-text);
  line-height: 1;
  font-weight: 600;
  margin: 0;
}

.front-about__body {
  width: min(calc(602 / 1366 * 100vw), 602px);
  font-size: min(calc(14 / 1366 * 100vw), 14px);
  font-weight: 600;
  color: #000;
  line-height: 2;
}

.front-about__cta {
  display: inline-flex;
  align-items: center;
  gap: min(calc(20 / 1366 * 100vw), 20px);
  padding: min(calc(20 / 1366 * 100vw), 20px) min(calc(30 / 1366 * 100vw), 30px);
  border-radius: 500px;
  text-decoration: none;
  width: fit-content;
}

.front-about__cta > span {
  font-size: min(calc(18 / 1366 * 100vw), 18px);
  color: #fff;
  font-weight: 700;
  line-height: 1;
}

.front-about__cta-icon {
  position: relative;
  width: min(calc(15 / 1366 * 100vw), 15px);
  height: min(calc(15 / 1366 * 100vw), 15px);
  background: #fff;
  border-radius: 50%;
  overflow: hidden;
  flex-shrink: 0;
  transition: transform 0.3s ease;
}

.front-about__cta:hover .front-about__cta-icon {
  transform: scale(1.3);
}

.front-about__cta-arrow {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  transition: transform 0.3s ease;
}

.front-about__cta-arrow:nth-child(2) {
  transform: translateX(-100%);
}

.front-about__cta:hover .front-about__cta-arrow:first-child {
  transform: translateX(100%);
}

.front-about__cta:hover .front-about__cta-arrow:nth-child(2) {
  transform: translateX(0);
}

/* Section: Holdings Organization
================================================ */
.front-org {
  position: relative;
  z-index: 2;
  width: 100%;
}

.front-org__inner {
  display: flex;
  flex-direction: column;
  gap: min(calc(50 / 1366 * 100vw), 50px);
  padding: min(calc(100 / 1366 * 100vw), 100px) 0;
  width: min(calc(966 / 1366 * 100vw), 966px);
  margin: 0 auto;
}

.front-org__header {
  display: flex;
  align-items: flex-end;
  gap: min(calc(10 / 1366 * 100vw), 10px);
}

.front-org__title-icon {
  width: min(calc(60 / 1366 * 100vw), 60px);
  height: min(calc(30 / 1366 * 100vw), 30px);
  flex-shrink: 0;
}

.front-org__title-icon img {
  width: 100%;
  height: 100%;
  display: block;
  filter: brightness(0) invert(1);
}

.front-org__title-group {
  display: flex;
  gap: min(calc(20 / 1366 * 100vw), 20px);
  align-items: flex-end;
}

.front-org__title-en {
  font-family: var(--font-family-en);
  font-size: min(calc(40 / 1366 * 100vw), 40px);
  color: #fff;
  line-height: 0.76;
  font-weight: 700;
  margin: 0;
}

.front-org__title-ja {
  font-size: min(calc(18 / 1366 * 100vw), 18px);
  color: #fff;
  line-height: 1;
  font-weight: 600;
  margin: 0;
}

/* Section: KV Chevron
================================================ */
.front-kv-chevron {
  position: relative;
  width: 100vw;
  height: min(calc(850 / 1366 * 100vw), 850px);
  display: flex;
  align-items: center;
  justify-content: center;
}

.kv-image-clip-top-left {
  position: absolute;
  width: min(calc(500 / 1366 * 100vw), 500px);
  height: min(calc(500 / 1366 * 100vw), 500px);
  top: 0;
  left: calc(50% - min(calc(800 / 1366 * 100vw), 800px));
}

.kv-image-chevron--top-left {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background-size: cover;
  background-position: 100% 35%;
  overflow: hidden;
  background-image: url("../../images/front/service_photo1.jpg");
  clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 100%, 49% 50%, 0 0);
}

.kv-layer-chevron--top-left {
  position: absolute;
  width: 100%;
  height: 100%;
  top: min(calc(15 / 1366 * 100vw), 15px);
  right: min(calc(30 / 1366 * 100vw), 30px);
}

.kv-image-clip-top-right {
  position: absolute;
  width: min(calc(500 / 1366 * 100vw), 500px);
  height: min(calc(500 / 1366 * 100vw), 500px);
  top: max(calc(-200 / 1366 * 100vw), -200px);
  right: calc(50% - min(calc(500 / 1366 * 100vw), 500px));
}

.kv-image-chevron--top-right {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  right: 0;
  background-size: cover;
  background-position: 0% 165%;
  background-repeat: no-repeat;
  overflow: hidden;
  background-image: url("../../images/front/service_photo3.jpg");
  clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 100%, 49% 50%, 0 0);
}

.kv-layer-chevron--top-right {
  position: absolute;
  width: 100%;
  height: 100%;
  top: min(calc(15 / 1366 * 100vw), 15px);
  right: min(calc(30 / 1366 * 100vw), 30px);
}

.kv-image-clip-bottom-right {
  position: absolute;
  width: min(calc(500 / 1366 * 100vw), 500px);
  height: min(calc(500 / 1366 * 100vw), 500px);
  bottom: max(calc(-180 / 1366 * 100vw), -180px);
  right: calc(50% - min(calc(800 / 1366 * 100vw), 800px));
}

.kv-image-chevron--bottom-right {
  position: absolute;
  width: 100%;
  height: 100%;
  bottom: 0;
  left: 0;
  background-size: contain;
  background-position: 0% 0%;
  background-repeat: no-repeat;
  overflow: hidden;
  background-image: url("../../images/front/service_photo4.jpg");
  clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 100%, 49% 50%, 0 0);
}

.kv-layer-chevron--bottom-right {
  position: absolute;
  width: 100%;
  height: 100%;
  top: min(calc(15 / 1366 * 100vw), 15px);
  right: min(calc(30 / 1366 * 100vw), 30px);
}

.kv-image-clip-bottom-left {
  position: absolute;
  bottom: min(calc(-50 / 1366 * 100vw), -50px);
  width: min(calc(500 / 1366 * 100vw), 500px);
  height: min(calc(500 / 1366 * 100vw), 500px);
  left: calc(50% - min(calc(250 / 1366 * 100vw), 250px));
}

.kv-image-chevron--bottom-left {
  position: absolute;
  width: 100%;
  height: 100%;
  bottom: 0;
  right: 0;
  background-size: 200%;
  background-position: 55% 55%;
  overflow: hidden;
  background-image: url("../../images/front/service_photo2.jpg");
  clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 100%, 49% 50%, 0 0);
}

.kv-layer-chevron--bottom-left {
  position: absolute;
  width: 100%;
  height: 100%;
  top: min(calc(15 / 1366 * 100vw), 15px);
  right: min(calc(30 / 1366 * 100vw), 30px);
}

.kv-text-group {
  position: absolute;
  left: 0;
  width: 419px;
  z-index: 12;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
}

.kv-text-content {
  position: relative;
  background-color: white;
  color: var(--color-text);
  font-size: min(calc(33 / 1366 * 100vw), 33px);
  padding: 20px 30px 20px 60px;
  margin-bottom: 10px;
  display: inline-block;
  white-space: nowrap;
  z-index: 11;
}

/* Section: Track Record
================================================ */
.front-track-wrap {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  overflow: clip;
  padding: min(calc(40 / 1366 * 100vw), 50px);
  position: relative;
  width: 100%;
  z-index: 2;
}

.front-track {
  background-color: #fff;
  border-radius: 10px;
  padding: min(calc(50 / 1366 * 100vw), 50px);
  overflow: clip;
  width: min(calc(1266 / 1366 * 100vw), 1266px);
  margin: 0 auto;
}

.front-track__header {
  display: flex;
  align-items: flex-end;
  gap: min(calc(10 / 1366 * 100vw), 10px);
  margin-bottom: min(calc(50 / 1366 * 100vw), 50px);
}

.front-track__title-icon {
  width: min(calc(60 / 1366 * 100vw), 60px);
  height: min(calc(30 / 1366 * 100vw), 30px);
  flex-shrink: 0;
}

.front-track__title-icon img {
  width: 100%;
  height: 100%;
  display: block;
}

.front-track__title-group {
  display: flex;
  gap: min(calc(20 / 1366 * 100vw), 20px);
  align-items: flex-end;
}

.front-track__title-en {
  font-family: var(--font-family-en);
  font-size: min(calc(40 / 1366 * 100vw), 40px);
  color: var(--color-text);
  font-weight: 700;
  margin: 0;
  line-height: 0.76;
}

.front-track__title-ja {
  font-size: min(calc(18 / 1366 * 100vw), 18px);
  color: var(--color-text);
  font-weight: 600;
  margin: 0;
  line-height: 1;
}

.front-track__cards {
  display: flex;
  gap: min(calc(20 / 1366 * 100vw), 20px);
}

.front-track__card {
  flex: 1;
  background-color: #e4e7f1;
  border-radius: 10px;
  overflow: hidden;
}

.front-track__card-label {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: min(calc(20 / 1366 * 100vw), 20px);
  border-bottom: 3px solid var(--color-hd-contrast-lightest);
}

.front-track__card-label p {
  font-size: min(calc(18 / 1366 * 100vw), 18px);
  font-weight: 700;
  text-align: center;
  background: linear-gradient(
    90deg,
    var(--color-hd-contrast-lightest) 0%,
    var(--color-hd-contrast-lighter) 18%,
    var(--color-hd-contrast-light) 37%,
    var(--color-hd-contrast-dark) 56%,
    var(--color-hd-contrast-darker) 76%,
    var(--color-hd-contrast-darkest) 100%
  );
  background-clip: text;
  color: transparent;
}

.front-track__card-body {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: min(calc(40 / 1366 * 100vw), 40px) min(calc(50 / 1366 * 100vw), 50px);
}

.front-track__card-illust {
  position: relative;
  width: min(calc(100 / 1366 * 100vw), 100px);
  height: min(calc(100 / 1366 * 100vw), 100px);
  border-radius: 50%;
  background-color: #dde1ef;
  margin-bottom: min(calc(20 / 1366 * 100vw), 20px);
  overflow: visible;
}

.front-track__card-illust img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  height: 120%;
  width: auto;
}

.front-track__card-number {
  display: flex;
  align-items: baseline;
  justify-content: center;
}

.front-track__card-num {
  font-family: var(--font-family-en);
  font-size: min(calc(75 / 1366 * 100vw), 75px);
  color: var(--color-text);
  font-weight: 700;
  line-height: 1;
}

.front-track__card-unit {
  font-size: min(calc(33 / 1366 * 100vw), 33px);
  color: var(--color-text);
  font-weight: 700;
  margin-left: min(calc(5 / 1366 * 100vw), 5px);
}

.front-track__card-note {
  font-size: min(calc(14 / 1366 * 100vw), 14px);
  color: var(--color-text);
  margin-top: min(calc(10 / 1366 * 100vw), 10px);
}

/* Section: Company
================================================ */
.front-company-wrap {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  overflow: clip;
  position: relative;
  width: 100%;
  padding: min(calc(50 / 1366 * 100vw), 50px);
}

.front-section-company {
  background-color: var(--color-contrast-white);
  border-radius: 10px;
  width: min(calc(1266 / 1366 * 100vw), 1266px);
  margin: 0 auto;
}

.front-company-main {
  display: flex;
  flex-direction: column;
  gap: min(calc(50 / 1366 * 100vw), 50px);
  padding: min(calc(50 / 1366 * 100vw), 50px);
}

.front-comp__header {
  display: flex;
  align-items: flex-end;
  gap: min(calc(10 / 1366 * 100vw), 10px);
}

.front-comp__title-icon {
  width: min(calc(60 / 1366 * 100vw), 60px);
  height: min(calc(30 / 1366 * 100vw), 30px);
  flex-shrink: 0;
}

.front-comp__title-icon img {
  width: 100%;
  height: 100%;
  display: block;
}

.front-comp__title-group {
  display: flex;
  gap: min(calc(20 / 1366 * 100vw), 20px);
  align-items: flex-end;
}

.front-comp__title-en {
  font-family: var(--font-family-en);
  font-size: min(calc(40 / 1366 * 100vw), 40px);
  color: var(--color-text);
  font-weight: 700;
  margin: 0;
  line-height: 0.76;
}

.front-comp__title-ja {
  font-size: min(calc(18 / 1366 * 100vw), 18px);
  color: var(--color-text);
  font-weight: 600;
  margin: 0;
  line-height: 1;
}

.front-comp-link__area {
  display: flex;
  justify-content: center;
}

.front-comp-link__item-list {
  display: flex;
  width: 100%;
  list-style: none;
  justify-content: flex-start;
  gap: min(calc(15 / 1366 * 100vw), 15px);
}

.front-comp-link__item {
  display: flex;
  flex: 1;
  min-width: 0;
  background-color: var(--color-front-sub-contrast);
  border-radius: 20px;
}

.front-comp-link__item-link {
  color: var(--color-text);
  font-size: min(calc(24 / 1366 * 100vw), 24px);
  font-weight: 700;
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  text-decoration: none;
  padding: min(calc(30 / 1366 * 100vw), 30px) min(calc(20 / 1366 * 100vw), 20px);
}

.front-comp-link__item-link span {
  white-space: nowrap;
  line-height: min(calc(50 / 1366 * 100vw), 50px);
}

.front-comp-link__item-link img {
  width: min(calc(17 / 1366 * 100vw), 17px);
  height: auto;
  flex-shrink: 0;
}

/* Section: Topics
================================================ */
.front-topics-wrap {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  overflow: clip;
  position: relative;
  width: 100%;
  padding: min(calc(50 / 1366 * 100vw), 50px);
}

.front-section-topics {
  background-color: var(--color-contrast-white);
  border-radius: 10px;
  overflow: clip;
  width: 100%;
  width: min(calc(1266 / 1366 * 100vw), 1266px);
  margin: 0 auto;
}

.front-topics-main {
  display: flex;
  flex-direction: column;
  gap: min(calc(50 / 1366 * 100vw), 50px);
  padding: min(calc(50 / 1366 * 100vw), 50px);
}

.front-topics__header {
  display: flex;
  align-items: flex-end;
  gap: min(calc(10 / 1366 * 100vw), 10px);
}

.front-topics__title-icon {
  width: min(calc(60 / 1366 * 100vw), 60px);
  height: min(calc(30 / 1366 * 100vw), 30px);
  flex-shrink: 0;
}

.front-topics__title-icon img {
  width: 100%;
  height: 100%;
  display: block;
}

.front-topics__title-group {
  display: flex;
  gap: min(calc(20 / 1366 * 100vw), 20px);
  align-items: flex-end;
}

.front-topics__title-en {
  font-family: var(--font-family-en);
  font-size: min(calc(40 / 1366 * 100vw), 40px);
  color: var(--color-text);
  font-weight: 700;
  margin: 0;
  line-height: 0.76;
}

.front-topics__title-ja {
  font-size: min(calc(18 / 1366 * 100vw), 18px);
  color: var(--color-text);
  font-weight: 600;
  margin: 0;
  line-height: 1;
}

.front-section__action {
  justify-content: flex-start;
  min-width: 0;
  display: flex;
  align-items: center;
  position: relative;
  z-index: 4;
}

.front-topics-main .front-section__action {
  justify-content: center;
}

.front-section__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: min(calc(15 / 1366 * 100vw), 15px);
  background-image: url("../../images/front/button-background.png");
  background-size: 100% 100%;
  background-repeat: no-repeat;
  color: #fff;
  font-weight: bold;
  font-size: 18px;
  white-space: nowrap;
  width: 298px;
  height: 54px;
  padding-left: min(calc(40 / 1366 * 100vw), 40px);
  text-decoration: none;
}

.front-section__button img {
  width: min(calc(13 / 1366 * 100vw), 13px);
  height: auto;
  filter: brightness(0) invert(1);
  flex-shrink: 0;
}

.front-topics-link__area {
  display: flex;
  justify-content: center;
  overflow: hidden;
}

.front-topics-link__item-list {
  display: flex;
  width: 100%;
  list-style: none;
  justify-content: flex-start;
  column-gap: min(calc(15 / 1366 * 100vw), 15px);
}

.front-topics-link__item {
  display: flex;
  flex-grow: 1;
  flex-shrink: 0;
  width: calc((100% - (min(calc(15 / 1366 * 100vw), 15px) * 2)) / 3);
  aspect-ratio: 378.667 / 469;
  background-color: var(--color-front-sub-contrast);
  border-radius: min(calc(20 / 1366 * 100vw), 20px);
  flex-direction: column;
  padding: min(calc(20 / 1366 * 100vw), 20px);
}

.topic-thumbnail-ratio {
  aspect-ratio: 338.67 / 285;
  width: 100%;
  overflow: hidden;
  margin-bottom: min(calc(30 / 1366 * 100vw), 30px);
  pointer-events: none;
  border-radius: min(calc(10 / 1366 * 100vw), 10px);
  background-color: var(--color-contrast-dark);
}

.topic-thumbnail-ratio img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.topic-date {
  font-size: var(--font-size-14);
  margin-bottom: min(calc(15 / 1366 * 100vw), 15px);
  display: block;
  line-height: 44px;
}

.topic-title {
  font-size: var(--font-size-14);
  font-weight: 600;
  margin-bottom: auto;
  line-height: 20px;
}

.front-topics-link__item-link {
  color: var(--color-text-dark);
  font-size: var(--font-size-14);
  font-weight: 600;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: min(calc(15 / 1366 * 100vw), 15px);
  text-decoration: none;
  margin-top: auto;
}

.front-topics-link__item-link img {
  width: min(calc(11 / 1366 * 100vw), 11px);
  height: auto;
}

/* Section: Recruit
================================================ */
.front-recruit-wrap {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  overflow: clip;
  padding: min(calc(50 / 1366 * 100vw), 50px);
  position: relative;
  width: 100%;
}

.front-section-recruit {
  position: relative;
  background-color: var(--color-contrast-white);
  border-radius: 10px;
  overflow: clip;
  width: min(calc(1266 / 1366 * 100vw), 1266px);
  margin: 0 auto;
}

.front-recruit-main {
  display: flex;
  flex-direction: column;
  gap: min(calc(50 / 1366 * 100vw), 50px);
  padding: min(calc(50 / 1366 * 100vw), 50px);
}

.front-recruit__header {
  display: flex;
  align-items: flex-end;
  gap: min(calc(10 / 1366 * 100vw), 10px);
}

.front-recruit__title-icon {
  width: min(calc(60 / 1366 * 100vw), 60px);
  height: min(calc(30 / 1366 * 100vw), 30px);
  flex-shrink: 0;
}

.front-recruit__title-icon img {
  width: 100%;
  height: 100%;
  display: block;
}

.front-recruit__title-group {
  display: flex;
  gap: min(calc(20 / 1366 * 100vw), 20px);
  align-items: flex-end;
}

.front-recruit__title-en {
  font-family: var(--font-family-en);
  font-size: min(calc(40 / 1366 * 100vw), 40px);
  color: var(--color-text);
  font-weight: 700;
  margin: 0;
  line-height: 0.76;
}

.front-recruit__title-ja {
  font-size: min(calc(18 / 1366 * 100vw), 18px);
  color: var(--color-text);
  font-weight: 600;
  margin: 0;
  line-height: 1;
}

.front-recruit-contents__area {
  display: flex;
  justify-content: space-between;
}

.front-recruit-image {
  position: absolute;
  bottom: min(calc(50 / 1366 * 100vw), 50px);
  right: -7%;
  width: min(calc(860 / 1366 * 100vw), 860px);
  height: min(calc(410 / 1366 * 100vw), 410px);

  /* background-size: 80%; */
  background-position: right center;
  overflow: hidden;
  background-repeat: no-repeat;
  background-image: url("../../images/front/recruit_photo.png");
  background-size: cover;
  clip-path: polygon(25% 0, 100% 0, 85% 100%, 0 100%);
}

.front-recruit-image::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 30%;
  background: linear-gradient(to top, rgb(22 31 100 / 100%) 0%, rgb(22 31 100 / 0%) 100%);
  z-index: 1;
}

.front-recruit-text-box {
  position: relative;
  display: flex;
  flex-direction: column;
  z-index: 2;
}

.front-recruit-arrow {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) rotate(180deg);
  width: min(calc(333 / 1366 * 100vw), 333px);
  z-index: 3;
  pointer-events: none;
}

.front-recruit-arrow img {
  width: 100%;
  height: auto;
}

.front-recruit-text-box h3 {
  color: var(--color-text);
  font-size: min(calc(35 / 1366 * 100vw), 35px);
  margin-bottom: min(calc(175 / 1366 * 100vw), 175px);
  line-height: 1.8;
}

/* Progress SVG (Topics)
================================================ */
.progress-svg-topics {
  display: none;
}

/* SP responsive (<=750px)
================================================ */
@media (width <= 750px) {
  /* -- Hero -- */
  .front-hero-group {
    gap: calc(80 / 375 * 100vw);
  }

  .front-hero__title {
    font-size: calc(30 / 375 * 100vw);
    line-height: calc(50 / 375 * 100vw);
  }

  .front-hero-image__bg {
    background-image: url("../../images/front/front_hero_bg_sp.svg");
    background-size: cover;
    background-position: 65% center;
  }

  .front-intro__bg {
    background-image: url("../../images/front/front_hero_bg_sp.svg");
  }

  /* -- 1. Intro -- */
  .front-intro__inner {
    padding: calc(80 / 375 * 100vw) 0 calc(50 / 375 * 100vw);
  }

  .front-intro__label {
    padding-left: calc(20 / 375 * 100vw);
    font-size: calc(14 / 375 * 100vw);
  }

  .front-intro__badge {
    padding: calc(20 / 375 * 100vw);
    border-radius: 0 10px 10px 0;
  }

  .front-intro__badge-text {
    font-size: calc(24 / 375 * 100vw);
    line-height: 1;
  }

  .front-intro__nav {
    flex-direction: column;
    gap: calc(10 / 375 * 100vw);
    padding: 0 calc(20 / 375 * 100vw);
  }

  .front-intro__nav-btn {
    border-radius: 5px;
    padding: calc(15 / 375 * 100vw) calc(20 / 375 * 100vw);
  }

  .front-intro__nav-btn span {
    font-size: calc(14 / 375 * 100vw);
    line-height: calc(40 / 375 * 100vw);
  }

  /* -- 2. About Us -- */
  .front-about {
    border-radius: 0 0 5px 5px;
    padding: calc(50 / 375 * 100vw) calc(20 / 375 * 100vw);
  }

  .front-about__inner {
    gap: calc(30 / 375 * 100vw);
  }

  .front-about__header {
    gap: calc(10 / 375 * 100vw);
    align-items: flex-start;
  }

  .front-about__title-group {
    flex-direction: column;
    align-items: flex-start;
    gap: calc(10 / 375 * 100vw);
  }

  .front-about__title-icon {
    width: calc(34 / 375 * 100vw);
    height: calc(17 / 375 * 100vw);
  }

  .front-about__title-en {
    font-size: calc(24 / 375 * 100vw);
  }

  .front-about__title-ja {
    font-size: calc(12 / 375 * 100vw);
  }

  .front-about__body {
    width: 100%;
    font-size: calc(14 / 375 * 100vw);
    line-height: 22px;
  }

  .front-about__cta {
    padding: calc(20 / 375 * 100vw) calc(30 / 375 * 100vw);
    margin: 0 auto;
    gap: calc(16 / 375 * 100vw);
  }

  .front-about__cta > span {
    font-size: calc(16 / 375 * 100vw);
  }

  .front-about__cta-icon {
    width: calc(16 / 375 * 100vw);
    height: calc(16 / 375 * 100vw);
  }

  /* -- 3. Holdings Org -- */

  .front-org__header {
    gap: calc(10 / 375 * 100vw);
    align-items: flex-start;
  }

  .front-org__title-icon {
    width: calc(34 / 375 * 100vw);
    height: calc(17 / 375 * 100vw);
  }

  .front-org__title-group {
    flex-direction: column;
    gap: calc(10 / 375 * 100vw);
    align-items: flex-start;
  }

  .front-org__title-en {
    font-size: calc(24 / 375 * 100vw);
  }

  .front-org__title-ja {
    font-size: calc(12 / 375 * 100vw);
  }

  .front-org__inner {
    width: calc(335 / 375 * 100vw);
    padding: calc(50 / 375 * 100vw) 0;
  }

  /* -- KV Chevron -- */
  .kv-image-group {
    width: 100%;
  }

  .front-kv-chevron {
    height: calc(800 / 375 * 100vw);
  }

  .kv-image-clip-top-left {
    width: calc(200 / 375 * 100vw);
    height: calc(200 / 375 * 100vw);
    top: calc(80 / 375 * 100vw);
    left: calc(-60 / 375 * 100vw);
  }

  .kv-layer-chevron--top-left {
    bottom: calc(-5 / 375 * 100vw);
    left: calc(-15 / 375 * 100vw);
    top: auto;
  }

  .kv-image-chevron--top-left {
    top: 0;
    left: 0;
  }

  .kv-image-clip-top-right {
    width: calc(200 / 375 * 100vw);
    height: calc(200 / 375 * 100vw);
    top: calc(-62 / 375 * 100vw);
    right: calc(-10 / 375 * 100vw);
  }

  .kv-layer-chevron--top-right {
    inset: auto auto calc(-5 / 375 * 100vw) calc(-15 / 375 * 100vw);
  }

  .kv-image-chevron--top-right {
    top: 0;
    right: 0;
    background-position: 0% 115%;
  }

  .kv-image-clip-bottom-left {
    width: calc(200 / 375 * 100vw);
    height: calc(200 / 375 * 100vw);
    top: calc(456 / 375 * 100vw);
    right: calc(120 / 375 * 100vw);
    left: auto;
  }

  .kv-layer-chevron--bottom-left {
    inset: auto auto calc(-5 / 375 * 100vw) calc(-15 / 375 * 100vw);
  }

  .kv-image-chevron--bottom-left {
    bottom: 0;
    right: 0;
  }

  .kv-image-clip-bottom-right {
    width: calc(200 / 375 * 100vw);
    height: calc(200 / 375 * 100vw);
    bottom: calc(-50 / 375 * 100vw);
    right: calc(-25 / 375 * 100vw);
    left: auto;
  }

  .kv-layer-chevron--bottom-right {
    inset: auto auto calc(-5 / 375 * 100vw) calc(-15 / 375 * 100vw);
  }

  .kv-image-chevron--bottom-right {
    bottom: 0;
    left: 0;
    background-image: url("../../images/front/service_photo4_sp.jpg");
    background-size: 130%;
    background-position: 0% 0%;
  }

  .kv-text-group {
    top: 50%;
    transform: translateY(-50%);
  }

  .kv-text-content {
    font-size: calc(18 / 375 * 100vw);
    padding: calc(10 / 375 * 100vw) calc(20 / 375 * 100vw);
    white-space: nowrap;
  }

  /* -- 4. Track Record -- */
  .front-track-wrap {
    padding: calc(20 / 375 * 100vw) 0;
  }

  .front-track {
    width: calc(335 / 375 * 100vw);
    padding: calc(30 / 375 * 100vw) calc(20 / 375 * 100vw);
  }

  .front-track__header {
    gap: calc(10 / 375 * 100vw);
    margin-bottom: calc(30 / 375 * 100vw);
    align-items: flex-start;
  }

  .front-track__title-icon {
    width: calc(34 / 375 * 100vw);
    height: calc(17 / 375 * 100vw);
  }

  .front-track__title-group {
    flex-direction: column;
    gap: calc(10 / 375 * 100vw);
    align-items: flex-start;
  }

  .front-track__title-en {
    font-size: calc(24 / 375 * 100vw);
  }

  .front-track__title-ja {
    font-size: calc(12 / 375 * 100vw);
  }

  .front-track__cards {
    flex-direction: column;
    gap: calc(10 / 375 * 100vw);
  }

  .front-track__card {
    flex: none;
    width: 100%;
  }

  .front-track__card-label {
    padding: calc(10 / 375 * 100vw);
  }

  .front-track__card-label p {
    font-size: calc(14 / 375 * 100vw);
  }

  .front-track__card-body {
    position: relative;
    flex-direction: row;
    padding: calc(20 / 375 * 100vw) calc(30 / 375 * 100vw);
    justify-content: center;
    gap: calc(20 / 375 * 100vw);
  }

  .front-track__card-illust {
    width: calc(50 / 375 * 100vw);
    height: calc(50 / 375 * 100vw);
    margin-bottom: 0;
  }

  .front-track__card-num {
    font-size: calc(34 / 375 * 100vw);
  }

  .front-track__card-unit {
    font-size: calc(18 / 375 * 100vw);
  }

  .front-track__card-note {
    position: absolute;
    bottom: 0;
    right: calc(10 / 375 * 100vw);
    font-size: calc(10 / 375 * 100vw);
  }

  .front-topics-link__item-link {
    gap: calc(10 / 375 * 100vw);
  }

  .front-topics-link__item-link img {
    width: calc(11 / 375 * 100vw);
  }

  /* -- 5. Company -- */
  .front-company-wrap,
  .front-topics-wrap,
  .front-recruit-wrap {
    padding: calc(20 / 375 * 100vw) 0;
  }

  .front-company-main {
    width: calc(335 / 375 * 100vw);
    gap: calc(30 / 375 * 100vw);
    padding: calc(30 / 375 * 100vw) calc(20 / 375 * 100vw);
  }

  .front-comp__header {
    gap: calc(10 / 375 * 100vw);
    align-items: flex-start;
  }

  .front-comp__title-icon {
    width: calc(34 / 375 * 100vw);
    height: calc(17 / 375 * 100vw);
  }

  .front-comp__title-group {
    flex-direction: column;
    gap: calc(10 / 375 * 100vw);
    align-items: flex-start;
  }

  .front-comp__title-en {
    font-size: calc(24 / 375 * 100vw);
  }

  .front-comp__title-ja {
    font-size: calc(12 / 375 * 100vw);
  }

  .front-comp-link__item-list {
    flex-direction: column;
    gap: calc(15 / 375 * 100vw);
    width: 100%;
  }

  .front-comp-link__item {
    width: 100%;
    border-radius: 5px;
  }

  .front-comp-link__item-link {
    font-size: calc(16 / 375 * 100vw);
    padding: calc(20 / 375 * 100vw);
    min-height: calc(72 / 375 * 100vw);
  }

  .front-comp-link__item-link span {
    line-height: 1.6;
  }

  .front-comp-link__item-link img {
    width: calc(17 / 375 * 100vw);
  }

  /* -- 6. Topics -- */
  .front-topics-main {
    gap: calc(30 / 375 * 100vw);
    padding: calc(30 / 375 * 100vw) calc(20 / 375 * 100vw);
  }

  .front-section-topics {
    border-radius: 5px;
    width: calc(335 / 375 * 100vw);
  }

  .front-topics__header {
    gap: calc(10 / 375 * 100vw);
    align-items: flex-start;
  }

  .front-topics__title-icon {
    width: calc(34 / 375 * 100vw);
    height: calc(17 / 375 * 100vw);
  }

  .front-topics__title-group {
    flex-direction: column;
    gap: calc(10 / 375 * 100vw);
    align-items: flex-start;
  }

  .front-topics__title-en {
    font-size: calc(24 / 375 * 100vw);
  }

  .front-topics__title-ja {
    font-size: calc(12 / 375 * 100vw);
  }

  .front-topics-link__area {
    overflow: visible;
  }

  .front-topics-link__item-list {
    flex-direction: column;
    margin: 0;
    gap: calc(20 / 375 * 100vw);
  }

  .front-topics-link__item {
    width: 100%;
    height: auto;
    aspect-ratio: auto;
    border-radius: 5px;
    padding: calc(20 / 375 * 100vw);
  }

  .topic-thumbnail-ratio {
    aspect-ratio: 510 / 429;
    border-radius: 3px;
    margin-bottom: calc(20 / 375 * 100vw);
  }

  .topic-date {
    line-height: 44px;
    margin-bottom: calc(10 / 375 * 100vw);
  }

  .topic-title {
    line-height: 20px;
  }

  .progress-svg-topics {
    display: none;
  }

  .front-section__button {
    width: calc(250 / 375 * 100vw);
    height: calc(45 / 375 * 100vw);
    font-size: calc(14 / 375 * 100vw);
    background-image: url("../../images/front/button-background-sp.svg");
    padding-left: calc(30 / 375 * 100vw);
    gap: calc(10 / 375 * 100vw);
  }

  .front-section__button img {
    width: calc(13 / 375 * 100vw);
  }

  /* -- 7. Recruit -- */
  .front-section-recruit {
    min-height: auto;
    border-radius: 10px;
    width: calc(335 / 375 * 100vw);
  }

  .front-recruit-main {
    gap: calc(30 / 375 * 100vw);
    padding: calc(30 / 375 * 100vw) 0;
  }

  .front-recruit__header {
    gap: calc(10 / 375 * 100vw);
    padding: 0 calc(20 / 375 * 100vw);
    align-items: flex-start;
  }

  .front-recruit__title-icon {
    width: calc(34 / 375 * 100vw);
    height: calc(17 / 375 * 100vw);
  }

  .front-recruit__title-group {
    flex-direction: column;
    gap: calc(10 / 375 * 100vw);
    align-items: flex-start;
  }

  .front-recruit__title-en {
    font-size: calc(24 / 375 * 100vw);
  }

  .front-recruit__title-ja {
    font-size: calc(12 / 375 * 100vw);
  }

  .front-recruit-contents__area {
    margin: 0;
    flex-direction: column;
    min-height: auto;
    justify-content: flex-start;
    padding: 0 calc(20 / 375 * 100vw);
  }

  .front-recruit-text-box {
    width: 100%;
    position: relative;
    z-index: 2;
    gap: calc(20 / 375 * 100vw);
  }

  .front-recruit-text-box h3 {
    color: var(--color-text);
    margin-bottom: 0;
    margin-top: 0;
    line-height: calc(35 / 375 * 100vw);
    font-size: calc(22 / 375 * 100vw);
  }

  .front-recruit-image {
    position: relative;
    top: auto;
    bottom: auto;
    right: auto;
    width: calc(450 / 375 * 100vw);
    height: calc(181 / 375 * 100vw);
    background-size: 80%;
    background-position: left 50%;
    overflow: hidden;
    clip-path: polygon(22% 0, 100% 0, 100% 100%, 0 100%);
    margin-bottom: 0;
  }

  .front-recruit-image::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: calc(60 / 375 * 100vw);
    background: linear-gradient(to top, rgb(22 31 100 / 100%) 0%, rgb(22 31 100 / 0%) 100%);
    z-index: 1;
  }

  .front-recruit-arrow {
    display: none;
  }

  .front-section__action {
    padding-bottom: 0;
    margin: 0 auto;
  }
}