@charset "utf-8";
/* CSS Document */
.base_slider {
  margin-top: 2rem;
}
.base_slider .slide_area {
  overflow-x: scroll;
  overflow-y: hidden;
  /*スクロールバー非表示*/
  -ms-overflow-style: none;
  scrollbar-width: none;
}
/*スクロールバー非表示*/
.base_slider .slide_area::-webkit-scrollbar {
  display: none;
}
.base_slider .area .slide_nav {
  display: none;
}

.base_slider.touch .area .slide_nav {
  display: none !important;
}
.base_slider .slide_area ul {
  margin-top: 0px;
  margin-right: 0px;
  margin-bottom: 0px;
  margin-left: 0px;
  padding-top: 0px;
  padding-right: 0px;
  padding-bottom: 0px;
  padding-left: 0px;
  width: 129rem;
  gap: 1rem;
}
.base_slider .slide_area ul.background {
  gap: 2rem;
}
.base_slider .slide_area ul li {
  display: block;
  margin-top: 0px;
  margin-right: 0px;
  margin-bottom: 0px;
  margin-left: 0px;
  padding-top: 0px;
  padding-right: 0px;
  padding-bottom: 0px;
  padding-left: 0px;
  width: 25rem;
}
.base_slider .slide_area ul li img {
  width: 100%;
}
.base_slider .slide_area ul.background li .img {
  aspect-ratio: 628/432;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
}
.base_slider .slide_area ul.background li .img img {
  display: none;
}
.base_slider .slide_area ul li .cap {
    width: fit-content;
    margin: 1rem auto 0;
    color:#fff;
}
.base_slider .area .slide_bar {
  height: 1px;
  background-color: var(--gray_line);
  margin-top: 2.5rem;
  position: relative;
}
body.black .base_slider .area .slide_bar {/* Black */
	filter: invert(1);
}
.base_slider .slide_bar span {
  display: block;
  width: 50%;
  height: 100%;
  position: absolute;
  top: 0px;
  left: 0px;
  background-color: var(--base_black);
}
@media only screen and (min-width: 768px) {
  .base_slider {
    margin-top: 3rem;
  }
  .base_slider .area .slide_nav {
    display: flex;
    margin-left: auto;
    margin-right: 0px;
    width: 9rem;
  }
	body.black .base_slider .area .slide_nav {/* Black */
		filter: invert(1);
	}
  .base_slider .area .slide_nav .slidebb {
    aspect-ratio: 1/1;
    width: 3rem;
    cursor: pointer;
    position: relative;
    overflow-x: hidden;
    overflow-y: hidden;
  }
  .base_slider .area .slide_nav .slidebb.stop {
    cursor: default;
  }
  .base_slider .area .slide_nav .slidebb.left {
    transform: rotate(180deg);
  }
  .base_slider .area .slide_nav .slidebb:after {
    width: 66.6667%;
    aspect-ratio: 1/1;
    display: block;
    position: absolute;
    left: 16.6667%;
    top: 16.6667%;
    content: "";
    -webkit-mask: url(../../images/arrow_normal_l_41fbcdf9.svg) center/contain no-repeat;
    mask: url(../../images/arrow_normal_l_41fbcdf9.svg) center/contain no-repeat;
    background: var(--base_black);
    transition: 0.3s all;
  }
  .base_slider .area .slide_nav .slidebb.stop:after {
    background: #a5acb1;
    transition: 0.3s all;
  }
  .base_slider .area .slide_nav .slidebb:hover:after {
    transform: translate(30%);
    transition: 0.3s all;
  }
  .base_slider .area .slide_nav .slidebb.stop:hover:after {
    transform: translate(0%);
    transition: 0.3s all;
  }
  .base_slider .slide_area {
    margin-top: 3rem;
  }
  .base_slider .slide_area ul {
    gap: 2rem;
  }
  .base_slider .slide_area ul li {
    width: 44.0rem;
  }
  .base_slider .slide_area ul li a {
    opacity: 1;
    transition: 0.3s opacity;
  }
  .base_slider .slide_area ul li a:hover {
    opacity: 0.8;
    transition: 0.3s opacity;
  }
}