/**********
** mv
***********************************/

.mv {
  position: relative;
  width: 100%;
}

.mv__img {
  width: 100%;
}

.mv__img img {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}

.mv .splide__pagination__page {
  width: calc(10 * var(--r));
  height: calc(10 * var(--r));
  background: var(--white);
  border: 1px solid var(--blue-500);
  opacity: 1;
  -webkit-transition:
    background-color 0.3s,
    -webkit-transform 0.3s;
  transition:
    background-color 0.3s,
    -webkit-transform 0.3s;
  transition:
    transform 0.3s,
    background-color 0.3s;
  transition:
    transform 0.3s,
    background-color 0.3s,
    -webkit-transform 0.3s;
}

.mv .splide__pagination__page.is-active {
  background: var(--blue-500);
  -webkit-transform: scale(1.2);
          transform: scale(1.2);
}

.mv__video-btn {
  position: absolute;
  bottom: calc(140 / 1920 * 100vw);
  right: calc(50 / 1920 * 100vw);
  z-index: 10;
  background: none;
  border: none;
  padding: 0;
  margin: 0;
  cursor: pointer;
  border-radius: 50%;
  -webkit-transition: opacity 0.3s;
  transition: opacity 0.3s;
  width: calc(60 * var(--r));
  height: calc(60 * var(--r));
}

.mv__video-btn .splide__toggle__play,
.mv__video-btn .splide__toggle__pause {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}

.mv__video-btn:hover {
  opacity: 0.8;
}

.mv__video-btn:focus-visible {
  outline: 3px solid var(--blue-500);
  outline-offset: 2px;
}

/**********
** top-news
***********************************/

.top-news {
  overflow: hidden;
}

.top-news__wrap {
  padding-block: clamp(
    calc(100 * var(--r)),
    calc(100 * var(--r)) + (120 - 100) * var(--fluid-rate),
    calc(120 * var(--r))
  );
  background-color: var(--gray-200);
  position: relative;
}

.top-news__wrap::before {
  content: '';
  position: absolute;
  top: 14%;
  left: 85%;
  translate: -50% -50%;
  width: 240%;
  height: 110%;
  background: url(/img/news_bg.webp) no-repeat center center/contain;
}

@media (min-width: 768px) {

.top-news__wrap::before {
    top: 29%;
    left: 56%;
    width: 210%;
    height: 170%;
}
  }

.top-news__inner {
  position: relative;
}

.top-news__sp-wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: calc(60 * var(--r));
}

@media (min-width: 768px) {

.top-news__sp-wrap {
    display: contents;
}
  }

.top-news__head {
  display: contents;
  margin-bottom: clamp(
    calc(40 * var(--r)),
    calc(40 * var(--r)) + (60 - 40) * var(--fluid-rate),
    calc(60 * var(--r))
  );
}

@media (min-width: 768px) {

.top-news__head {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    gap: calc(20 * var(--r));
}
  }

.top-news__btn-area {
  width: 100%;
  -webkit-box-ordinal-group: 4;
      -ms-flex-order: 3;
          order: 3;
}

@media (min-width: 768px) {

.top-news__btn-area {
    width: auto;
}
  }

.top-news__list {
  display: grid;
  grid-template-columns: 1fr;
  border: 1px solid var(--gray-300);
  background-color: var(--white);
  margin-top: clamp(
    calc(40 * var(--r)),
    calc(40 * var(--r)) + (60 - 40) * var(--fluid-rate),
    calc(60 * var(--r))
  );
}

@media (min-width: 768px) {

.top-news__list {
    grid-template-columns: repeat(4, 1fr);
}
  }

.top-news__item {
  border-bottom: 1px solid var(--gray-300);
}

@media (min-width: 768px) {

.top-news__item {
    border-bottom: none;
    border-right: 1px solid var(--gray-300);
}
  }

.top-news__item:last-child {
  border-bottom: none;
}

@media (min-width: 768px) {

.top-news__item:last-child {
    border-right: none;
}
  }

.top-news__link {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  height: 100%;
  padding: clamp(
      calc(10 * var(--r)),
      calc(10 * var(--r)) + (35 - 10) * var(--fluid-rate),
      calc(35 * var(--r))
    )
    clamp(
      calc(15 * var(--r)),
      calc(15 * var(--r)) + (20 - 15) * var(--fluid-rate),
      calc(20 * var(--r))
    );
  text-decoration: none;
  color: var(--black);
  -webkit-transition: background-color 0.3s;
  transition: background-color 0.3s;
}

.top-news__link:hover {
  background-color: #f9f9f9;
}

