@media  (max-width: 1300px){
    .slogan{
        padding: 30% 0;
    }

}

@media (max-width: 1005px){
    .items a{
        width: 45%; 
        font-size: 23px; 
        width: 250px;
    }
    .text-img {
        font-size: 15px;
    }
    .slogan{
        padding: 45% 0;
    }
    .wid{
        font-size: 14px!important;
    }
    
}

@media  (max-width: 950px){
    .slogan{
        padding: 40% 0;
    }

    .logo-img-up{
        width: 8%;
    }

}


@media (max-width: 820px){
    .items a{
        width: 50%; 
        width: 200px;
    }
    .items{
        padding: 20px 0;
    }
    
    .text-img {
        font-size: 15px;
    }
    .slogan{
        padding: 50% 0;
    }
    .slogan h2{
        font-size: 20px;

    }

    .logo-img {  
        width: 15%; 
    } 

    
}

@media (max-width: 750px){
    
    .items a{
        width: 45%; 
        height: auto;
    }
    .items{
        padding: 0;
    }
    .btn-items .btn{
        font-size: 15px;
        margin-bottom: 20px;      

    }
    .wid{
        font-size: 12px!important;
    }

    .slogan-content{
        flex: 1 1 calc(45%);        
    
    }

    .slogan-content p{
        padding: 5px;
    }

}

@media (max-width: 650px){
    .text-img {
        font-size: 12px;
    }

    .btn-items .btn{
        font-size: 12px;
    }
    .text-block{
        font-size: 25px;
    }

    .slogan h1{
        font-size: 40px;

    }

    .slogan h2{
        font-size: 15px;
    }

    .slogan a{
        font-size: 10px;
    }
    
    .wid{
        width: 30% !important;
        margin: 0 auto;
    }
    .input input{
        width: 80%;
    }

    .slogan-content{
        flex: 1 1 calc(90%);        
    
    }

}
@media (max-width: 530px){  
    .li-bg {  
        display: flex;  
        flex-direction: column;  
        align-items: flex-end; 
        padding: 10px;
    }  
    .li-bg-up {  
        display: flex;  
        flex-direction: column;  
        align-items: flex-end; 
        padding: 10px;
    } 
    .home-top{
        height: 100px;  
    } 
    .logo-img-up{
        width: 30%;
    }

    .li-bg li {  
        text-align: center;
        margin-right: 10px auto;
        padding: 5px;
    }  

    .li-1{
        transform: translateX(-150%);
        top: 15px;
    }
    .li-2{
        transform: translateX(-130%);
        top: 15px;
    }
    .logo-img {  
        width: 20%; 
    } 
}


@media (max-width: 450px){
    .slogan a{
        font-size: 10px;
    }

}

@media (max-width: 430px){
    .btn-items .btn{
        font-size: 10px;
    }

}


@media (max-width: 400px){
    .items a{
        width: 100%; 
    }

    

}