@charset "utf-8";

.topHero {
  height: 747px;
  position: relative;
  padding-bottom: 70px;
  background-color: #1E295E;
}
@media screen and (max-width: 768px) {
  .topHero {
    height: auto;
      padding-bottom: 96px;
    /*padding-bottom: 25.6vw;*/
  }
}

.topHero-img {
  display: grid;
  grid-template-columns: 24.5% 75.5%;
  /*grid-template-columns: 470px 1fr;*/
  height: 100%;
}
@media screen and (max-width: 768px) {
  .topHero-img {
    gap: 32px 0;
    /*gap: 8.53vw 0;*/
    grid-template-columns: 100%;
    padding-top: 88px;
    /*padding-top: 23.46vw;*/
    background: url(/img/img_slide_bg_sp.svg) no-repeat center/cover #FFF;
  }
}

.topHero-catch {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  background: url(/img/img_slide_bg.svg) no-repeat center/cover #FFF;
}
@media screen and (max-width: 768px) {
  .topHero-catch {
    background: none;
  }
}

.topHero-catch img {
  /*width: min(7.44vw, 143px);*/
  width: 143px;
}
@media screen and (max-width: 768px) {
  .topHero-catch img {
    width: 234px;
    /*width: 293px;*/
    /*width: 78.13vw;*/
  }
}

html[lang="en"] .topHero-catch img {
  width: 430px;
}
@media screen and (max-width: 768px) {
  html[lang="en"] .topHero-catch img {
    width: 100%;
    padding: 0 5%;
  }
}

@media screen and (max-width: 768px) {
  .splide {
    padding-left: 9.33vw;
  }
}

.splide__track {
  height: 711px;
  margin-bottom: -36px;
}
@media screen and (max-width: 768px) {
  .splide__track {
    height: 275px;
    margin-bottom: -47px;
    /*margin-bottom: -12.53vw;*/
  }
}

.splide__slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  /*object-position: left top;*/
  object-position: center;
}
@media screen and (max-width: 768px) {
.splide__slide img {
  object-position: center top;
}
}

.splide__pagination {
  position: static;
  padding: 0;
}

.splide__pagination li {
  display: flex;
  width: 40px;
}
@media screen and (max-width: 1023px) {
  .splide__pagination li {
    width: min(2.6vw,40px);
  }
}
@media screen and (max-width: 768px) {
  .splide__pagination li {
    width: 34px;
    /*width: 9.06vw;*/
  }
}

.splide__pagination__page {
  position: relative;
  width: 100%;
  height: 1px;
  margin: 0;
  border-radius: 0;
  background: #475B77;
  color: #475B77;
  opacity: 1;
}

.splide__pagination__page::after {
  position: absolute;
  top: 50%;
  translate: 0 -50%;
  display: block;
  width: 100%;
  height: 3px;
  content: "";
}

.splide__pagination__page.is-active {
  transform: scale(1);
  background: #475B77;
}

.splide__pagination__page.is-active::after {
  background: #AEB6D1;
}

.splide__play {
  position: relative;
  display: block;
  width: 30px;
  height: auto;
  aspect-ratio: 1;
}
/*@media screen and (max-width: 768px) {
  .splide__play {
    width: 8vw;
  }
}*/

.splide__play::before {
  position: absolute;
  inset: 0;
  display: block;
  width: 13px;
  height: auto;
  aspect-ratio: 13/20;
  margin: auto;
  background: url(/img/icn_play.svg) no-repeat center/ contain;
  content: "";
}
@media screen and (max-width: 768px) {
  .splide__play::before {
    width: 11px;
    /*width: 2.93vw;*/
  }
}

.splide__pause {
  position: relative;
  display: block;
  width: 30px;
  height: auto;
  aspect-ratio: 1;
}
/*@media screen and (max-width: 768px) {
  .splide__pause {
    width: 8vw;
  }
}*/

.splide__pause::before {
  position: absolute;
  inset: 0;
  display: block;
  width: 13px;
  height: auto;
  aspect-ratio: 13/14;
  margin: auto;
  background: url(/img/icn_pause.svg) no-repeat center/ contain;
  content: "";
}
@media screen and (max-width: 768px) {
  .splide__pause::before {
    width: 11px;
    /*width: 2.93vw;*/
  }
}

.splide-control {
  position: absolute;
  bottom: -50px;
/*  left: -24%;*/
  left: calc(max(22.13vw,170px) * -1);
  display: flex;
  gap: 0 10px;
}
@media screen and (max-width: 768px) {
  .splide-control {
    left: -30%;
  }
}
@media screen and (max-width: 768px) {
  .splide-control {
    bottom: -85px;
    left: 23px;
    /*bottom: -22.66vw;
    left: 6vw;*/
  }
}

.categolyLinks {
  margin-top: 45px;
  overflow: hidden;
}

.categolyLinks-inner {
  position: relative;
  z-index: 1;
  max-width: 1360px;
  margin: 0 auto;
  padding: 39px 20px 31px;
}
@media screen and (max-width: 768px) {
  .categolyLinks-inner {
    padding: 10.66vw 8vw 12.8vw;
    background: url(/img/img_cate_bg_sp.svg) no-repeat left top/cover;
  }
}

