@charset "UTF-8";









@media screen and (max-width:1470px){


    header{
        height:auto;
    }

    header h1{
        margin-left: 20px;
    }
    header h1 a{
        height: auto;
    }

    header .h-right > ul{
        margin-right: 45px;
    }
    header .h-right div{
        margin-right: 80px;
    }


}


@media screen and (max-width: 914px){

    header .h-right > ul {
        margin-right: 10px;
    }
    header .h-right div {
        margin-right: 40px;
    }
    header .h-right > ul > li > a {
        padding: 24px 5px 20px;

    }
}

@media screen and (max-width:700px){

    header .h-right > ul{
        float: none;
        position: fixed;
        top: 0;
        right: -200px;
        height: 100%;
        width: 200px;
        margin-right: 0;
        background-color: rgba(255,255,255,.6);
        z-index: 2;
        transition: .3s;
    }
    header .h-right > ul > li:nth-child(1){
        margin-top: 50px;
    }
    header .h-right > ul > li{
        float: none;
        width: 70%;
        height: 45px;
        text-align: center;
        line-height: 45px;
        white-space: nowrap;
    }

    header .h-right > ul > li > a{
        color: #449c4a;
        font-size: 14px;

    }
    header .h-right > ul > li .mnav{

    }
    header .h-right > ul > li:hover > a {
        color: #449c4a;
        background-color: transparent;
    }
    header .h-right > ul > li > a.on{
        background-color: transparent;
        color: #449c4a;
    }
    header .h-right > ul > li > a{
        display: inline-block;
        vertical-align: middle;
    }
    header .h-right > ul > li i{
        display: inline-block;
        width: 16px;
        height: 16px;
        margin-left: 10px;
        background: url("../img/xiala.png") no-repeat center/100%;
        vertical-align: middle;
    }
    header .h-right > ul > li .mnav{
        margin-left: 60px;
        line-height: 25px;
    }
    header .h-right > ul > li .mnav li a{
        color: #449c4a;
        font-size: 12px;
    }
    header .phonebtn{
        display: block;
        top:50%;
        right: 0;
        width:42px;
        height:34px;
        margin: -17px 20px 0 0;
        background: url("../img/dao.png") no-repeat center/100%;
        z-index: 9;
    }
    header .h-right div{
        display: none;
    }

}


@media screen and (max-width:700px){

    header h1{
        padding: 18px 0;
    }
    header h1 a{
        width: 130px;
    }
    header .h-right ul {

    }



}











