@import "../../styles/mixin";
.#{$prefix}-carousel-container {
  position: relative;
  width: 600px;
  height: 341px;
  margin: 0 auto;
  overflow: hidden;
}
.#{$prefix}-carousel-container .#{$prefix}-carousel-wrap {
  position: relative;
  height: auto;
  overflow: hidden;
  left: 0;
  top: 0;
}
.#{$prefix}-carousel-container .#{$prefix}-carousel-item {
  float: left;
  width: 600px;
  height: 300px;
  position: relative;
  transition-property: transform;
}
.#{$prefix}-carousel-container .#{$prefix}-carousel-item > img {
  display: block;
  width: 100%;
  height: auto;
}
.#{$prefix}-carousel-pagin-link {
  font-size: 0;
}
.carouse-mixin {
  width: 600px;
  height: 191px;
}
.carouse-mixin .#{$prefix}-carousel-item {
  width: 300px;
}
.carouse-mixin .#{$prefix}-carousel-item > img {
  width: 300px;
  display: inline-block;
}
.carouse-mixin .#{$prefix}-carousel-dots-wrap .#{$prefix}-carousel-dot {
  display: none;
}
.carouse-mixin .#{$prefix}-carousel-dot:nth-child(4n + 1) {
  display: inline-block;
}
.custom-dot-carousel .#{$prefix}-carousel-dots-wrap .#{$prefix}-carousel-dot {
  width: auto;
  height: auto;
  border: none;
  margin-right: 10px;
  padding: 0 10px;
  border-radius: 0;
}
.custom-dot-carousel
  .#{$prefix}-carousel-dots-wrap
  .#{$prefix}-carousel-dot:hover {
  border: none;
}

.carouse-percent {
  width: calc(100vw - 200px);
  .lg-carousel-item {
    width: calc(100vw - 200px);
    height: 300px;
    object-fit: cover;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
  }
}