@charset "UTF-8";
/*////////////////////////*/
/*ファーストビュー*/
/*////////////////////////*/

/*トップスライダー*/
.top-slider {
	position: relative;
	width: 100%;
  padding: 80px 0;
  max-height: 650px;
}

.image_wrapper {
  position: absolute;
  top: 45%;
  display: flex;
  width: 100%;
  height: 200px;
  overflow: hidden;
}

.loop_image {
    width: auto;
    height: 100%;
    max-width: none;
}

.loop_image:nth-child(odd) {
  animation: loop3 320s -160s linear infinite;
}

.loop_image:nth-child(even) {
  animation: loop4 320s linear infinite;
}

@keyframes loop3 {
    0% {
      transform: translateX(100%);
    }
    to {
      transform: translateX(-100%);
    }
}

@keyframes loop4 {
    0% {
      transform: translateX(0);
    }
    to {
      transform: translateX(-200%);
    }
}



.bg-illust {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 1250px;
}



.slider1 .swiper-slide {
	height: unset;
}
.swiper-custom-parent {
  position: relative;
}
.slider1 {
  position: unset;
  width: 100%;
  height: 100%;
}
.swiper-pagination-bullet {
	width: 8%;
    height: 3px;
    border-radius: unset;
    background: #808080;
}
.top-catch {
	position: absolute;
	z-index: 1;
	top: 50%;
	left: 50%;
	transform: translateY(-50%) translateX(-50%);
	-webkit- transform: translateY(-50%) translateX(-50%);
	width: 90%;
	height: auto;
	/* background:rgba(0,0,0,0.7); */
}
.main-logo {
	width: 200px;
	height: 150px;
	position: absolute;
	z-index: 2;
	top: 50%;
	left: 50%;
	transform: translateY(-50%) translateX(-50%);
	-webkit- transform: translateY(-50%) translateX(-50%);
}


/*////////////////////////*/
/*セカンドビュー*/
/*////////////////////////*/


/*slider2*/
.sw-btn-box {
    position: relative;
    height: 50px;
    width: 110px;
    margin: 10px auto;
}
.swiper-button-prev, .swiper-container-rtl .swiper-button-next {
    left: 0;
    background: #134ea2;
    width: 44px;
    border-radius: 25px;
}
.swiper-button-next, .swiper-container-rtl .swiper-button-prev {
    right: 0;
    background: #134ea2;
    width: 44px;
    border-radius: 25px;
}
.swiper-button-next:after, .swiper-button-prev:after {
    font-size: 1.4rem;
    color: #fff;
}

.slider02-ph {
  height: 200px;
}
.slider02-text {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}


.bnr-box01 {
  position: relative;
  height: 180px;
  color: #fff;
  overflow-y: hidden;
  border-radius: 10px;
}
.bnr-box01-02 {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  -webkit- transform: translateY(-50%) translateX(-50%);
  color: #fff;
}
.bnr-box-img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -2;
}
.top-bg02 {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 180px;
  background: #4e93a6;
  mix-blend-mode: multiply;
}
.bnr-box02 {
  position: relative;
  height: 180px;
  color: #fff;
  overflow-y: hidden;
  border-radius: 10px;
}
.bnr-box02-02 {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  -webkit- transform: translateY(-50%) translateX(-50%);
}

.bnr-box03 {
  position: relative;
  height: 330px;
  overflow-y: hidden;
}
.bnr-box03-bg {
  position: absolute;
  top: 20px;
  left: 2%;
  width: 96%;
  height: calc(100% - 20px) ;
  background: #dfeaf0;
  border-radius: 10px;
  z-index: -1;
}
.bnr-box03-img {
  height: 200px;
}





/*slider3*/
.slider3 .slider-box {
	position: relative;
	height: 220px;
}

/*slider4*/
.slider04-cap {
	position: absolute;
	left: 15px;
	bottom: 10px;
	padding-left: 15px;
	background: url(/assets/images/common/icon-arrow02.png) no-repeat left center / 6px 10px;
}









/*PCのみ*/
@media (min-width: 768px) {

    .sw-wrap {
      border-radius: 30px 0 0 30px;
    }
    .catch01 {
      width: 700px;
    }
    .top-bg-sp {
      width: 100%;
      max-width: 1400px;
    }
}

@media (max-width: 768px) {

		.top-slider {
			height: 100vh;
      max-height: 400px;
			z-index: unset;
      padding-bottom: 0;
		}
    .top-bg-sp {
      height: 200px;
    }
    .image_wrapper {
      height: 120px;
    }
    .bg-illust {
      display: none;
    }

    .top-bg02 {
        top: 20%;
        height: 60%;
    }
    .bnr-box02 {
        height: 150px;
    }
    .slider02-ph {
      height: 180px;
    }
    .slider2 .swiper-pagination-bullet {
        width: 10%;
    }


}