@charset "utf-8";

.bgImageBase::before {
  content: '';
  display: block;
  position: fixed;
  top: 0;
  left: 0;
  width: 100svw;
  height: 100vh;
  background-repeat: no-repeat;
  background-position: center center;
  background-color: #fff;
  background-size: cover;
  transition: 0.5s opacity ease;
}
.bgImage::before {
  opacity: 0;
  content: '';
  display: block;
  position: fixed;
  top: 0;
  left: 0;
  width: 100svw;
  height: 100vh;
  background-repeat: no-repeat;
  background-position: center center;
  background-color: #fff;
  background-size: cover;
  transition: 1s opacity ease;
}
.bgImage.active::before {
  opacity: 1;
}
.bgImage.sec02::before {
  background-image: url(/assets/images/toppage/section02_bg.webp);
}
.bgImage.sec03::before {
  background-image: url(/assets/images/toppage/section03_bg.webp);
}
.bgImage.sec04::before {
  background-image: url(/assets/images/toppage/section04_bg.webp);
}
.bgImage.sec05::before {
  background-image: url(/assets/images/toppage/section05_bg.webp);
}
.bgImage.sec06::before {
  background-image: url(/assets/images/toppage/section06_bg.webp);
}
.bgImage.sec07::before {
  background-image: url(/assets/images/toppage/section07_bg.webp);
}

.visualArea {
  position: relative;
  height: calc(100svh + var(--visual-bottom-margin));
  min-height: calc(610px + var(--visual-bottom-margin));
  overflow: hidden;
}
.visualArea::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100svw;
  height: 140px;
  background: linear-gradient(
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 1) 100%
  );
  z-index: 1;
}
.visualArea .visualFadeSlider {
  height: 100%;
}
.visualFadeSlider .swiper-wrapper {
  height: 100%;
}
.visualFadeSlider .swiper-slide {
  height: 100%;
  background-position: center center;
  background-size: cover;
  position: relative;
}
.visualFadeSlider .swiper-slide::before {
  content: '';
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  background: rgba(0, 0, 0, 0.2);
  width: 100%;
  height: 100%;
}
.visualFadeSlider .slide01 {
  background-image: url(/assets/images/toppage/mv_slide_bg01.webp);
}
.visualFadeSlider .slide02 {
  background-image: url(/assets/images/toppage/mv_slide_bg04.webp);
  background-size: auto 100%;
  background-repeat: no-repeat;
}
.visualFadeSlider .slide03 {
  background-image: url(/assets/images/toppage/mv_slide_bg09.webp);
}
.visualFadeSlider .slide04 {
  background-image: url(/assets/images/toppage/mv_slide_bg08.webp);
}
@media screen and (max-width: 767px) {
  .visualFadeSlider .slide01 {
    background-image: url(/assets/images/toppage/mv_slide_bg01_sp.webp);
  }
  .visualFadeSlider .slide02 {
    background-image: url(/assets/images/toppage/mv_slide_bg04_sp.webp);
  }
  .visualFadeSlider .slide03 {
    background-image: url(/assets/images/toppage/mv_slide_bg09_sp.webp);
  }
  .visualFadeSlider .slide04 {
    background-image: url(/assets/images/toppage/mv_slide_bg08_sp.webp);
  }
}
.visualFadeSlider .swiper-pagination {
  top: calc(50% + 10px);
  left: 3.125%;
  width: 8px;
  opacity: 0;
}
.visualFadeSlider.displayed .swiper-pagination {
  animation: fadeIn 1s cubic-bezier(0.215, 0.61, 0.355, 1) forwards;
  animation-delay: 0.6s;
}

.visualFadeSlider .swiper-pagination .swiper-pagination-bullet {
  display: block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  margin: 12px 0 0;
  background: #fff;
}

.visualArea .btnArea01 {
  position: absolute;
  width: 81.5%;
  left: 50%;
  transform: translate(-50%, 0);
  bottom: calc(220px + var(--visual-bottom-margin));
  z-index: 5;
  display: flex;
  justify-content: flex-end;
}
.visualArea .btnArea01 a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 42px;
  padding: 0 30px;
  border: 1px solid var(--site-color-main);
  background-color: #fff;
  color: var(--site-color-main);
  font-size: 1.8rem;
  font-weight: 700;
  text-decoration: none;
  transition: var(--hover-transition);
}
.visualArea .btnArea01 a:hover {
  background-color: var(--site-color-main);
  color: #fff;
}
.visualArea .btnArea01 a .c-link-arrow02 {
  margin-left: 8px;
}
.visualArea .btnArea01 a:hover .c-link-arrow02 {
  background-color: #fff;
}

