
/*header*/
@media screen and (max-width: 860px){
    .navbar .all-links{
        position: fixed;
        left: -100%;
        width: 100%;
        display: block;
        height: 100vh;
        top: 96px;
        background: #2c3e50;
        transition: left 0.3s ease;
    }

    .navbar #menu-toggler:checked~.all-links {
        left: 0;
    }

    .navbar .all-links li {
        font-size: 18px;
    }

    .navbar #hamburger-btn {
        display: block;
    }

    .navbar .logo a{
        font-size:25px;
    }

    .link{
        color: #FFF;
    }

}


@media screen and (max-width: 560px) {
    section .cards .card {
        width: 100%;
        margin-bottom: 30px;
    }
}

/*header end**********************/


/*homepage*/
@media screen and (max-width: 860px){

    .homepage .homepage-content {
        z-index: 3;/*文字要在图片和灰色膜之上*/
        position: absolute;
        left: 5%;
        top: 35%;

    }


    .homepage .homepage-content h1 {
        font-size: 30px;
        font-weight: 700;
        margin-bottom: 10px;
    }

    .homepage .homepage-content h3 {
        font-size: 15px;
        font-weight: 700;
        margin-bottom: 10px;
    }


}

/*homepage end *********************/


/*homepage*/
@media screen and (max-width: 1000px){


    .sayimage{
        display: none;
    }

    .say{
        height:310px;
    }
    .say2{
        height:310px;
    }

    .say-content{
        width: 100%;
    }
    .say-right{
        width: 100%;
    }

    .headinfo{

        padding-left:0.75rem ;

    }

    .sayinfo{
        padding: 20px;
        color: #fff;
    }




    .sayimage2{
        display: none;
    }

    .say-content{
        width: 100%;
    }
    .say-right2{
        width: 100%;
    }

    .headinfo{

        padding-left:0.75rem ;

    }

    .sayinfo{
        padding: 20px;
        color: #fff;
    }

    .sayinfo2{
        padding: 20px;
        color: #000;
    }

    .headinfo2{

        padding-left:0.75rem ;

    }


    .sayhead2::before{
        content: "";
        position: absolute;
        width: 100px;
        height: 5px;
        background: linear-gradient(to right,#0d6efd,#fff);
        bottom: 0;
        left:0.75rem ;
    }

}



/*cards*/

@media screen and (max-width: 860px) {

    section .cards{
        max-width: 90%;
    }


    section .cards .card {
        width: calc(100% / 2 - 15px);
        margin-bottom: 30px;
    }

    #sale_img{
        width: 100%;text-align: center
    }

    #sale_img img{
        width: 90%;text-align: center
    }

    .card p{
        padding-left:60px;
    }


}

@media screen and (max-width: 560px) {
    section .cards .card {
        width: 100%;
        margin-bottom: 30px;
    }
}

/*cards end****************************/


/*plan*/

@media (max-width: 900px){
    .plan-content{
        width: 100%;
        flex-direction: column;
    }

    .plan-content>div{
        width: 100%;
    }

    .headleft{

        font-size: 15px;

    }

    .headright{
        font-size: 20px;
    }

    .detail-img{
        display: none;
    }

    .detail-text{
        width: 100%;


    }


    .plan-content>div{

        height: 200px;

    }

    .detail-text{
        padding: 20px;

    }

    .headleft{
        line-height:36px;
    }

    .headright{
        line-height:36px;
    }

    .plan{

        height: 950px;


    }

}

/*plan end*******************************/

/*about*/

@media (max-width: 500px){

    .about-content{
        flex-direction: column;
        width: 100%;
        height:1000px;
    }
    .about-left{
        position: relative;
        width: 100%;
        height: 500px;
    }

    .about-left img{
        width: 100%;
    }

    .about-right{
        width: 100%;
        height:1000px;
        padding: 20px;

    }

    .font2{
        font-size: 2rem;
        font-weight: 700;
    }

    .about-info{
        padding-top:30px;
    }



}


/*about end*********************/

/*culture*/

@media screen and (max-width: 860px) {

    .culture{
        width: 100%;
        flex-direction: column;
    }
    #culture{
        height: 690px;
    }


    .culture .idea{
        background: #f4f5f7;
        padding:2.81rem;
        list-style: none;
        border-radius: 5px;
        width: 100%;
        text-align: right;
        position: relative;
    }
}
/*culture end************************/

/*footer*/

@media (max-width: 900px) {
    footer .footct .link-boxes{
        flex-wrap: wrap;
    }
    footer .footct .link-boxes .input-box{
        width: 40%;
        margin-top: 10px;
    }
}
@media (max-width: 700px){
    footer{
        position: relative;
    }
    .footct .top .logo-details{
        font-size: 26px;
    }
    .footct .top .media-icons a{
        height: 35px;
        width: 35px;
        font-size: 14px;
        line-height: 35px;
    }
    footer .footct .link-boxes .box{
        width: calc(100% / 3 - 10px);
    }
    footer .footct .link-boxes .input-box{
        width: 60%;
    }
    .bottom-details .bottom_text span,
    .bottom-details .bottom_text a{
        font-size: 12px;
    }
}
@media (max-width: 520px){
    footer::before{
        top: 145px;
    }
    footer .footct .top{
        flex-direction: column;
    }
    .footct .top .media-icons{
        margin-top: 16px;
    }
    footer .footct .link-boxes .box{
        width: calc(100% / 2 - 10px);
    }
    footer .footct .link-boxes .input-box{
        width: 100%;
    }
}



/*footer end*/



