@charset "utf-8";

/*banner style*/

.banner{
	position: relative;
	height: 550px;
	overflow: hidden;
	text-align: center;
}

.banner ul{
	position: absolute;
	left: 0;
	width: 10000px;
}

.banner ul li{
	float: left;
}

.banner ul li img{
	width: 1920px;
}

.banner .banner-btn{
	position: absolute;
	left: 50%;
	bottom: 15px;
}

.banner .banner-btn a{
	float: left;
	width: 15px;
	height: 15px;
	background: #fff;
	border: 2px solid #ddd;
	border-radius: 50%;
	margin-left: 10px;
}

.banner .banner-btn a:first-child{
	margin-left: 0;
}

.banner .banner-btn a.active{
	background: rgba(18,92,179,.5);
}

.banner .prev,.banner .next{
	position: absolute;
	top: 50%;
	margin-top: -30px;
	width: 50px;
	height: 50px;
	opacity: 0;
	-moz-opacity: 0;
	filter: alpha(opacity=0);
	-webkit-opacity: 0;
	transition: .4s;
	-webkit-transition: .4s;
	-moz-transition: .4s;
	-ms-transition: .4s;
	border-radius: 3px;
	overflow: hidden;
}

.banner .prev{
	left: 30px;
}

.banner .next{
	right: 30px;
}

.banner:hover .prev,.banner:hover .next{
	opacity: 1;
	-webkit-opacity: 1;
	-moz-opacity: 1;
	filter: alpha(opacity=100);
}

/*banner style*/

/*common-title*/

.common-title h2{
	font-size: 26px;
	font-weight: bold;
	color: #333;
	text-align: center;
	margin: 50px 0;
}

.common-title h2 span{
	/* font-size: 20px;
	font-family: "Arial";
	color: #444; */
}

.common-title p{
	font-size: 16px;
	color: #212121;
	text-align: center;
	margin-bottom: 15px;
}

/*common-title*/

/*choice style*/

.choice{
	padding: 30px 0;
}

.choice ul{
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.choice ul li{
	color: #fff;
	float: left;
	width: 160px;
	height: 170px;
	background: #125cb3;
	padding: 30px;
	border-radius: 5px;
}

.choice ul li div.choice-img img{
	margin: auto;
	max-width: 65%;
	height: 65px;
}

.choice ul li div.choice-txt{
	text-align: center;
	font-size: 18px;
	margin: 10px 0;
}

/*choice style*/

/*server style*/

.server{
	background: #f8f8f8;
	margin: 30px 0;
}

.server .server-con > div{
	background: url(../images/127.0.0.png) no-repeat right 0;
	height: 345px;
}

.server .server-txt p{
	padding: 30px 0;
	font-size: 16px;
	line-height: 34px;
	color: #125CB3;
	width: 660px;
}

.server .server-btn a{
	font-size: 26px;
	color: #fff;
	padding: 6px 15px;
	background: #125CB3;
	transition: .4s;
	-webkit-transition: .4s;
	-moz-transition: .4s;
	-ms-transition: .4s;
	
	animation:twinkles 3s infinite;
	-webkit-animation:twinkles 3s infinite; /*Safari and Chrome*/

}


	@keyframes twinkles
	{
	from {opacity:0.5;}
	50% {opacity:1;}
	100% {opacity:0.5;}
	}

	@-webkit-keyframes twinkles /*Safari and Chrome*/
	{
	from {opacity:0.5;}
	50% {opacity:1;}
	100% {opacity:0.5;}
	}


.server .server-btn a:hover{
	background: #0b3e79;
}

/*server style*/

/*product style*/

.product ul li{
	width: 288px;
	height: 354px;
	float: left;
	margin-left: 16px;
	margin-bottom: 15px;
	border: 1px solid #ddd;
	padding: 10px;
	transition: .4s;
	-webkit-transition: .4s;
	-moz-transition: .4s;
	-ms-transition: .4s;
}

.product ul li:nth-child(4n+1){
	margin-left: 0;
}

.product ul li .product-img{
	margin-bottom: 15px;
}

.product ul li img{
	margin: auto;
}

.product ul li .product-txt h3{
	font-size: 16px;
	line-height: 24px;
	height: 24px;
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
	font-weight: bold;
}

.product ul li .product-txt h3 a{
	color: #333;
	transition: .4s;
	-webkit-transition: .4s;
	-moz-transition: .4s;
	-ms-transition: .4s;
}

.product ul li .product-txt div.line{
	width: 100%;
	height: 1px;
	background: #DDDDDD;
	margin: 10px 0;
}

.product ul li .product-txt div.line div{
	height: 1px;
	background: #125CB3;
	width: 0;
	transition: .4s;
	-webkit-transition: .4s;
	-moz-transition: .4s;
	-ms-transition: .4s;
}

.product ul li .product-txt p{
	font-size: 14px;
	color: #999;
	line-height: 22px;
	height: 66px;
	display: -webkit-box;
    display: -moz-box;
    display: -ms-box;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -moz-box-orient: vertical;
    -ms-box-orient: vertical;
    -webkit-line-clamp: 3;
    -moz-line-clamp: 3;
    -ms-line-clamp: 3;
    overflow: hidden;
}

.product ul li .product-txt div.product-btn a{
	color: #125CB3;
	margin-top: 10px;
	display: inline-block;
	font-size: 16px;
}

.product ul li:hover{
	box-shadow: 0 0 10px #ccc;
}

.product ul li:hover .product-txt div.line div{
	width: 100%;
}

.product ul li:hover h3 a{
	color: #125CB3;
}

/*product style*/

/*news style>>*/

.news .news-list{
	width: 345px;
	margin-left: 80px;
	float: left;
}

.news .news-list:first-child{
	margin-left: 0;
}

.news .news-list h3{
	font-size: 28px;
	color: #2C3E50;
	line-height: 40px;
	margin-bottom: 30px;
}

.news .news-list h3 a{
	font-size: 16px;
	line-height: 40px;
	color: #129fda;
}

.news .news-list h3 a i{
	margin-left: 5px;
}

.news .news-list ul li{
	position: relative;    
	height: 30px;
}

.news .news-list ul li a{
	width: 80%;
    line-height: 30px;
    height: 30px;
    font-size: 15px;
    color: #666;
    padding-left: 13px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.news .news-list ul li a:hover{
	color: #3498db;
	text-decoration: underline;
}

.news .news-list ul li span {
    font-size: 10px;
    margin-top: 4px;
    height: 16px;
    line-height: 10px;
    background: #e5e5e5;
    border-radius: 8px;
    padding: 3px 5px;
    color: #666;
}

.news .news-list ul li:after {
    content: '';
    position: absolute;
    left: 0;
    top: 12px;
    width: 6px;
    height: 6px;
    background: #208eeb;
    border-radius: 50%;
}

.news .news-list .activity a{
	display: block;
	height: 170px;
	overflow: hidden;
}

/*<<news style*/