body{
	background-color: #f6f7f6;
}
header{
	position: fixed;
	left:0;
	right:0;
	top:0;
	margin:auto;
	height: 80px;
	background-color: #fff;
	z-index: 9999;
}
header .head-nav{
	height: 100%;
	display: flex;
	justify-content: space-between;
}
header .head-nav .left-box{
	display: flex;
	justify-content: flex-start;
	align-items: center;
}
header .head-nav .left-box .logo{
	display: flex;
	width:124px;
	align-items: center;
	justify-content: center;
}
header .head-nav .left-box .hjy{
	display: block;
	/* margin-left: 30px; */
	font-size: 28px;
}
header .head-nav .right-box{
	display: flex;
	justify-content: flex-end;
	align-items: center;
}
header .head-nav .right-box .nav-group{
	position: relative;
	font-size: 16px;
	color:#000;
	margin-left: 30px;
}
header .head-nav .right-box .nav-group:after{
	position: absolute;
	left:0;
	bottom:-10px;
	content: "";
	width: 100%;
	height: 2px;
	background-color: transparent;
}
header .head-nav .right-box .nav-group.on{
	color:var(--blue);
}
header .head-nav .right-box .nav-group.on::after{
	background-color: var(--blue)
}
header .head-nav .right-box .nav-group:hover{
	color:var(--blue);
}

/*banenr*/
.banner-box{
	position: relative;
	height: 450px ;
	min-width:1170px;
	background-color: #36b093;
	/*position: relative;*/
}
.img_text{
	margin-top: 4%;
}
.img_text .img_title,.img_text .img_main{
	color: #f8fcfc;
	letter-spacing: 1.5px;
	margin-left: 35%;
	margin-bottom: 20px;
}
.img_text .img_title{
	font-size:34px;
	/*margin-top: 10%;*/
	height: 55px;
}
.img_text .img_main{
	font-size:16px;
	font-weight: 400;
	color: #c9e8e1;
}

