
/*banner s*/
.banner{height:100%;;position: relative;overflow:hidden;}
.slideBox .hd{overflow:hidden;position:absolute;left:0;bottom:30px;z-index:999;width:100%}
.slideBox .hd ul{zoom:1;text-align:center;padding: 0 60px; }
.slideBox .hd ul li{ display:inline-block; margin:0 45px;  width:13px; height:13px;text-align:center;cursor:pointer;zoom:1;*display:inline;position:relative;background:#c1c0c1 }
.slideBox .hd ul li.on{background:#fff}
.slideBox .bd{ position:relative; height:100%; z-index:0;   }
.slideBox .bd li{ zoom:1; vertical-align:middle; text-align:center; height:100%; }
.slideBox .bd img{ width:100%; height:auto; display:block; margin:0 auto;  }
.slideBox .bd a{display:block;width:100%;height:100%;}
.divs{position:absolute;left:50%;bottom:0;z-index:9999;height: 85px;width:70px;margin-left:-35px;}
.divs a{float: left;}
.slideBox .prev{width:60px; height:60px;position: absolute;right:80px;top:380px;}
.slideBox .next{width:60px; height:60px;position: absolute;right:80px;top:220px;}
.slideBox .prev{background:url(../images/left.jpg) no-repeat center;}
.slideBox .next{background:url(../images/right.jpg) no-repeat center;}
.slideBox .next:hover{background:url(../images/rights.jpg) no-repeat center;}
.slideBox .prev:hover{background:url(../images/lefts.jpg) no-repeat center;}
.banner .tempWrap,.slideBox,.bd ul{height:100%!important}

/*banner e*/

/*navs s*/
.navs{width:135px;background:#fff;position:fixed;left:0;top:0;bottom:0;z-index:9999;border:1px solid #eeeeee;}
.navs ul{height:100%}
.navs li{height:33%;border-bottom:1px solid #d2d2d2;position:relative;}
.navs li:last-child{border:0;}
.navs li.li1{text-align:center;margin-top:20px;background:url(../images/xt.jpg) no-repeat bottom;}
.navs li.li2 i{width:35px;height:35px;background:#e5e5e5;margin:auto;position: absolute;left:0;top:0;bottom:0;right:0;font-style:normal;text-align:center;line-height:35px;font-size:20px;color:#333333}
.navs li.li2 i.i1{bottom:85px}
.navs li.li2 i.i2{bottom:-85px}
.navs li.li2 i:hover{background:url(../images/tb.jpg) no-repeat center;color:#fff}
.menu{position: absolute;left:0;top:0;right:0;bottom:0;margin:auto;cursor:pointer;}
.bdsharebuttonbox{
	position: absolute;
    left: 0;
    bottom: 0;
    right: 0;
    top: 0;
    margin: auto;
    height: 105px;}
.bdsharebuttonbox a{float:none!important;display:block;margin:0 auto!important;text-align:center;}

.navs-manus{width:150px;height:100%;background:rgba(237,237,237,.8);position:fixed;left:135px;top:0;bottom:0;z-index:9999;display:flex;justify-content:center;align-items:center;}
.navs-manus ul{width:100%}
.navs-manus li{text-align:center;margin:10% 0;width:100%}
.navs-manus li a{font-size:16px;color:#444444;display:block;width:100%;margin:40px 0;}
.navs-manus li:hover a{color:#105400;letter-spacing:1px}

.btns{text-align:center;}
.btns ul{position:relative;display:inline-block;}

.btns ul li:after{
	content:'';
	display:block;
	position: absolute;right:-90px;
	top:0;
	width:92px;
	height:12px;
	background:rgba(255,255,255,.6);
	background:url(../images/xx.png) no-repeat center

}

.btns ul li:last-child:after{display:none}

/*navs e*/

/*about s*/
.about{padding:80px 0;overflow:hidden;height:850px;position:relative;}
.about-btn{width:320px;height:850px;position:relative;}
.about-btn ul{padding-top:520px}
.about-btn i{width:1px;height:100%;background:#c9c9c9;display:block;position: absolute;left:0;top:0;}
.about-btn  li{margin-bottom:50px;padding-left:22px;position:relative;}
.about-btn  li h2{font-size:18px;color:#333333;font-weight:normal;}
.about-btn  li p{font-size:12px;color:#999999;text-transform:uppercase;}
.about-btn  li:before{
	content:'';
	position:absolute;
	width:10px;
	height:10px;
	left:-5px;
	top:8px;
	background:#c9c9c9;
}
.about-btn li:hover:before{background:#105400}
.tb2{position: absolute;left:5px;top:260px}

.about-top{position: absolute;right:0;top:80px;width:65%;height:600px;background:#555}
.about-img{width:1200px;height:260px;background:url(../images/bg.png);position: absolute;left:418px;bottom:150px;right:0;margin:auto;z-index:999;}
.about-pic{width:300px;height:260px;overflow:hidden;}
.about-pic img{width:100%;height:100%;transition:all 0.6s}
.about-pic img:hover{transform:scale(1.06);}
.about-ms{width:610px;margin-left:60px;}
.about-ms h2{font-size:24px;color:#151311;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-weight:normal;margin-top:35px}
.about-ms p{text-align:justify;margin-top:40px;line-height:1.8;font-size:14px;color:#666666;height:125px;overflow:hidden;}
.ibs{width:220px;height:90px;position: absolute;left: -60px;bottom: -120px;text-align:right;}
.ibl{width:1px;height:90px;background:#dcdcdc;position: absolute;left:0;top:-6px;}
.ibr{width:70px;height:1px;background:#dcdcdc;position: absolute;left:-15px;top:30px;}
.ibs a{font-size:14px;color:#666666!important;text-transform:uppercase;margin-top:20px;display:block;margin-right: 25px;}
.obb{width:10%;height:260px;background:url(../images/bg.png);position: absolute;right:0;bottom:150px;}
/*about e*/

/*pinzhi s*/
.pinzhi{padding:80px 0;overflow:hidden;background:url(../images/bg2.jpg) no-repeat center top;}
.pinzhi-tit h2{font-size:30px;color:#ffffff}
.pinzhi-tit p{font-size:16px;color:#e9ebf1;margin-top:7px}
.pinzhi-btn{margin-top:10px}
.pinzhi-btn li{float:left;font-style:14px;margin-left:80px}
.pinzhi-btn li a{color:#fff}
.pinzhi-btn li:hover a{color:#105400}
.findmore{font-size:14px;text-transform:uppercase;color:#fff!important;margin-left:70px }

.picScroll-left{ width:100%;position:relative;margin-top:40px}
.picScroll-left .hd{width:100%;position: absolute;left:0;top:0;}
.picScroll-left .hd .prev,.picScroll-left .hd .next{ display:block;  width:15px; height:30px; overflow:hidden;cursor:pointer;position: absolute;z-index:9999;}
.picScroll-left .hd .prev{left:-30px;top:190px;background:url(../images/left.png) no-repeat center top;}
.picScroll-left .hd .next{right:-30px;top:190px;background:url(../images/right.png) no-repeat center top;}
.picScroll-left .hd ul{ float:right; overflow:hidden; zoom:1; margin-top:10px; zoom:1; }
.picScroll-left .hd ul li{ float:left;  width:9px; height:9px; overflow:hidden; margin-right:5px; text-indent:-999px; cursor:pointer; }
.picScroll-left .bd ul{ overflow:hidden; zoom:1; }
.picScroll-left .bd ul li{ margin:0 8px; float:left; _display:inline; overflow:hidden;width:285px;height:385px;background:#555  }
.pinzhi-pic{height:285px;position:relative;overflow:hidden;}
.pinzhi-pic img.pinpics{width:100%;height:100%;transition:all 0.6s;}
.pinzhi-ms{height:60px;background:#fff;padding:20px;transition:all 0.6s}
.picScroll-left .bd ul li h2{font-size:16px;color:#333333;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-weight:normal;}
.picScroll-left .bd ul li p{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;margin-top:10px;color:#888888;font-size:14px;}
.picScroll-left .bd ul li:hover .pinzhi-ms{background:#105400}
.picScroll-left .bd ul li:hover .pinzhi-ms *{color:#fff}
.kj{width:245px;height:245px;border:1px solid rgba(255,255,255,.6);position: absolute;left:0;top:0;bottom:0;right:0;margin:auto;display:none}
.kj img{position: absolute;left:0;top:0;right:0;bottom:0;margin:auto;}
.picScroll-left .bd ul li:hover .kj{display:block;}
.picScroll-left .bd ul li:hover img.pinpics{transform:scale(1.1);}
.picScroll-left .tempWrap{margin:0 auto;}
.mss{text-align:center;font-size:18px;color:#ffffff;font-size:18px;margin-top:50px;margin-bottom:0;}
.smcall{display:block;text-align:center;color:#fff;font-size:30px;color:#fff;font-weight:bold;margin-top:20px}
/*pinzhi e*/

/*service s*/
.service{padding:80px 0;overflow:hidden;position:relative;}
.service-l,.service-r{width:50%;height:480px;}
.service-ms{width:550px;margin-left:70px}
/* .service-ms{width:530px;margin-left:70px} */
.service-ms h2{font-size:24px;color:#333333;font-weight:normal;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-top:60px;background:url(../images/xt2.png) no-repeat left;padding-left:15px}
.service-ms p.descs{font-size:14px;color:#808080;line-height:1.8;text-align:justify;margin-top:40px;height:100px;overflow:hidden;}
.service-call p{font-size:14px;color:#666666;margin-bottom:15px}
.service-call span{background:#105400;color:#fff;padding:3px 15px;font-size:24px}
.service-m-l{width:570px;height:125px;background:#f6f6f6;padding: 50px 0 0 30px;}
.service-mm{margin-left:15px}
.service-mm h2{font-size:16px;color:#333333;font-weight:normal;padding-top:18px;margin-bottom:10px}
.service-mm h2 em{font-style:normal;color:#d2d2d2;display:inline-block;margin:0 10px;}
.service-mm span{font-size:12px;color:#808080;text-transform:uppercase;}
.service-ad{position: absolute;right:0;background:url(../images/bg3.jpg) no-repeat center top;width:50%;top:560px;height:175px;background-size:cover;z-index: 999; }
.lxs{position: absolute;left:-70px;bottom:65px;z-index:9999;}
/*service e*/

/*advs s*/
.advs{height:235px;padding-top:85px;text-align:center;}
.advs h2{font-size:30px;text-align:center;color:#fff;font-weight:normal;}
.advs span{font-size:12px;color:#9e9e9e;text-transform:uppercase;margin-top:5px;display:block;text-align:center;}
.lxss{display:block;margin-top:40px}
/*advs e*/

/*show1 s*/
.show1{margin-top:20px;}
.show1 li{width:280px;height:420px;float:left;margin-right:15px;border:1px solid #e5e5e5;}
.show1-pic{height:285px;overflow:hidden;background:#555;}
.show1-pic img{width:100%;height:100%;transition:all 0.6s}
.show1-ms{padding:10px 15px;}
.show1-ms h2{font-size:16px;color:#4c4c4c;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-weight:normal;margin-bottom:10px}
.show1-ms p{font-size:13px;color:#898989;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;margin-bottom:5px}
.show1 li:hover img{transform:scale(1.06)}
.allcase{width:178px;height:43px;border:1px solid #cccccc;display:block;text-align:center;border-radius:20px;margin:50px auto;line-height:43px;color:#999999!important;font-size:16px;}
.allcase:hover{background:#105400;color:#fff!important;border:1px solid #105400;}
/*show1 e*/

/*whys s*/
.whys{padding:80px 0;overflow:hidden;background:url(../images/bg13.jpg) no-repeat center top fixed;background-size:cover}
.titss{text-align:center;}
.whys-top{width:1200px;height:300px;margin:40px auto;}
.whys-top-l{width:600px;height:300px;background:#555}
.whys-top-l img{width:100%;height:100%}
.whys-top-r{width:480px;height:180px;background:rgba(255,255,255,.9);padding:60px;}
.whys-top-r-tit h2{font-size:30px;color:#303030;  margin-bottom: 10px;background:url(../images/xl.png) no-repeat left;padding-left:20px}
.whys-top-r-tit span{font-size:14px;color:#999999;text-transform:uppercase;margin-left:20px }
.whys-top-r p{font-size:16px;color:#666666;line-height:1.8;text-align:justify;margin-top:25px;height:56px;overflow:hidden;margin-left: 20px;}
.whys-list{width:1200px;margin:30px auto;}
.whys-list ul{width:105%}
.whys-list li{width:292px;height:205px;float:left;background:#ffffff;margin-right:10px;text-align:center;padding-top:30px}
.whys-list li:hover{background:#105400}
.whys-list li i{width:30px;height:20px;background:url(../images/sj.png) no-repeat center;display:block;margin:0 auto 45px;}
.whys-list li h2{font-size:22px;color:#333333;margin-bottom:10px}
.whys-list li span{font-size:14px;color:#666666;text-transform:uppercase;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;display:block;padding:0 10px;}
.whys-list li em{display:block;width:20px;height:20px;background:url(../images/xt5.png) no-repeat center;margin:30px auto;}
.whys-list li:hover h2{color:#fff}
.whys-list li:hover span{color:#538447}
/*whys e*/



/*Choice s*/
.Choice{overflow:hidden;padding-bottom:80px;margin-top:80px;}
.Choice-top{height:320px;}
.Choice-list{margin-top:30px}
.Choice-list ul{width:105%}
.Choice-list li{width:200px;height:350px;float:left;background:#f5f5f5;margin-right:50px;text-align:center;transition:all 0.6s}
.Choice-list li i{width:75px;height:95px;display:block;margin:30px auto 10px;background:url(../images/btns.png) no-repeat center;text-align:center;line-height:75px;color:#fff;font-size:26px;font-style:normal;}
.Choice-list li span{display:block;width:165px;margin:0 auto;text-align:center;font-size:12px;color:#105400;text-transform:uppercase;height: 51px;}
.Choice-list li p{width:80px;margin:20px auto;text-align:center;font-size:20px;color:#333333}
.Choice-list li:hover{background:#d8d7d7}
/*Choice e*/

/*videos s*/
.videos{height:435px;overflow:hidden;position:relative;}
.videos img{position: absolute;left:0;top:0;right:0;bottom:0;margin:auto;}
/*videos e*/

/*mess s*/
.mess{padding:80px 0;overflow:hidden;}
.mess-l{width:290px}
.messs-input{width:575px;margin-left:40px}
.inputs{margin-bottom:20px}
.inputs label{color:#666666;cursor:pointer;font-size:14px;font-weight:normal; margin-left: 5px;}
.inputs input{height:45px;text-indent:10px;border:1px solid #e5e5e5;}
.textareas{width:493px;height:80px;display:inline-block;vertical-align:top;padding-top:10px;text-indent:10px;border:1px solid #e5e5e5;background:none;    margin-left: -1px;}
.inputs span{font-size:13px;color:#999999;display:inline-block;position:relative;top:-15px}
.brands-top-call{width:300px;height:200px;background:#008ed6;text-align:center;}
.brands-top-call p{padding-top:40px;color:#80c7eb;font-size:14px;}
.brands-top-call strong{color:#fff;font-size:24px;display:block;margin:15px 0;}
.brands-r{width:775px;margin-left:50px}
.brands-top-tit{margin-bottom:90px;}
.brands-top-tit h2{font-size:30px;color:#ffffff;font-weight:normal;margin-top:20px}
.brands-top-tit p{font-size:16px;color:#e3ebef;margin-top:10px;}

.brands-top-ms h3{font-size:24px;color:#333333;font-weight:normal;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}
.brands-top-ms p{font-size:15px;color:#888888;text-align:justify;line-height:1.8;margin-top:15px;height:82px;overflow:hidden;}

.messs-r{width:250px;height:350px;}
.titms{text-align:center;font-size:24px;color:#333333;font-weight:normal;margin-bottom:50px;}
/*mess e*/


/*show2 s*/
.show2{height:380px;overflow:hidden;}
.show2-l{width:55%;height:380px;background:#666}
.show2-r{width:45%;height:380px;padding-top:85px;position:relative;}
.show2-r img{margin-left:40px}
.mores{position: absolute;left:150px;bottom:155px;}
/*show2 e*/

/*news s*/
.news{padding:80px 0;overflow:hidden;}
.news-l{width:170px;background:#f5f5f5;padding:90px 15px 45px 15px}
.news-btn{margin-top:80px;}
.news-btn li{height:50px;text-align:center;background:#e5e5e5;line-height:50px;margin-bottom:10px}
.news-btn li a{color:#333333;display:block;width:100%;height:100%}
.news-btn li:hover a{color:#fff;background:#105400}
.news-code{text-align:center;margin-top:50px;}
.news-code img{width:125px;height:125px;}
.news-code p{font-size:14px;color:#333333;margin-top:8px}
.news-r{width:960px;}
.news-r-top{height:380px;overflow:hidden;position:relative;}
.news-r-top img.newspic{width:100%;height:100%;transition:all 0.6s}
.news-r-top:hover img{transform:scale(1.06);}
.news-ms{position: absolute;left:0;bottom:0;/* height: 69px; */background:#105400;width:920px;padding: 27px 20px 14px 20px;}
.news-time{width:70px;height:70px;color:#fff;text-align:center;font-size:14px}
.news-time span{display:block;padding-bottom:10px;background:url(../images/xt4.png) no-repeat center bottom;margin-bottom: 4px;font-size:18px}
.news-lms{width:635px;margin-left:50px}
.news-lms h2{font-size:18px;color:#ffffff;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-weight:normal;}
.news-lms p{font-size:14px;color:#bac6b8;margin-top:15px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}
.moress{position: absolute;right:40px;top:40px;}
.news-list{margin-top:50px;}
.news-list ul{width:115%}
.news-list li{width:270px;float:left;margin-right:80px}
.news-list li span{color:#9c9c9c;font-size:14px;color:#9c9c9c}
.news-list li h2{font-size:18px;color:#2d2d2d;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-weight:normal;margin-top:10px}
.news-list li p{font-size:14px;color:#666666;line-height:1.8;text-align:justify;margin-top:10px;height:50px;overflow:hidden;}
.moresss{width:115px;height:26px;background:#eeeeee;display:block;text-align:center;line-height:26px;color:#747474;font-size:12px;text-transform:uppercase;margin-top:70px;border-radius:12px}
.news-list li:hover .moresss{background:#105400;color:#fff}
/*news e*/

/*panner s*/
.panner{padding:60px 0;background:#f5f5f5}
.picMarquee-left{ width:100%;  overflow:hidden; position:relative;}
.picMarquee-left .hd .prev,.picMarquee-left .hd .next{ display:block;  width:5px; height:9px; float:right; margin-right:5px; margin-top:10px;  overflow:hidden;cursor:pointer;}
.picMarquee-left .hd .next{ background-position:0 -50px;  }
.picMarquee-left .bd ul{ overflow:hidden; zoom:1; }
.picMarquee-left .bd ul li{ margin:0 15px; float:left; _display:inline; overflow:hidden; text-align:center;width:210px;height:120px;background:#555;position:relative; }
.picMarquee-left .bd ul li img{position: absolute;left:0;top:0;right:0;bottom:0;margin:auto;width:100%;height:100%;transition:all 0.6s}
.picMarquee-left .bd ul li img:hover{transform:scale(1.06);}
/*panner e*/

/*footer s*/
.footer{height:530px;overflow:hidden;}
.maps{width:40%;height:100%;background:#666;overflow:hidden;}
.foot-r{width:60%;height:100%;}
.foot-ms{width:700px;padding-left:100px;padding-top:70px;position:relative;}
.foot-ms p{font-size:14px;color:#555555;margin-bottom:25px;height:50px;padding-left:70px;padding-top:20px}
.foot-ms p.p1{background:url(../images/t1.png) no-repeat left;}
.foot-ms p.p2{background:url(../images/t2.png) no-repeat left;}
.foot-ms p.p3{background:url(../images/t3.png) no-repeat left;}
.foot-code img{width:110px;height:110px;border:1px solid #e6e6e6;padding:5px;}
.foot-code div{font-size:14px;color:#828282}
.foot-code div span{margin-left:10px;line-height:1.2}
.bg12{position: absolute;right:0;top:0;}
.onlines{width:150px;height:60px;background:#105400;color:#fff!important;text-align:center;line-height:60px;position: absolute;right:30px;top:240px;}
.onlines:hover{background:#23850b;}
.copys{height:50px;background:#333333;overflow:hidden;}
.copys p{text-align:center;line-height:50px;color:#b0b0b0;font-size:14px;}
.copys p a{color:#b0b0b0}
/*footer e*/


.vidMb video{
    width: 100%;
    height: 100%;
}
#video_list li img.videopic,.videos-pic img.videopic,.videos-pic{width:100%;height:435px}
.video-show{position: absolute;left:0;top:0;}
.videosss video,.vidCon,#mp4,.video-play,.video-show{width:100%;height:100%}
.play{position: absolute;left:0;top:0;right:0;bottom:0;margin:auto;z-index:999}
#video_list li{position:relative;width:100%;height:435px;overflow:hidden;background-repeat:no-repeat;background-position:center center;background-size: cover;}

/* 视频 */
.vidMb{
    width: 100%;
    height: 0px;
    background-color: rgba(0, 0, 0, .5);
    overflow: hidden;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    z-index: -5000;
    opacity: 0;
    filter: alpha(opacity=0);

    -webkit-transition: 0.5s;
       -moz-transition: 0.5s;
        -ms-transition: 0.5s;
         -o-transition: 0.5s;
            transition: 0.5s;
}

.vidList{
    width: 740px;
    height: 481px;
    background-color: #000;
    overflow: hidden;
    position: relative;
    top: 50%;
    left: 50.22%;
    -webkit-transform: translate(-50%,-50%);
       -moz-transform: translate(-50%,-50%);
        -ms-transform: translate(-50%,-50%);
         -o-transform: translate(-50%,-50%);
            transform: translate(-50%,-50%);    
}
.vidList > .vidGb{
    color: #e1e1e1;
    cursor: pointer;
    display: block;
    font-style: normal;
    font-size: 36px;
    position: absolute;
    top: 2px;
    right: 12px;
    z-index: 99;
    overflow: hidden;

    -webkit-transform: scaleY(0.8);
       -moz-transform: scaleY(0.8);
        -ms-transform: scaleY(0.8);
         -o-transform: scaleY(0.8);
            transform: scaleY(0.8);

    -webkit-transition: 0.3s;
       -moz-transition: 0.3s;
        -ms-transition: 0.3s;
         -o-transition: 0.3s;
            transition: 0.3s;
}
.vidList .vidCon{
    width: 100%;
    height: 100%;
    position: relative;
}
.vidCon > embed{
    width: 100%;
    height: 100%;
}
.videoTop{
    width: 1196px;
    height: 59px;
    padding-left: 34px;
    padding-right: 34px;
    background-color: #fff;
    margin: 0 auto;
}
.videoTop h4{
    font-size: 24px;
    color: #000;
    width: 100px;
    float: left;
    line-height: 38px;
}
.videoTop > span{
    display: block;
    float: right;
    height: 100%;
    font-size: 14px;
    line-height: 59px;
    color: #000;
}
.videoTop > span a {
    color: #222;
    font-size: 14px;
}
.videoTop > span a:hover {
    color: #029b41;
}
#videoCon{
    width: 100%;
    overflow: hidden;
    margin: auto;
    padding-top: 2px;
    padding-bottom: 80px;
}
.vidsListCon{
    width: 100%;
    height: 435px;
    position: absolute;
}

.vidsListCon > ul{
    width: 1197px;
    overflow: hidden;
    margin: auto;
    /* min-height: 600px; */
    border-top: 1px solid #efefef;
    border-left: 1px solid #efefef;
}
.vidsListCon > ul li{
    box-sizing: content-box!important;
    border-right: 1px solid #efefef;
    border-bottom: 1px solid #efefef;
    background: #fff;
    float: left;
    width: 298px;
    height: 286px;
    padding: 10px 10px 20px;
    box-sizing: border-box!important;
    overflow: hidden;
}
.vidsListCon > ul li a{
    height: 100%;
    display: block;
    overflow: hidden;
}
.vidsListCon > ul li a > .img{
    width: 100%;
    height: 188px;
    position: relative;
    overflow: hidden;
}
.vidsListCon > ul li a > .img img{
    max-width: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%,-50%);
       -moz-transform: translate(-50%,-50%);
        -ms-transform: translate(-50%,-50%);
         -o-transform: translate(-50%,-50%);
            transform: translate(-50%,-50%);
}
.vidsListCon > ul li a >.liText{
    width: 100%;
    height: auto;
    margin-top: 9px;
    overflow: hidden;
}
.vidsListCon > ul li a >.liText h4{
    width: 100%;
    font-size: 14px;
    font-weight: 500;
    text-align: center;
    margin: 0;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}
.vidsListCon > ul li a >.liText span{
    display: block;
    font-size: 12px;
    width: 100px;
    margin: auto;
    text-align: center;
    border: 1px solid #efefef;
    border-radius: 50px;
    line-height: 30px;
    margin-top: 10px;
    color: #999;
}
.vidsListCon > ul li:hover{
    box-shadow: inset 0 0 12px #e6e6e6;
}
.vidsListCon > ul li:hover span{
    box-shadow: inset 0 0 12px #e6e6e6;
}
.vidsListCon > ul li,
.liText span{
    -webkit-transition: 0.3s;
       -moz-transition: 0.3s;
        -ms-transition: 0.3s;
         -o-transition: 0.3s;
            transition: 0.3s;
}


#float{
    width: 80px;
    height: 335px;
    position: fixed;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    z-index: 99999999;
    opacity: 0;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -ms-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
    transform-origin: right center;
    -webkit-transform: perspective(100px) rotateY(90deg);
    -moz-transform: perspective(100px) rotateY(90deg);
    -ms-transform: perspective(100px) rotateY(90deg);
    -o-transform: perspective(100px) rotateY(90deg);
    transform: perspective(100px) rotateY(90deg);
}
#float.on{
    right: 0;
    opacity: 1;
    -webkit-transform: perspective(0) rotateY(0deg);
    -moz-transform: perspective(0) rotateY(0deg);
    -ms-transform: perspective(0) rotateY(0deg);
    -o-transform: perspective(0) rotateY(0deg);
    transform: perspective(0) rotateY(0deg);
}
#float ul{
    width: 100%;
    height: auto;
    margin-bottom: 0;
}
#float ul li{
    width: 80px;
    height: 80px;
    border-radius: 2px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    margin-bottom: 1px;
    position: relative;
    background:#eeeeee;

    -webkit-transition: 0.3s;
    -moz-transition: 0.3s;
    -ms-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
}
#float ul li:last-child{
    margin-bottom: 0;
}
#float ul li a{
    height: 100%;
    display: block;
    position: relative;
    z-index: 99999;
    overflow: hidden;
}
#float ul li a i{
    width: 38px;
    height: 38px;
    background-repeat: no-repeat;
    display: block;
    margin: 12px auto 4px;
}
#float ul li a span{
    color: #666666;
    display: block;
    font-size: 14px;
    line-height: 12px;
    text-align: center;
}
.floatTel{
    width: 160px;
    height: 80px;
    background: #01a74b;
    border-radius: 2px;
    color: #ffffff;
    font-size: 16px;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 80px;
    margin: auto;
    line-height: 80px;
    text-align: center;
    z-index: -1;
    opacity: 0;
    transform-origin: right;
    -webkit-transform: scaleX(0);
    -moz-transform: scaleX(0);
    -ms-transform: scaleX(0);
    -o-transform: scaleX(0);
    transform: scaleX(0);

    -webkit-transition: 0.5s;
    -moz-transition: 0.5s;
    -ms-transition: 0.5s;
    -o-transition: 0.5s;
    transition: 0.5s;
}
#float ul li:hover .floatTel{
    opacity: 1;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
}
#float ul li.flEwm > div{
    width: 120px;
    height: 120px;
    background: #fff;
    border-radius: 8px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: 3px;
    position: absolute;
    top: 0;
    right: 80px;
    z-index: 9;

    opacity: 0;
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    -o-transform: scale(0);
    transform: scale(0);

    -webkit-transition: 0.5s;
    -moz-transition: 0.5s;
    -ms-transition: 0.5s;
    -o-transition: 0.5s;
    transition: 0.5s;
}
#float ul li.flEwm > div img{
    width: 100%;
    height: 100%;
}
#float ul li.flEwm:hover > div{
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
    opacity: 1;
}
#float ul li,
#float ul li i,
#float ul li span{
    -webkit-transition: 0.4s;
    -moz-transition: 0.4s;
    -ms-transition: 0.4s;
    -o-transition: 0.4s;
    transition: 0.4s;
}
#float ul li:hover{
    background-color: #62a719;
    border-color: transparent;
}
#float ul li:nth-child(1) a i{
    background:url(../images/dh.png) no-repeat center;
}
#float ul li:hover:nth-child(1) a i{
    background:url(../images/dhs.png) no-repeat center;
}
#float ul li:nth-child(2) a i{
   background:url(../images/zx1.png) no-repeat center;
}
#float ul li:hover:nth-child(2) a i{
   background:url(../images/zx1s.png) no-repeat center;
}

#float ul li:nth-child(3) a i{
   background:url(../images/ly.png) no-repeat center;
}
#float ul li:hover:nth-child(3) a i{
   background:url(../images/lys.png) no-repeat center;
}
#float ul li:nth-child(5) a i{
    background-position: -54px -334px;
}
#float ul li:nth-child(4) a i{
    background:url(../images/ewm.png) no-repeat center;
}
#float ul li:hover:nth-child(4) a i{
    background:url(../images/ewms.png) no-repeat center;
}
#float ul li:nth-child(5) a i{
    background:url(../images/top.png) no-repeat center;
}
#float ul li:hover:nth-child(5) a i{
    background:url(../images/tops.png) no-repeat center;
}
#float ul li:hover span{
    color: #fff;
}
.tops{cursor: pointer;}