/* 默认指示点颜色 */
.carousel-indicators li {
    background-color: #333; /* 替换成您想要的颜色 */
}

dl.carousel-indicators, 
ol.carousel-indicators, 
ul.carousel-indicators {
    margin-top: 0rem;
    margin-bottom: 0rem;
}

/* 激活状态的指示点颜色 */
.carousel-indicators .active {
    background-color: rgb(48,59,118); /* 替换成您想要的颜色 */
}

/* 调整导航按钮的大小以增大点击区域 */
a.carousel-control-prev,
a.carousel-control-next {
    width: 2rem; /* 增加宽度 */
    height: 2rem; /* 增加高度 */
    top: 50%; /* 垂直居中 */
    transform: translateY(-50%); /* 使按钮在中间 */
}

/* 自定义导航箭头颜色 */
.carousel-control-prev-icon,
.carousel-control-next-icon {
    background-color: #333; /* 设置背景颜色 */
    background-size: 2rem 2rem; /* 修改图标尺寸 */
    width: 2rem; /* 宽度 */
    height: 2rem; /* 高度 */
    background-size: 50%;   /* 调整箭头大小 */
    border-radius: 50%;     /* 可选：使箭头背景变成圆形 */
}

/* 调整轮播指示点的位置 */
.carousel-indicators {
    bottom: 0px; /* 调整为所需的位置 */
}

.card {
    height: 400px;
    width: 80%;
}
@media (min-width: 800px) {
    .card {
       height: 300px; /* 固定高度，可根据需要调整 */
    }
}

.card-body {
    display: flex;
    flex-direction: column;
    justify-content: center; /* 垂直居中 */
    align-items: center;     /* 水平居中 */
    height: 100%;            /* 填充父级卡片高度 */
    text-align: center;      /* 让文本居中对齐 */
}