/* splideここから */
.container {
  width: 100%;
  /* margin-top: 40px; */
}

.splide-wrapper {
  max-width: 700px;
  margin-right: auto;
  margin-left: auto;
}

.splide__list {
  height: auto;
}

.splide__slide img {
  height: auto;
  width: 100%;
}

/* .splide__slide {
  opacity: .5;
} */

.splide__arrow--prev {
  left: 8px;
}

.splide__arrow--next {
  right: 8px;
}

.splide__track--nav>.splide__list>.splide__slide.is-active {
  border: none;
  opacity: 1;
}

/* 以下カスタマイズ */
.splide__track--nav>.splide__list>.splide__slide {
    border: none;
    /* cursor: pointer; */
}


.splide-main01,
.splide-main02,
.splide-main03 {
  margin-bottom: 10px;
}

.splide__arrow {
  background-color: #fff;
  opacity: 1;
}

.splide__arrow:hover:not(:disabled) {
  opacity: 1;
}

.splide__arrow svg {
  fill: #231816;
  width: 0.6em;
  height: 0.6em;
}

.splide-main01 li,
.thumbnail-carousel01 li,
.splide-main02 li,
.thumbnail-carousel02 li,
.splide-main03 li,
.thumbnail-carousel03 li {
  background-color: #f3efec;
}

.thumb-wrapper {
  aspect-ratio: 3 / 2;
  width: 100%;
  overflow: hidden;
  position: relative;
}

/* 画像は中でフィット（またはカバー） */
.thumb-wrapper img {
  width: 100%;
  height: 100%;
  object-fit: contain;  /* coverでトリミング、containで全体表示 */
  display: block;
}

.thumbnail-carousel .thumb-wrapper img {
  object-fit: cover;  /* coverでトリミング、containで全体表示 */
}

/* splideここまで */