.categolyLinks-inner::before {
  position: absolute;
  top: 0;
  left: -40px;
  z-index: -1;
  width: max(calc(50vw + 50% + 40px),1679px);
  height: 280px;
  background: url(/img/img_cate_bg.svg) no-repeat left top/cover;
  content: "";
}
@media screen and (max-width: 768px) {
  .categolyLinks-inner::before {
    display: none;
  }
}

.categolyLinks-list {
  display: grid;
  gap: 0 20px;
  grid-template-columns: repeat(4,1fr);
}
@media screen and (max-width: 768px) {
  .categolyLinks-list {
    gap: 14px 0;
    grid-template-columns: 100%;
  }
}

.categolyLink {
  display: block;
}

.categolyLink-img {
  width: 100%;
  height: auto;
  aspect-ratio: 315/160;
  overflow: hidden;
}

.categolyLink img {
  width: 100%;
  transition: scale .3s ease-out;
}

.categolyLink:hover img {
  scale: 1.05;
}

.categolyLink-txt {
  position: relative;
  padding: 13px 40px 13px 17px;
  background-color: #FFF;
  color: #222;
  font-size: 16px;
  font-weight: 700;
}
@media screen and (max-width: 768px) {
  .categolyLink-txt {
    padding: 3.46vw 10.66vw 3.46vw 4.8vw;
    font-size: 4.26vw;
  }
}

.categolyLink-txt::after {
  position: absolute;
  top: 50%;
  right: 20px;
  translate: 0 -50%;
  display: block;
  width: 13px;
  height: auto;
  aspect-ratio: 17/15;
  background: url(/assets/img/icn_arrow_right.svg) no-repeat center/cover;
  content: "";
}
@media screen and (max-width: 768px) {
  .categolyLink-txt::after {
    right: 5.86vw;
    width: 3.46vw;
  }
}

.topSection._news {
  padding-top: 70px;
}
@media screen and (max-width: 768px) {
  .topSection._news {
    padding-top: 21.33vw;
    padding-bottom: 12.26vw;
  }
}

.newsBoxWrap {
  display: grid;
  gap: 0 min(9.6vw,96px);
  grid-template-columns: repeat(2,1fr);
  max-width: 1000px;
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  .newsBoxWrap {
    gap: 16vw 0;
    grid-template-columns: 100%;
  }
}

.newsBox-jp {
  color: #1E295E;
  font-size: 16px;
  font-weight: 700;
}
@media screen and (max-width: 768px) {
  .newsBox-jp {
    font-size: 4.26vw;
  }
}

.newsBox-en {
  margin-top: 10px;
  color: #1E295E;
  font-family: 'Bellefair';
  font-size: 70px;
  line-height: 1.14;
}
@media screen and (max-width: 768px) {
  .newsBox-en {
    font-size: 14.66vw;
  }
}

.newsBox-en:first-letter {
  color: #3A93BA;
}

.newsList-item {
  display: block;
}

.news-data span {
  min-width: 85px;
}
@media screen and (max-width: 768px) {
  .news-data span {
    min-width: 22.66vw;
  }
}

.news-link {
  margin-top: 9px;
}

/*.newsList-item {
  padding: 15px 7px 20px 0;
  border-top: 1px solid #CFCFCF;
}
@media screen and (max-width: 768px) {
  .newsList-item {
    padding: 5.33vw 0;
  }
}

.newsList-item:last-child {
  border-bottom: 1px solid #CFCFCF;
}

.news-data {
  display: flex;
  align-items: center;
  gap: 0 10px;
}
@media screen and (max-width: 768px) {
  .news-data {
    gap: 0 2.66vw;
  }
}

.news-data time {
  color: #979797;
  font-size: 15px;
}
@media screen and (max-width: 768px) {
  .news-data time {
    font-size: 4vw;
  }
}

.news-data span {
  display: inline-block;
  padding: 2px 15px;
  background-color: #D8E9F0;
  color: #333;
  font-size: 14px;
}
@media screen and (max-width: 768px) {
  .news-data span {
    padding: .53vw 4vw;
    font-size: 3.73vw;
  }
}

.news-link {
  position: relative;
  display: block;
  margin-top: 9px;
  padding-right: 30px;
  color: #222;
  font-size: 15px;
  line-height: 1.46;
}
@media screen and (max-width: 768px) {
  .news-link {
    margin-top: 2.4vw;
    padding-right: 8vw;
    font-size: 4vw;
  }
}

.news-link:hover {
  text-decoration: underline;
}

.news-link::after {
  position: absolute;
  top: 50%;
  right: 0;
  translate: 0 -50%;
  display: block;
  width: 18px;
  height: auto;
  aspect-ratio: 1;
  background: url(/img/icn_pdf.svg) no-repeat center/cover;
  content: "";
}
@media screen and (max-width: 768px) {
  .news-link::after {
    width: 4.8vw;
  }
}

.newsBox-moreWrap {
  margin-top: 16px;
  text-align: right;
}
@media screen and (max-width: 768px) {
  .newsBox-moreWrap {
    margin-top: 4.26vw;
  }
}

.newsBox-more {
  position: relative;
  padding-right: 24px;
  color: #3E3E3E;
  font-size: 16px;
  font-weight: 500;
}
@media screen and (max-width: 768px) {
  .newsBox-more {
    padding-right: 7.46vw;
    font-size: 4.26vw;
  }
}

.newsBox-more:hover {
  text-decoration: underline;
}

.newsBox-more::after {
  position: absolute;
  top: 50%;
  right: 4px;
  rotate: 45deg;
  translate: 0 -50%;
  display: block;
  width: 8px;
  height: auto;
  aspect-ratio: 1;
  border-top: 2px solid #3A93BA;
  border-right: 2px solid #3A93BA;
  content: "";
}
@media screen and (max-width: 768px) {
  .newsBox-more::after {
    right: 1.06vw;
    width: 2.13vw;
  }
}*/

