@charset "utf-8";
/* CSS Document */
.phone_nav{display:none;}

@media screen and (max-width:1200px){
    body{ -webkit-tap-highlight-color:rgba(0,0,0,0);}
    .phone_nav{display: block;}
    .header{display: none;}	.body_on{overflow:hidden; }

    /*头部*/
    .phone_nav .top{ background: #fff; height: 50px; position:relative; left: 0; top: 0; width: 100%; box-sizing: border-box; padding: 0 10px; z-index:9999;}
    .phone_nav .top .a{float: left; width: 120px; margin: 12px 0 0;}
    .phone_nav .top .a img{width:100%;}
    .phone_nav .top .but{ float:right; width: 25px; height: 25px; margin:10px 0; display: block;}
    .phone_nav .top .but i{width:100%; height: 2px; margin-top: 15px; background: #000; display: block; position: relative; transition: 0.4s;}
    .phone_nav .top .but i:before,
    .phone_nav .top .but i:after{content:""; position:absolute; left:0; top:0; display:block; width:100%; height:2px; background: #000; transition: 0.4s;}
    .phone_nav .top .but i:before{ margin-top: -7px;}
    .phone_nav .top .but i:after{ margin-top: 7px;}

    /*背景*/
    .phone_nav .box{ width:100%; height: 100%; background:rgba(0,0,0,0.8); position: fixed; left: 0; top: 0; z-index: 9998; transform: translateX(100%); transition: 0.7s; }
    .phone_nav .box_con{ margin:50px 10px 0px 10px; overflow-x: hidden;}

    /*列表*/
    .phone_nav .box_con ul{ border-bottom: 1px solid rgba(225,225,225,0.7);}
    .phone_nav .box_con li{ border-bottom: 1px solid rgba(225,225,225,0.7); padding: 15px 10px; position: relative;}
    .phone_nav .box_con li a{color:#fff; font-size: 16px;}
    .phone_nav .box_con li:last-child{border-bottom: 0; }
    .phone_nav .box_con ol{display: none; padding-top: 10px;}
    .phone_nav .box_con .a_zk{position:absolute; right:10px; top:14px; width: 20px; height: 20px; transition:0.4s;  transform: rotate(-90deg);
        background: url(../images/ico_nav.html) right no-repeat;}
    .phone_nav .box_con .a_zk_on{transform: rotate(0deg);}

    /*打开样式*/
    .phone_on .top .but i:before{ transform: rotate(45deg); margin: 0;}
    .phone_on .top .but i:after{ transform: rotate(-45deg); margin: 0;}
    .phone_on .top .but i{ background:none;}
    .phone_on .box{transform: translateX(0%); }
}