/* 基础容器类 */
.container,
.container-sm,
.container-md,
.container-lg,
.container-xl,
.container-xxl {
    width: 100%;
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto;
}

/* 原有的 Bootstrap 断点配置 */
@media (min-width: 576px) {
    .container-sm,
    .container-xxl {
        max-width: 540px;
    }
}

@media (min-width: 768px) {
    .container-md,
    .container-xxl {
        max-width: 720px;
    }
}

@media (min-width: 992px) {
    .container-lg,
    .container-xxl {
        max-width: 960px;
    }
}

@media (min-width: 1200px) {
    .container-xl,
    .container-xxl {
        max-width: 1140px;
    }
}

/* 新的 XXL 断点配置 */
@media (min-width: 1600px) {
    .container-xxl {
        max-width: 1580px;
    }
}

.col-10-1 { flex: 0 0 10%; max-width: 10%; }
.col-10-2 { flex: 0 0 20%; max-width: 20%; }
.col-10-3 { flex: 0 0 30%; max-width: 30%; }
.col-10-4 { flex: 0 0 40%; max-width: 40%; }
.col-10-5 { flex: 0 0 50%; max-width: 50%; }
.col-10-6 { flex: 0 0 60%; max-width: 60%; }
.col-10-7 { flex: 0 0 70%; max-width: 70%; }
.col-10-8 { flex: 0 0 80%; max-width: 80%; }
.col-10-9 { flex: 0 0 90%; max-width: 90%; }
.col-10-10 { flex: 0 0 100%; max-width: 100%; }