/*pro方案的CSS布局*/
.pro{height:auto;overflow:hidden;
/*background-color:#268cc4; */
background:url(../images/matou.jpg) no-repeat 58%;
padding:60px 0;}
.pro ul{text-align:center;margin:0;padding:0;}
.pro ul li{width:24.33%;float:left;margin:0 0.5%;position:relative;}
.pro ul li a{display:block;font-size:16px;color:#ffffff;line-height:40px;transition:0.5s;}

.pro ul li a .img{width:200px;height:200px;overflow:hidden;border-radius:100%;border:8px solid #f3f8fa; background:#FFF; margin:0 auto;}
.pro ul li a .img img{ max-width:100%;}

.pro ul li a span{display:block;padding:20px 0 5px;}	
.pro ul li a .p_more{ width:38px; height:48px; margin:0 auto;}
.pro ul li a .p_more img{ max-width:100%;}

.pro ul li a:hover .img{ border:8px solid #8cc25c;}
.pro ul li a:hover{ margin: -10px 0 0; transition: 0.5s;}

.pro ul li a:hover .img img{ opacity:0.9;  }


@media (max-width:720px){
	.pro{height:auto;overflow:hidden;background-color:#268cc4; padding:6% 0;}
	.pro ul li{width:32.33%;}
	.pro ul li a{font-size:14px;line-height:22px;}
	.pro ul li a .img{width:120px;height:120px;border:5px solid #7dbadc;}

	
	.pro ul li a span{padding:10px 0;}	
	.pro ul li a .p_more{ width:28px; height:28px;}
	
	
	.pro ul li a:hover .img{ border:5px solid #8cc25c;}
	.pro ul li a:hover{ margin: -3px 0 0;}
	
}

@media (max-width:550px){
	.pro ul li a .img{width:100px;height:100px;}
}

@media (max-width:470px){
	.pro ul li a .img{width:80px;height:80px;}
}

@media (max-width:380px){
	.pro ul li{width:49%; margin-bottom:10px; height:230px;}
	.pro ul li a .img{width:120px;height:120px;}
	.pro ul li a:hover{ margin:0;}
}





/*about的CSS布局*/
.k_about{
    background:url(../images/about1.jpg) no-repeat;
    height: 551px;
}
.about{height:auto;overflow:hidden;
    
}
.about .a_title{height:auto;line-height:50px;display:block;font-size:40px;color:#333;
	background:url(../images/about.png) no-repeat center right;}
.about .a_title a{ color:#333;}

.about .about_left{width:40%;float:left;padding:45px 5px;
    
}

.about .about_left .a_desc{height:auto;line-height:30px;padding:45px 0;}
.about .about_left .a_img{height:auto;overflow:hidden;}
.about .about_left .a_img img,.about .about_left .a_desc img{max-width:100%;}

.about .about_right{width:50%;height:auto;float:right;}
.about .about_right img{ max-height:100%;height:551px;}


@media (max-width:720px){
	.about .a_title{ font-size:26px; text-align:center;background:url(../images/service_line.png) no-repeat center;}
	.about .about_left{width:96%; padding:6% 2%;}
	.about .about_left .a_desc{padding:15px 0; line-height:22px;}
	.about .about_right{ display:none;}
}


.a_desc p{font-size: 16px;color: rgb(0, 0, 0);line-height: 30px;}

/*service专业服务的CSS布局*/
.service{height:auto;overflow:hidden;padding:60px 0 40px;background-color:#efefef;}
.service .service_title{font-size:40px;text-align:center;background:url(../images/service_line.png) no-repeat center;color:#333333;}

.service_img{height:auto;overflow:hidden; margin:40px 0;}
.service_img ul{text-align:center;margin:0;padding:0;}
.service_img ul li{ width:32%;height:auto;overflow:hidden;float:left; margin:0 0.6%;}
.service_img ul li a{display:block;font-size:18px;color:#666;line-height:30px;}

.service_img ul li a .ser_img{width:100%;height:auto;overflow:hidden;}
.service_img ul li a .ser_img img{max-width:100%;transition:0.5s;}

.service_img ul li a span{display:block;padding-top:15px;}

.service_img ul li a .ser_more{ width:38px;height:38px;overflow:hidden;margin:15px auto;background-repeat:no-repeat;
	background-position:center top;transition: 0.5s;}

.service_img ul li:hover a .ser_img img{transform:scale(1.1,1.1);}
.service_img ul li:hover a span{color:#fff;}

.service_img ul li:hover a .ser_more{background-position:center bottom;}

.service_img ul li:hover{background:url(../images/ser_li_bg.png) bottom no-repeat;transition:0.5s;}



@media (max-width:720px){
	.service{ padding:6% 0;}
	.service .service_title{font-size:26px;}
	.service_img{ margin:15px 0;}
	.service_img ul li a{font-size:14px;line-height:24px;}
	.service_img ul li a .ser_more{margin:10px auto;}
}




/*news新闻动态的CSS布局*/
.news{
	height:auto;
	overflow:hidden;
	padding:30px 0 60px;;
	background:url(../images/news_bg.jpg) no-repeat top;	
}
.news .news_title a{
	float: right;
	height: 70px;
	width: 180px;
	position: absolute;
	top: 0px;
	right: 0px;
}
.news .news_title{position: relative;font-size:40px;text-align:left;background:url(../images/news_more.png) no-repeat right;color:#333333; margin-bottom:35px;}

.news .news_left{ width:560px;float:left;height:400px; overflow:hidden; position:relative;}

.news .news_left .hd{ height:15px; overflow:hidden; position:absolute;right:0; left: 0; width:80px; margin: 0 auto; bottom:30px;z-index:1; }
.news .news_left .hd ul{ overflow:hidden; zoom:1; float:left;}
.news .news_left .hd ul li{ float:left; margin-right:6px;  width:15px; height:15px; line-height:14px; text-align:center; background:#fff; cursor:pointer;border-radius:100%; }
.news .news_left .hd ul li.on{ background:#f00; color:#fff;}

.news .news_left .bd{ position:relative; height:100%; z-index:0;}
.news .news_left .bd li{ zoom:1; vertical-align:middle;}
.news .news_left .bd li a{ cursor: w-resize}
.news .news_left .bd li a .img{ width:100%;height:400px; background-position: center top; background-repeat: no-repeat; }
.news .news_left .bd li a .img img{ max-width:100%;}

.news .news_right{width:605px;height:auto;overflow:hidden;float:right;}
.news .news_right .text_box{width:100%;height:auto;overflow:hidden;padding:20px 15px;border-bottom:1px dashed #b7b7b7;transition:0.5s;}
.news .news_right .text_box .date{width:100px;height:90px;float:left;overflow:hidden;color:#ffffff;text-align:center;background-color:#b7b7b7;}
.news .news_right .text_box .date font{
	display:block;
	font-size:24px;
	padding-top:20px;

	overflow: hidden;
}
.news .news_right .text_box .date span{display:block;}

.news .news_right .text_box .text{ width:460px; float:left;height:auto;line-height:22px;overflow:hidden;padding-left:20px;}
.news .news_right .text_box .text font{display:block;font-size:16px;padding-bottom:8px; color:#333;	white-space: nowrap; float:left; width:100%;text-overflow: ellipsis; overflow:hidden;}
.news .news_right .text_box .text span{display:block; color:#666;}

.news .news_right .text_box:hover{background-color:#d11023;}
.news .news_right .text_box:hover .text font{color:#fff;}
.news .news_right .text_box:hover .text span{color:#fff;}
.news .news_right .text_box:hover .data{border-bottom:1px solid #ae0029;}
.news .news_right .text_box:hover .date{background-color:#d11023;}
.news .news_right .text_box a{}

@media (max-width:720px){
	
.news .news_title{ font-size:26px; text-align:center;background:url(../images/service_line.png) no-repeat center; margin-bottom:0;}
.news .news_left{ display:none;}	
.news .news_right .text_box{ padding:8px 2%; width:96%;}
.news .news_right .text_box .text{ padding:0;}
.news .news_right{ float:none; width:100%;}
.news .news_right .text_box .date{ width:100%; float:none; height:25px; text-align:left; background-color:#FFF;}
.news .news_right .text_box .text{ width:100%; float:none; line-height:22px;}
.news .news_right .text_box .date font{display:inline; color:#999; font-size:14px; line-height:26px;}
.news .news_right .text_box .date span{ display:none;}
.news .news_right .text_box .text font{padding-bottom:0; font-size:14px;}
.news .news_right .text_box:hover .date font{color:#fff;}
	
}