﻿@charset "utf-8";
/* CSS Document */
.empty-30 {height: 30px;}
.empty-20 {height: 20px;}
.empty-10 {height: 10px;}
.empty-5 {height: 5px;}
.empty-25 {height: 25px;}
.empty-40 {height: 40px;}

ul {padding: 0px;margin: 0px;}
body {
	font: 12px/22px Verdana, "微软雅黑", Arial, sans-serif, "Times New Roman";
	color: #333;
}
* {
	text-decoration: none;
	font-style: normal;
	list-style: none;
}
a:hover {text-decoration: none;}
.main-wrap {max-width:1000px;margin: 0 auto;}

.shou-warp{background:#336699;margin: 0 -15px; height:30px; line-height:30px; color:#fff; font-size:13px;}
.r-show a{ color:#fff;}

.top-warp{background:#f5f5f5;margin: 0 -15px;}
.logo { margin:15px 0px;}
.logo img{ width:100%;}
.tel{ float:right;margin-top:25px; background:url(../images/tel.png) no-repeat left center; height:28px; text-indent:110px; color:#dc0405; font-weight:bold;font-size:26px; font-family:微软雅黑;}
.menu-warp {  height:45px; margin: 0 -15px;background:#0099cc;}

.nav-bar1{ background:url(../images/nav-bj.jpg) repeat-x; height:86px; width:100%; background-size:100% 100%;}
.nav-bar1 li{ float:left; width:23%; margin:1%; height:37px; text-align:center; line-height:40px; font-size:14px;}
.nav-bar1 a:link, .nav-bar1 a:visited{ display:block; width:100%; height:37px; line-height:40px; color:#fff;}
.nav-bar1 a:hover, .nav-bar1 a:active{ display:block; width:100%; height:37px; line-height:40px; color:#fff; background:#336699;}

/*导航下拉开始*/
.menu .nLi { display: block;  text-align: center;height: 45px;  width: 12.5%; font-family:微软雅黑; font-size:14px; }
.menu .nLi a:link, .menu .nLi a:visited{display:block; width:100%; height:45px; color:#fff;}
.menu .nLi a:hover, .menu .nLi a:active{display:block; width:100%; height:45px; color:#fff; background:#336699;transition: all 0.6s;}
.clearfix:after{content:".";display:block;height:0;clear:both;visibility:hidden;}
.nav{  position:relative; z-index:1; }
.nav .nLi{ float:left;  position:relative; display:inline;  }
.nav .nLi h3{ float:left;  }
.nav .nLi h3 a{ display:block;  font-size:14px; font-family:微软雅黑;   }
.nav .sub{ display:none; width:100%;left:0; top:55px;  position:absolute; background:url(../images/n.png) repeat-y;  line-height:30px; z-index:999;}
.nav .sub li{ zoom:1; text-align:center; padding-top:10px;  font-family:微软雅黑;background:#171717; opacity: 0.6; filter: alpha(opacity=50);}
.nav .sub a{ display:block;  }
.nLi .sub a:link, .nLi .sub a:visited{ display:block;width:100; height:30px; line-height:30px;  color:#fff;   }
.nLi .sub a:hover, .nLi .sub a:active{ display:block;width:100; height:30px; line-height:30px;  color:#fff;kground:#8ab822;  }


/*导航下拉结束*/


.txt { font-size:14px;}
.tit a { color:#f5f5f5;}


.dh { height: 60px; position: absolute; top: 20; right: 0; z-index: 2; }
#xx { width: 100%; display: none; position: absolute; top: 40px; right: 0; z-index: 99999; }
#xx ul { margin: 0; padding: 0; }
#xx ul li { width: 100%; height: 30px; line-height: 30px; border-bottom: solid 1px #f00; float: left; background: #336699; opacity: 0.6; filter: alpha(opacity=50); text-align: center; font-size: 16px; font-family: 微软雅黑; }
#xx ul li a:link, #xx ul li a:visited { color: #fff; display: block; width: 100%; height: 30px; line-height: 30px; }
#xx ul li a:hover, #xx ul li a:active { color: #FFFFFF; display: block; width: 100%; height: 30px; line-height: 30px; background:#f49701; }



.main{ background:#f5f5f5; padding-top:20px;}
.l-main{ background:#e9e9e9;}
.pro-list .tit{ background:url(../images/cp-tit.png) no-repeat; height:32px; line-height:28px; text-indent:45px; color:#fff; font-size:10px; font-family:微软雅黑; width:100%; background-size:100% 100%;}
.pro-list .tit span{ font-size:16px;}
.pro-list .txt{ padding-left:25px;}
.pro-list .txt li{ font-family:微软雅黑; text-indent:60px;}
.pro-list .txt a:link, .pro-list .txt a:visited{ display:block; background:url(../images/link.png) no-repeat; height:38px; line-height:38px; color:#505050;}
.pro-list .txt a:hover, .pro-list .txt a:active{ display:block; background:url(../images/hover.png) no-repeat; height:38px;line-height:38px; color:#0157ad;}
.pro-list .txt2{ padding-left:25px;}
.pro-list .txt2 li{ font-family:微软雅黑; text-indent:26px;}
.pro-list .txt2 a:link, .pro-list .txt a:visited{ display:block; background:url(../images/link2.png) no-repeat; height:38px; line-height:38px; color:#505050;}
.pro-list .txt2 a:hover, .pro-list .txt a:active{ display:block; background:url(../images/hover2.png) no-repeat; height:38px;line-height:38px; color:#0157ad;}

.fw{ background:url(../images/fw.png) no-repeat top center; height:54px; line-height:16px; margin-top:10px; color:#606060; font-size:11px; font-family:Arial;}
.fw .fw-zi span{ font-family:微软雅黑; color:#333333; font-size:16px;}
.fw .fw-zi{padding:15px 0px 0px 105px;}


.news{ background:url(../images/new.png) no-repeat top center; height:54px; line-height:16px; margin-top:10px; color:#606060; font-size:11px; font-family:Arial;}
.news .fw-zi span{ font-family:微软雅黑; color:#333333; font-size:16px;}
.news .fw-zi{padding:15px 0px 0px 105px;}



.message{ background:url(../images/mes.png) no-repeat top center; height:54px; line-height:16px; margin-top:10px; color:#606060; font-size:11px; font-family:Arial;}
.message .fw-zi span{ font-family:微软雅黑; color:#333333; font-size:16px;}
.message .fw-zi{padding:15px 0px 0px 105px;}



.contact .tit{ margin-top:20px; background:url(../images/cp-tit.png) no-repeat; height:32px; line-height:28px; text-indent:45px; color:#fff; font-size:10px; font-family:微软雅黑; width:100%; background-size:100% 100%;}
.contact .tit span{ font-size:16px;}
.contact .txt{ padding:10px;}
.contact .c-top{ background:url(../images/t-2.png) no-repeat left center; text-indent:45px; color:#f07b28; font-size:20px; font-family:Arial; font-weight:bold; font-style:italic;}
.contact .c-img{ margin:10px 0px;}
.contact .c-foot{ background:url(../images/t-5.png) no-repeat; color:#505050; line-height:22px; padding-bottom:20px; }
.contact .c-foot span{ color:#333333; font-weight:bold;}

.row-list .tit{ background:url(../images/ab-tit.png) no-repeat; text-indent:50px; width:100%;background-size:100% 100%; height:36px; line-height:30px; color:#fff; font-size:14px; font-family:微软雅黑;}
.row-list .tit span{ font-weight:bold; font-size:16px;}
.row-list li{ float:left; width:31.3%; margin:1%;}
.row-list img{ width:100%;}
.row-list{ margin-bottom:10px;}


.about .tit{ background:url(../images/ab-tit.png) no-repeat; text-indent:50px; width:100%;background-size:100% 100%; height:36px; line-height:30px; color:#fff; font-size:14px; font-family:微软雅黑;}
.about .tit span{ font-weight:bold; font-size:16px;}
.about .more{ float:right; margin-right:10px;}
.about .txt img{ float:right; margin-left:10px;transition:all 0.6s;}
.about .txt{ line-height:22px; color:#333333; margin-top:20px; }
.about .txt:hover img{ opacity:0.5;}



.ry .tit{ background:url(../images/ry-tit.png) no-repeat; text-indent:50px; width:100%;background-size:100% 100%; height:36px; line-height:30px; color:#fff; font-size:14px; font-family:微软雅黑;}
.ry .tit span{ font-weight:bold; font-size:16px;}
.ry .txt{ margin-top:20px; padding-left:30px;}
/*幻灯片滚动开始*/

.slide-Box{ width:100%; height:164px; overflow:hidden; position:relative;   }
.slide-Box .hd{ height:15px; overflow:hidden; position:absolute; right:60px; bottom:0px; z-index:1; }

.slide-Box .hd ul{ overflow:hidden; zoom:1; float:left;  }

.slide-Box .hd ul li{ float:left; margin-right:2px;  width:10px; height:10px; line-height:14px; text-align:center; background:#000; color:#000; cursor:pointer; border-radius:50%; }
.slide-Box .hd ul li.on{ background:#f00; color:#f00;  }

.slide-Box .bd{ position:relative; height:100%; z-index:0;   }
.slide-Box .bd li{ zoom:1; vertical-align:middle; }
.slide-Box .bd img{ width:230px; height:164px; display:block;  }

/*幻灯片滚动结束*/




.cp .tit{ margin-top:30px; background:url(../images/anli-tit.png) no-repeat; text-indent:50px; width:100%; background-size:100% 100%; height:35px; line-height:30px; color:#fff; font-size:14px; font-family:微软雅黑;}
.cp .tit span{ font-weight:bold; font-size:16px;}
.cp .more{ float:right; margin-right:10px;}
.cp .txt { margin-top:20px;}
.cp .cp-img img{ transition:all 0.6s; position: absolute; top: 0; bottom: 0; left: 0; right: 0; max-width: 100%; max-height: 100%; display: block; margin: auto;}
.cp .cp-img:hover img{ opacity:0.5;}
.cp .txt li{ text-align:center; margin-bottom:10px;}
.cp .txt span{ line-height:35px; color:#333333;}


.anli .tit{ background:url(../images/anli-tit.png) no-repeat; text-indent:50px; width:100%; background-size:100% 100%; height:35px; line-height:30px; color:#fff; font-size:14px; font-family:微软雅黑;}
.anli .tit span{ font-weight:bold; font-size:16px;}
.anli .more{ float:right; margin-right:10px;}
.anli .txt li{ text-align:center;}
.fwxm_contect{width:100%; padding-top:30px; position:relative;}

/*响应式轮播图*/
#responsive-shuffling { width:100%;height:100%;}
#responsive-shuffling .swiper-slide {width:100%; position:relative; padding:0px ;}
#responsive-shuffling .swiper-slide img{ width:100%;}

.swiper-slide .s-img:link, .swiper-slide .s-img:visited{ display:block; width:100%;}
.swiper-slide .s-img:hover, .swiper-slide .s-img:active{ display:block; width:100%;}
.s-img img{ position: absolute; top: 0; bottom: 0; left: 0; right: 0; max-width: 100%; max-height: 100%; display: block; margin: auto; }

#responsive-shuffling .swiper-slide .gcal_sp{display:none; width:100%; height:100%; line-height:130px;text-align:center;background:rgba(0, 0, 0, 0.4) none repeat scroll 0 0 !important; background-color:#000; overflow:hidden; position:absolute;left:0;top:0; cursor:pointer;transition:all 0.1s;}
#responsive-shuffling .swiper-slide .gcal_sp a{ display:block; overflow:hidden;  color:#fff; font-size:14px; font-weight:bold;}
#responsive-shuffling .swiper-slide:hover .gcal_sp{ display:block;}
#responsive-shuffling:hover .swiper-button-prev, .swiper-container-rtl .swiper-button-next{ display:block;}
#responsive-shuffling:hover .swiper-button-next, .swiper-container-rtl .swiper-button-prev{ display:block;}

.col-xs-5ths, .col-sm-5ths, .col-md-5ths, .col-lg-5ths { position: relative; min-height: 1px; }
@media ( min-width : 768px) {
.col-sm-5ths { width:  19.3%; float: left; }
}
@media ( min-width : 992px) {
.col-md-5ths { width:  19.3%; float: left; }
}



.footer{ height:55px; line-height:55px; color:#fff; background:#336799; font-family:微软雅黑; font-size:13px;}
.footer a{ color:#fff;}







.content .tit{background:url(../images/anli-tit.png) no-repeat; text-indent:50px; width:100%; background-size:100% 100%; height:35px; line-height:30px; color:#fff;}
.content .txt{ color:#333333; margin-top:20px;}


/*about*/
.n-about .txt img{ float:left; margin-right:15px;}


/*fw*/
.n-fw .txt img{ float:left; margin-right:15px;}


/*anli*/
.n-anli .cp-img img{ transition:all 0.6s; position: absolute; top: 0; bottom: 0; left: 0; right: 0; max-width: 100%; max-height: 100%; display: block; margin: auto;}
.n-anli .cp-img:hover img{ opacity:0.5;}
.n-anli .txt li{ text-align:center; margin-bottom:10px;}
.n-anli .txt p{ line-height:35px; color:#333333;}

/*cp*/
.cp-img { position: relative; overflow: hidden;}
.n-cp .cp-img img{ transition:all 0.6s; position: absolute; top: 0; bottom: 0; left: 0; right: 0; max-width: 100%; max-height: 100%; display: block; margin: auto;}
.n-cp .cp-img:hover img{ opacity:0.5;}
.n-cp .txt li{ text-align:center; margin-bottom:10px;}
.n-cp .txt p{ line-height:35px; color:#333333;}
.case-top { padding-top: 70%; }

/*cpnei*/
.n-cpnei .pstit{ text-align:center; font-size:16px;}
.n-cpnei .psimg { width:100%; text-align:center; padding:15px 0;}
.n-cpnei .psimg img { max-width:90%; margin:0 auto; }
.n-cpnei .pscon { width:100%;}

/*news*/
.n-news .txt li{ border-bottom:1px dotted #c9cacc; line-height:35px; height:35px; overflow:hidden;}
.n-news .txt a{ color:#333333;}

/*newsnei*/
.n-newsnei .new-name{ text-align:center; font-size:16px; font-weight:bold; margin-bottom:20px;}


/*message*/
.n-message .txt li{ margin-bottom:15px;}
.n-message .m-name{ float:left; width:15%; height:25px; line-height:25px; text-align:center; font-size:14px; font-family:微软雅黑;}
.n-message .m-text { float:left;width:84%;height:25px;}
.n-message .m-text input{ height:25px; line-height:25px; width:50%;}
.n-message .m-text input:hover{ border:1px solid #399ef2; height:25px; line-height:25px; display:block;}

.n-message .m-text textarea{ height:100px; width:60%; border-radius:5px;}
.n-message .m-text textarea:hover{ border:1px solid #399ef2; height:100px; display:block;border-radius:5px;}

.n-message .m-butt{ width:50%; margin-top:90px; text-align:center;}
.n-message .m-butt input{ height:30px; line-height:30px; text-align:center; width:30%; }

/*online*/
.n-online .txt li{ margin-bottom:15px;}
.n-online .o-name{ float:left; width:100%; height:25px; line-height:25px; }
.n-online .o-text{ float:left; width:100%;}
.n-online .o-text input{ height:25px; line-height:25px; width:100%; border:1px solid #ccc; border-radius:5px; }
.n-online .o-text input:hover{ border:1px solid #ac1d1e; width:100%; height:25px; line-height:25px; display:block;}

.n-online .o-text textarea{ height:85px; width:100%;border:1px solid #ccc; border-radius:5px; }
.n-online .o-text textarea:hover{ border:1px solid #399ef2;  height:85px; display:block;}

.n-online .on-last{ padding-top:20px;}
.n-online .o-in1{ float:left; width:45%;}
.n-online .o-in2{ float:right; width:45%; }

.n-online .o-in1 input{height:23px; line-height:23px; text-align:center; width:100%; background:#dedede; border:1px solid #c0c0c0; border-radius:5px;}
.n-online .o-in2 input{height:23px; line-height:23px; text-align:center; width:100%; background:#dedede; border:1px solid #c0c0c0; border-radius:5px;}













.bottomqq {
	position: fixed;
	bottom: 0;
	left: 0;
	z-index: 2000;
	right: 0px;
	width: 100%;
	height: 49px;
	overflow: hidden;
	cursor: default;
	padding-top: -61px;
	background:#336799;
}
.bottom1 {
	width: 300px;
	margin: 0 auto;
}
.bottom1 a {
	float: left;
	width: 43px;
	text-align: center;
	line-height: 20px;
	color: #fff;
	height: 44px;
	margin: 5px 15px 0 15px;
	font-size: 16px;
	font-family:微软雅黑;
}
.bottom1 a:hover{ background:#0099cc;}
.bottom1 a img {
	margin-bottom: 5px;
}
.bottom1 a.xianqd {
	border: 0px;
}



/*产品下拉开始*/
.n-prolist1{ margin-top:20px;}
.n-prolist1 .left{width:100%;height:auto;}
.n-prolist1 .div1{width:100%; }
.n-prolist1 .div6{cursor:pointer;position:relative; }
.n-prolist1 .div6{ width:100%; height:40px; line-height:40px; color:#fff; font-family:微软雅黑; font-size:14px; background:url(../images/n-tu2.jpg) no-repeat right 10px center #0099cc; text-indent:20px;  }

.n-prolist1 .div7{display:none;font-family:微软雅黑; margin-top:1px; }
.n-prolist1 .div7 ul{margin:0;padding:0;}
.n-prolist1 .div7 li{ width:100%;height:25px; margin-bottom:1px; line-height:25px;  font-family:微软雅黑; text-align:center;border:1px solid #22a2dd;}
.n-prolist1 .div7 li a{color:#22a2dd;}

/*产品下拉结束*/
.fix_qq {
position: fixed;
right: 0px;
top: 240px;
width: 93px;
height: 122px;
z-index:9999;
background: url(../images/qq_01.png) no-repeat;}
.fix_qq_top {
height: 122px;
background: url(../images/qq_01.png) no-repeat;
}
.fix_qq_center {
background: url(../images/qq_02.png) repeat-y;
text-align: center;
}
.fix_qq_foot {
height: 4px;
background: url(../images/qq_04.png) no-repeat;
}

/*banner*/
.banner{  overflow:hidden;width:100%;}
.banner a.active{ outline:0;}
.banner .bannerc { position: relative; height: 100%; overflow-x: hidden; overflow-y: auto;}
.banner .ck-slide { width:100%;height:420px;position: relative; overflow: hidden; transition:all 0.3s;}
.banner .ck-slide ul { margin: 0; padding: 0; list-style-type: none;}
.banner .ck-slide ul.ck-slide-wrapper { position: absolute; top: 0; left: 0;  margin: 0; padding: 0;width:100%;height:420px; transition:all 0.3s;}
.banner .ck-slide ul.ck-slide-wrapper li { display:none; position: absolute; width:100%; height:100%; text-align:center;}
.banner .ck-slide ul.ck-slide-wrapper li a{ height:100%;}
.banner .ck-slide ul.ck-slide-wrapper li div{ width:100%; height:420px;}
.banner .ck-slide ul.ck-slide-wrapper li .img01{background:url(../images/1.jpg) no-repeat center center;background-size:100% 100%;}
.banner .ck-slide ul.ck-slide-wrapper li .img02{background:url(../images/2.jpg) no-repeat center center;background-size:100% 100%;}
.banner .ck-slide ul.ck-slide-wrapper li .img03{background:url(../images/3.jpg) no-repeat center center;background-size:100% 100%;}

.banner .ck-slide ul.ck-slide-wrapper li.active{ display:block;}
.banner .ck-slide .ck-prev, .ck-slide .ck-next { position: absolute; top: 50%; z-index: 2; width: 35px; height: 70px; margin-top: -35px; border-radius: 3px; opacity: .15; background: red; text-indent: -9999px; background-repeat: no-repeat; transition: opacity .2s linear 0s;}
.banner .ck-slide .ck-prev { left: 5px; background: url(../images/arrow-left.png) #000 50% no-repeat;}
.banner .ck-slide .ck-next { right: 5px; background: url(../images/arrow-right.png) #000 50% no-repeat;}
.banner .ck-slidebox { position: absolute; left: 50%; bottom: 12px; z-index: 30;}
.banner .ck-slidebox ul { height: 20px; padding: 0 4px; border-radius: 8px; background: rgba(0,0,0,0.5);}
.banner .ck-slidebox ul li { float: left; height: 12px; margin: 4px 4px;}
.banner .ck-slidebox ul li em { display: block; width: 12px; height: 12px; border-radius: 100%; background-color: #fff; text-indent: -9999px; cursor: pointer;}
.banner .ck-slidebox ul li.current em { background-color: #fe6500;}
.banner .ck-slidebox ul li em:hover { background-color: #fe6500;}

.zero-padding{ padding:0}
.zero-margin{ margin:0}

@media (max-width:768px){
.banner .ck-slide{height:200px;}
.banner .ck-slide ul.ck-slide-wrapper {height:200px;}
.banner .ck-slide ul.ck-slide-wrapper li div{ height:200px;}
lg>.btn, .btn-lg { font-size:26px;margin-top:10px;}
#xx { width: 100%; display: none; position: absolute; top: 60px; right: 0; z-index: 99999; }
.about .txt img{ width:40%;}
.ry .tit{ background-size:100% 100%;}
.footer{ height:220px;}
.n-about .txt img{ max-width:100%;}
.n-contact .txt img{ width:100%;}
.n-fw .txt img{ width:100%;}
.n-cpnei .txt img{ width:100%;}

.n-message .txt li{ margin-bottom:15px;}
.n-message .m-name{ float:left; width:20%; height:25px; line-height:25px; }
.n-message .m-text{ float:left; width:78%;}
.n-message .m-text input{ height:25px; line-height:25px; width:100%; border:1px solid #ccc; border-radius:5px; }
.n-message .m-text input:hover{ border:1px solid #ac1d1e; width:100%; height:25px; line-height:25px; display:block;}

.n-message .m-text textarea{ height:85px; width:100%;border:1px solid #ccc; border-radius:5px; }
.n-message .m-text textarea:hover{ border:1px solid #399ef2;  height:85px; display:block;}

.n-message .m-butt{ width:100%; margin:50px 0; text-align:center;}
.n-message .m-butt input{ height:30px; line-height:30px; text-align:center; width:20%; margin-top:20px; }

    .fix_qq {
    display:none;
    }
}
@media (max-width:414px){.logo{ margin-top:20px;}
.nav-bar1 li{ float:left; width:23%; margin:1%; height:35px; text-align:center; line-height:40px; font-size:14px;}

}
@media (max-width:375px){.logo{ margin-top:20px;}
.nav-bar1 li{ float:left; width:23%; margin:1%; height:35px; text-align:center; line-height:40px; font-size:14px;}

}

@media (max-width:340px){
/*banner*/
.banner .ck-slide{height:100px}
.banner .ck-slide ul.ck-slide-wrapper {height:100px}
.banner .ck-slide ul.ck-slide-wrapper li div{ height:100px;}
lg>.btn, .btn-lg { font-size:18px;margin-top:5px;}
#xx { width: 100%; display: none; position: absolute; top: 60px; right: 0; z-index: 99999; }
}

/*清除样式*/
.clear { clear:both;}

/*分页css scott style pagination*/
div.scott{padding:3px;margin:3px;text-align:center;}
div.scott a{border:#ddd 1px solid;padding:2px 5px;color:#88af3f;margin:0 2px 0 0;text-decoration:none;}
div.scott a:hover{border:#85bd1e 1px solid;color:#638425;background-color:#f1ffd6;}
div.scott a:active{border:#85bd1e 1px solid;color:#638425;background-color:#f1ffd6;}
div.scott span.current{border:#b2e05d 1px solid;padding:2px 5px;font-weight:bold;color:#fff;margin:0 2px 0 0;background-color:#b2e05d;}
div.scott span.disabled{border:#f3f3f3 1px solid;padding:2px 5px;color:#ccc;margin:0 2px 0 0;}

.ditu { height:300px;padding:8px 0;width:90%; margin-top:20px; margin:0 auto;}



/*浮动QQ*/
.dock {
	position: fixed;
	right: 0px;
	width: 50px;
	-moz-opacity: 0.7;
	opacity: 0.7;
	z-index: 200;
}

.dock.close {
	z-index: 50;
}

.dock ul.icons {
	position: absolute;
	list-style: none;
	right: 0px;
	padding: 0px;
	width: 50px;
	border: 1px solid #333;
	border-right: none;
	background: #111;
	-moz-border-radius: 10px 0 0 10px;
	-webkit-border-radius: 10px 0 0 10px;
	border-radius: 10px 0 0 10px;
	-webkit-transition: all .3s ease-in-out 0s;
	-moz-transition: all .3s ease-in-out 0s;
	-ms-transition: all .3s ease-in-out 0s;
	-o-transition: all .3s ease-in-out 0s;
	transition: all .3s ease-in-out 0s;
}

.dock.close ul.icons {
	right: -70px;
}

.dock ul.icons li i {
	display: block;
	position: relative;
	width: 50px;
	height: 50px;
	background: url(../images/icons.png) no-repeat;
	cursor: pointer;
	-webkit-transition: all .3s ease-in-out 0s;
	-moz-transition: all .3s ease-in-out 0s;
	-ms-transition: all .3s ease-in-out 0s;
	-o-transition: all .3s ease-in-out 0s;
	transition: all .3s ease-in-out 0s;
	z-index: 210;
}

.dock ul.icons li.active i {
	-moz-opacity: 0.4;
	opacity: 0.4;
}

.dock ul.icons li.up i {
	background-position: -63px -150px;
}

.dock ul.icons li.phone i {
	background-position: -62px -108px;
}

.dock ul.icons li.im i {
	background-position: -63px -20px;
}

.dock ul.icons li.wechat i {
	background-position: -59px -66px;
}

.dock ul.icons li.down i {
	background-position: -63px -190px;
}

.dock ul.icons li p {
	display: block;
	position: absolute;
	top: 50px;
	right: -260px;
	padding: 15px 20px;
	height: 120px;
	color: White;
	line-height: 30px;
	border: 1px solid #333;
	border-right: none;
	background: #111;
	-moz-border-radius: 10px 0 0 10px;
	-webkit-border-radius: 10px 0 0 10px;
	border-radius: 10px 0 0 10px;
	-moz-opacity: 0;
	opacity: 0;
	filter: alpha(opacity=0);
	-webkit-transition: all .4s ease-in-out .1s;
	-moz-transition: all .4s ease-in-out .1s;
	-ms-transition: all .4s ease-in-out .1s;
	-o-transition: all .4s ease-in-out .1s;
	transition: all .4s ease-in-out .1s;
	overflow: hidden;
	z-index: 201;
}

.dock ul.icons li.active p {
	right: 50px;
	-moz-opacity: 1;
	opacity: 1;
	filter: alpha(opacity=100);
}

.dock ul.icons li.phone p {
width: 143px;
    height:130px;
    line-height:30px
}

.dock ul.icons li.im p {
	width: 140px;
    height:170px;
    line-height:30px
}

.dock ul.icons li.im p a {
	display: block;
	margin-top: 12px;
	width: 100px;
	height: 35px;
	line-height: 32px;
	color: #00dfb9;
	font-size: 16px;
	text-align: center;
	text-decoration: none;
	border: 1px solid #00dfb9;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	-webkit-transition: all .3s ease-in-out 0s;
	-moz-transition: all .3s ease-in-out 0s;
	-ms-transition: all .3s ease-in-out 0s;
	-o-transition: all .3s ease-in-out 0s;
	transition: all .3s ease-in-out 0s;
}

.dock ul.icons li.im p a:hover {
	color: White;
	background: #0f8773;
	border: 1px solid #0f8773;
}

.dock ul.icons li.wechat p {
	width: 180px;
    height:180px;
    line-height:30px
}

.dock ul.icons li.wechat p img {
	
	border: 2px solid #000;
}

.dock a.switch {
	position: absolute;
	display: block;
	top: 270px;
	right: 11px;
	width: 26px;
	height: 26px;
	background: url(../images/icons.png) no-repeat 0px -640px;
	cursor: pointer;
	-webkit-transition-delay: .15s;
	-moz-transition-delay: .15s;
	-ms-transition-delay: .15s;
	-o-transition-delay: .15s;
	transition-delay: .15s;
}

.dock a.switch.off {
	background-position: -32px -640px;
}


