/* 轮播容器样式 */
.slideshow-container {
    max-width: 100%;
    position: relative;
    margin: auto;

}

/* 图片轮播样式 */
.mySlides {
    display: none;
}


/* 图片全宽 */
.mySlides img {
    width: 100%;
    height:auto;
}

@media screen and (max-width: 768px) {
    .mySlides img {
        width: 100%;
        height: auto;
    }
}
/* 轮播容器样式 */
.slideshow-container {
    max-width: 100%;
    position: relative; /* 确保伪元素相对于此容器定位 */
    margin: auto;
    overflow: hidden;
}

/* 图片遮罩 */
.slideshow-container::before {
    content: ""; /* 伪元素必须有content属性 */
    position: absolute; /* 绝对定位相对于最近的已定位祖先元素 */
    left: 0;
	top: 0%;
    width: 100%; /* 宽度覆盖整个容器 */
    height: 100%; /* 高度为容器的90%，留出顶部10% */
    background: rgba(0, 0, 0, 0.6); /* 黑色背景，80%透明度 */
    z-index: 5; /* 确保遮罩在图片之上，但在文字之下 */
}

@media screen and (max-width: 784px) {
    .slideshow-container::before {
		top: 0;
        width: 100%; /* 宽度覆盖整个容器 */
        height: 100%; /* 高度为容器的90%，留出顶部10% */
    }
}

.animate {
    animation-name: scaleDraw; /*关键帧名称*/
    animation-timing-function: linear; /*动画的速度曲线*/
    animation-iteration-count: 1; /*动画播放的次数*/
    animation-duration: 3s; /*动画所花费的时间*/
}

@keyframes scaleDraw {
    /*定义关键帧、scaleDrew是需要绑定到选择器的关键帧名称*/
    0% {
        transform: scale(1); /*开始为原始大小*/
    }
    100% {
        transform: scale(1.10);
    }
}