#newsCarousel .carousel-control-prev,
#newsCarousel .carousel-control-next {
    top: -72px;              /* 取消垂直居中 */
    width: 38px;            /* 控制按钮宽度 */
    height: 38px;           /* 控制按钮高度 */
    background-color: #8c8c8c;
    border: 2px solid #7f7f7e;
    border-radius: 50%;
}

#newsCarousel .carousel-control-prev {
    left: auto;             /* 清除默认 left */
    right: 60px;            /* 距离右边 60px */
}

#newsCarousel .carousel-control-next {
    left: auto;
    right: 10px;            /* 紧挨 prev */
}

#newsCarouselMove .carousel-control-prev,
#newsCarouselMove .carousel-control-next {
    top: -72px;              /* 取消垂直居中 */
    width: 38px;            /* 控制按钮宽度 */
    height: 38px;           /* 控制按钮高度 */
    background-color: #8c8c8c;
    border: 2px solid #7f7f7e;
    border-radius: 50%;
}

#newsCarouselMove .carousel-control-prev {
    left: auto;             /* 清除默认 left */
    right: 60px;            /* 距离右边 60px */
}

#newsCarouselMove .carousel-control-next {
    left: auto;
    right: 10px;            /* 紧挨 prev */
}


#projectCarousel .carousel-control-next, #projectCarousel .carousel-control-prev {
    width: 38px;            /* 控制按钮宽度 */
    height: 38px;           /* 控制按钮高度 */
    background-color: #8c8c8c;
    border: 2px solid #7f7f7e;
    border-radius: 50%;
    top: 50%;
    transform: translateY(-50%);
    z-index: 99999;
}

#pjCarousel .carousel-control-next, #pjCarousel .carousel-control-prev {
    width: 38px;            /* 控制按钮宽度 */
    height: 38px;           /* 控制按钮高度 */
    background-color: #8c8c8c;
    border: 2px solid #7f7f7e;
    border-radius: 50%;
    top: 60px;
    z-index: 99999;
    right: 15px;
}

#myCarousel .carousel-control-next, #myCarousel .carousel-control-prev {
    width: 38px;            /* 控制按钮宽度 */
    height: 38px;           /* 控制按钮高度 */
    background-color: #8c8c8c;
    border: 2px solid #7f7f7e;
    border-radius: 50%;
    top: 50%;
    transform: translateY(-50%);
    z-index: 99999;
}

#myCarousel .carousel-control-next {
    right: 20px;
}

#myCarousel .carousel-control-prev {
    left: 20px;
}

.mask {
    position: absolute;
    height: 100%;
    width: 100%;
    background: linear-gradient(to bottom,
      rgba(0, 0, 0, 0.18) 0%,
      rgba(0, 0, 0, 0.12) 10%,
      rgba(0, 0, 0, 0.08) 30%,
      rgba(0, 0, 0, 0) 100%
    );
    /*background-color: rgba(0,0,0,0.3);*/
    z-index: 2;
}

/* 左侧元素从左向右淡入动画 */
@keyframes fadeInLeft {
    from {
        opacity: 0; /* 初始透明 */
        transform: translateX(-100px); /* 初始位置：向左偏移50px */
    }
    to {
        opacity: 1; /* 结束不透明 */
        transform: translateX(0); /* 结束位置：回归原位 */
    }
}

/* 右侧元素从右向左淡入动画 */
@keyframes fadeInRight {
    from {
        opacity: 0; /* 初始透明 */
        transform: translateX(100px); /* 初始位置：向右偏移50px */
    }
    to {
        opacity: 1; /* 结束不透明 */
        transform: translateX(0); /* 结束位置：回归原位 */
    }
}

/* 动画类：绑定动画逻辑 + 控制时长/缓动 */
.fadeInLeft, .fadeInRight {
    opacity: 0; /* 默认透明（等待动画触发） */
    animation-duration: 0.8s; /* 动画时长（可调整） */
    animation-timing-function: ease-out; /* 缓动效果：先快后慢 */
    animation-fill-mode: both; /* 动画结束后保持最终状态 */
}

/* 给左侧元素分配动画 */
.fadeInLeft {
    animation-name: fadeInLeft;
}

/* 给右侧元素分配动画 */
.fadeInRight {
    animation-name: fadeInRight;
}

/* 轮播项未激活时，隐藏动画（避免初始加载混乱） */
.carousel-item:not(.active) .fadeInLeft,
.carousel-item:not(.active) .fadeInRight {
    display: none; /* 非激活轮播项的内容不显示 */
}