body {color:#666666;font-family:Microsoft yahei;font-size:14px;}
body,div,ul,ol,li,dl,dt,dd,p,span,h1,h2,h3,h4,h5,h6,form,pre,fieldset,legend,table,tr,td,th,input,textarea,img {margin:0;padding:0;}
div,ul,ol,li,dl,dt,dd {margin:0 auto;list-style:none;font-size:14px;}
fieldset,img {border:0;}
textarea {resize:none;font-size:12px;}
a:link,a:visited {color:#666666;font-size:14px;text-decoration:none;}
a:hover,a:active {color:#FF0000;font-size:14px;text-decoration:none;}
a.white,a.white:visited {color:#FFFFFF;font-size:14px;text-decoration:none;}
a.black,a.black:visited {color:#666666;font-size:14px;text-decoration:none;}
a.links,a.links:visited {color:#666666;font-size:14px;text-decoration:none;margin:0px 5px 0px 4px;}

.clear,.cl {clear:both;}
.fl,.l {float:left;}
.fr,.r {float:right;}
.center {text-align:center;}
.mt5 {margin-top:5px;}
.mt10 {margin-top:10px;}
.pt10 {padding-top:10px;}
.text {width:120px;height:20px;line-height:20px;border:1px solid #8A8484;}

.duzhan{margin-top:90px;}
.bridgeCode {width:99%;text-align:center;padding-bottom:5px;}
.bridgeCode span {padding:0px 10px 0px 10px;}
.button_submit {padding-bottom:2px;font-weight:normal;cursor:pointer;}
.button_upload {padding-top:1px;border:1px solid #888888;width:195px;font-size:12px;cursor:pointer;}
.topCon_1 {float:left;width:100%;}

.Top-main {width:100%;height:36px;border-bottom:1px solid #DDDDDD;}
.Top-left {width:200px;height:36px;line-height:36px;float:left;}
.Top-left span {color:#666666;padding-left:5px;}
.Top-right {width:100px;height:36px;line-height:36px;float:right;text-align:right;}
.Top-right span {padding-right:5px;}
.Top-right a:link,.Top-right a:active,.Top-right a:visited {color:#06929F;text-decoration:none;font-size:14px;}
.Header {width:100%;margin-top:0px;overflow: hidden;position: fixed;top:0;z-index: 10;left: 0;box-shadow: 0px 0px 15px #000;display:none;}
.Header-logo {width:100%;height: 70px;text-align: center;padding: 5px;background: #006a11;}
.Header-logo img{max-height: 70px;}

.Menus{overflow: hidden;border-radius: 20px;margin: 5px;}
.Menus li{width: 25%;float: left;height: 35px;background: #006a11;text-align: center;box-sizing:border-box;-moz-box-sizing:border-box; /* Firefox */-webkit-box-sizing:border-box;line-height: 35px;}
.Menus li a{color: #FFF;font-size: 14px;display: block;height:100%;max-height: 106px;}
.Menus li:nth-child(2),.Menus li:nth-child(4),.Menus li:nth-child(2n+5){background: #FFA200;}
.Menus i{padding: 8px 0 5px 0;color: #FFF}

.topbg {width:100%;clear:both;z-index:1000;}
.navbtn {width:61px;height:39px;line-height:39px;position:fixed;right:1%;top:10px;z-index:1000;cursor:pointer;
    text-align:center;background:#1B6EB2;border:1px solid #DEDEDE;border-radius:5px;-moz-border-radius:5px;   
	-webkit-border-radius:5px;color:#DDDDDD;font-size:18px;filter:alpha(opacity=80);opacity:0.8;}
.navbg {width:207px;border:0px solid #0F60A2;background:#1A6DB1;position:fixed;right:1%;top:51px;display:none;z-index:999;}
.navbg li {width:100%;height:36px;border-bottom:1px solid #095DA2;}
.navbg li a {width:100%;display:block;height:35px;line-height:35px;border-bottom:1px solid #247AC1;font-size:16px;color:#FFFFFF;text-indent:23px;background:url('../images/navicos.jpg') 155px center no-repeat;}

.search {width:100%;height:27px;padding-top:10px;}
.searchA {float:left;width:80%;height:27px;}
.searchA input {width:100%;height:25px;line-height:25px;border:1px #C5C5C5 solid;font-size:12px;color:#888888;padding:0px 0px 0px 3px;}
.searchB {float:left;height:27px;padding-left:5px;}
.searchB input {width:46px;height:27px;border:0;cursor:pointer;color:#FFFFFF;background:#75D116;background-image:-moz-linear-gradient(center top, #7FDB1E, #4D8808);background-image:-moz-linear-gradient(top, #7FDB1E, #4D8808);background-image:-webkit-gradient(linear, 0 0, 0 100%, from(#7FDB1E), to(#4D8808));background-image:-webkit-linear-gradient(top, #7FDB1E, #4D8808);background-image:-o-linear-gradient(top, #7FDB1E, #4D8808);background-image:linear-gradient(top, #7FDB1E, #4D8808);}

.ContentA {clear:both;width:100%;padding:12px 0px 12px 0px;} 
.ContentA1 {width:100%;height:30px;line-height:30px;background:#FE5900;font-size:14px;font-family:Microsoft yahei;}
.ContentA1 span {color:#FFFFFF;padding-left:15px;padding-right:10px;}
.ContentA2 {width:100%;background:#F8F7F4;} 
.ContentA2a {width:90px;float:left;padding:12px 0px 0px 22px;} 
.ContentA2b {width:98%;float:left;line-height:21px;padding:5px 1% 5px 1%;}
.ContentA2b img {max-width:98%;height:auto !important;}
.ContentA2b table {width:99% !important;table-layout:fixed;word-wrap:break-word;}
.ContentA3 {width:100%;line-height:35px;font-size:14px;font-family:Microsoft yahei;margin-top: 10px;float: left;}
.ContentA3a {float:left;width:10%;height:30px;position: absolute;top: 21px;z-index: 199;left: 10px;}
.ContentA3a a {float:left;width:100%;height:30px;display:block;}
.ContentA3a i{font-size: 31px;color: #FFF}
.ContentA3b {float:left;color:#FFF;text-indent: 10px;font-size: 20px;line-height: 35px;background: #006a11;border-radius: 0 0 0 0;position: fixed;top: 0;left: 0;z-index: 198;width: 100%;height: 80px;line-height: 80px;text-align: center;font-weight: bolder;}
.ContentA3c {float:right;width:18%;background:url('../images/index_15.png') no-repeat 0px 6px;cursor:pointer;display: none;}
.ContentA3c span {color:#666666;padding-left:23px;cursor:pointer;}
.view_menumain {float:left;width:96%;padding:0 2%;}
.view_menumain ul {padding:0px;overflow: hidden;}
.view_menumain ul li{overflow: hidden;float: left;width: 23%;padding: 4px 1%;}
.view_menumain ul a {float:left;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;border:1px solid #DDDDDD;color:#FFF;border-radius:10px;background:#006a11;width: 99%;text-align: center;}

.ContentB {clear:both;width:100%;}
.ContentB1 {width:100%;height:30px;background:#0087FE;}
.ContentB1a {float:left;width:100%;height:30px;line-height:30px;font-size:14px;font-family:Microsoft yahei;}  
.ContentB1a span {color:#FFFFFF;padding-left:15px;}
.ContentB1b {float:left;width:70px;height:14px;padding-left:2px;background:#32CFB2;color:#FFFFFF;margin-top:4px;}  

.ContentC {clear:both;width:100%;}
.ContentC1 {width:100%;height:30px;line-height:30px;background:#FCB803;font-size:14px;font-family:Microsoft yahei;}
.ContentC1 span {color:#FFFFFF;padding-left:15px;padding-right:10px;}
.ContentC .BB {clear:both;width:95%;height:20px;text-align:right;border-bottom:1px solid #DDDDDD;}

.ContentE {clear:both;width:100%;padding-top:12px;}
.ContentE1 {width:100%;height:30px;line-height:30px;background:#0087FE;font-size:14px;font-family:Microsoft yahei;}
.ContentE1 span {color:#FFFFFF;padding-left:15px;padding-right:10px;}
.ContentE2 {float:left;width:48%;height:180px;margin:5px 1% 10px 1%;overflow:hidden;} 
.ContentE2a {width:98%;height:150px;border:1px solid #CCCCCC;background:#FFFFFF;padding:1%;box-sizing:border-box;box-sizing:border-box;-o-box-sizing:border-box;-ms-box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;overflow:hidden;} 
.ContentE2a img {width:100%;}
.ContentE2b {width:98%;height:25px;line-height:25px;border:1px solid #CCCCCC;background:#BAD99E;text-align:center;color:#3F4D5A;text-overflow:ellipsis;margin-top:2px;overflow:hidden;white-space:nowrap;} 

.About {width:98%;height:15px;text-align:right;padding-top:0px;display: none;}
.AboutContent {width:98%;min-height:100px;_height:100px;padding:1%;line-height:24px;border-bottom:0px solid #DDDDDD;color:#333333;clear:both;font-size: 14px;}
.aboutus {clear:both;padding:10px 0px 10px 5px;line-height:28px;}
.aboutus a:link,.aboutus a:visited {background:url('../images/ico_09.png') no-repeat left center;padding-left:12px;font-size:16px;font-weight:bold;color:#666666;margin-right:10px;display:block;float:left;}
.company {clear:both;padding:10px;}
.company img {max-width:98%;height:auto !important;}
.company table {width:99% !important;table-layout:fixed;word-wrap:break-word;}

.footnav {clear:both;width:99%;padding-top:10px;padding-bottom:10px;}
.footnav ul {overflow: hidden;}
.footnav ul li {float:left;width:25%;height:30px;line-height:30px;background:#D40;padding: 6px 0;}
.footnav ul li:nth-of-type(2n){background: #333;}
.footnav ul li a {display:block;width:100%;height:100%;font-size:14px;color:#FFF;text-align:center;}

.shareview {font-size:14px;line-height:180%;color:#7FA6C6;width:92%;margin:10px 4% 0px 4%;}
.Footder {clear:both;width:100%;min-height:140px;_height:140px;padding-top:10px;}
.FootderA {width:100%;border-bottom:0px solid #DDDDDD;border-top:1px solid #DDDDDD;text-align:center;line-height:22px;}
.FootderAContent {padding:8px 5px 8px 5px;color:#666666;}
.FootderC {width:100%;text-align:center;background:#33D0B3;position:fixed;bottom:0;display:block;left:0;z-index:100;}
.footbtn {width:100%;height:62px;border-top:1px solid #E9F0F4;background:#F7FAFC;background-image:-moz-linear-gradient(center top, #EDF4F7, #FCFDFE);background-image:-moz-linear-gradient(top, #EDF4F7, #FCFDFE);background-image:-webkit-gradient(linear, 0 0, 0 100%, from(#EDF4F7), to(#FCFDFE));background-image:-webkit-linear-gradient(top, #EDF4F7, #FCFDFE);background-image:-o-linear-gradient(top, #EDF4F7, #FCFDFE);background-image:linear-gradient(top, #EDF4F7, #FCFDFE);}
.footbtn li {float:left;width:24.5%;height:100%;}
.footbtn a {display:block;width:100%;height:32px;margin-top:30px;color:#7FA6C6;text-align:center;}
.footbtn a span {display:block;width:100%;height:100%;line-height:32px;font-size:14px;cursor:pointer;}
.share {background:url('../images/share.png') center 6px no-repeat;border-right:1px solid #FFFFFF;}
.sms {background:url('../images/sms.png') center 6px no-repeat;border-right:1px solid #FFFFFF;border-left:1px solid #E2ECF1;}
.tel {background:url('../images/tel.png') center 6px no-repeat;border-right:1px solid #FFFFFF;border-left:1px solid #E2ECF1;}
.map {background:url('../images/map.png') center 6px no-repeat;border-left:1px solid #E2ECF1;}

.newslist1 {clear:both;width:98%;margin-left:1%;padding:5px 0px 0px 0px;}
.newslist1 ul {float:left;width:100%;}
.newslist1 ul li {padding:0px 0px 0px 13px;border-bottom:#DFDFDF 1px dashed;text-align:left;background:url('../images/more.png') no-repeat 1px center;height:28px;line-height:28px;}
.newslist1 ul li a:link,.newslist1 ul li a:visited,.newslist1 ul li a:active {text-decoration:none;font-size:12px;color:#666666;}

.newslist2 {clear:both;width:98%;margin-left:1%;padding:10px 0px 0px 0px;min-height:200px;_height:200px;}
.newslist2 ul {float:left;width:100%;}
.newslist2 ul li {padding:0px 0px 0px 13px;border-bottom:#DDD 1px dashed;text-align:left;height:28px;line-height:28px;background:url('../images/more.png') no-repeat 3px center;}
.newslist2 ul li a:link,.newslist2 ul li a:visited,.newslist2 ul li a:active {text-decoration:none;font-size:12px;color:#666666;}
.newslist2 ul li span {color:#808080;padding-left:10px;}

.prolist2 {float:left;width:100%;clear:both;}
.prolist2 ul {width:94%;padding:5px 3% 0 3%;overflow: hidden;}
.prolist2 ul li {float:left;width:48%;height:180px;margin:5px 1% 10px 1%; }
.prolist2 li div {float:left;width:100%;}
.prolist2 li img {float:left;width:100%;display:block;}
.prolist2 .proimg {float:left;width:99%;height:150px;border:1px solid #CCCCCC;background:#FFFFFF;padding:1%;box-sizing:border-box;box-sizing:border-box;-o-box-sizing:border-box;-ms-box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;overflow:hidden;}
.prolist2 .protxt {float:left;width:98%;height:25px;line-height:25px;border:1px solid #CCCCCC;background:#006a11;text-align:center;color:#FFFFFF;text-overflow:ellipsis;margin-top:2px;overflow:hidden;white-space:nowrap; }

.content {width:100%;}
.content h1 {font-weight:bold;font-size:16px;line-height:30px;color:#325065;text-align:center;border-bottom:1px dashed #999999;width:98%;margin:10px 1%;}
.content h1 p {width:100%;font-size:16px;line-height:30px;color:#555555;text-align:center;}
.content .ptimeviews {font-size:12px;}
.content .ptimeviews span {padding-left:10px;font-size:12px;}
.content .view {font-size:13px;line-height:180%;color:#325065;width:98%;padding:8px 0px;margin:0px 1% 0px 1%;}
.content .view p {font-size:13px;line-height:180%;color:#325065;width:100%;}
.content .view div img {max-width:98%;height:auto !important;}
.content .view div table {width:99% !important;table-layout:fixed;word-wrap:break-word;}
.content .jobtable {width:99%;border-left:1px solid #CCCCCC;border-top:1px solid #CCCCCC;}
.content .jobtable td {border-bottom:1px solid #CCCCCC;border-right:1px solid #CCCCCC;}
.content .backlist2 {display:block;width:60px;height:32px;line-height:32px;margin:15px auto;color:#FFFFFF;font-size:14px;text-align:center;background:#FF8101;border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;}
.content .prevpage,.content .nextpage {display:block;width:98%;margin:0px 1% 8px 1%;height:25px;line-height:25px;font-size:12px;color:#325065;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;background:#DDDDDD;border-radius:2px;-moz-border-radius:2px;-webkit-border-radius:2px;}
.content .prevpage span,.content .nextpage span {padding-left:10px;}
.content .hr {width:98%;height:0;border-top:1px dashed #999999;margin:6px 1%;}

.downloadlist {width:99%;clear:both;min-height:200px;_height:200px;}
.downloadlist dl {float:left;width:100%;padding:5px 0px 10px 0px;}
.downloadlist dt {float:left;width:110px;}
.downloadlist dd {float:left;width:180px;padding-left:10px;}
.downloadlist div {float:left;width:100%;}
.downloadlist div ul {}
.downloadlist div ul li {line-height:23px;}
.downloadlist div span {color:#006699;}

.linklist {width:95%;clear:both;padding:10px 0px 10px 0px;}
.linklist ul {width:100%;}
.linklist ul li {text-align:left;height:28px;line-height:28px;}
.submitTable {border:0;}
.submitTable td {height:35px;font-size:12px;}
.submitTable td input {height:24px;line-height:24px;}
.in {line-height:24px;border:1px solid #999999;}
.welcome {color:#333333;font-size:13px;font-weight:bold;background-color:orange;}

/* pages */
.dede_pages {width:98%;text-align:center;line-height:30px;padding:10px 0px 10px 0px;}
.dede_pages span {text-align:center;color:#FFFFFF;background:#FB9007;border:1px solid #E61636;margin:0px 2px;padding:3px 8px 3px 8px;font-weight:bold;}
.dede_pages a {text-align:center;color:#666666;background:#FFFFFF;border:1px solid #DDDDDD;margin:0px 2px;padding:3px 8px 3px 8px;}

/* banner */
.big-pic {width:100%;position:relative;}
.big-pic img {float:left;width:100%;height:auto;display:block;}
.big-pic-in {position:relative;width:100%;height:auto;overflow:hidden;}
.pic-list {position:relative;height:auto;-webkit-transform:translate3d(0,0,0);z-index:0;}
.slide-dot {width:95%;overflow:hidden;position:absolute;left:0;bottom:0;height:26px;text-align:right;padding:0 5% 0 0;}
.slide-dot span {display:inline-block;width:6px;height:6px;border-radius:8px;vertical-align:top;z-index:10;background:#B5B5B5;margin:8px 3px 0 2px;}
.slide-dot .slide-dot-cur {z-index:10;vertical-align:top;background:#C80002;width:7px;height:7px;border-radius:10px;margin-top:7px;}
.transition {-moz-transition:-moz-transform 0.3s ease-out;-webkit-transition:-webkit-transform 0.3s ease-out;-o-transition:-o-transform 0.3s ease-out;transition:transform 0.3s ease-out;}

.banner4 {width:300px;height:200px;overflow:hidden;position:relative;}
.slider4 {width:6550px;position:absolute;}
.slider4 li {float:left;display:inline;}
.slider4 img {width:300px;height:200px;display:block;}
.num4 {position:absolute;bottom:5px;right:5px;}
.num4 li {float:left;width:15px;height:14px;line-height:14px;color:#FFFFFF;background:url('../images/dots_01.png') no-repeat;text-align:center;font-size:12px;cursor:pointer;padding-bottom:5px;margin-right:5px;display:inline;}
.num4 li.on,.num4 li:hover,.num4 li.active {color:#FFFFFF;background:url('../images/dots_02.png') no-repeat;line-height:14px;font-size:12px;}





.iConinfo{width: 100%;overflow: hidden;}
.iConinfo>.title{line-height: 40px;color: #FFF;font-size: 16px;overflow: hidden;background: #006a11;text-align: center;}
.iConinfo>.title p{float: left;padding: 0 10px 0 5px;background: #006a11;border-radius: 0 20px 0 0}
.iConinfo>.title a{background: #006a11;color: #FFF;text-align: center;font-weight: bolder;font-size: 16px;padding: 0 10px;}
.iConinfo>.info{overflow: hidden;padding: 10px;font-size: 14px}
.iConinfo>.info a{font-size: 14px;}
.wapimages{width: 48%;float: left;padding: 0 1%;margin-bottom: 10px;}
.wapimages .pic{display: table;position: relative;width: 100%;height: 160px;overflow: hidden;border: 1px solid #CCC;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;}
.wapimages .pic a{display: table-cell;vertical-align: middle;line-height: 0;text-align: center;}
.wapimages .pic a img{max-width: 100%;}
.wapimages .title{line-height: 25px;height: 25px;padding: 5px;text-align: center;border:1px solid #CCC;border-top: 0;background: #006a11;}
.wapimages .title a{color: #FFF}

.wapnews{width: 100%;overflow: hidden;}
.wapnews li{line-height: 25px;height: 25px;margin: 5px 0;border-bottom:1px dashed #DDD;background:url('../images/more.png') no-repeat 3px center;padding-left:15px;}

.bottomnav{position: fixed;right: 0;bottom: 0;}
.navbutton{z-index: 200;position: fixed;bottom: 15px;right: 15px;color: #333;-webkit-transform: rotate(45deg);transform: rotate(45deg);transition: 300ms;}
.navbutton .bg{background: #FFF;width: 44px;height: 44px;position: absolute;top: 6px;right: 2px;border-radius: 100%;z-index: -1;transition: 300ms}
.navbutton.on{color: #FFF;-webkit-transform: rotate(270deg);transform: rotate(270deg);transition: 300ms;}
.navbutton.on .bg{background: #333;transition: 300ms;border-radius: 100%}
.navinfo{transition:300ms;-webkit-transform: scale(1) translateX(-100%) translateY(100%);transform: scale(1) translateX(100%) translateY(100%);width: 180px;background: #333;position: fixed;bottom: 0;right: 0;}
.navinfo.show{transition:300ms;-webkit-transform: scale(1) translateX(0) translateY(0);transform: scale(1) translateX(0) translateY(0);background: #333;padding-bottom: 80px;}
.navinfo li{width: 50%;float: left;height: 90px;text-align: center;}
.navinfo li a{color: #FFF;padding-top: 25%;display: block;height: 75%;font-size: 15px;}

.iConinfo .more{background: #FFA200;border-radius: 15px;height: 30px;line-height: 30px;width: 100px;margin: 0 auto;text-align: center;margin-bottom: 10px;}
.iConinfo .more a{color: #FFF;display: block;font-size: 16px;}

.searchbutton{position: absolute;left: 10px;top: 19px;color: #FFF; cursor:pointer;}
.searchbutton i{font-size: 31px;}
.searchArea{position: fixed;left: 0;top: 0;height: 70px;background: #689A70;padding: 5px 0;width: 100%;z-index: 201;transition: 300ms ease}
.searchClose{color: #FFF;font-size: 40px;position: absolute;top: 19px;left: 10px;cursor:pointer;}
.searchClose i{float: left;}
.close{top: -80px;transition: 300ms ease;}

.searchFrom{width: 100%;float: right;padding-left: 50px;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;line-height: 70px;height: 70px;}
.searchFrom form{overflow: hidden;padding: 15px 0;}
.searchFrom input{width: 80%;height: 40px;padding: 0;border-radius: 20px 0 0 20px;border: 0;font-family: Microsoft Yahei;font-size: 14px;text-indent: 20px;float: left;outline:none;}
.searchFrom button{width: 16%;float: left;border: none;height: 40px;border-radius: 0 20px 20px 0;background: #006a11;cursor:pointer;}
.searchFrom button i{color: #FFF}

.nav {position: fixed;z-index: 100;opacity: 0;-webkit-transition-property: all;transition-property: all;-webkit-transition-duration: 300ms;transition-duration: 300ms;top: 0;z-index: 199}
.nav__trigger {display: block;position: fixed;width: 30px;height: 25px;right: 10px;top: 20px;z-index: 200;}
.nav--active .nav__trigger {opacity: 0.5;}
.nav__icon {display: inline-block;position: relative;width: 30px;height: 5px;background-color: #FFFFFF;-webkit-transition-property: background-color, -webkit-transform;transition-property: background-color, -webkit-transform;
transition-property: background-color, transform;transition-property: background-color, transform, -webkit-transform;
-webkit-transition-duration: 300ms;transition-duration: 300ms;}
.nav__icon:before,.nav__icon:after {content: '';display: block;width: 30px;height: 5px;position: absolute;background: #FFFFFF;-webkit-transition-property: margin, -webkit-transform;transition-property: margin, -webkit-transform;transition-property: margin, transform;transition-property: margin, transform, -webkit-transform;-webkit-transition-duration: 300ms;transition-duration: 300ms;}
.nav__icon:before {margin-top: -10px;}
.nav__icon:after {margin-top: 10px;}
.nav--active .nav {opacity: 1;background-color: #333;}
.nav__list {padding: 20px 0 20px 20%;}
.nav__item {list-style-type: none;text-align: left;line-height:45px;}
.nav__link {font-size: 16px !important;text-transform: uppercase;text-decoration: none;color: #FFF !important;opacity: 1;-webkit-transition: opacity 300ms ease-in-out;transition: opacity 300ms ease-in-out;line-height: 35px;}

.style-1 .nav {-webkit-transform: translateX(-100%);transform: translateX(-100%);width: 100%; height: 100%;}
.style-1 .nav__link {opacity: 0;-webkit-transition-delay: 500ms;transition-delay: 500ms;}
.style-1 .nav--active .nav__link {opacity: 1;}
.style-1 .nav--active .nav {-webkit-transition: all 300ms ease-in-out;transition: all 300ms ease-in-out;
  -webkit-transform: translateX(0);transform: translateX(0);}
.style-1 .nav--active .nav__icon {background: rgba(0, 0, 0, 0);}
.style-1 .nav--active .nav__icon:before {margin-top: 0;-webkit-transform: rotate(45deg);transform: rotate(45deg);}
.style-1 .nav--active .nav__icon:after {margin-top: 0;-webkit-transform: rotate(-45deg);transform: rotate(-45deg);}

.style-3 .nav {width: 100%;height: 100%;-webkit-transform: translateX(100%);transform: translateX(100%);}
.style-3 .nav--active .nav {-webkit-transform: translateX(40%);transform: translateX(40%);}
.style-3 .duzhan {-webkit-transform: scale(1) translateX(0);transform: scale(1) translateX(0);-webkit-transition: all 300ms ease-in-out;transition: all 300ms ease-in-out;}
.style-3 .nav--active .duzhan {-webkit-transform: scale(0.9) translateX(-90%);transform: scale(0.9) translateX(-90%);}
.style-3 .nav__icon {background: rgba(0, 0, 0, 0);}
.style-3 .nav__icon:before {margin-top: 0;-webkit-transform: rotate(90deg);transform: rotate(90deg);}
.style-3 .nav__icon:after {margin-top: 0;-webkit-transform: rotate(180deg);transform: rotate(180deg);}
.style-3 .nav--active .nav__icon {-webkit-transform: rotate(135deg);transform: rotate(135deg);}

@media all and (min-width:640px) {body {width:640px;margin:0 auto;}}