@media (max-width: 2000px) {
    .li8 {
        display: none;
    }
}

@media (max-width: 1800px) {
    .li7 {
        display: none;
    }
}

@media (max-width: 1600px) {
    .li6 {
        display: none;
    }
}

@media (max-width: 1400px) {
    .li5 {
        display: none;
    }
}

@media (max-width: 1200px) {
    .li4 {
        display: none;
    }
}

@media (max-width: 1000px) {
    .li3 {
        display: none;
    }
}

@media (max-width: 800px) {
    .li2 {
        display: none;
    }
}

@media (max-width: 500px) {
    .ul01 {
        gap: 30px !important;
    }
}

@media (max-height: 450px) {
    .ul02 {
        gap: 30px !important;
    }
}

@media (max-height: 350px) {
    .ul02 {
        gap: 1rem !important;
    }
}

@media (max-height: 300px) {
    .ul02 {
        gap: 0.5rem !important;
    }
}