.top-news__img {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-inline: auto;
  margin-bottom: calc(10 * var(--r));
  width: clamp(
    calc(210 * var(--r)),
    calc(210 * var(--r)) + (288 - 210) * var(--fluid-rate),
    calc(288 * var(--r))
  );
}

@media (min-width: 768px) {

.top-news__img {
    margin-bottom: calc(20 * var(--r));
}
  }

.top-news__img img {
  max-width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
  aspect-ratio: 210 / 125;
}

@media (min-width: 768px) {

.top-news__img img {
    aspect-ratio: 288 / 180;
}
  }

.top-news__content {
  border-top: 1px solid #ccc;
  padding-top: calc(10 * var(--r));
}

@media (min-width: 768px) {

.top-news__content {
    padding-top: calc(20 * var(--r));
    padding-inline: calc(10 * var(--r));
}
  }

.top-news__time {
  display: block;
  font-size: var(--fs-base);
  color: #666;
  margin-bottom: calc(10 * var(--r));
}

.top-news__text {
  font-size: var(--fs-md);
  line-height: calc(32 / 18);
  font-weight: 500;
}

/* スライダー関連 */

.top-news__slider {
  position: relative;
  margin-right: calc(-30 * var(--r));
}

@media (min-width: 768px) {

.top-news__slider {
    margin-right: 0;
}
  }

/* PCではスライダーをリセット */

@media (min-width: 768px) {
  .top-news__list {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    width: 100%;
  }
}

@media (max-width: 767px) {
  .top-news__item {
    width: calc(250 * var(--r));
  }
}

/* SP: スライダー有効時のスタイル */

@media (max-width: 767px) {
  .top-news__slider.is-initialized .top-news__list {
    border: none;
  }

  .top-news__slider.is-initialized .top-news__item {
    border: 1px solid var(--gray-300);
    border-right: none;
    background-color: var(--white);
  }

  .top-news__slider.is-initialized .top-news__item:last-child {
    border-right: 1px solid var(--gray-300);
  }
}

/* 矢印スタイル */

.top-news__arrows {
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  translate: 0 -50%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  pointer-events: none;
  z-index: 10;
  padding-inline: calc(10 * var(--r));
}

@media (min-width: 768px) {

.top-news__arrows {
    display: none;
}
  }

.top-news__arrow.splide__arrow {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: calc(59 * var(--r));
  height: calc(59 * var(--r));
  background: color-mix(in srgb, var(--black) 50%, transparent);
  border: none;
  border-radius: 50%;
  cursor: pointer;
  pointer-events: auto;
  -webkit-transition:
    background-color 0.3s,
    opacity 0.3s;
  transition:
    background-color 0.3s,
    opacity 0.3s;
}

.top-news__arrow:hover {
  background: var(--blue-600);
}

.top-news__arrow::before {
  content: '';
  display: block;
  width: calc(10 * var(--r));
  height: calc(10 * var(--r));
  border-top: 2px solid var(--white);
  border-right: 2px solid var(--white);
}

.top-news__arrow--prev::before {
  -webkit-transform: rotate(-135deg);
          transform: rotate(-135deg);
  margin-left: calc(4 * var(--r));
}

.top-news__arrow--next::before {
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
  margin-right: calc(4 * var(--r));
}

/* visually-hidden ユーティリティ */

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/**********
** top-information
***********************************/

.top-information {
  background-color: var(--gray-400);
  padding-block: clamp(
    calc(40 * var(--r)),
    calc(40 * var(--r)) + (80 - 40) * var(--fluid-rate),
    calc(80 * var(--r))
  );
}

.top-information__container {
  background-color: var(--white);
  padding: clamp(
      calc(40 * var(--r)),
      calc(40 * var(--r)) + (50 - 40) * var(--fluid-rate),
      calc(50 * var(--r))
    )
    clamp(
      calc(20 * var(--r)),
      calc(20 * var(--r)) + (40 - 20) * var(--fluid-rate),
      calc(40 * var(--r))
    );
  position: relative;
}

.top-information__title {
  position: absolute;
  top: 0;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  background-color: var(--blue-500);
  color: var(--white);
  padding: calc(10 * var(--r))
    clamp(
      calc(20 * var(--r)),
      calc(20 * var(--r)) + (40 - 20) * var(--fluid-rate),
      calc(40 * var(--r))
    );
  border-radius: 9999px;
  font-size: clamp(
    calc(18 * var(--r)),
    calc(18 * var(--r)) + ((24 - 18) * var(--fluid-rate)),
    calc(24 * var(--r))
  );
  font-weight: 700;
  white-space: nowrap;
  width: clamp(
    calc(250 * var(--r)),
    calc(250 * var(--r)) + ((440 - 250) * var(--fluid-rate)),
    calc(440 * var(--r))
  );
  text-align: center;
}

