@charset "utf-8";
/* CSS Document */
	h1,h2,h3,h4,h5{ font-weight:normal;}
	.morepro{width:100%;height: 510px;background:#eee;padding-top:20px;margin-top:50px;}
	.pro{ width:1200px; height:270px; margin:0 auto; position:relative; top:70px;}
	.left_pro,.right_pro{ float:left;}
	.left_pro{ width:280px; height:330px; background:url(../images/pro_one.png) no-repeat -30px -80px; margin-right:30px; box-shadow:0 0 10px 2px #e0e0e0;}
	.left_pro h1{ color:#09F; line-height:45px; font-size:24px; margin:30px 0 0 25px;}
	.left_pro p{ line-height:23px; color:#4a4a4a; font-size:14px; margin:20px 0 0 25px;}
	.left_pro a{ display:block; width:120px; height:35px; text-align:center; line-height:35px; border:#09F solid 1px; color:#09F; font-size:14px; margin:30px 0 0 25px; transition:width 1s;}
	.left_pro a:hover{ width:140px; background:#09F; color:white;}
	
	
	.right_pro li{ width:280px; height:270px; float:left; background:#fff; margin-right:24px; transition:0.5s; position:relative;}
	.right_pro li:nth-child(4){ margin-right:0;}
	.right_pro li img{ margin:0 auto; margin-top:30px;}
	.right_pro li h2{ line-height:35px; color:#313044; font-size:24px; text-align:center; margin-top:10px;}
	.right_pro li p{ font-size:14px; line-height:20px; color:#999; text-align:center;}
	.right_pro li h3{ text-align:center; color:#F60; font-size:14px; line-height:20px; margin-top:20px;}
	.right_pro li a{ display:block; width:120px; height:35px; text-align:center; margin:0 auto; line-height:35px; font-size:14px; color:#666; border:#666 solid 1px; margin-top:10px;}
	.right_pro li:hover{ cursor:pointer; box-shadow:0 0 10px 2px #cccccc; margin-top:-20px;}
	.text_pro{ position:absolute; bottom:0; width:280px; height:300px; background:white; display:none; border:#33a6ff solid 1px; z-index:1;}
	.right_pro li .text_pro p{ color:#4a4a4a; margin-top:15px;}
	.right_pro li .text_pro h4{ font-weight:bold; font-size:14px; color:#666; text-align:center; margin-top:10px;}
	.right_pro li .text_pro h5{ width:100%; text-align:center; background-color:#33a6ff; height:30px; line-height:30px; color:white; position:absolute; bottom:0;}
	.right_pro li .text_pro span{ margin-top:10px; display:block;}
	.right_pro li .text_pro a{ width:100px; height:30px; line-height:30px; margin-top:15px;}
	
	.index_abo{ width:100%; background:url(../images/index_abo_bg.png) no-repeat center center; background-size:cover; height:500px; margin-top:150px;}
	.index_abo_box{ width:100%; height:100%; background:rgba(46,43,43,0.8);}
	.index_abo_p{ text-align:center; color:rgba(255,255,255,0.8); font-size:14px; line-height:24px; font-weight:400; padding-top:130px; margin-bottom:60px;}
	.index_abo_box ul{ width:1200px; margin:0 auto;}
	.index_abo_box ul li{ float:left; width:240px; text-align:center;}
	.index_abo_box ul li h2{ font-size:48px; font-weight:300; color:white; line-height:48px;}
	.index_abo_box ul li h3{ font-size:24px; font-weight:400; line-height:48px; color:white;}
	.index_abo .index_abo_box ul li p{ color:rgba(255,255,255,0.8); font-size:14px; font-weight:400; line-height:24px;}
	.index_abo .index_abo_box .abo_title{ top:50px;}
	
	.index_abo .index_abo_box .abo_title h1{ color:white;}
	.index_abo .index_abo_box .abo_title p{ color:rgba(255,255,255,0.8);}
	
	
		@media(max-width:1200px){
		.right_pro li{ width:230px;}
		.pro{ width:1000px;}
		
		.index_abo_box ul{ width:1000px;}
		.index_abo_box ul li{ width:200px;}
		}
	@media(max-width:1000px){
		.index_abo_box ul{ width:825px;}
		.index_abo_box ul li{ width:165px;}
		}
	@media(max-width:825px){
		.index_abo_box ul{ width:200px;}
		.index_abo_box ul li{ width:200px; margin-top:50px;}
		.index_abo{ height:1300px;}
		}
	@media(max-width:992px){
		.right_pro li{ width:280px;}
		.right_pro li:nth-child(2){ margin-right:0;}
		.right_pro li:nth-child(3),.right_pro li:nth-child(4){ margin-top:50px;}
		.right_pro li:nth-child(3):hover,.right_pro li:nth-child(4):hover{ margin-top:20px;}
		.pro{ width:584px; top:30px;}
		.morepro{height: 800px;}
		}
	@media(max-width:610px){
		.right_pro li{ width:300px; margin-right:0; margin-top:50px;}
		.right_pro li:hover{ margin-top:0;}
		.right_pro li:nth-child(1){ margin-top:20px;}
		.text_pro{ width:100%;}
		.morepro{height: 1450px;}
		.pro{ width:300px;}
		}
.right_pro li .text_pro a{
    width: 100%;
    text-align: center;
    background-color: #33a6ff;
    height: 30px;
    line-height: 30px;
    color: white;
    position: absolute;
    bottom: 0;
}