@charset "UTF-8";
/* 画像拡大*/
.top_slider_img {
  background: #fff;
}
/*
.top_slider_img img {
    transform: scale(1.035);


}
.splide__slide.is-active .top_slider_img img {
  animation: animationZoom 20s ease-in-out forwards;
}
@keyframes animationZoom {
  0% {
      transform: scale(1);
 }
  100% {
    transform: scale(1.1);
	      -webkit-backface-visibility:hidden;
      backface-visibility:hidden;
  }
}*/
/* 青い板　*/
.ita {
  margin: auto;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  display: flex;
  width: 0;
  height: 110%;
  top: 0;
  bottom: 0;
  position: absolute;
  background: linear-gradient(75.12984154789706deg, 
    #000000 12.752604166666668%,  /* Black */
    #000000 12.752604166666668%,  /* Black */
    #0d0d0d 66.14344618055556%, /* Dark Gray */
    #0d0d0d 91.60677083333333%); /* Dark Gray */
  z-index: 1;
}
.splide__slide.is-active .ita {
  animation: stretch 1s forwards, shrink 1s 1s forwards;
}
@keyframes stretch {
  0% {
    left: 0%;
    width: 0px;
  }
  100% {
    left: 0%;
    width: 100%;
  }
}
@keyframes shrink {
  0% {
    right: 0%;
    left: auto;
    width: 100%;
  }
  100% {
    right: 0;
    left: auto;
    width: 30%;
  }
}
/* 半円　板　*/
.ita:before {
  content: "";
  display: block;
  position: absolute;
  
  background: #000;
  

  
  width: 0px;
  height: 100%;
  left: 0;
  top: 0;
  bottom: 0;
  margin: auto;
}
.splide__slide.is-active .ita:before {
  animation: stretch_sub 1s forwards, shrink_sub 1s 1s forwards;
}
@keyframes stretch_sub {
  0% {
    left: 0%;
    width: 0px;
  }
  100% {
    left: 0%;
    width: 0px;
  }
}
@keyframes shrink_sub {
  0% {
    width: 0px;
    border-radius: 0;
  }
  100% {
    width: 100px;
    left: -100px;
    border-radius: 100% 0 0 100% / 50%;
  }
}
/*********************************** slider上のテキスト*/
.slider_text_wrap {
  font-weight: bold;
  color: #fff;
  text-align: center;
  z-index: 1;
}
.st_line {
  overflow: hidden;
}
.st_line span {
  display: block;
  font-size: 50px;
  line-height: 1;
  margin-bottom: 25px;
  font-style: italic;
}
/* 表示されているスライドのテキスト */
.splide__slide.is-active .st_line_01 span {
  animation: fadeIn 0.6s 2.3s both;
}
.splide__slide.is-active .st_line_02 span {
  animation: fadeIn 0.6s 2.4s both;
}
.splide__slide.is-active .st_line_03 a, .splide__slide.is-active .st_line_03 span {
  animation: fadeIn 0.6s 2.5s both;
}
.splide__slide.is-active .st_line_04 a {
  animation: fadeIn 0.6s 2.6s both;
}
/*.splide__slide.is-active .slider_text_wrap {
  animation:fadeIn 0.6s 2.5s both;
}
*/
/* アニメーション */
@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(100px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes fadeIn_02 {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
.slider_text_wrap {
  opacity: 0;
     margin-left: -4vw;

}
.splide__slide.is-active .slider_text_wrap {
  animation-delay: 1.5s;
  animation-duration: 0s;
  animation-fill-mode: both;
  animation-name: fadeIn_02;
}
/*********************************** slider内のmore */
.slider_more {
  margin-top: 30px;
  overflow: hidden;
}
.slider_more a {
  display: block;
  max-width: 400px;
  height: 60px;
  padding: 5px 25px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  display: flex;
  font-size: 17px;
  font-weight: bold;
  color: #000;
  background-color: #ffc415;
  border-radius: 100px;
  position: relative;
  letter-spacing: 1px;
  border:solid 2px #ffc415;
}
.slider_more a:hover{
background: #000;
color: #ffc415;
}


@media all and (min-width: 1071px) and (max-width: 1200px) {
.splide__slide, .top_slider_img, .top_slider_wrap {
    height: 800px;
}
.st_line span {
font-size: clamp(30px, 4vw, 50px);
}
.slider_text_wrap {
}

}


@media all and (min-width: 768px) and (max-width:1070px) {
.splide__slide, .top_slider_img, .top_slider_wrap {
    height: 400px;
}
.st_line span {
font-size: clamp(24px, 4vw, 30px);
}
.slider_text_wrap {
    margin-left: -6vw;
}
.slider_more a {
    height: 50px;
    font-size: 15px;
    letter-spacing: 0;
}
.slider_more {
    margin-top: 10px;
}

}

@media screen and (max-width: 767.888px) {
.top_slider_img {
    border-radius: 20px;
}

.splide__slide, .top_slider_img, .top_slider_wrap {
    height: 250px;
}
.st_line span {
font-size: clamp(18px, 4vw, 24px);
}
.slider_text_wrap {
margin-left: -35px;
    margin-top: 10px;
}
.slider_more a {
    height: 50px;
    font-size: 14px;

}
.slider_more {
    margin-top: 10px;
}
.slider_more a {
    height: 40px;
    font-size: 12px;
    line-height: 1.1;
	    padding: 5px 15px;
		letter-spacing: 0;
}
.st_line span {
    margin-bottom: 10px;
}

.splide__pagination {
    bottom: 20px!important;
    column-gap: 5px!important;
    margin-right: 11px!important;
}


@keyframes shrink {
  0% {
    right: 0%;
    left: auto;
    width: 100%;
  }
  100% {
    right: 0;
    left: auto;
    width: 150px;
  }
}

@keyframes shrink_sub {
  0% {
    width: 0px;
    border-radius: 0;
  }
  100% {
    width: 50px;
    left: -50px;
    border-radius: 100% 0 0 100% / 50%;
  }
}



}