/* 轮播容器：核心是overflow:hidden，控制内容裁剪 */
.snapShotCont.carousel-container {
  position: relative;
  overflow: hidden;
  width: 100%;
  height: 600px; /* 可根据图片比例调整，或用JS动态计算 */
  margin: 0 auto;
}

/* 轮播列表：用flex布局实现水平排列，通过transform平移切换 */
.elastislide-list.carousel-slides {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  width: 100%;
  height: 100%;
  transition: transform 0.5s cubic-bezier(0.68, -0.55, 0.27, 1.55); /* 丝滑过渡 */
}

/* 每个轮播项：占满容器宽度，图片自适应填充 */
.elastislide-list.carousel-slides li {
  flex: 0 0 100%;
  height: 100%;
}

.elastislide-list.carousel-slides img {
  width: 100%;
  height: 100%;
  object-fit: cover; /* 图片不变形，覆盖容器 */
}

/* 切换按钮：居中+半透明背景 */
.carousel-btn {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: rgba(0,0,0,0.5);
  color: #fff;
  border: none;
  padding: 15px 20px;
  cursor: pointer;
  z-index: 10;
  font-size: 24px;
  transition: background 0.3s;
}

.carousel-btn:hover {
  background: rgba(0,0,0,0.8);
}

.carousel-prev {
  left: 20px;
}

.carousel-next {
  right: 20px;
}

/* 指示器：底部小圆点，高亮当前项 */
.carousel-indicators {
  position: absolute;
  bottom: 20px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  gap: 8px;
  z-index: 10;
}

.carousel-indicators .indicator {
  width: 12px;
  height: 12px;
  background: rgba(255,255,255,0.5);
  border-radius: 50%;
  cursor: pointer;
  transition: all 0.3s;
}

.carousel-indicators .indicator.active {
  background: #fff;
  transform: scale(1.2);
}

/* 响应式调整：不同屏幕尺寸下修改高度 */
@media (max-width: 768px) {
  .snapShotCont.carousel-container {
    height: 350px;
  }
}