@charset "UTF-8";

/* ----------------------------------------
  メインビジュアル
---------------------------------------- */
.mv {
  width: calc(100% - 1.8rem);
  max-width: 1000px;
  margin: 0 auto;
  aspect-ratio: 1280 / 600;
}

/* ----------------------------------------
  トップ コンテンツ
---------------------------------------- */
.top-content {
  margin-top: 30px;
  padding: 1.8rem 1.8rem calc(1.8rem + 60px);
  background: var(--color-bg-gray);
}

/* パネル共通 */
.top-bnr__item,
.sub-bnr__item {
  display: flex;
}

.top-bnr__item > a,
.sub-bnr__item > a {
  display: block;
  position: relative;
  width: 100%;
  background: #fff;
  box-shadow: 0 0 35px 0 rgba(0, 0, 0, .1);
  text-align: center;
  transition: box-shadow .2s ease-out;
}

@media (min-width: 1024px) {
  .top-bnr__item > a:hover,
  .top-bnr__item > a:focus-visible,
  .sub-bnr__item > a:hover,
  .sub-bnr__item > a:focus-visible {
    box-shadow: 0 7px 35px 0 rgba(0, 0, 0, .15);
  }
}

.top-bnr__img img,
.sub-bnr__img img {
  display: block;
  width: 100%;
}

.top-bnr__ttl,
.sub-bnr__ttl {
  padding: 1.8rem;
  font-weight: 700;
}

/* メインバナー */
.top-bnr {
  display: grid;
  grid-template-columns: 1fr;
  margin: 0 -.9rem;
}

.top-bnr__img {
  padding: .9rem .9rem 0;
}

/* お知らせ */
.news {
  margin-top: 67px;
}

.news__heading,
.partner__heading {
  margin-bottom: 2.25rem;
  color: var(--color-red);
  font-size: 1.7rem;
  line-height: 1.633;
  text-align: center;
}

.news__list {
  width: calc(100% - 1.8rem);
  max-width: 828px;
  margin: 0 auto;
  border-top: 1px solid var(--color-border);
}

.news__item {
  border-bottom: 1px solid var(--color-border);
}

.news__item a {
  display: flex;
  flex-direction: column;
  padding: .9rem 0;
}

.news__item time {
  flex: 1 1 auto;
  margin-top: 1px;
  font-size: .875rem;
  line-height: 1.78;
}

.news__item time,
.news__ttl {
  transition: opacity .2s ease-out;
}

.news__item a:hover time,
.news__item a:hover .news__ttl,
.news__item a:focus-visible time,
.news__item a:focus-visible .news__ttl {
  opacity: .8;
}

.news__more {
  display: flex;
  justify-content: center;
  margin-top: 1.8rem;
}

/* 会社情報・採用 */
.sub-bnr {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.8rem;
  max-width: 1280px;
  margin: 80px auto 0;
  padding: 0 .9rem;
}

/* ビジネスパートナー */
.partner {
  margin-top: 80px;
  padding: 2.7rem 0;
  background: #fff url("../images/top/partner_bg.png") no-repeat center / cover;
}

.partner__inner {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 .9rem;
}

.partner__list {
  display: grid;
  grid-template-columns: 1fr;
  row-gap: 1.8rem;
}

.partner__list li:not(:last-child) {
  border-right: 1px solid var(--color-border);
}

.partner__list a,
.links a {
  display: block;
}

.partner__list img,
.links img {
  transition: filter .2s ease-out;
}

.partner__list img {
  width: 100%;
}

.partner__list a:hover img,
.links a:hover img,
.partner__list a:focus-visible img,
.links a:focus-visible img {
  filter: brightness(80%);
}

/* 公式サイト・グループ企業 */
.links {
  margin-top: 60px;
}

.links__heading {
  margin-bottom: 1.35rem;
  font-size: 1.4rem;
  line-height: 1.633;
  text-align: center;
}

.links__official {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin-bottom: 1.35rem;
}

.links__official li {
  width: 264px;
  height: 70px;
  margin-bottom: 1.8rem;
  padding: 0 .9rem;
}

/* 最後の段が埋まらないときは中央に寄せる */
.links__group {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: .9rem;
  padding-top: .45rem;
}

.links__group li {
  width: calc(50% - .45rem);
}

.links img {
  vertical-align: middle;
}

.links__group img {
  width: 100%;
}

.links__bsc,
.links__bgs {
  order: 2;
}

@media (min-width: 640px) {
  /* 1 段に 4 つ（1 つ 200px まで） */
  .links__group {
    width: min(800px, 80%);
    gap: 1.8rem 0;
    margin: 0 auto;
    padding-top: 0;
  }

  .links__group li {
    order: 0;
    width: 25%;
    height: 60px;
    padding: 0 .9rem;
  }
}

@media (min-width: 640px) {
  .mv {
    width: calc(100% - 3.6rem);
  }

  .top-bnr {
    grid-template-columns: 1fr 1fr;
  }

  .news__list {
    width: calc(100% - 3.6rem);
  }

  .sub-bnr {
    grid-template-columns: 1fr 1fr;
    padding: 0 1.8rem;
  }

  .partner__inner {
    padding: 0 1.8rem;
  }

  .partner__list {
    grid-template-columns: 1fr 1fr;
  }
}

@media (min-width: 1024px) {
  .news__heading,
  .partner__heading,
  .links__heading {
    line-height: 1.467;
  }

  .news__item a {
    flex-direction: row;
  }

  .news__item time {
    flex: 0 0 auto;
    width: 7rem;
    margin-right: 1.8rem;
    white-space: nowrap;
  }

  .partner {
    padding: 5.4rem 0;
  }

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