.topSection-inner {
  max-width: 1360px;
  margin: 0 auto;
  padding: 0 20px;
}

.topSection._business {
  padding-top: 200px;
  padding-bottom: 210px;
  background: url(/img/img_business_bg.svg) no-repeat center top/max(100vw,1920px);
}
@media screen and (max-width: 768px) {
  .topSection._business {
    padding-top: 9.6vw;
    padding-bottom: 21.33vw;
    background-position: center top 9.6vw;
  }
}

.businessBox-ttl {
  text-align: center;
}

.businessBox-jp {
  color: #1E295E;
  font-size: 16px;
  font-weight: 700;
}
@media screen and (max-width: 768px) {
  .businessBox-jp {
    font-size: 4.26vw;
  }
}

.businessBox-en {
  margin-top: 14px;
  color: #1E295E;
  font-family: 'Bellefair';
  font-size: 110px;
  line-height: 1.14;
}
@media screen and (max-width: 768px) {
  .businessBox-en {
    font-size: 14.93vw;
  }
}

.businessBox-en:first-letter {
  color: #3A93BA;
}

.businessBox-lead {
  margin-top: 30px;
  color: #222;
  font-size: 16px;
  font-weight: 500;
  line-height: 2.12;
  text-align: center;
}
@media screen and (max-width: 768px) {
  .businessBox-lead {
    margin-top: 8vw;
    font-size: 4.26vw;
    line-height: 2.06;
    text-align: left;
  }
}

.businessBox-moreWrap {
  margin-top: 70px;
  text-align: center;
}
@media screen and (max-width: 768px) {
  .businessBox-moreWrap {
    margin-top: 10.66vw;
  }
}

.businessBox-more {
  position: relative;
  display: inline-block;
  width: 297px;
  margin: 0 auto;
  padding: 11px 50px;
  border-radius: 9999px;
  background-color: #3A93BA;
  color: #FFF;
  font-size: 16px;
  font-weight: 500;
  transition: background .3s ease-out;
}
@media screen and (max-width: 768px) {
  .businessBox-more {
    width: 83.2vw;
    padding: 2.93vw 13.33vw;
    font-size: 4.26vw;
  }
}

.businessBox-more:hover {
  background-color: #1E295E;
}

.businessBox-more::after {
  position: absolute;
  top: 50%;
  right: 20px;
  translate: 0 -50%;
  display: block;
  width: 12px;
  height: auto;
  aspect-ratio: 12/10;
  background-color: #FFF;
  mask: url(/assets/img/icn_arrow_right.svg) no-repeat center/cover;
  transition: right .3s ease-out;
  content: "";
}
@media screen and (max-width: 768px) {
  .businessBox-more::after {
    right: 6.13vw;
    width: 3.46vw;
  }
}

.businessBox-more:hover::after {
  right: 15px;
}

.businessCards {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(4, 1fr);
  margin-top: 97px;
}
@media screen and (max-width: 768px) {
  .businessCards {
    gap: 4.26vw 0;
    grid-template-columns: 100%;
    margin-top: 23.46vw;
  }
}

.businessCard {
  display: block;
  border: 1px solid #E0E0E0;
  background-color: #FFF;
}

.businessCard-img {
  width: 100%;
  height: auto;
  aspect-ratio: 322/167;
  overflow: hidden;
}
@media screen and (max-width: 768px) {
  .businessCard-img {
    aspect-ratio: 336/164;
  }
}

.businessCard img {
  width: 100%;
  transition: scale .3s ease-out;
}

.businessCard:hover img {
  scale: 1.05;
}

.businessCard-ttl {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 80px;
  padding: 10px;
  color: #222;
  font-size: 16px;
  font-weight: 700;
}
@media screen and (max-width: 768px) {
  .businessCard-ttl {
    height: 17.59vw;
    padding: 2.66vw;
    font-size: 4.53vw;
  }
}

.brightness-130 {
    filter: brightness(130%);
}
