@charset "utf-8";
body,ol,ul,h1,h2,h3,h4,h5,h6,p,th,td,dl,dd,form,fieldset,legend,input,textarea,select{margin:0;padding:0}
/* CSS Document */
body{margin:0; padding:0; font-family:"微软雅黑";-webkit-text-size-adjust:100%; min-width: 320px;overflow-x:hidden;}
input:required,textarea:required{outline:0 none; -webkit-box-shadow:none; -moz-box-shadow:none; -ms-box-shadow:none; -o-box-shadow:none; box-shadow: none;-webkit-appearance: none !important;}
*{margin:0; padding:0;}
a{text-decoration:none !important;line-height:none !important;cursor:pointer !important;}
a:focus{outline:none!important;}
ul,li,dl,dt,dd{list-style-type:none;}
i{font-style:normal}
li{list-style: none;}
img{max-width: 100%;}
.container-fluid{max-width:1230px !important;}
.overflow{white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.tr3{transition:all 0.3s; -moz-transition:all 0.3s;-ms-transition:all 0.3s; -o-transition:all 0.3s; -webkit-transition:all 0.3s;}
.tr4{transition:all 0.4s; -moz-transition:all 0.4s;-ms-transition:all 0.4s; -o-transition:all 0.4s; -webkit-transition:all 0.4s;}
.tr5{transition:all 0.5s; -moz-transition:all 0.5s;-ms-transition:all 0.5s; -o-transition:all 0.5s; -webkit-transition:all 0.5s}
.tr6{transition:all 0.6s; -moz-transition:all 0.6s;-ms-transition:all 0.6s; -o-transition:all 0.6s; -webkit-transition:all 0.6s}
.sizeCover{background-position: 50% 50%; background-size: cover;}
.clearfix:before,.clearfix:after {display: table;content:'';}
.clearfix:after{clear: both;}
.clearfix{ *zoom:1;}
.vertical_center{display: table-cell;vertical-align: middle;}
.wzduiqi{text-align: justify!important;text-align-last: auto!important;}
.da{transform:scale(1.1,1.1);-moz-transform:scale(1.1,1.1);-ms-transform:scale(1.1,1.1);-o-transform:scale(1.1,1.1);-webkit-transform:scale(1.1,1.1)}


/*大图轮播*/
.banner .lb1,.lb1 img{width: 100%;overflow: hidden;}
.banner .swiper-button-next{height: 150px!important;margin-top: -70px!important;width: 100px!important;right: -100px;}
.banner .swiper-button-prev{height: 150px!important;margin-top: -70px!important;width: 100px!important;left: -100px;}
.banner .lb1:hover .swiper-button-next{display:block;right: 10px;transition:all 0.6s;}
.banner .lb1:hover .swiper-button-prev{display:block;left: 10px;transition:all 0.6s;}
.banner .swiper-pagination-bullet{width:10px!important;height: 10px!important;}

header{position:relative;background: #2e75b6;padding-bottom: 15px;}
#logo{position: absolute;left: 50%;top: 0;margin-left: -121px;z-index: 9999;}
#logo .logo{position:absolute;left: 0;top:0px;bottom:0;right: 0;margin: auto;display: block;max-height: 100%;}
#bian{background: url(../images/tu3.png)no-repeat;width:89px;height: 55px;position: absolute;left: 50%;top:0;margin-left: -208px;}
#bian2{background: url(../images/tu4.png)no-repeat;width:89px;height: 55px;position: absolute;right: 50%;top:0;margin-right: -210px;}
header .top{padding: 16px 0 15px 0}
header .top .txt{color: aliceblue;font-size: 13px;}
header .top .txt b{color: aliceblue;font-size: 16px;font-weight: bold;}
header .top .tit h4{color:aliceblue;font-size: 13px;background: url(../images/tu1.png)no-repeat left center;padding-left: 26px;}
header .top .tit h4 b{color:aliceblue;font-size:22px;font-weight: bold;font-family: 'Arial';}
header .nav{background:#4fa0ed;position: relative;z-index: 100;}
header .nav:after{content:"";width:240px;height: 32px;background:url(../images/tu2.png)no-repeat center center/contain;position: absolute;left: 0;right: 0; bottom:-32px;margin:0 auto;}
/*pc导航*/
header nav{position: relative;}
header nav ul{clear: both;}
header nav ul li{position: relative;float:left;width:auto;text-align: center;}
header nav ul li  > a{position: relative;text-align:center; line-height:60px; display:block; color: #fff;font-size: 14px;width: 100%;}
header nav ul li .ul {position:absolute; display:none;padding:inherit;padding-top: 0px;left: 0;top: 100%;z-index: 100;width: 100%;}
header nav ul li .ul .li{float:none;position: relative;font-size: 14px;background:rgba(97,174,247,0.8);line-height: 40px;height: 40px;overflow: hidden;padding: 0 5px; color: #fff;border-top: 1px solid rgba(0,0,0,0.1);}
header nav ul li:hover{background: url(../images/bj2.jpg) repeat-x}
header nav ul li:hover > a{color: #fff;}
header nav ul li.active{background: url(../images/bj2.jpg) repeat-x}
header nav ul li.active > a{color: #fff;}
header nav ul li .ul .li:hover{background: url(../images/bj2.jpg) repeat-x;color: aliceblue;border-color: #2980d6;}
header nav ul li:nth-child(6){margin-left:212px;}
header nav ul li:nth-child(-n+5){padding: 0 18.4px;}
header nav ul li:nth-child(-n+5) .ul .li{width:calc(100% + 36.8px);margin-left: -18.4px;}
header nav ul li:nth-child(n+6):nth-child(-n+10){padding: 0 21.6px;}
header nav ul li:nth-child(n+6):nth-child(-n+10) .ul .li{width:calc(100% + 43.2px);margin-left: -21.6px;}

/*移动导航*/
header .sjdnav{ display:none;width:120px;height:auto;position:absolute;right:0;top:131px;z-index:2000; }
header .sjdnav ul{ padding:0; margin:0;}
header .sjdnav li{width:100%;background:rgba(0,0,0,0.55);line-height:38px;text-align:center;font-size:15px;line-height:38px;margin-bottom:1px}
header .sjdnav li a{display:block;color:#fff;}
header .sjdnav li a:hover{ background:rgba(35,143,221,0.8);}
header .ydd_btn{width:40px;cursor:pointer;position:absolute;z-index:2000;top:60px;right:15px;}
header .ydd_btn span{ display:block; width:100%; height:4px; background:#27a5fc;}
header .ydd_btn span.span02{margin:4px 0;}
header .ydd_btn.click{ background:none;}
header .ydd_btn.click span{ background:#27a5fc;}
header .ydd_btn.click span.span01{transform:rotate(45deg);-ms-transform:rotate(45deg); -moz-transform:rotate(45deg); -webkit-transform:rotate(45deg); -o-transform:rotate(45deg); position:relative;top:8px;margin-top:0px;} 
header .ydd_btn.click span.span02{margin:4px 0;}
header .ydd_btn.click span.span03{transform:rotate(-45deg);-ms-transform:rotate(-45deg); -moz-transform:rotate(-45deg); -webkit-transform:rotate(-45deg); -o-transform:rotate(-45deg);position:relative;top:-8px;margin-top:0px;}
header .ydd_btn.click span.span02{ width:0;filter:alpha(opacity=0);-moz-opacity:0;-khtml-opacity: 0; opacity: 0;}

.box{padding-bottom:70px;}
.box .title{text-align:center;padding: 54px 0 35px 0;}
.box .title h4{font-size:27px;font-weight: bold;color: #2e75b6;line-height: 27px;}
.box .title span{font-size:12px;text-transform: uppercase;color: #010101;line-height: 36px;padding-bottom: 4px; position: relative;display: block;margin-bottom: 18px;}
.box .title span:after{content:"";width:20px;height: 4px;background: #ff7b0e;position: absolute;left: 0;right: 0; bottom:0;margin: 0 auto;}
.box .title .tt{color:#222222;line-height: 23px;}
.box .gd{display:block;color: aliceblue;font-size: 12px;width: 170px;line-height: 45px;background: #2e75b6;text-align: center;text-transform: uppercase;border-radius: 26px;margin: 0 auto;margin-top: 45px;}
.box .gd:hover{background:#ff7b0e;}
.box ul{font-size:0;text-align: center;margin-bottom:42px;}
.box ul li{display:inline-block;padding: 0 1.5px;margin-bottom: 3px;}
.box ul li span{width:135px;line-height: 45px;color: aliceblue;font-size: 15px;background: #2e75b6;text-align: center;display: block;padding: 0 5px;}
.box ul li span:hover{background:#ff7b0e;}
.box ul li span.active{background:#ff7b0e;}


.main1{background:#f5f5f5;}
.main1 .box #swiper2 .hezi{background:#fff;}
.main1 .box #swiper2 .hezi .tt{position:relative;color: #000000;font-size: 15px;width: 100%;overflow: hidden;border-top: 1px solid #eeeeee;transition:all 0.7s;}
.main1 .box #swiper2 .hezi .tt h4{width: 100%;text-align: center;line-height:60px;transition:all 0.5s;transition:all 0.3s;padding: 0 8px 0 5px;font-size: 15px;}
.main1 .box #swiper2 .hezi .tt span{position: absolute;display: block;right: 0;top:0;bottom:0;width:0;height: 30px;margin: auto 0;transition:all 0.5s;}
.main1 .box #swiper2 .hezi .tt span i{width:70px;line-height: 30px;display: block;font-size: 12px;color: #fff;background: #ff7b0e;text-transform: uppercase;text-align: center;}

.main2 .box .title h4{color: #fff;}
.main2 .box .title span{color:#fff}
.main2 .box .title .tt{color:#fff;}
.main2 .hezi{background:#fff;padding: 40px;}
.main2 .hezi .img{float:left;width:48%;}
.main2 .hezi .img img{height:322px;}
.main2 .hezi .txt_box{float:left;width:52%;padding-left: 30px;}
.main2 .hezi .txt_box h4{color:#000000;font-size: 18px;line-height: 25px;padding-bottom: 17px;border-bottom: 1px solid #e9e9e9;position: relative;padding-right: 80px;}
.main2 .hezi .txt_box h4 .mo{line-height:30px;width: 70px;color: aliceblue;font-size: 12px;background: #ff7b0e;text-align: center;text-transform: uppercase;position: absolute;right: 0;top:0;display: block;}
.main2 .hezi .txt_box span{margin:14px 0 20px 0;color: #000000;line-height: 27px;display: block;height: 135px;overflow: hidden;}
.main2 .hezi .txt_box .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{background:#2e75b6 !important;}
.main2 .hezi .txt_box .txt{background: #f9f9f9;border: 1px solid #f0f0f0;}
.main2 .hezi .txt_box .txt .list{width:33.33%;float: left;text-align: center;padding: 20px 0;}
.main2 .hezi .txt_box .txt .list img{display:block;margin: 0 auto;margin-bottom: 10px;}
.main2 .hezi .txt_box .txt .list .img1{display:block;transition:all 0.5s;}
.main2 .hezi .txt_box .txt .list .img2{display:none;transition:all 0.5s;}
.main2 .hezi .txt_box .txt .list .tit{font-size:15px;color: #000000;line-height: 22px;}
.main2 .hezi .txt_box .txt .list .tt{font-size:12px;color: #afafaf;font-family: 'Arial';line-height: 13px;}
.main2 .hezi .txt_box .txt .list:hover .img1{display:none;transition:all 0.5s;}
.main2 .hezi .txt_box .txt .list:hover .img2{display:block;transition:all 0.5s;}
.main2 .hezi .txt_box .txt .list:hover{background:#2e75b6;}
.main2 .hezi .txt_box .txt .list:hover .tit{color: #fff;}
.main2 .hezi .txt_box .txt .list:hover .tt{color: #fff;}
.main2 .hezi .txt_box .txt .list.active .img1{display:none;transition:all 0.5s;}
.main2 .hezi .txt_box .txt .list.active .img2{display:block;transition:all 0.5s;}
.main2 .hezi .txt_box .txt .list.active{background:#2e75b6;}
.main2 .hezi .txt_box .txt .list.active .tit{color: #fff;}
.main2 .hezi .txt_box .txt .list.active .tt{color: #fff;}

.main3{background:#f5f5f5;}
.main3 .box .con .txt_box{width:385px;float: left;}
.main3 .box .con .txt_box a .list{padding: 34px 20px 34px 110px;margin-bottom: 10px;}
.main3 .box .con .txt_box a:nth-child(1) .list{background:#fff url(../images/tu12.png)no-repeat 34px center}
.main3 .box .con .txt_box a:nth-child(2) .list{background:#fff url(../images/tu14.png)no-repeat 34px center}
.main3 .box .con .txt_box a:nth-child(3) .list{background:#fff url(../images/tu16.png)no-repeat 34px center}
.main3 .box .con .txt_box a:nth-child(4) .list{background:#fff url(../images/tu18.png)no-repeat 34px center;margin: 0;}
.main3 .box .con .txt_box a:hover:nth-child(1) .list{background:#2e75b6 url(../images/tu13.png)no-repeat 34px center}
.main3 .box .con .txt_box a:hover:nth-child(2) .list{background:#2e75b6 url(../images/tu15.png)no-repeat 34px center}
.main3 .box .con .txt_box a:hover:nth-child(3) .list{background:#2e75b6 url(../images/tu17.png)no-repeat 34px center}
.main3 .box .con .txt_box a:hover:nth-child(4) .list{background:#2e75b6 url(../images/tu19.png)no-repeat 34px center;margin: 0;}
.main3 .box .con .txt_box a .list h4{color:#222222;font-weight: bold;font-size: 17px;line-height: 18px;padding-bottom: 10px;}
.main3 .box .con .txt_box a .list span{color:#555555;font-size: 12px;line-height: 14px;display: block;height: 14px;overflow: hidden;}
.main3 .box .con .txt_box a:hover .list h4{color:aliceblue;}
.main3 .box .con .txt_box a:hover .list span{color:aliceblue;}
.main3 .box .con .hezi{width:calc(100% - 385px);float: left;}
.main3 .box .con .hezi .lbtop{width:calc(100% - 194px);margin-left: 20px;float: left;}
.main3 .box .con .hezi .gallery-top{width:100%;}
.main3 .box .con .hezi .gallery-top .swiper-slide .list{position:relative;}
.main3 .box .con .hezi .gallery-top .swiper-slide .list img{height:494.5px;}
.main3 .box .con .hezi .gallery-top .swiper-slide .list .txt{position: absolute;left: 0;bottom:0;width: 100%;background:rgba(0,0,0,0.85);overflow: hidden;padding: 15px 30px;}
.main3 .box .con .hezi .gallery-top .swiper-slide .list .txt .tit{color: aliceblue;line-height: 27px;max-height: 54px;overflow: hidden;text-indent: 25px;}
.main3 .box .con .hezi .gallery-thumbs{height: 100%; box-sizing: border-box; cursor: pointer;background: #ededed;float: right;width: 154px;padding: 65px 0 14px 0;z-index: 0;border-right: 15px solid #ededed;border-left: 15px solid #ededed}
.main3 .box .con .hezi .gallery-thumbs .swiper-slide {opacity: 0.6;}
.main3 .box .con .hezi .gallery-thumbs .swiper-slide-thumb-active {opacity: 1; border: 3px solid #ff7b0e;}
.main3 .box .con .hezi .gallery-thumbs .txt{display:none;}
.main3 .box .con .hezi .swiper-button-next{width:60px;background:#3986cc url(../images/tu20.png)no-repeat center center;top:15px;margin: 0;right: -159px;}
.main3 .box .con .hezi .swiper-button-prev{width:60px;background:#3986cc url(../images/tu20.png)no-repeat center center;top:15px;margin: 0;left:auto; right: -95px;}

.main4{background:#fff;}
.main4 .box{padding:0;}
.main4 .con{padding-bottom:70px;}
.main4 .con #swiper3 .swiper-slide .hezi .tt{color:#000000;font-size: 15px;line-height: 48px;border: 1px solid #e9e9e9;background: #fff;text-align: center;padding: 0 8px;}
.main4 .con #swiper3 .swiper-slide .hezi:hover .tt{color:#fff;border-color: #2e75b6;background: #2e75b6;}
.main4 .con .swiper-button-prev{background:#d2d6d8 url(../images/tu21.png)no-repeat center center;width: 52px;height: 52px;margin-top: -26px;transition:all 0.4s;}
.main4 .con .swiper-button-prev:hover{background-color: #ff7b0e;transition:all 0.4s;}
.main4 .con .swiper-button-next{background:#d2d6d8 url(../images/tu22.png)no-repeat center center;width: 52px;height: 52px;margin-top: -26px;transition:all 0.4s;}
.main4 .con .swiper-button-next:hover{background-color: #ff7b0e;transition:all 0.4s;}

.main5 .con{text-align:center;display: table;margin:0 auto;}
.main5 .con .gao{height:235px;text-align: center;}
.main5 .con .gao h4{color:#ffffff;font-size: 28px;font-weight: bold;line-height: 33px;}
.main5 .con .gao span{color:#ffffff;font-size: 14px;line-height: 24px;padding: 10px 0 15px 0;display: block;}
.main5 .con .gao .rexian{color:#000000;font-size: 14px;background: #fff;padding: 0 28px 2px 28px;line-height: 45px;display: inline-block;border-radius: 28px;}
.main5 .con .gao .rexian b{color:#2e75b6;font-size: 22px;font-family: 'Arial';position: relative;top:2px;}
.main5 .con .gao .rexian:hover{background:rgba(255,255,255,0.8);}

.main6 .box .con .list1{width:41%;float: left;background: #f7f7f7;}
.main6 .box .con .list2{width:59%;float: left;padding-left: 25px;position: relative;}
.main6 .box .con .list1 .img_box{position:relative;}
.main6 .box .con .list1 .img_box img{height:310px;}
.main6 .box .con .list1 .img_box .shijian{position:absolute;left: 0;top:0;width:85px;height: 85px;background: rgba(0,0,0,0.75);text-align: center;margin: auto;display: table;}
.main6 .box .con .list1 .img_box .shijian .gao{height: 85px;}
.main6 .box .con .list1 .img_box .shijian h4{color:aliceblue;font-size: 35px;}
.main6 .box .con .list1 .img_box .shijian span{color:aliceblue;font-size: 12px;}
.main6 .box .con .list1 .txt_box{padding: 10px 20px 11px 30px}
.main6 .box .con .list1 .txt_box:hover{background:rgba(0,0,0,0.05);}
.main6 .box .con .list1 .txt_box h4{color: #000000;font-size: 16px;line-height: 46px;}
.main6 .box .con .list1 .txt_box span{color: #777777;font-size: 12px;line-height: 24px;display: block;height: 48px;overflow: hidden;}
.main6 .box .con .list1 .txt_box i{line-height:40px;color: #0f4da2;font-size: 12px;font-family: 'Arial';text-transform: uppercase;display: block;padding-left: 17px;margin-top:4px;background: url(../images/tu23.png)no-repeat left center;}
.main6 .box .con .list1 .txt_box:hover i{text-decoration: underline;}
.main6 .box .con .list2 .hezi{background:#f7f7f7;padding: 30px 25px 30px 137px;position: relative;margin-bottom: 8px;overflow: hidden;}
.main6 .box .con .list2 a:nth-child(4) .hezi{margin:0;}
.main6 .box .con .list2 .hezi:hover{background:rgba(0,0,0,0.08);}
.main6 .box .con .list2 .hezi .txt_box h4{color: #000000;font-size: 16px;line-height: 22px;padding-bottom: 5px;}
.main6 .box .con .list2 .hezi .txt_box span{color: #777777;font-size: 12px;line-height: 24px;height: 24px;overflow: hidden;display: block;}
.main6 .box .con .list2 .hezi .shijian{position: absolute;left: 0;top:50%;bottom:0;margin: auto 0;height: 100%;width: 137px;text-align: center;margin-top: -30px;}
.main6 .box .con .list2 .hezi .shijian h4{color:#0f4da2;font-size: 35px;}
.main6 .box .con .list2 .hezi .shijian span{color:#343434;font-size: 12px;}

.main7{background:#1e1e1e;padding: 50px 0;}
.main7 .con .ul{width:45%;float: left;}
.main7 .con .ul ul{width:25%;float: left;max-height: 223px;overflow: hidden;}
.main7 .con .ul ul li{text-align: left;color: rgba(255,255,255,0.5);line-height: 22px;padding: 0 15px 8px 0px}
.main7 .con .ul ul li:hover{text-decoration:underline;}
.main7 .con .ul ul a:nth-child(1) li{font-size: 16px;color: aliceblue;margin-bottom: 15px;line-height: 52px;position: relative;}
.main7 .con .ul ul a:nth-child(1) li:after{content:"";width:31px;height: 1px;background: #404040;position: absolute;left: 0;bottom:0;}
.main7 .con .txt_box{width:37%;border-left:1px solid #2e2e2e;border-right:1px solid #2e2e2e;float: left;min-height: 187px;text-align: center;}
.main7 .con .txt_box .txt{display:inline-block;text-align: left;}
.main7 .con .txt_box .txt h4{color:#ffa900;font-size: 24px;font-family: 'Impact';line-height: 70px;}
.main7 .con .txt_box .txt span{color:#ffffff;font-size: 12px;display: block;margin-bottom: 15px;}
.main7 .con .txt_box .txt span i{color:rgba(255,255,255,0.15);font-size: 11px;display: block;}
.main7 .con .txt_box .tt{color:rgba(255,255,255,0.5);line-height: 24px;}
.main7 .con .img_box{width:18%;float: left;}
.main7 .con .img_box img{width:140px;height: 140px;display: block;float: right;}
.main7 .con .img_box span{display: block;color: aliceblue;font-size: 12px;line-height: 22px;clear: both;width: 140px;text-align: left;float: right;padding-top: 8px;}

footer{color:aliceblue;font-size: 12px;background: #2e75b6;line-height: 22px;padding: 18px;text-align: center;}


.ny{background:#f5f5f5;}
.ny .box ul.anbox{margin-bottom: 25px;}
.ny .box ul.anbox li{position: relative;}
.ny .box ul.anbox li .an{cursor:pointer;}
.ny .box ul.anbox li .an.active:after{content:"";width:14px;height: 11px;background: url(../images/tu24.png)no-repeat center center;position: absolute;left: 0;bottom:-11px;right: 0;margin: 0 auto;transition:all 0.3s;}
.ny .box .contbox{border-top: 1px solid #e4e4e4}
.ny .box .contbox .cont{display:none;}
.ny .box .contbox .cont.active{display:block;}
.ny .box .contbox .cont .ul{font-size:0;text-align: center;padding: 25px 0 35px 0}
.ny .box .contbox .cont .ul .li{color:#000000;padding: 0 18px;display: inline-block;font-size: 14px;margin-bottom: 10px;}
.ny .box .contbox .cont .ul .li.active{color:#ff7b0e;}
.ny .box .contbox .cont .ul .li:hover{color:#ff7b0e;}

/*内页产品*/
.ny .box .nycp{margin:0 -9px;}
.ny .box .nycp .list{width:25%;float: left;padding: 0 10px;margin-bottom: 20px;}
.ny .box .nycp .list .hezi{background:#fff;}
.ny .box .nycp .list .hezi .tt{position:relative;color: #000000;font-size: 15px;width: 100%;overflow: hidden;border-top: 1px solid #eeeeee;transition:all 0.7s;}
.ny .box .nycp .list .hezi .tt h4{width: 100%;text-align: center;line-height:60px;transition:all 0.5s;transition:all 0.3s;padding: 0 8px 0 5px;font-size: 15px;}
.ny .box .nycp .list .hezi .tt span{position: absolute;display: block;right: 0;top:0;bottom:0;width:0;height: 30px;margin: auto 0;transition:all 0.5s;}
.ny .box .nycp .list .hezi .tt span i{width:70px;line-height: 30px;display: block;font-size: 12px;color: #fff;background: #ff7b0e;text-transform: uppercase;text-align: center;}
/*导航移动CSS*/
.yidong .w-ltside{width:100%;margin-bottom: 26px;}
.yidong .w-ltside .show-hide {display: block;overflow: hidden;width: 100%; }
.yidong .w-ltside .show-hide .div2 {display: block;cursor: pointer;background: #eee;color: #707070; font-size: 14px;text-align: center;margin-bottom: 2px;position: relative;}
.yidong .w-ltside .show-hide .div2 span{position: absolute;right: 15px;top:0;bottom:0;margin: auto 0;font-size: 15px;line-height: 42px;display: block;color: aliceblue;}
.yidong .w-ltside .show-hide .div2 a{display: block;font-size: 15px; color: #ffff;text-decoration: none; padding: 0 28px 0 15px;background: #2e75b6;line-height: 42px;text-align: left;overflow: hidden;}
.yidong .w-ltside .show-hide .div2:hover a {background:#ff7b0e;color: #fff; }
.yidong .w-ltside .show-hide .div3 {display: none;}
.yidong .w-ltside .show-hide .div3 ul {margin: 0;padding: 0; }
.yidong .w-ltside .show-hide .div3 ul li {display: block; height: 38px;line-height: 38px;list-style: none;text-align: center;background: #fff;overflow: hidden;border-bottom: 1px solid #eee; width: 100%;}
.yidong .w-ltside .show-hide .div3 ul li a {text-decoration: none;display: block;overflow: hidden;padding: 0 10px;color: #000000;font-size: 14px;}
.yidong .w-ltside .show-hide .div3 ul li a:hover {color: #03a0e5; }
.yidong .ltside { margin-bottom: 20px;position: relative;}







/*内页新闻*/
.ny .box .nyxw .hezi{margin-bottom:29px;border-bottom: 1px solid #d9d9d9;padding-bottom: 29px;}
.ny .box .nyxw .hezi .img{width:266px;float: left;}
.ny .box .nyxw .hezi .txt_box{font-size:15px;color: #333333;line-height: 25px;float: left;width: calc(100% - 266px);padding-left:24px;}
.ny .box .nyxw .hezi .txt_box .txt{color: #000000; line-height: 18px;font-weight: bold;font-size: 16px;}
.ny .box .nyxw .hezi .txt_box .shuzi{color: #999999;font-size: 12px;line-height: 22px;padding-top: 2px;}
.ny .box .nyxw .hezi .txt_box .txt2{height: 100px;line-height: 25px;overflow: hidden;color: #4f4f4f;}
.ny .box .nyxw .hezi .txt_box .txt3{width:90px;text-align: center;line-height: 28px;background: #999999;color: aliceblue;float: right;margin-top: 5px;font-size: 13px;}
.ny .box .nyxw .hezi:hover .txt_box .txt3{background: #ff7800;}

.ny .box .newsxq{text-align:center;}
.ny .box .newsxq h4{font-size:22px;font-weight: bold;line-height: 30px;margin-top: -10px;color: #000000;padding-bottom: 10px;}
.ny .box .newsxq span{font-size:13px;color: #8B8585; line-height: 15px;display: block;padding-bottom: 22px;margin-top: -7px;}
.ny .box .newsxq .tt{font-size:15px;line-height: 25px;color: #333;text-align: left;margin-bottom: 20px;}
.ny .box .newsxq img{margin-bottom:20px;}


/*内页资质*/
.ny .box .nyzizhi{margin:0 -9px;}
.ny .box .nyzizhi .list{padding:0 10px;width: 20%;float: left;margin-bottom: 20px;}
.ny .box .nyzizhi .list .hezi{background:#fff;padding: 9px;position: relative;}
.ny .box .nyzizhi .list .hezi .hezi2{position: relative;}
.ny .box .nyzizhi .list .hezi .hezi2 .tt{position:absolute;left: 0;bottom:0;width: 100%;background: rgba(0,0,0,0.8);color: aliceblue;font-size: 16px;line-height: 54px;text-align: center;}

.ny .box .gsjj{font-size:14px;line-height: 29px;color: #000000;margin-top: -10px;}

.ny .box .gsjj .ul9 .li{border-bottom:dashed 1px #d2d2d2;line-height: 38px;height: 38px;padding-left: 20px;position: relative;font-size: 15px;color: #000000;width: 100%;}
.ny .box .gsjj .ul9 .li span{display:block;width:calc(100% - 180px);white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.ny .box .gsjj .ul9 .li i{display:block;position: absolute;right: 40px;top:0;bottom:0;margin: auto 0;color: #F00;}
.ny .box .gsjj .ul9 .li:after{content:"";width:5px;height: 5px;background: #000000;border-radius: 100%;position: absolute;left: 0;top:0;bottom:0;margin: auto 0;}

.ny .box .gsjj .ul9 .li:hover span{text-decoration:underline;}
.ny .box .gsjj .ul9 .li:hover i{text-decoration:underline;}


/*产品详情*/
.ny .box .cpxq .hezi{width: 100%; background: #fff;padding: 15px;border: 1px solid #e5e5e5;margin-bottom: 34px;}
.ny .box .cpxq .hezi .gallery-top{width:100%;}
.ny .box .cpxq .hezi .gallery-top .swiper-slide .list{position:relative;}
.ny .box .cpxq .hezi .gallery-top .swiper-slide .list img{height:370px;}
.ny .box .cpxq .hezi .gallery-thumbs{height: 100%;width:calc(100% - 56px); box-sizing: border-box; cursor: pointer;z-index: 0;margin: 15px 0 0px 28px;}
.ny .box .cpxq .hezi .gallery-thumbs .swiper-slide {opacity: 0.6;border: 2px solid rgba(0,0,0,0);}
.ny .box .cpxq .hezi .gallery-thumbs .swiper-slide img{height:62px;}
.ny .box .cpxq .hezi .gallery-thumbs .swiper-slide-thumb-active {opacity: 1; border: 2px solid #ff7b0e;}
.ny .box .cpxq .hezi .swiper-button-next{background: #eaf9f9 url(../images/tu26.png)no-repeat center center;height:62px;width: 18px; margin: 0;border: 1px solid #dfdfdf;top:inherit;right: 0;bottom:-77px;}
.ny .box .cpxq .hezi .swiper-button-prev{background: #eaf9f9 url(../images/tu25.png)no-repeat center center;height:62px;width: 18px; margin: 0;border: 1px solid #dfdfdf;top:inherit;left: 0;bottom:-77px;}
.ny .box .cpxq .hezi h4{color: #000000;font-size: 18px;font-weight: bold;}
.ny .box .cpxq .hezi span{color: #4b4b4b;font-size: 13px;display: block;line-height: 40px;padding-bottom:5px;border-bottom: 1px solid #e3e0e0;}
.ny .box .cpxq .hezi .txt{color: #000000;font-size: 14px;line-height: 32px;height: 285px;margin: 10px 0;}
.ny .box .cpxq .hezi .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { background: #2e75b6 !important;}
.ny .box .cpxq .hezi .zixun{display:block;text-align: center;width: 130px;line-height: 40px;font-size: 18px;background: #ff7b0e;color: aliceblue;margin-top:34px;}
.ny .box .cpxq .hezi .zixun:hover{background: #e97b0e;}
.ny .box .cpxq .hezi2{background: #fff;border: 1px solid #e5e5e5;border-top: 0;}
.ny .box .cpxq .hezi2 .anbox{ text-align:left;font-size: 0;background: #f5f5f5;border: 1px solid #e5e5e5;}
.ny .box .cpxq .hezi2 .anbox .an{display:inline-block;  position:relative;  cursor:pointer;background: #f5f5f5;line-height: 50px;color: #000000;font-size: 15px;padding: 0 34px;border:1px solid #e5e5e5;border-top: 0;border-bottom: 0;}
.ny .box .cpxq .hezi2 .anbox .an:after{content: ""; width:100%;height: 2px;background: #fff;position: absolute;left: 0;bottom:-2px;opacity: 0;}
.ny .box .cpxq .hezi2 .anbox .an:before{content: ""; width:100%;height: 2px;background: #2e75b6;position: absolute;left: 0;top:0px;opacity: 0;}
.ny .box .cpxq .hezi2 .anbox .an.active{background:#fff; border-color:rgba(0,0,0,0); color:#2e75b6;}
.ny .box .cpxq .hezi2 .anbox .an.active:after{content: ""; width:100%;height: 2px;background: #fff;position: absolute;left: 0;bottom:-2px;opacity: 1;}
.ny .box .cpxq .hezi2 .anbox .an.active:before{content: ""; width:100%;height: 2px;background: #2e75b6;position: absolute;left: 0;top:0px;opacity:1;}
.ny .box .cpxq .hezi2 .contbox{border: 0;}
.ny .box .cpxq .hezi2 .contbox .cont{display:none;color: #000000;line-height: 14px;line-height: 36px;padding: 25px 35px;}
.ny .box .cpxq .hezi2 .contbox .cont.active{display:block;}
.ny .box .cpxq .hezi2 .anbox .an:nth-child(even){border-left:0;border-right: 0;}
.ny .box .cpxq .hezi3 .fanhui{color: #555555;font-size: 14px;line-height: 60px;width: 50%;float: left;padding-right: 15px;}
.ny .box .cpxq .hezi3 .fanhui:nth-child(2){float: right;text-align: right;}
.ny .box .cpxq .hezi3 .fanhui:hover{text-decoration:underline !important}
.ny .box .cpxq .hezi4{background: #fff;border: 1px solid #e5e5e5;margin-bottom: 20px;}
.ny .box .cpxq .hezi4 h4{color: #555555;font-size: 18px;line-height: 50px;background: #f6f6f6;padding: 0 15px;}
.ny .box .cpxq .hezi4 .img_box{border:1px solid #d8d8d8;padding: 3px;}
.ny .box .cpxq .hezi4 .img_box .img{border:1px solid #d8d8d8;}
.ny .box .cpxq .hezi4 .img_box .txt{color: #333333;font-size: 15px;line-height: 40px;text-align: center;padding: 0 5px;}
.ny .box .cpxq .hezi4 .img_box:hover{background:#2e75b6}
.ny .box .cpxq .hezi4 .img_box:hover .txt{color: aliceblue;}
.ny .box .cpxq .hezi4 .swiper-container{padding: 50px;}
.ny .box .cpxq .hezi4 .swiper-container .swiper-container{padding: 0;}
.ny .box .cpxq .hezi4 .swiper-container .swiper-button-prev{background:url(../images/tu27.png)no-repeat center center;width: 16px;height: 27px;margin-top: -13.35px;left: 17px;}
.ny .box .cpxq .hezi4 .swiper-container .swiper-button-next{background:url(../images/tu27.png)no-repeat center center;width: 16px;height: 27px;margin-top: -13.35px;right: 17px;transform:rotate(180deg);}




.ny .box .ditu{height:450px;width: 100%;}







@media (min-width:992px){
	.ny .box .nyxw .hezi:hover .img .xg,
	.main6 .box .con .list1 .img_box:hover .img .xg,
	.main4 .con #swiper3 .swiper-slide .hezi:hover .img .xg,
	.main2 .hezi .img:hover .xg,
	.main1 .box #swiper2 .hezi:hover .img .xg
	{transform:scale(1.1,1.1);-moz-transform:scale(1.1,1.1);-ms-transform:scale(1.1,1.1);-o-transform:scale(1.1,1.1);-webkit-transform:scale(1.1,1.1);cursor:pointer;}
	
	.main1 .box #swiper2 .hezi:hover .tt h4{width:calc(100% - 100px);  transition:all 0.5s;}
	.main1 .box #swiper2 .hezi:hover .tt h4{color: aliceblue;transition:all 0.3s;}
	.main1 .box #swiper2 .hezi:hover .tt span{width:100px;display: block;transition:all 0.5s;}
	.main1 .box #swiper2 .hezi:hover .tt{background:#2e75b6;transition:all 0.7s;}
	
	.ny .box .nycp .list .hezi:hover .tt h4{width:calc(100% - 100px);  transition:all 0.5s;}
	.ny .box .nycp .list .hezi:hover .tt h4{color: aliceblue;transition:all 0.3s;}
	.ny .box .nycp .list .hezi:hover .tt span{width:100px;display: block;transition:all 0.5s;}
	.ny .box .nycp .list .hezi:hover .tt{background:#2e75b6;transition:all 0.7s;}




}



@media (max-width:1230px){
	header nav ul li:nth-child(-n+5){padding: 0 17px;}
	header nav ul li:nth-child(-n+5) .ul .li{width:calc(100% + 34px);margin-left: -17px;}
	header nav ul li:nth-child(n+6):nth-child(-n+10){padding: 0 20px;}
	header nav ul li:nth-child(n+6):nth-child(-n+10) .ul .li{width:calc(100% + 40px);margin-left: -20px;}


}

@media (max-width:1200px){
	header{background:#fff;padding:22px 15px;}
	header #logo{position:relative;left: 0;margin: 0;width: calc(100% - 90px);height: 87px;}
	header #logo .logo{position: relative;margin: inherit;}
	#bian{display: none;}
	#bian2{display: none;}
	ul.anbox li .an.active:after{display:none;}
	
	.ny .box .cpxq .hezi{width:100%;margin-left: 0;}
	.ny .box .cpxq .hezi4 .swiper-container{padding:15px;}


}

@media (max-width:1100px){

}



@media (max-width:991px){

	header{background:#fff;padding:17px 15px;}
	header .ydd_btn{top:55px;}
	header .sjdnav{top:121px;}
	.banner .lb1, .lb1 img{min-height:270px;}
	.main1 .box #swiper2 .hezi .tt h4{width:100%;}
	.main2 .hezi{padding: 30px;}
	.main2 .hezi .img{float:none;width:100%;margin-bottom: 25px;}
	.main2 .hezi .img img{height:auto;}
	.main2 .hezi .txt_box{float:none;width:100%;padding-left: 0;}
	.main2 .hezi .txt_box span{height: 189px;}
	.main3 .box .con .txt_box{width:100%;float: none;clear: both;margin-bottom: 10px;}
	.main3 .box .con .txt_box a .list{padding: 34px 20px 34px 110px;margin-bottom: 10px;width:calc(50% - 5px);float: left;}
	.main3 .box .con .txt_box a:nth-child(2) .list{float: right;}
	.main3 .box .con .txt_box a:nth-child(4) .list{float: right;}
	.main3 .box .con .hezi{width:100%;float: none;}
	.main3 .box .con .hezi .lbtop{margin:0;}
	.main3 .box .con .hezi .lbtop{width:calc(100% - 164px)}
	.main3 .box .con .hezi .swiper-button-next{right:-149px;}
	.main3 .box .con .hezi .swiper-button-prev{right:-85px;}
	.main6 .box .con .list1{width:100%;float: none;margin-bottom: 15px;}
	.main6 .box .con .list2{width:100%;float: none;padding-left: 0;}
	.main6 .box .con .list1 .img_box img{height:auto;}
	.main7 .con .ul{display: none;}
	.main7 .con .txt_box{width:calc(100% - 180px);border: 0; min-height: inherit;}
	.main7 .con .txt_box .txt{display:block;}
	.main7 .con .img_box{width:180px;}
	
	.ny .box .nycp .list{width:33.33%;}
	.ny .box .nycp .list .hezi .tt h4{width:100%;}
	.ny .box .nyzizhi .list{width: 25%;}
	.ny .box .cpxq .hezi .row .col-xs-12:nth-child(1){margin-bottom:30px;}
	.ny .box .cpxq .hezi .gallery-top .swiper-slide .list img{height:auto;}
	.ny .box .ditu{height:350px;width: 100%;}


}

@media (max-width:767px){
	header{padding:15px 10px;}
	header #logo{height: 65px;}
	header .ydd_btn{top:40px;}
	header .sjdnav{top:95px;}
	.banner .lb1, .lb1 img{min-height:240px;}
	.box .title{padding:40px 0 25px 0}
	.box .title span{margin-bottom:14px;}
	.box ul{margin-bottom:30px;}
	.box .gd{margin-top:30px;}
	.box{padding-bottom:45px;}
	.main4 .con{padding-bottom:45px;}
	.main3 .box .con .txt_box a .list{padding: 26px 20px 26px 110px;width:100%;float: none;}
	.main3 .box .con .txt_box a:nth-child(2) .list{float: none;}
	.main3 .box .con .txt_box a:nth-child(4) .list{float: none;}
	.main3 .box .con .hezi .swiper-button-next{display: none;}
	.main3 .box .con .hezi .swiper-button-prev{display: none;}
	.main3 .box .con .hezi .lbtop{width:100%;}
	.main3 .box .con .hezi .gallery-thumbs{width:100%;padding: 15px 0 15px 0;}
	.main3 .box .con .hezi .gallery-top .swiper-slide .list img{height:auto;}
	
	.ny .box .nycp .list{width:50%;}
	.ny .box .nyxw .hezi{margin-bottom:20px;padding-bottom: 20px;}
	.ny .box .nyxw .hezi .img{width:200px;}
	.ny .box .nyxw .hezi .img img{height:160px;}
	.ny .box .nyxw .hezi .txt_box{width: calc(100% - 200px);}
	.ny .box .nyxw .hezi .txt_box .txt2{height: 75px;margin-bottom: 10px;}
	.ny .box .nyzizhi .list{width:33.33%;}

	.ny .box .ditu{height:300px;width: 100%;}

	

}

@media (max-width:600px){
	.banner .lb1, .lb1 img{min-height: 202px;}
	.main2 .hezi{padding:20px;}
	.main5 .con .gao h4{font-size:18px;line-height: 29px;}
	.main5 .con .gao span{padding:6px 0 10px 0}
	.main5 .con .gao .rexian{line-height:38px;}
	.main5 .con .gao{height:200px;}
	.main6 .box .con .list2 .hezi{padding:20px 15px 20px 100px;}
	.main6 .box .con .list2 .hezi .shijian{width:100px;}
	.main7 .con .txt_box{width:100%;margin-bottom: 20px;}
	.main7 .con .img_box{width:100%;float: none;}
	.main7 .con .img_box img{float:none;}
	.main7 .con .img_box span{float:none;}
	.main7{padding:30px 0;}

	.ny .box .nyxw .hezi .img{width:180px;}
	.ny .box .nyxw .hezi .txt_box{width: calc(100% - 180px);}
	.ny .box .cpxq .hezi .txt{line-height:28px;}
	.ny .box .cpxq .hezi .zixun{margin-top:18px;}
	.ny .box .cpxq .hezi2 .anbox .an{width:33.33%;padding: 0;text-align: center;line-height: 40px;}
	.ny .box .cpxq .hezi2 .contbox .cont{padding:15px 20px;}

.ny .box .ditu{height:280px;width: 100%;}

}


@media (max-width:479px){
	header{padding:11px 15px;}
	header #logo{height:53px;}
	header .ydd_btn{top:31px;}
	header .sjdnav{top:75px;}
	.banner .lb1, .lb1 img{min-height:150px;}
	.banner .swiper-container-horizontal > .swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction{bottom:3px;}
	.box .title{padding:30px 0 15px 0}
	.box .title h4{font-size:23px;}
	.box .title span{line-height:28px;}
	.box .title span:after{height:2px;}
	.box .title span{margin-bottom:11px;}
	.box ul li{width:50%;}
	.box ul li span{width:100%;padding: 0 6px;font-size: 14px;line-height: 38px;}
	.box ul{margin-bottom:20px;}
	.main1 .box #swiper2 .hezi .tt h4{line-height:40px;font-size: 14px;}
	.box .gd{margin-top:20px;}
	.box{padding-bottom:35px;}
	.main4 .con{padding-bottom:35px;}
	.box .gd{width:130px;line-height: 35px;}
	.main2 .hezi{padding:15px;}
	.main2 .hezi .txt_box h4{line-height:25px;padding-bottom: 10px;}
	.main2 .hezi .txt_box h4 .mo{line-height:25px;font-size: 10px;}
	.main2 .hezi .img{margin-bottom:20px;}
	.main2 .hezi .txt_box .txt .list{padding:15px 0;}
	.main2 .hezi .txt_box .txt .list img{margin-bottom:5px;}
	.main3 .box .con .txt_box a:nth-child(1) .list{background:#fff url(../images/tu12.png)no-repeat 12px center}
	.main3 .box .con .txt_box a:nth-child(2) .list{background:#fff url(../images/tu14.png)no-repeat 12px center}
	.main3 .box .con .txt_box a:nth-child(3) .list{background:#fff url(../images/tu16.png)no-repeat 12px center}
	.main3 .box .con .txt_box a:nth-child(4) .list{background:#fff url(../images/tu18.png)no-repeat 12px center;margin: 0;}
	.main3 .box .con .txt_box a:hover:nth-child(1) .list{background:#2e75b6 url(../images/tu13.png)no-repeat 12px center}
	.main3 .box .con .txt_box a:hover:nth-child(2) .list{background:#2e75b6 url(../images/tu15.png)no-repeat 12px center}
	.main3 .box .con .txt_box a:hover:nth-child(3) .list{background:#2e75b6 url(../images/tu17.png)no-repeat 12px center}
	.main3 .box .con .txt_box a:hover:nth-child(4) .list{background:#2e75b6 url(../images/tu19.png)no-repeat 12px center;margin: 0;}
	.main3 .box .con .txt_box a .list{padding:20px 15px 20px 85px;}
	.main3 .box .con .hezi .gallery-top .swiper-slide .list .txt .tit{line-height:22px;max-height: 44px;}
	.main3 .box .con .hezi .gallery-top .swiper-slide .list .txt{padding:11px 10px;}
	.main4 .con #swiper3 .swiper-slide .hezi .tt{font-size:14px;line-height: 38px;}
	.main5 .con .gao h4{font-size:17px;line-height: 24px;}
	.main5 .con .gao .rexian b{font-size:17px;}
	.main5 .con .gao span{line-height: 19px;}
	.main6 .box .con .list1 .txt_box{padding:12px 15px 14px 15px;}
	.main6 .box .con .list1 .txt_box h4{line-height:34px;}
	.main6 .box .con .list1 .txt_box i{line-height:25px;}
	.main6 .box .con .list2 .hezi{padding:20px 15px 20px 80px;}
	.main6 .box .con .list2 .hezi .shijian{width:80px;margin-top: -26px;}
	.main6 .box .con .list2 .hezi .shijian h4{font-size:26px;line-height: 30px;}
	.main6 .box .con .list2 .hezi .txt_box h4{line-height:20px;padding: 0;font-size: 15px;}
	.main7{padding:15px 0 30px 0}
	
	.ny .box .nycp{margin:0 -5px;}
	.ny .box .nycp .list{padding:0 5px;margin-bottom: 12px;}
	.ny .box .nycp .list .hezi .tt h4{line-height:40px;font-size: 14px;}
	.ny .box .contbox .cont .ul{padding-bottom:22px;}
	.ny .box .nyxw .hezi .img{width:140px;}
	.ny .box .nyxw .hezi .img img{height:134px;}
	.ny .box .nyxw .hezi .txt_box{width: calc(100% - 140px);padding-left: 15px;}
	.ny .box .nyxw .hezi .txt_box .txt{padding-top:5px;}
	.ny .box .nyxw .hezi .txt_box .txt2{height: 50px;margin-bottom:4px;}
	.ny .box .nyxw .hezi .txt_box .txt3{font-size:12px;line-height: 26px;}
	.ny .box .nyzizhi{margin:0 -4px;}
	.ny .box .nyzizhi .list{width:50%;padding: 0 5px;margin-bottom: 10px;}
	.ny .box .nyzizhi .list .hezi .hezi2 .tt{line-height:46px;}
	.ny .box .cpxq .hezi3{padding:15px 0;}
	.ny .box .cpxq .hezi3 .fanhui{width:100%;float: none;display: block;line-height: 30px;}
	.ny .box .cpxq .hezi3 .fanhui:nth-child(2){width:100%;float: none;text-align: left;}
	.ny .box .cpxq .hezi4 .img_box .txt{line-height:30px;}
	.ny .box .cpxq .hezi2 .contbox .cont{line-height:28px;}
	
	
	
	
	.main7 .con .txt_box .txt h4{font-size:20px;line-height: 44px;}
	
	
.ny .box .gsjj .ul9 .li{padding-left: 12px;}
.ny .box .gsjj .ul9 .li span{width:calc(100% - 80px);}
.ny .box .gsjj .ul9 .li i{right: 0;}



	
	
}



@media (max-width:350px){

	


}

	#tabBar{ position: fixed; left:20px; bottom:20px; z-index: 99; width: calc(100% - 40px); height: 50px;}
	#tabBar.active{ animation: tabBarAnimation 3s 1s infinite linear;  }
	#tabBar .clickbtn{ position: absolute; right: 0; bottom: 0; z-index: 2; width:50px; height:50px; font-size: 0; line-height: 50px; background: rgba(255,255,255,0.8); border-radius: 50%; }
	#tabBar .clickbtn span{ display: block; position: absolute; left: 0; top: 0; z-index: 1; width: 100%; height: 100%; opacity: 0; }
	#tabBar .clickbtn img{ width: 22px;}
	#tabBar .clickbtn.on{ animation:clickbtnAnimation 10s 0s infinite linear; box-shadow: 0 3px 5px rgba(0,0,0,0.5); }
	#tabBar .clickbtn.on:before{ content: ""; position: absolute; left: 0; bottom: -5px; z-index: 1; width: 20px; height: 5px;}
	#tabBar .clickbtn.active{ background:url(../images/tabBar/xian2.png) rgba(110,209,207,1); background-size: 100% 100%; }
	#tabBar .clickbtn.active:before{ content: ""; position: absolute; left: 0; top: 0; z-index: 2; width: 100%; height: 100%; border:solid 1px rgba(255,255,255,0.2); border-radius: 50%; }
	#tabBar .clickbtn.active > img{ opacity: 0;}
	#tabBar .clickbtn.active span{ opacity: 1; }
	#tabBar .navigation{ position: absolute; left:calc(100% - 100px); bottom: 0; z-index: 1; width:0; height: 50px; border-radius: 25px; transition: all 0.3s;}
	#tabBar .navigation:before{ content: ""; position: absolute; left: 0; top: 0; z-index: 1; width: 100%; height: 100%; border-radius: 25px; 
background:-moz-linear-gradient(left,rgba(255,255,255,0.8) 0%,rgba(255,255,255,0.6) 100%);background:-webkit-linear-gradient(left,rgba(255,255,255,0.8) 0%,rgba(255,255,255,0.6) 100%);background:linear-gradient(to right,rgba(255,255,255,0.8) 0%,rgba(255,255,255,0.6) 100%);filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#ccffffff',endColorstr='#99ffffff',GradientType=1 );}
	#tabBar .navigation ul{ position: relative; z-index: 2; padding: 0 60px 0 20px; }
	#tabBar .navigation ul li{ width: calc(100% / 3); font-size: 0; }
	#tabBar .navigation ul li a{ position: relative; left: 10px; display: inline-block; vertical-align: top; line-height: 50px;opacity: 0; }
	#tabBar .navigation ul li a .tab-icon{ margin-right: 5px;}
	#tabBar .navigation ul li a .tab-icon img{ width: 22px; }
	#tabBar .navigation ul li a .tab-title{ font-size: 12px;color: #333; }
	#tabBar .navigation.active{ box-shadow: 5px 5px 10px rgba(0,0,0,0.2); animation: navigationAnimation 0.5s 0s linear forwards; }
	#tabBar .navigation.active ul li:nth-child(1) a{animation:navigationAAnimation 0.3s 0.5s linear forwards; }
	#tabBar .navigation.active ul li:nth-child(2) a{animation:navigationAAnimation 0.3s 0.6s linear forwards; }
	#tabBar .navigation.active ul li:nth-child(3) a{animation:navigationAAnimation 0.3s 0.7s linear forwards; }		

	@keyframes tabBarAnimation{
		0%{transform:translate(0,0);}
		30%{transform:translate(0,5px);}
		50%{transform:translate(0,0);}
		70%{transform:translate(0,-5px);}
		100%{transform:translate(0,0);}
	}

	@keyframes navigationAnimation{
		0%{left:calc(100% - 100px); width: 0; }
		80%{ left: -10px; width:100%; }
		90%{ left:  5px; width:100%; }
		100%{ left: 0; width:100%; }
	}

	@keyframes navigationAAnimation{
		from{ left: -10px; opacity: 0; }
		to{ left: 0; opacity: 1; }
	}

	@keyframes clickbtnAnimation{
		0%{ transform: rotateY(0deg); }
		10%{transform: rotateY(270deg); }
		15%{transform: rotateY(180deg); }
		30%{transform: rotateY(0deg); }
		100%{transform: rotateY(0deg); }
}