@media screen and (max-width: 1279px) {
  .visualArea .btnArea01 {
    width: calc(100% - 40px);
  }
}

.visualArea .messageArea {
  position: absolute;
  left: 3.125%;
  bottom: calc(50% - 10px);
  color: #fff;
  z-index: 1;
}
.visualArea .messageArea .sub {
  font-size: 2.8rem;
  font-weight: 700;
  margin-bottom: 20px;
}

.visualArea .messageArea .main {
  font-size: 6.8rem;
  line-height: 1.4;
  letter-spacing: 0;
}

.visualArea .messageArea .main2 {
  font-size: 4.8rem;
  line-height: 1.6;
  letter-spacing: 0.03em;
}
.visualArea .messageArea .main2 .point {
  display: none;
}
@media screen and (max-width: 1023px) {
  .visualArea .messageArea .main2 .point {
    display: block;
  }
}

.visualArea .messageArea .textWrap {
  overflow: hidden;
  opacity: 0;
}
.visualArea .messageArea .intext {
  opacity: 0;
  transform: matrix(1, 0, 0, 1, 0, 100);
  transition: 1.4s cubic-bezier(0.22, 1, 0.36, 1) 0.2s;
}
.visualArea .messageArea.displayed .textWrap {
  opacity: 1;
}
.visualArea .messageArea.displayed .intext {
  opacity: 1;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

.visualArea .pickupArea {
  opacity: 0;
  position: absolute;
  left: 50%;
  transform: translate(-50%, 0);
  bottom: calc(84px + var(--visual-bottom-margin));
  width: 81.5%;
  z-index: 4;
}
.visualArea .pickupArea.displayed {
  animation: fadeIn 1s cubic-bezier(0.33, 1, 0.68, 1) forwards;
  animation-delay: 0.2s;
}
@keyframes pickupfadeup {
  0% {
    transform: translate(-50%, 30px);
    opacity: 0;
  }
  80% {
    opacity: 1;
  }
  100% {
    opacity: 1;
    transform: translate(-50%, 0);
  }
}

.visualArea .pickupArea .heading {
  font-family: 'Roboto', sans-serif;
  font-weight: 400;
  font-size: 1.6rem;
  line-height: 21px;
  color: #fff;
  margin-bottom: 10px;
}
.visualArea .pickupBox {
  padding: 19px 20px;
  background: rgba(0, 0, 0, 0.3);
  border-radius: 8px;
}
.pickupSlider {
  overflow-x: hidden;
}

.pickupSlider .swiper-button-prev,
.pickupSlider .swiper-button-next {
  width: 20px;
  height: 20px;
}
.pickupSlider .swiper-button-prev {
  left: auto;
  right: 20px;
  bottom: -36px;
  top: auto;
}
.pickupSlider .swiper-button-next {
  right: -6px;
  bottom: -36px;
  top: auto;
}
.pickupArea .swiper-navigation-icon {
  width: 9px;
  height: 14px;
  color: #fff;
}
.pickupSlider .swiper-slide {
  position: relative;
}
.pickupSlider .swiper-slide:not(:last-child)::before {
  content: '';
  position: absolute;
  top: 0;
  right: -40px;
  display: block;
  height: 100%;
  width: 1px;
  background: #D9D9D9;
}
.pickupItem {
  display: flex;
  height: 82px;
  flex-flow: column nowrap;
  justify-content: flex-end;
}
.pickupItem .date {
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 1.6rem;
  height: 25px;
  color: #fff;
}
.pickupItem .title {
  height: 60px;
}
.pickupItem .title a {
  display: flex;
  gap: 0 13px;
  color: #fff;
  text-decoration: none;
}
.pickupItem .title a:hover {
  text-decoration: none;
}
.pickupItem .title a .text {
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1.25;
}
.pickupItem .title a .icon {
  align-self: center;
  flex-shrink: 0;
}
@media screen and (max-width: 1279px) {
  .visualFadeSlider .swiper-pagination {
    left: 20px;
  }
  .visualArea .messageArea {
    left: 20px;
  }
  .visualArea .pickupArea {
    width: calc(100% - 40px);
  }
  .pickupSlider .swiper-slide:not(:last-child)::before {
    right: -35px;
  }
}
@media screen and (max-width: 1023px) {
  .pickupSlider .swiper-slide:not(:last-child)::before {
    right: -20px;
  }
}
@media screen and (max-width: 767px) {
  .visualFadeSlider .swiper-pagination {
    left: 10px;
    top: calc(50% - 70px);
  }
  .visualArea .messageArea {
    bottom: calc(50% + 70px);
    left: 10px;
  }
  .visualArea .messageArea .sub {
    font-size: 1.6rem;
    font-weight: 400;
    margin-bottom: 10px;
  }
  .visualArea .messageArea .main {
    font-size: 3.5rem;
    line-height: 1.342;
  }
  .visualArea .messageArea .main2 {
    font-size: 3.0rem;
  }
  .pickupSlider .swiper-slide:not(:last-child)::before {
    display: none;
  }
}

.sectionBlock + .sectionBlock {
  margin-top: 50px;
}
@media screen and (max-width: 767px) {
  .sectionBlock + .sectionBlock {
    margin-top: 30px;
  }
}

.section01 {
  margin-top: calc(-1 * var(--visual-bottom-margin));
  position: relative;
  z-index: 8;
}
.section01 .l-contentsBox01::before {
  content: '';
  display: block;
  background: #fff;
  position: absolute;
  left: 0;
  bottom: 50px;
  width: 100%;
  height: calc(100% - var(--visual-bottom-margin) - 50px);
}
.section01 .leadWrap {
  display: flex;
}
.section01 .leadWrap .leftArea {
  flex: 1;
  padding-right: 40px;
}
.section01 .leadWrap .rightArea {
  flex-shrink: 0;
  width: 48%;
  margin-top: -30px;
  display: flex;
  justify-content: flex-end;
}
.section01 .leadWrap .rightArea .imgWrap {
  width: 100%;
  max-width: 500px;
}
@media screen and (max-width: 1366px) {
  .section01 .leadWrap .rightArea .imgWrap {
    max-width: 460px;
  }
}
@media screen and (max-width: 1279px) {
  .section01 .lead {
    padding-left: 68px;
  }
  .section01 .leadWrap .rightArea {
    width: 40%;
    position: relative;
  }
}
@media screen and (max-width: 1023px) {
  .section01 .lead {
    padding-left: 0;
  }
  .section01 .lead br {
    display: none;
  }
  .section01 .leadWrap .rightArea {
    width: 370px;
    left: auto;
    right: -20px;
  }
}
@media screen and (max-width: 767px) {
  .section01 .leadWrap {
    display: block;
  }
  .section01 .leadWrap .leftArea {
    padding-right: 0;
  }
  .section01 .leadWrap .rightArea {
    width: 94%;
    margin: 24px auto 0;
    right: auto;
  }
  .section01 .leadWrap .rightArea .imgWrap {
    width: 100%;
    max-width: 400px;
    margin: 0 auto;
  }
}

.section02 {
  margin-top: -80px;
  position: relative;
  padding: 280px 0 100px;
  /*
  background-image: url(/assets/images/toppage/toppage_section02_bg.webp);
  background-size: cover;
  background-attachment: fixed;
  */
  z-index: 7;
}
.section02 .c-heading01__main br {
  display: none;
}
@media screen and (max-width: 1279px) {
  .section02 .lead {
    padding-left: 68px;
  }
}
@media screen and (max-width: 1023px) {
  .section02 .lead {
    padding-left: 0;
  }
}
@media screen and (max-width: 767px) {
  .section02 .c-heading01__main br {
    display: block;
  }
}
.section03 {
  position: relative;
  padding: 100px 0;
  z-index: 6;
}
.section03 .c-heading01 {
  margin-bottom: 10px;
}
.section03 .l-btnArea01 {
  margin-top: 0px;
}
.section04 {
  position: relative;
  padding: 100px 0;
  z-index: 5;
}
.section04 .l-contentsBox01 {
  overflow: hidden;
}
.section04 .l-contentsBox01 .decoration01 {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  background-image: url(/assets/images/toppage/decoration01.svg);
  background-size: 100% auto;
  background-repeat: no-repeat;
  background-position: right bottom;
}
@media screen and (max-width: 767px) {
  .section04 .l-contentsBox01 .decoration01 {
    background: none;
  }
}
.section05 {
  position: relative;
  padding: 100px 0;
  z-index: 4;
}
.section05 .l-contentsBox01 {
  overflow: hidden;
}
.section05 .l-contentsBox01 .decoration02 {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  background-image: url(/assets/images/toppage/decoration02.svg);
  background-position: center top;
  background-size: cover;
}
@media screen and (max-width: 767px) {
  .section05 .l-contentsBox01 .decoration02 {
    background: none;
  }
}

.section06 {
  position: relative;
  padding: 100px 0;
  z-index: 4;
}
.section06 .l-contentsBox01 {
  overflow: hidden;
}
.section06 .l-contentsBox01 .decoration01 {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  background-image: url(/assets/images/toppage/decoration01.svg);
  background-size: 100% auto;
  background-repeat: no-repeat;
  background-position: right bottom;
}
@media screen and (max-width: 767px) {
  .section06 .l-contentsBox01 .decoration01 {
    background: none;
  }
}

.section07 {
  position: relative;
  padding: 100px 0 0;
  z-index: 3;
}
.section07 .l-contentsBox01::after {
  border-radius: 0;
}
.section07 .l-contentsBox01 {
  overflow: hidden;
  border-radius: 46px 0 0 0;
}
.section07 .l-contentsBox01 .decoration02 {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  background-image: url(/assets/images/toppage/decoration02.svg);
  background-position: center top;
  background-size: cover;
}
@media screen and (max-width: 767px) {
  .section07 .l-contentsBox01 {
    padding: 50px 0 100px;
  }
}

@media screen and (max-width: 767px) {
  .section07 .l-contentsBox01 .decoration02 {
    background: none;
  }
}
.newsArea {
  display: flex;
  gap: 64px;
}
.newsArea .p-newsArea01 {
  width: 100%;
}

@media screen and (max-width: 1023px) {
  .newsArea {
    display: block;
  }
  .newsArea .p-newsArea01 + .p-newsArea01 {
    margin-top: 50px;
  }
}
@media screen and (max-width: 767px) {
  .newsArea .p-newsArea01 + .p-newsArea01 {
    margin-top: 30px;
  }
}

.talentBook {
  max-width: 1200px;
  margin: 0 auto;
}
.talentBook iframe {
  height: 406px;
}
@media screen and (max-width: 1280px) {
  .talentBook iframe {
    height: 386px;
  }
}
@media screen and (max-width: 1279px) {
  .talentBook iframe {
    height: 410px;
  }
}
@media screen and (max-width: 1230px) {
  .talentBook iframe {
    height: 408px;
  }
}
@media screen and (max-width: 1180px) {
  .talentBook iframe {
    height: 396px;
  }
}
@media screen and (max-width: 1120px) {
  .talentBook iframe {
    height: 386px;
  }
}
@media screen and (max-width: 1078px) {
  .talentBook iframe {
    height: 436px;
  }
}
@media screen and (max-width: 1020px) {
  .talentBook iframe {
    height: 424px;
  }
}
@media screen and (max-width: 960px) {
  .talentBook iframe {
    height: 410px;
  }
}
@media screen and (max-width: 890px) {
  .talentBook iframe {
    height: 398px;
  }
}
@media screen and (max-width: 822px) {
  .talentBook iframe {
    height: 710px;
  }
}
@media screen and (max-width: 800px) {
  .talentBook iframe {
    height: 706px;
  }
}
@media screen and (max-width: 780px) {
  .talentBook iframe {
    height: 690px;
  }
}
@media screen and (max-width: 768px) {
  .talentBook iframe {
    height: 686px;
  }
}
@media screen and (max-width: 740px) {
  .talentBook iframe {
    height: 668px;
  }
}
@media screen and (max-width: 710px) {
  .talentBook iframe {
    height: 646px;
  }
}
@media screen and (max-width: 670px) {
  .talentBook iframe {
    height: 620px;
  }
}
@media screen and (max-width: 630px) {
  .talentBook iframe {
    height: 594px;
  }
}
@media screen and (max-width: 600px) {
  .talentBook iframe {
    height: 574px;
  }
}
@media screen and (max-width: 570px) {
  .talentBook iframe {
    height: 560px;
  }
}
@media screen and (max-width: 530px) {
  .talentBook iframe {
    height: 528px;
  }
}
@media screen and (max-width: 500px) {
  .talentBook iframe {
    height: 510px;
  }
}
@media screen and (max-width: 470px) {
  .talentBook iframe {
    height: 500px;
  }
}
@media screen and (max-width: 440px) {
  .talentBook iframe {
    height: 480px;
  }
}
@media screen and (max-width: 420px) {
  .talentBook iframe {
    height: 460px;
  }
}
@media screen and (max-width: 375px) {
  .talentBook iframe {
    height: 440px;
  }
}