body{background:#f8f8f8;}

.header{padding:15px 0;}
.logo{width: 50%; float: left;}
.logo img{width: 100%;}
.tel{width: 50%; float: right; }

.c-search ul{float: right; margin-top: 20px;}
.phone{float: right; margin-right: 20px;}

.xx{float: right;}

.c-search input {
    border: 1px solid #bbb;
    width: 180px;
    height: 28px;
    padding-left: 10px;
    border-radius: 5px 0 0 5px;
    border-right: 0;
    float: left;
}

.c-search button {
    border: 1px solid #bbb;
    background: #fff;
    width: 30px;
    height: 28px;
    line-height: 24px;
    border-radius: 0 5px 5px 0;
    border-left: 0;
    cursor: pointer;
    font-size: 22px;
    color: #0AA2E8;
}
.yy{float: right; margin-left: 15px;}
.yy a{display: inline-block;  border-radius: 26px; text-align: center; width:28px; height: 28px; line-height: 28px; background: #0AA2E8; color: #fff;}


.nav{background: #0AA2E8; height: 44px;}
#hzMenu{text-align: center;}

#hzMenu>li{
	position: relative;
	float:left; 
	padding:6px 20px;
	cursor: pointer;
	box-sizing: border-box; 
 
}
#hzMenu>li>a{display: block; color: #fff; height: 32px; line-height: 32px; padding:0 25px;}
#hzMenu>li:hover>a,#hzMenu>li.current>a{background: #009B52}
.subnav{
	position: absolute; 
	top: 44px; 
	left: 0; 
	width: 100%;
	display: none; 
	z-index: 99;
	line-height: 36px;
	background-color:rgba(0,162,234,0.89);
	filter:progid:DXImageTransform.Microsoft.gradient(startcolorstr=#F0FFFFFF,endcolorstr=#F0FFFFFF);
}
.subnav li a{display: block; font-size: 14px; text-align: center; color: #fff; line-height: 36px;}
.subnav li a:hover{background: #009B52; color: #ffffff;}

.l-open {background-color: #009B52; color: #fff; width: 40px; height: 38px; font-size: 26px; cursor: pointer; line-height: 32px;}
.l-close{color: #fff; background-color: #333; width: 100%; height: 46px; line-height: 46px;}
.hov {display: block;}
.fudong{width:100%;position:fixed;z-index:100000;top:0;}

.swiper-pagination-bullet{width: 14px; height: 14px; background: #ffffff; opacity: .8; transition:all 0.1s;}
.swiper-pagination-bullet-active{background: #0AA2E8; }

@media screen and (max-width: 1200px) {
	.show-r{display: block;}
	.nav{height: 38px; line-height: 38px;}
	#hzMenu{position: fixed; top:0; right:-45%; width: 45%; height: 100%; background-color: #555555; display: block;z-index: 99; }
	#hzMenu>li{float: none; width: 100%; border-bottom: 1px dashed #777;margin:0; padding: 0;}
	#hzMenu>li a{color: #fff; font-size: 14px; width: 100%; height: 46px; line-height: 46px;}
	.subnav{display: none !important;}
}
@media screen and (max-width: 800px) {
	.fd{float: none;}
	.logo{width: 40%;}
	.tel{width: 60%;}
	.c-search ul {margin-top: 15px;}
	.swiper-pagination-bullet{width: 10px; height: 10px;}
	.bannerswiper .swiper-pagination span{width: 8px; height:8px;}
	.swiper-button-next, .swiper-button-prev {width: 20px; height: 16px; background-size: 100%; top: 50%;}
}
@media(max-width: 600px){
    .logo{width: 30%;}
    .tel{width: 70%;}
    .c-search input {width: 120px;}
    .c-search ul {margin-top: 0px;}
    .xx{margin-top: 2px;}
    .yy{margin-top: 4px; margin-left: 15px;}
    .yy a{width:22px; height: 22px; line-height: 22px; background: #0AA2E8; color: #fff;}
	.nav{height: 32px; line-height: 32px;}
	.l-open{height: 32px; font-size: 24px;}

    .swiper-button-prev,.swiper-button-next{ background-size: 50%;}
    .swiper-container-horizontal>.swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction {bottom: 5px;}
    .swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet {
        margin: 0 3px;
        width: 7px;
        height: 7px;
    }
}

@media(max-width: 350px){
	.logo{width: 40%;}
	.tel{width: 60%;}
    .c-search input {width: 90px;}
    .yy{margin-left: 8px;}
}

.tit{ margin-bottom: 12px; color: #262626; text-align: center; font-size: 16px; text-transform: uppercase;}
.tit span{display: block; color: #3264a5; margin: 4px auto; font-size: 24px; font-family: "Arial"; margin-bottom: 10px;}
.tit img{margin: 0 auto;}
.tit b{font-weight: normal; margin-top: 10px; display: block;}

@media screen and (max-width: 800px) {
	.tit{font-size: 14px;}
	.tit span{font-size: 18px;}
}
@media screen and (max-width: 320px) {
	.tit{font-size: 14px;}
	.tit span{font-size: 14px;}
}


/*yingyong*/
.yingyong{margin-top: 40px;}
.yingyong .tabs{width: 100%; z-index: 9; text-align: center; margin-top:45px;}
.yingyong .tabs a{color: #333; cursor: pointer; width:16%; padding-bottom: 3px; display: inline-block; font-size: 16px;}
.yingyong .tabs a i{
	display: block; 
	font-size: 74px; 
	background: #0AA2E8; 
	border-radius: 60px; 
	color: #fff; 
	width:116px;
	height: 116px; 
	line-height: 116px;
	margin: 0 auto 10px;
	border:2px solid #0AA2E8;
	transition: all .3s;
}
.yingyong .tabs a.active{ color: #0AA2E8;}
.yingyong .tabs a.active i{background: #fff; color: #0AA2E8; box-shadow: 1px 1px 6px #aaa;}

.list_yingyong{margin-top: 30px; padding: 0 10px;}
.list_yingyong .pic{float: left; width: 45%; padding:0 10px 0 0 ; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;} 
.list_yingyong .pic img{border: 10px solid #fff; width: 100%;}
.list_yingyong .tt{float: right; width: 53%; padding:50px 10px 0 50px; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;}
.list_yingyong .tt h3{font-size: 20px; color: #333;}
.list_yingyong .tt p{color: #666; margin: 30px 0 50px;}
.list_yingyong .yingyong_more a{display: inline-block; text-transform: uppercase; position: relative; width: 140px; height:44px; overflow: hidden;}
.list_yingyong .yingyong_more a span{
	color: #333; 
	position: absolute; 
	width: 140px; 
	text-align: center; 
	line-height: 44px; 
	height: 44px;
	transition:all .2s;
	border: 1px solid #ddd;
}
.list_yingyong .yingyong_more a span.out{ top: 0;}
.list_yingyong .yingyong_more a span.in{top: -44px; background: #0AA2E8; color: #fff; border-color:#0AA2E8;}
.list_yingyong .yingyong_more a:hover span.out{top: 44px;}
.list_yingyong .yingyong_more a:hover span.in{top: 0;}


/*产品*/
.product{margin-top: 40px;}
.productswiper{margin-top: 30px;}
.pro_pic{padding: 12px; float: left; width: 25%; border: 1px solid #ddd; background: #fff;box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;}
.pro_pic a{display: block;}
.pro_pic .pic{overflow: hidden;}
.pro_pic .pic img{background: #fff;  transition:all .5s; -webkit-transition:all .5s; width: 100%;}
.pro_pic .tt{margin-top: 10px; width:100%; }
.pro_pic .tt h3{font-size: 14px;}
.pro_pic .tt p{margin: 10px 0; font-size: 12px; color: #666;}
.pro_pic .tt .pro_more{transition:all .3s; color: #0AA2E8; font-size: 12px;}
.product .swiper-button-next{background: url(../images/r_jt.png) no-repeat center; width: 40px; height: 40px; right: 0px;}
.product .swiper-button-prev{background: url(../images/l_jt.png) no-repeat center; width: 40px; height: 40px; left: 0px;}

.pro_pic:hover h3{color: #f00;}
.pro_pic:hover .tt .pro_more{margin-left: 10px;}
.pro_pic:hover .pic img{transform: scale(1.05);}

/*关于*/
.about{margin-top: 25px; 
	width: 50%; 
	padding: 0 10px 0 0; 
	box-sizing:border-box; 
	-moz-box-sizing:border-box; 
	-webkit-box-sizing:border-box;
	float: left;
}
.about a{
	display: block; 
	width: 100%; 
	position: relative;
	background: url(../images/about_pic.jpg) no-repeat center;
	height: 310px;
}


.about a .title{
	position: absolute; 
	bottom: 0; 
	left: 0; 
	width: 100%; 
	height: 40px; 
	line-height: 40px; 
	background: #0AA2E8; 
	color: #fff; 
	text-align: center; 
	font-size: 16px;
	transition: all .3s;
}
.about a:hover .pic img{transform: scale(1.05);}
.about a:hover .title{height: 50px; line-height: 50px;}

/*服务*/
.fuwu{
	margin-top: 25px; 
	padding: 0 0 0 10px; 
	box-sizing:border-box; 
	-moz-box-sizing:border-box; 
	-webkit-box-sizing:border-box;
	float: right;
	width: 50%;
}
.fuwu_son{
	background: url(../images/fuwu_bg.jpg) no-repeat top center;
	padding:60px 110px 0;
	text-align: center;	
	height: 310px;
}
.fuwu_son h4{font-size: 24px; color: #fff;}
.fuwu_son p{font-size: 16px; color: #fff; margin:20px 0 58px; line-height: 28px;}
.fuwu_son .fuwu_more a{border: 1px solid #fff; color: #fff; padding: 7px 30px; transition: all .3s; position: relative;}
.fuwu_son .fuwu_more a b{font-weight:normal; opacity: 0; transition: all .3s;  position: absolute; right: 20%; top: 20%;}
.fuwu_son .fuwu_more a:hover b{opacity: 1;}
.fuwu_son .fuwu_more a:hover{padding: 7px 48px 7px 30px;}

/*案例*/
.case{margin-top:40px;}
.caseswiper{margin-top: 30px;}
.case_pic a{
	display: inline-block; 
	position: relative; 
	background: #fff;  
	transition:all .2s; 
	-webkit-transition:all .2s;
}
.case_pic a .pic{overflow: hidden;}
.case_pic a .tt{padding: 20px 15px;}
.case_pic a .tt h5{float: left; font-size: 16px; color: #333; width: 80%; line-height: 30px;}
.case_pic a .tt h5 p{font-size: 12px; color: #666; line-height: 20px; margin-top: 5px;transition: all .5s;}
.case_pic a:hover .tt h5 p{margin-top: 10px;}
.case_pic a .tt .case_more{float: right; width: 20%; padding: 25px 0 25px 35px;}
.case_pic a .tt .case_more span{ 
	display: block;
	font-size:22px;
	border: 1px solid #D1D1D1;
	color: #D1D1D1;
	border-radius: 20px;
	width:30px;
	height:30px;
	text-align: center;
	line-height: 30px;
}
.case_pic a:hover .tt .case_more span{background: #0AA2E8; border-color: #0AA2E8; color: #fff; transition: all .5s;}
.case_pic a:hover .tt .case_more span{transform: rotate(360deg);}

.case .swiper-button-next{background: url(../images/r_jt.png) no-repeat center; width: 40px; height: 40px; right: 0px;}
.case .swiper-button-prev{background: url(../images/l_jt.png) no-repeat center; width: 40px; height: 40px; left: 0px;}


@media screen and (max-width: 1200px){
	.about a{height: 280px;}
	.fuwu_son{padding:60px 40px 0; height: 280px;}
	.fuwu_son h4{font-size: 22px;}
	.fuwu_son p{font-size:14px; margin:15px 0 38px;}
}
@media screen and (max-width: 1024px){
	.list_yingyong .pic{width: 45%; padding:0 5px;}
	.list_yingyong .tt{width: 53%; padding:20px 5px;}
	.list_yingyong .tt p{margin: 10px 0 20px;}

	.swiper-button-black{display: block;}
	.productswiper{padding:0 ;}
}
@media screen and (max-width: 800px) {
	.yingyong .tabs{margin-top:30px;}
	.yingyong .tabs a{font-size: 14px;}
	.yingyong .tabs a i{
		font-size: 34px; 
		width:66px;
		height: 66px; 
		line-height: 66px;
	}
	.list_yingyong{padding: 0 10px; margin-top: 20px;}
	.list_yingyong .pic{float:none; width: 100%; padding:0 5px;}
	.list_yingyong .tt{float:none; width: 100%; padding:15px 5px 0px;}
	.list_yingyong .tt h3{font-size: 16px;}
	.list_yingyong .yingyong_more a span{width: 100px; line-height: 40px; height: 40px;	}

	.productswiper{padding:0 ;}
	
	.about a{height: 240px;}
	.fuwu_son{padding:40px 20px 0; height: 240px;}
	.fuwu_son h4{font-size: 22px;}
	.fuwu_son p{font-size:14px; margin:15px 0 32px;}
}
@media screen and (max-width: 600px) {
	.yingyong{margin-top: 25px;}
	.yingyong .tabs{margin-top:20px;}
	.yingyong .tabs a{font-size: 12px; width: 15%;}
	.yingyong .tabs a i{font-size: 24px; width:46px; height: 46px; line-height: 44px;}
	.yingyong .tabs a span{width:100%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;	display: block;}
	.list_yingyong{padding: 0px; margin-top: 10px;}

	.pro_pic{padding: 9px;}
	.pro_pic .tt p{max-height: 34px; }

	.about{width: 100%; padding:0; float: none;}
	.fuwu{width: 100%; padding:0; float: none;}

	.case{margin-top: 25px;}
	.caseswiper {margin-top: 20px;}
}
@media screen and (max-width: 320px) {
	.yingyong{margin-top: 20px;}
	.yingyong .tabs a i{
		font-size: 20px;
		width:36px;
		height: 36px; 
		line-height: 36px;
		border:1px solid #0AA2E8;
	}
	.list_yingyong .tt h3{font-size: 16px;}
	.list_yingyong .tt p{margin: 10px 0 15px;}

	.product { margin-top: 25px;}

	.about a{height: 200px;}
	.about a .title{font-size: 14px;}

	.fuwu_son{padding:25px 20px 0; height: 220px;}
	.fuwu_son h4{font-size: 18px;}
	.fuwu_son p{font-size:14px; line-height: 22px; margin:15px 0 28px;}
}

/*新闻*/
.news{margin-top: 40px;}
.news_l{float: left; width: 50%; padding-right: 15px; margin-top: 20px;}
.news_l h5{font-size: 16px;  margin: 20px 0px 15px; color: #333;}
.news_l:hover h5{color: #ff0000;}
.news_l p{font-size: 12px; color: #666; line-height: 22px;}
.news_l .news_more{ margin-top: 10px; font-size: 12px; color: #0AA2E8;transition: all .3s;}
.news_l:hover .news_more{margin-left: 15px;}

.news_r{float: right; width: 50%; padding-left: 15px; margin-top: 20px;}
.news_r ul{border-top: 1px solid #ccc;}
.news_r li{width: 100%; margin-bottom: : 25px; padding:5px 0; border-bottom: 1px solid #ccc;}
.news_r li .news_pic{
	width: 15%; 
	padding-top: 5px; 
	padding-right: 10px; 
	float: left; 
	box-sizing:border-box; 
	-moz-box-sizing:border-box; 
	-webkit-box-sizing:border-box;
	text-align: right; 
	font-size: 12px; 
	color: #666; 
	font-family:'HELVETICANEUELTPRO-THEX';
}
.news_r li .news_pic span{display: block; font-size: 24px; color: #020202; font-weight: bold;}
.news_r li .news_title{ width: 85%; float: left; padding-left: 15px; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;}
.news_r li .news_pic img{display: block; transition:all .3s;}
.news_r li .news_title h5{font-size: 14px; color: #333; margin: 5px 0 8px; transition: all .3s}
.news_r li .news_title p{color: #888; font-size: 12px; line-height: 18px;}
.news_r li:hover{background: #e5e5e5;}
.news_r li:hover .news_title h5{margin-left: 20px;}

/*合作*/
.link{margin-top: 40px;}
.link ul{margin-top:15px; border-left: 1px dashed #ddd; border-top: 1px dashed #ddd;}
.link ul li{float: left; width: 16.66%;border-right: 1px dashed #ddd; border-bottom: 1px dashed #ddd; background: #fff;box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;}
.link ul li img{width: 100%;}

/*footer*/
.footer{ background:#dfdfdf; padding: 40px 0 25px; margin-top:35px;}
.footer h3{font-size: 18px; color: #333;}
.cont{width:50%; padding-right: 20px; float: left; box-sizing: border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;}
.cont ul{margin-top: 15px;}
.cont li{width:50%;float: left; color: #888; line-height: 28px;}
.cont li:last-child{margin-top: 18px;}
.cont li a{font-size: 28px; margin-right: 10px; transition: all .3s; background: #fff; border-radius: 80px; display: inline-block;}
.cont li a.ico1{color: #0579B3;}
.cont li a.ico2{color: #3D5897;}
.cont li a.ico3{color: #55ADED;}
.cont li a.ico4{color: #78B234;}
.cont li a:hover{transform: rotate(360deg);}


.liuyan{width:50%; padding-left: 20px; float: left; box-sizing: border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;}
.liuyan span{
	width: 50%; 
	float:left; 
	display: inline-block; 
	color: #ccc; 
	padding:5px 15px 5px 0; 
	box-sizing:border-box; 
	-moz-box-sizing:border-box; 
	-webkit-box-sizing:border-box;
}
.liuyan span input{width: 100%; line-height: 22px; height: 22px; padding-left: 10px; background: none; border: 0px; border-bottom: 1px solid #bbb;}
.liuyan span.neirong{width: 50%; padding-right: 20px;box-sizing: border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;}
.liuyan span textarea{width: 100%; background: none; border:0; border-bottom: 1px solid #bbb; padding:10px; height: 70px;}
.liuyan span button{width: 100%; float:left; height: 36px; background: #0AA2E8; color: #fff; margin-top: 35px; font-family: "微软雅黑"; cursor: pointer; transition:all .3s; -webkit-transition:all .3s;}

.footer-info{line-height: 22px; padding: 12px 0; background-color: #b0b0b0; text-align: center; color: #555; font-size: 12px;}
.footer-info a{color: #999;}

@media screen and (max-width: 1200px) {
	.news_r li .news_pic{width: 20%;}
	.news_r li .news_title{width: 80%;}
	.news_r li .news_title p{max-height: 50px; overflow: hidden;}
}

@media screen and (max-width: 800px) {
	.news_l,.news_r{width:100%; float: none; padding:0 0 10px;}
	.cont,.liuyan{width:100%; float: none; padding:0;}
	.cont{margin-bottom: 20px;}
}	 

@media screen and (max-width: 600px) {
	.news_r li .news_pic{width: 25%;}
	.news_r li .news_title{width: 75%;}
	
	.footer h3{font-size: 16px;}
	.link ul li{width:33.33%;}
}

@media screen and (max-width: 320px) {
	.news_r li .news_pic span{font-size: 18px}
	.news_r li .news_title{width: 70%;}
	.news_r li .news_title p{max-height: 38px; overflow: hidden;}
}

/**返回顶部**/
.actGotop {
    position: fixed;
    _position: absolute;
    bottom: 60px;
    right: 10px;
    width: 30px;
    height: 30px;
    display: none;
    z-index: 9999;
}
.actGotop a {
    width: 30px;
    height: 30px;
    line-height: 30px;
    border-radius: 30px;
    color: #fff;
    text-align: center;
    display: inline-block;
    background-color: #555;
}
.actGotop a:hover{background-color: #0AA2E8;}