.top-information__list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.top-information__item {
  border-bottom: 1px solid var(--gray-400);
}

.top-information__link {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: calc(10 * var(--r));
  padding-block: clamp(
    calc(25 * var(--r)),
    calc(25 * var(--r)) + (40 - 25) * var(--fluid-rate),
    calc(40 * var(--r))
  );
  text-decoration: none;
  color: var(--black);
  -webkit-transition: opacity 0.3s;
  transition: opacity 0.3s;
}

.top-information__link:hover {
  opacity: 0.7;
}

.top-information__bullet {
  display: block;
  width: calc(12 * var(--r));
  height: calc(12 * var(--r));
  background-color: var(--yellow-500);
  border-radius: 50%;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  translate: 0 calc(8 * var(--r));
}

.top-information__text {
  font-size: var(--fs-md);
  text-decoration: underline;
}

/**********
** top-about
***********************************/

.top-about {
  position: relative;
  z-index: 2;
}

.top-about__wrap {
  padding-block: clamp(
    calc(100 * var(--r)),
    calc(100 * var(--r)) + (120 - 100) * var(--fluid-rate),
    calc(120 * var(--r))
  );
  position: relative;
}

.top-about__wrap::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url(/img/about_bg.webp) no-repeat center center/cover;
  z-index: -1;
}

.top-about__content {
  margin-top: calc(70 * var(--r));
}

@media (min-width: 768px) {

.top-about__content {
    margin-top: calc(100 * var(--r));
}
  }

.top-about__text {
  font-size: var(--fs-lg);
  line-height: 2;
  color: var(--white);
  text-align: justify;
  -webkit-font-feature-settings: 'palt';
          font-feature-settings: 'palt';
}

.top-about__illust-area {
  margin-top: calc(70 * var(--r));
  padding-block: calc(25 * var(--r));
  background: color-mix(in srgb, var(--black) 25%, transparent);
  border-radius: calc(5 * var(--r));
}

@media (min-width: 768px) {

.top-about__illust-area {
    margin-top: calc(100 * var(--r));
    padding-block: calc(70 * var(--r)) calc(60 * var(--r));
}
  }

.top-about__illust,
.top-about__note {
  width: min(100%, calc(1154 * var(--r)));
  margin-inline: auto;
  padding-inline: calc(20 * var(--r));
}

.top-about__illust {
  position: relative;
}

.top-about__illust-img {
  -o-object-fit: contain;
     object-fit: contain;
  width: 100%;
  height: 100%;
  -webkit-transition: opacity 0.3s;
  transition: opacity 0.3s;
}

@media (max-width: 767px) {

.top-about__illust-img {
    cursor: pointer;
}
  }

@media (max-width: 767px) {

.top-about__illust-img:hover {
    opacity: 0.8;
}
  }

.top-about__icon-zoom {
  position: absolute;
  bottom: 0;
  right: calc(20 * var(--r));
  cursor: pointer;
  pointer-events: auto;
  /* button要素のデフォルトスタイルをリセット */
  background: none;
  border: none;
  padding: 0;
  margin: 0;
  width: calc(30 * var(--r));
  height: calc(30 * var(--r));
}

@media (min-width: 768px) {

.top-about__icon-zoom {
    display: none;
}
  }

.top-about__icon-zoom:focus-visible {
  outline: 2px solid var(--blue-500);
  outline-offset: 2px;
  border-radius: 4px;
}

.top-about__note {
  font-size: var(--fs-sm);
  line-height: calc(40 / 24);
  color: var(--white);
  margin-top: calc(60 * var(--r));
  text-align: justify;
}

@media (min-width: 768px) {

.top-about__note {
    line-height: calc(24 / 16);
}
  }

.top-about__btn-area {
  margin-top: calc(60 * var(--r));
  display: grid;
  text-align: center;
  row-gap: calc(20 * var(--r));
}

@media (min-width: 768px) {

.top-about__btn-area {
    grid-template-columns: repeat(2, 1fr);
    gap: calc(40 * var(--r)) calc(30 * var(--r));
}
  }

/**********
** top-record
***********************************/

.top-record {
  overflow-x: clip;
}

.top-record__wrap {
  padding-block: clamp(
    calc(60 * var(--r)),
    calc(60 * var(--r)) + (120 - 60) * var(--fluid-rate),
    calc(120 * var(--r))
  );
  position: relative;
}

