/* 调整主轮播图的样式 */
.swiper-container {
    width: 100%; /* 使Swiper容器宽度与父容器相同 */
    max-width: 100%; /* 防止Swiper容器宽度超过父容器 */
    overflow: hidden; /* 隐藏溢出的部分 */
}
.ls-swiper-main{

}
.ls-swiper-main .swiper-slide {
    text-align: center;
    font-size: 18px;
    background: #fff;

    /* 使图片垂直居中 */
    display: flex;
    justify-content: center;
    align-items: center;
}

.ls-swiper-main img {
    width: auto; /* 或者使用100%来使图片充满容器，但保持宽高比 */
    max-height: 500px; /* 可以调整这个值来控制显示图片的大小 */
	height: 300px; /* 或其他固定高度 */
    object-fit: cover; /* 这将保持图片的宽高比，多余的部分会被裁剪 */
}


/* 缩略图轮播的样式 */
.ls-swiper-thumbs {
    height: 120px; /* 调整缩略图区域的高度 */
    margin-top: 0px; /* 与主图之间的间距 */
    box-sizing: border-box;
}

.ls-swiper-thumbs .swiper-slide {
    opacity: 0.4;
    cursor: pointer;
    display: flex; /* 添加flex布局使图片垂直居中 */
    justify-content: center;
    align-items: center;
    margin-right: 10px; /* 为缩略图之间添加一些间距 */
	 width: 100px; /* 缩略图的宽度，根据需要调整 */
    height: 100px; /* 缩略图的高度，根据需要调整 */
}
/* 移除margin的样式 */
.no-margin {
    margin-right: 0 !important; /* 使用!important确保覆盖基础样式 */
}
.ls-swiper-thumbs .swiper-slide-thumb-active {
    opacity: 1; /* 当前活动的缩略图更明显 */
}

.ls-swiper-thumbs img {
    width: 100px; /* 控制缩略图的宽度 */
    height: auto; /* 保持图片的原始宽高比 */
    max-height: 100px; /* 限制缩略图的最大高度，确保它们不会太大 */
	object-fit: cover; 
}

.swiper-button-next:after, .swiper-button-prev:after{
	font-size:28px !important;
}
.swiper-button-next, .swiper-button-prev {
    top: 38% !important;
}