.row{
	display: flex;
	flex-direction: row;
}
.img_btn{
	width: 150px;
	height: 45px;
	background-color: #fece2e;
	border: none;
	border-radius: 3px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #c79729;
	margin: 0 10px;
}
.img_btn img{
	margin: 0 10px;
}
.we{
	margin: 0 15px;
	font-weight: bold;
}
.right_icon{
	display: flex;
	align-items: center;
	margin: 0 10px;

}
.banner_img{
	margin-top: 50px;
	margin-right: 10%;

}
.banner-box .banner-swiper{
	width: 100%;
	/*height: 100%;*/
}
.banner-box .banner-swiper .swiper-slide{
	/*height: 100%;*/
	width: 100%;
	display: flex;
	justify-content: center;
}
.banner-box .banner-swiper .swiper-slide .slide{
	display: block;
	width: 100%;
	height: 100%;
}
.banner-box .banner-swiper .swiper-slide img{
	height: auto;
	width: 100%;
}
.banner-box .button-box{
	position: absolute;
	bottom:0;
	right: 30%;
	width:170px;
	height: 70px;
	background-color: #fff;
	display: flex;
	justify-content: space-between;
	align-items: center;
	z-index: 999;
	opacity: 0;
}
.banner-box .button-box .btn{
	width:70px;
	height: 70px;
	line-height: 70px;
	text-align: center;
	cursor:pointer;
}
.banner-box .button-box .btn:focus{
	outline: none;
}
.banner-box .button-box .btn-pre{
	background:url('../images/icon_left.png') no-repeat center;
}
.banner-box .button-box .btn-pre:hover{
	background:url('../images/icon_left_active.png') no-repeat center;
}
.banner-box .button-box .btn-next{
	background:url('../images/icon_right.png') no-repeat center;
}
.banner-box .button-box .btn-next:hover{
	background:url('../images/icon_right_active.png') no-repeat center;
}
/*module*/
.module{
	margin:0 auto;
}
.module-title{
	padding-top:30px;
}
.module-title .title{
	font-size: 32px;
	color: #5b9fe9;
	text-align: center;
}
.module-title .sub{
	margin-top: 10px;
	font-size: 18px;
	color: #999;
	text-align: center;
}
/*关于我们 about-us*/
.about-us{
	background-color: #202020;
}
.about-us .ab-con{
	margin:0 auto;
	width: 1170px;
	padding:30px 0;
}
.about-us .company-name{
	font-size: 20px;
	text-align: center;
	padding:20px 0;
	color:#fff;
}
.about-us .ab-con .box{
	display: flex;
	width:100%;
	justify-content: space-between;
	font-size: 14px;
	color:#fff;
}
.about-us .ab-con .box .left{
	width:870px;
}
.about-us .ab-con .box .left>.text{
	line-height: 2;
}
.about-us .ab-con .box .left .address{
	margin-top: 10px;
	margin-bottom: 30px;
	display: flex;
	justify-content: flex-start;
}
.about-us .ab-con .box .left .address li{
	line-height: 2;
	margin-right: 30px;
}
.about-us .ab-con .box .left .friendlink{
	display: flex;
	justify-content: flex-start;
	margin-top: 10px;
}
.about-us .ab-con .box .left .friendlink li{
	margin-right: 30px;
}
.about-us .ab-con .box .left .friendlink li a{
	font-size: 14px;
	line-height: 2;
	color:#fbfbfb;
}
.about-us .ab-con .box .left .friendlink li a:hover{
	color:var(--blue);
}
.about-us .ab-con .box .right{
	width:270px;
	display: flex;
	justify-content: space-between;
}
.about-us .ab-con .box .right .code-box{
	width:100px;
}
.about-us .ab-con .box .right .code-box .text{
	font-size: 14px;
	line-height: 2;
	margin-bottom: 20px;
	text-align: center;
}
.about-us .ab-con .box .right .code-box img{
	width:100%;
	height: auto;
}
/*copyright*/
.copyright{
	font-size: 14px;
	color: #fff;
	line-height: 3;
	text-align: center;
	background-color: #202020;
	border-top:1px solid #4d4d4d;
}
/***************************************************************/
.server{
	background-color: #f6f7f6;
}
.server-con{
	margin:0 auto;
	margin-top: 30px;
	width:1200px;
	padding-bottom: 30px;
}
.server-con .item{
	width:100%;
	height: 270px;
	margin-bottom: 30px;
	display: flex;
	justify-content:space-between;
	align-items: center;
	background-color: #fff;
}
.server-con .item .left-box{
	width:270px;
	height: 100%;
	display: flex;
	justify-content: center;
	flex-direction: column;
}
.server-con .item .left-box .imgbox{
	margin:0 auto;
	height: 66px;
}
.server-con .item .left-box .imgbox img{
	width: auto;
	height: 100%;
}
.server-con .item .left-box .des{
	margin:0 auto;
	width:74%;
	text-align: center;
	margin-top: 20px;
	font-size: 18px;
	font-weight: bold;
	color:#333;
}
.server-con .item .right-box{
	flex:1;
	height: 120px;
	border-left: 1px solid #eee;
	display: flex;
	justify-content: center;
	align-items: center;
}
.server-con .item .right-box .text{
	width:80%;
	height: 100%;
	font-size: 16px;
	line-height: 2;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp:4;
	-webkit-box-orient:vertical;
}
.red{
	color: #ba1919;
}
.server-con .item .right-box .text .more{
	color:#85c129;
}
/*procedure start*/
.procedure{
	width: 1170px;
	/*margin:0 auto;*/
	height: 400px;
	margin-bottom: 60px;
	background:url('../images/server_bg.png') no-repeat center/auto 100%;
}
.procedure .module-title {
	padding-top: 80px;
}
.procedure .module-title .title{
	color:#fff;
}
.procedure .module-title .sub{
	color:rgba(255,255,255,0.6);
}
.procedure .pro-con{
	padding:40px 70px 0;
}
.procedure .pro-con .con-a{
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.procedure .pro-con .con-a .group{
	width: 130px;
	height: 60px;
	border-radius: 30px;
	background-color: rgba(255,255,255,0.7);
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 18px;
	color: #fe9b00;
}
.procedure .pro-con .con-a .group .text{
	letter-spacing: 4px;
}
.procedure .pro-con .con-a .group .num{
	display: block;
	width: 30px;
	height: 30px;
	background-color: #fff;
	border-radius: 50%;
	margin-left: 6px;
	text-align: center;
	line-height: 30px;
}
.procedure .pro-con .con-a .right{
	position: relative;
	width:28px;
	height: 2px;
	background-color: rgba(255,255,255,0.4);
}
.procedure .pro-con .con-a .right:after{
	content:"";
	display: block;
	position: absolute;
	right: 0;
	bottom: 0;
	width:16px;
	height: 2px;
	background-color:rgba(255,255,255,0.4);
	transform-origin: right bottom;
	transform: rotate(45deg);
}
.procedure .pro-con .con-b{
	margin-top: 30px;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.procedure .pro-con .con-b .text-group{
	width: 130px;
	color:#fff;
	text-align: center;
	font-size: 16px;
	line-height: 1.5;
	letter-spacing: 4px;
}
/**/
/*recommend start*/
.recommend{
	margin-top: 30px;
	margin-bottom: 60px;
	width: 1170px;
}
.recommend .top-box{
	display: flex;
	justify-content: space-between;
	font-size: 18px;
}
.recommend .top-box .btn{
	color:#fe9b00;
	cursor:pointer;
}
.recommend .recommend-con{
	margin-top: 30px;
	display: flex;
	justify-content: space-between;
}
.recommend .recommend-con .rec-group{
	width:370px;
}
.recommend .recommend-con .rec-group .imgbox{
	height: 370px;
	background-color: pink;
}
.recommend .recommend-con .rec-group .img-wrap{
	display: block;
	height: 100%;
}
.recommend .recommend-con .rec-group .img-wrap img{
	width:100%;
	height: 100%;
	transition:transform 0.6s;
}
.recommend .recommend-con .rec-group .img-wrap img:hover{
	transform: scale(1.1);
	transition:transform 0.6s;
}
.recommend .recommend-con .rec-group .title{
	display: block;
	margin-top: 30px;
	font-weight: bold;
	font-size: 18px;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}
.recommend .recommend-con .rec-group .title:hover{
	color:var(--blue);
}
.recommend .recommend-con .rec-group .source{
	display: block;
	margin-top: 20px;
	color:#999;
	font-size: 16px;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}
/**/