.top-record__wrap::before {
  content: '';
  position: absolute;
  top: 11%;
  left: 100%;
  translate: -50% -50%;
  z-index: -1;
  width: 300%;
  height: 110%;
  background: url(/img/record_bg.webp) no-repeat center center/contain;
}

@media (min-width: 768px) {

.top-record__wrap::before {
    top: 40%;
    left: 54%;
    width: 170%;
}
  }

.top-record__lead {
  font-size: var(--fs-md);
  line-height: 1.8;
}

.top-record__list {
  display: grid;
  grid-template-columns: 1fr;
  gap: calc(20 * var(--r));
  width: calc(610 / 720 * 100%);
  margin-top: clamp(
    calc(30 * var(--r)),
    calc(30 * var(--r)) + (40 - 30) * var(--fluid-rate),
    calc(40 * var(--r))
  );
  margin-inline: auto;
}

@media (min-width: 768px) {

.top-record__list {
    grid-template-columns: repeat(2, 1fr);
    gap: calc(40 * var(--r)) calc(30 * var(--r));
}
  }

.top-record__card {
  background-color: var(--white);
}

.top-record__more {
  text-align: center;
  margin-top: clamp(
    calc(40 * var(--r)),
    calc(40 * var(--r)) + (60 - 40) * var(--fluid-rate),
    calc(60 * var(--r))
  );
}

.top-record__more-link {
  font-size: var(--fs-md);
  font-weight: 700;
  color: var(--blue-500);
  text-decoration: none;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: calc(10 * var(--r));
  -webkit-transition: opacity 0.3s;
  transition: opacity 0.3s;
}

.top-record__more-link:hover {
  opacity: 0.7;
}

/**********
** top-recruit
***********************************/

.top-recruit {
  overflow: hidden;
}

.top-recruit__wrap {
  padding-block: clamp(
    calc(80 * var(--r)),
    calc(80 * var(--r)) + (120 - 80) * var(--fluid-rate),
    calc(120 * var(--r))
  );
  position: relative;
  z-index: 1;
}

.top-recruit__wrap::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: calc(360 / 390 * 100vw);
  height: 47%;
  background: url(/img/recruit_bg.webp) no-repeat center center/cover;
  z-index: -1;
}

@media (min-width: 768px) {

.top-recruit__wrap::before {
    top: 0;
    width: calc(1700 / 1920 * 100vw);
    height: 100%;
    max-height: calc(562 * var(--r));
    aspect-ratio: 1700 / 562;
}
  }

.top-recruit__container {
  position: relative;
  background: url('/img/recruit_bg_person_sp.webp') no-repeat center center /
    cover;
  /* 390px時のコンテナ比率（幅330px:高さ623px）を維持 */
  aspect-ratio: 330 / 623;
  padding: clamp(
      calc(40 * var(--r)),
      calc(40 * var(--r)) + (80 - 40) * var(--fluid-rate),
      calc(80 * var(--r))
    )
    clamp(
      calc(20 * var(--r)),
      calc(20 * var(--r)) + (60 - 20) * var(--fluid-rate),
      calc(60 * var(--r))
    );
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
          box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
  width: calc(660 / 780 * 100vw);
  margin-right: calc(50% - 50vw);
  margin-left: auto;
}

@media (min-width: 768px) {

.top-recruit__container {
    aspect-ratio: auto;
    /* min-height: clamp(calc(300 * var(--r)), calc(300 * var(--r)) + (500 - 300) * var(--fluid-rate), calc(500 * var(--r))); */
    height: calc(500 * var(--r));
    background: url('/img/recruit_bg_person.webp') no-repeat center center /
      cover;
    width: auto;
    margin-left: 0;
}
  }

.top-recruit__content {
  color: var(--white);
  margin-left: -13%;
}

@media (min-width: 768px) {

.top-recruit__content {
    margin-left: 0;
}
  }

.top-recruit__btn-area {
  width: 100%;
  margin-top: calc(40 * var(--r));
  margin-left: -13%;
}

@media (min-width: 768px) {

.top-recruit__btn-area {
    -ms-flex-item-align: end;
        align-self: flex-end;
    max-width: calc(600 * var(--r));
    margin-top: 0;
    margin-left: 0;
}
  }

.top-recruit__btn {
  width: 100%;
  min-width: 0 !important;
  -webkit-box-pack: justify !important;
      -ms-flex-pack: justify !important;
          justify-content: space-between !important;
  padding-block: clamp(
    calc(15 * var(--r)),
    calc(15 * var(--r)) + (20 - 15) * var(--fluid-rate),
    calc(20 * var(--r))
  ) !important;
  font-size: var(--fs-base) !important;
}