.content .main .future
{
	width: 100%;
	height: 960px;
/*	background: url(../Images/banner-01.jpg) no-repeat 50%*/
}

.content .main .static
{
	width: 100%;
	height: 1080px;
	text-align: center;
	letter-spacing: 2px;
	padding-top: 130px
}

.content .main .static .text span
{
	color: #6a6a6a;
	font-size: 16px;
}

.content .main .static .title
{
	font-size: 30px;
	font-family: "SF Pro Display","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif;
    font-weight: 500;
}

.content .main .static .state
{
	font-size: 31px;
	line-height: 100px
}

.content .main .static .state i
{
	margin-right: 10px;
	font-family: "SF Pro Display","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif;
}

.content .main .service .service_banner
{
	width: 1200px;
	margin: 60px auto;
	overflow: hidden;
	color: #fff
}

.content .main .service .service_banner a
{
	width: 150px;
	float: left;
	height: 590px;
	color: #d2d2d2;
	font-size: 50px;
	line-height: 590px;
}

.content .main .service .service_banner ul
{
	float: left;
	width: 900px;
	margin: 0 auto
}

.content .main .service .service_banner li
{
	float: left;
	width: 440px;
	height: 590px
}

/*.content .main .service .service_banner .sli1
{
	background: url(../Images/server-01.jpg) no-repeat 50%
}*/

.content .main .service .service_banner .sli2
{
	margin-left: 20px;
	background-color: #000;
	padding-top: 135px;
	position: relative;
}

.content .main .service .service_banner .sli2 .txt{
	width: 100%;
	height: 475px;
	position: absolute;
	opacity: 0;
	left: 12px;
	top: 400px;
	opacity: 0;
	overflow: hidden;
	transition : all .5s ease;
	-webkit-transition : opacity .2s ease,top 1s ease;
	-moz-transition : opacity .2s ease,top 1s ease;
	-ms-transition : opacity .2s ease,top 1s ease;
	-o-transition : opacity .2s ease,top 1s ease;
}

.content .main .service .service_banner .sli2 .txt.active{
	opacity: 1;
	top: 115px;	
}

.content .main .service .service_banner .sli2 a,.content .main .service .service_banner .sli2 span
{
	display: block
}

.content .main .service .service_banner .sli2 .order
{
	display: block;
    margin: 0 auto 34px;
    width: 60px;
    height: 60px;
    background: #5a5f66;
    color: #fff;
    font-size: 24px;
    line-height: 60px;
    border-radius: 50%;
	text-indent: 4px;
}

.content .main .service .service_banner .sli2 h3
{
	font-size: 30px;
	line-height: 100px;
	font-weight: 400
}

.content .main .service .service_banner .sli2 h3 i
{
	margin-right: 10px;
	font-family: "SF Pro Display","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif;
}

.content .main .service .service_banner .sli2 .border
{
	width: 60px;
	border-top: 2px solid #fff;
	margin: 20px auto 40px;
	color: #bababa
}

.content .main .market
{
	background: url(../Images/market.jpg) no-repeat 50%
}

.content .main .market .text
{
	color: #fff
}

.content .main .market .text .title
{
	color: #fff;
	font-size: 25px;
	font-weight: 400
}

.content .main .market ul
{
	width: 1200px;
	height: auto;
	margin: 45px auto
}

.content .main .market ul li
{
	float: left;
	width: 390px;
	height: 245px
}

.content .main .market ul li .txt
{
	width: 100%;
	height: 100%;
	color: #fff;
	padding-top: 50px;
	background-color: rgba(0,0,0,.5);
	opacity: 0;
	transition: opacity .15s ease;
	-webkit-transition: opacity .15s ease;
	-moz-transition: opacity .15s ease;
	-ms-transition: opacity .15s ease;
	-o-transition: opacity .15s ease
}

.content .main .market ul li .txt h3
{
	font-size: 25px;
	font-weight: 400;
	line-height: 60px
}

.content .main .market ul li .txt p
{
	line-height: 25px
}

.content .main .market ul li .txt span
{
	display: block;
	width: 30px;
	height: 30px;
	text-align: center;
	line-height: 30px;
	font-size: 25px;
	border: 1px solid #fff;
	border-radius: 50%;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	margin: 10px auto
}

.content .main .market ul li:hover .txt
{
	opacity: 1
}

.content .main .market ul .mli1
{
	background: url(../Images/market-01.jpg) no-repeat 50%;
	background-size: 100% 100%
}

.content .main .market ul .mli2
{
	background: url(../Images/market-02.jpg) no-repeat 50%;
	background-size: 100% 100%
}

.content .main .market ul .mli3
{
	background: url(../Images/market-03.jpg) no-repeat 50%;
	background-size: 100% 100%
}

.content .main .market ul .mli4
{
	background: url(../Images/market-04.jpg) no-repeat 50%;
	background-size: 100% 100%
}

.content .main .market ul .mli5
{
	background: url(../Images/market-05.jpg) no-repeat 50%;
	background-size: 100% 100%
}

.content .main .market ul .mli6
{
	background: url(../Images/market-06.jpg) no-repeat 50%;
	background-size: 100% 100%
}

.content .main .market ul .mli2,.content .main .market ul .mli3,.content .main .market ul .mli5,.content .main .market ul .mli6
{
	margin-left: 15px
}

.content .main .market ul .mli4,.content .main .market ul .mli5,.content .main .market ul .mli6
{
	margin-top: 15px
}

.content .main .case .case_banner
{
	width: 1200px;
	height: auto;
	margin: 70px auto;
	overflow: hidden
}

.content .main .case .case_banner a
{
	float: left;
	width: 150px;
	height: 100px
}

.content .main .case .case_banner ul
{
	float: left;
	width: 1200px;
	margin: 0 auto;
	overflow: hidden
}

.content .main .case .case_banner li
{
	float: left;
	width: 390px;
	height: 220px;
	border: 1px solid #a4a4a4
}

.content .main .case .case_banner li div
{
	width: 100%;
	height: 100%;
	position: relative;
	background: rgba(0,0,0,.5);
	opacity: 0;
	transition: opacity .15s ease;
	-webkit-transition: opacity .15s ease;
	-moz-transition: opacity .15s ease;
	-o-transition: opacity .15s ease;
	-ms-transition: opacity .15s ease
}

.content .main .case .case_banner li div h3
{
	width: 140px;
	height: 140px;
	background-size: 100% 100%;
	position: absolute;
	left: 50%;
	top: 50%;
	margin-left: -70px;
	margin-top: -70px
}

.content .main .case .case_banner li:hover div
{
	opacity: 1
}

.content .main .case .case_banner .cli2,.content .main .case .case_banner .cli3,.content .main .case .case_banner .cli5,.content .main .case .case_banner .cli6
{
	margin-left: 15px
}

.content .main .case .case_banner .cli1
{
	background: url(../Images/case-01.jpg) no-repeat 50%;
	background-size: 100% 100%
}

.content .main .case .case_banner .cli2
{
	background: url(../Images/case-02.jpg) no-repeat 50%;
	background-size: 100% 100%
}

.content .main .case .case_banner .cli3
{
	background: url(../Images/case-03.jpg) no-repeat 50%;
	background-size: 100% 100%
}

.content .main .case .case_banner .cli4
{
	background: url(../Images/case-04.jpg) no-repeat 50%;
	background-size: 100% 100%
}

.content .main .case .case_banner .cli5
{
	background: url(../Images/case-05.jpg) no-repeat 50%;
	background-size: 100% 100%
}

.content .main .case .case_banner .cli6
{
	background: url(../Images/case-06.jpg) no-repeat 50%;
	background-size: 100% 100%
}

.content .main .case .case_banner .cli4,.content .main .case .case_banner .cli5,.content .main .case .case_banner .cli6
{
	margin-top: 15px
}

.content .main .case .click
{
	width: 140px;
	height: 40px;
	line-height: 40px;
	border: 1px solid #0170c9;
	margin: 100px auto 0
}

.content .main .case .click a
{
	color: #0170c9
}

.content .main .originality
{
	background: url(../Images/originality-bg.jpg) no-repeat 50%;
	height: 960px;
}

.content .main .originality .text
{
	color: #fff
}

.content .main .originality .originality_banner
{
	width: 1200px;
	height: 430px;
	margin: 150px auto;
	position: relative
}

.content .main .originality .originality_banner li
{
	position: absolute;
	transition: all .15s ease;
	-webkit-transition: all .15s ease;
	-moz-transition: all .15s ease;
	-ms-transition: all .15s ease;
	-o-transition: all .15s ease
}

.content .main .originality .originality_banner li:hover
{
	margin-top: -3px;
	-webkit-transform: scale(1.01);
	transform: scale(1.01)
}

.content .main .originality .originality_banner .li1
{
	background: url(../Images/originality-1-1.png) no-repeat 50%;
	background-size: 100% 100%;
	left: 0;
	top: 0
}

.content .main .originality .originality_banner .li2
{
	background: url(../Images/originality-1-2.png) no-repeat 50%;
	background-size: 100% 100%;
	left: 0;
	top: 200px
}

.content .main .originality .originality_banner .li1,.content .main .originality .originality_banner .li2
{
	width: 148px;
	height: 192px
}

.content .main .originality .originality_banner .li3
{
	width: 427px;
	height: 214px
}

.content .main .originality .originality_banner .li4,.content .main .originality .originality_banner .li5
{
	width: 205px;
	height: 104px
}

.content .main .originality .originality_banner .li6,.content .main .originality .originality_banner .li7
{
	width: 314px;
	height: 159px
}

.content .main .originality .originality_banner .li8
{
	width: 235px;
	height: 389px
}

.content .main .originality .originality_banner .li3
{
	background: url(../Images/originality-2-1.jpg) no-repeat 50%;
	background-size: 100% 100%;
	left: 178px;
	top: 30px
}

.content .main .originality .originality_banner .li4
{
	background: url(../Images/originality-2-2.jpg) no-repeat 50%;
	background-size: 100% 100%;
	left: 178px;
	top: 258px
}

.content .main .originality .originality_banner .li5
{
	background: url(../Images/originality-2-3.jpg) no-repeat 50%;
	background-size: 100% 100%;
	top: 258px;
	left: 400px
}

.content .main .originality .originality_banner .li6
{
	background: url(../Images/originality-3-1.jpg) no-repeat 50%;
	background-size: 100% 100%;
	left: 618px;
	top: 30px
}

.content .main .originality .originality_banner .li7
{
	background: url(../Images/originality-3-2.jpg) no-repeat 50%;
	background-size: 100% 100%;
	left: 618px;
	top: 203px
}

.content .main .originality .originality_banner .li8
{
	background: url(../Images/originality-4-1.png) no-repeat 50%;
	background-size: 100% 100%;
	right: 0;
	top: 5px
}

.content .main .promotion
{
	background-color: #ececec;
	height: 1000px;
}

.content .main .promotion .promotion_banner
{
	width: 1200px;
	height: 470px;
	margin: 70px auto;
	position: relative
}

.content .main .promotion .promotion_banner li
{
	position: absolute;
	width: 183px;
	height: 102px;
	transition: margin-top .15s ease;
	-webkit-transition: margin-top .15s ease;
	-moz-transition: margin-top .15s ease;
	-o-transition: margin-top .15s ease;
	-ms-transition: margin-top .15s ease
}

.content .main .promotion .promotion_banner .pli1
{
	background: url(../Images/promotion-01.jpg) no-repeat 50%;
	background-size: 100% 100%
}

.content .main .promotion .promotion_banner .pli2
{
	background: url(../Images/promotion-02.jpg) no-repeat 50%;
	background-size: 100% 100%
}

.content .main .promotion .promotion_banner .pli3
{
	background: url(../Images/promotion-03.jpg) no-repeat 50%;
	background-size: 100% 100%
}

.content .main .promotion .promotion_banner .pli4
{
	background: url(../Images/promotion-04.jpg) no-repeat 50%;
	background-size: 100% 100%
}

.content .main .promotion .promotion_banner .pli5
{
	background: url(../Images/promotion-05.jpg) no-repeat 50%;
	background-size: 100% 100%
}

.content .main .promotion .promotion_banner .pli6
{
	background: url(../Images/promotion-06.jpg) no-repeat 50%;
	background-size: 100% 100%
}

.content .main .promotion .promotion_banner .pli7
{
	background: url(../Images/promotion-07.jpg) no-repeat 50%;
	background-size: 100% 100%
}

.content .main .promotion .promotion_banner .pli8
{
	background: url(../Images/promotion-08.jpg) no-repeat 50%;
	background-size: 100% 100%
}

.content .main .promotion .promotion_banner .pli9
{
	width: 386px;
	height: 224px;
	background: url(../Images/promotion-21.jpg) no-repeat 50%;
	background-size: 100% 100%
}

.content .main .promotion .promotion_banner .pli10
{
	background: url(../Images/promotion-09.jpg) no-repeat 50%;
	background-size: 100% 100%
}

.content .main .promotion .promotion_banner .pli11
{
	background: url(../Images/promotion-10.jpg) no-repeat 50%;
	background-size: 100% 100%
}

.content .main .promotion .promotion_banner .pli12
{
	background: url(../Images/promotion-11.jpg) no-repeat 50%;
	background-size: 100% 100%
}

.content .main .promotion .promotion_banner .pli13
{
	background: url(../Images/promotion-12.jpg) no-repeat 50%;
	background-size: 100% 100%
}

.content .main .promotion .promotion_banner .pli14
{
	background: url(../Images/promotion-13.jpg) no-repeat 50%;
	background-size: 100% 100%
}

.content .main .promotion .promotion_banner .pli15
{
	background: url(../Images/promotion-14.jpg) no-repeat 50%;
	background-size: 100% 100%
}

.content .main .promotion .promotion_banner .pli16
{
	background: url(../Images/promotion-15.jpg) no-repeat 50%;
	background-size: 100% 100%
}

.content .main .promotion .promotion_banner .pli17
{
	background: url(../Images/promotion-16.jpg) no-repeat 50%;
	background-size: 100% 100%
}

.content .main .promotion .promotion_banner .pli18
{
	background: url(../Images/promotion-17.jpg) no-repeat 50%;
	background-size: 100% 100%
}

.content .main .promotion .promotion_banner .pli19
{
	background: url(../Images/promotion-18.jpg) no-repeat 50%;
	background-size: 100% 100%
}

.content .main .promotion .promotion_banner .pli20
{
	background: url(../Images/promotion-19.jpg) no-repeat 50%;
	background-size: 100% 100%
}

.content .main .promotion .promotion_banner .pli21
{
	background: url(../Images/promotion-20.jpg) no-repeat 50%;
	background-size: 100% 100%
}

.content .main .promotion .promotion_banner .pli2
{
	left: 203px
}

.content .main .promotion .promotion_banner .pli7,.content .main .promotion .promotion_banner .pli8,.content .main .promotion .promotion_banner .pli9,.content .main .promotion .promotion_banner .pli10,.content .main .promotion .promotion_banner .pli11
{
	top: 122px
}

.content .main .promotion .promotion_banner .pli12,.content .main .promotion .promotion_banner .pli13,.content .main .promotion .promotion_banner .pli14,.content .main .promotion .promotion_banner .pli15
{
	top: 244px
}

.content .main .promotion .promotion_banner .pli16,.content .main .promotion .promotion_banner .pli17,.content .main .promotion .promotion_banner .pli18,.content .main .promotion .promotion_banner .pli19,.content .main .promotion .promotion_banner .pli20,.content .main .promotion .promotion_banner .pli21
{
	top: 368px;
}

.content .main .promotion .promotion_banner .pli8,.content .main .promotion .promotion_banner .pli13,.content .main .promotion .promotion_banner .pli17
{
	left: 204px
}

.content .main .promotion .promotion_banner .pli3,.content .main .promotion .promotion_banner .pli9,.content .main .promotion .promotion_banner .pli18
{
	left: 408px
}

.content .main .promotion .promotion_banner .pli4,.content .main .promotion .promotion_banner .pli19
{
	left: 612px
}

.content .main .promotion .promotion_banner .pli5,.content .main .promotion .promotion_banner .pli10,.content .main .promotion .promotion_banner .pli14,.content .main .promotion .promotion_banner .pli20
{
	left: 816px
}

.content .main .promotion .promotion_banner .pli6,.content .main .promotion .promotion_banner .pli11,.content .main .promotion .promotion_banner .pli15,.content .main .promotion .promotion_banner .pli21
{
	right: 0
}

.content .main .promotion .promotion_banner li:hover
{
	margin-top: -5px
}

.content .main .advantage
{
	background: url(../Images/advantage-bg_35.jpg) no-repeat 50%;
	height: 920px
}

.content .main .advantage .text
{
	color: #fff
}

.content .main .advantage .advantage_banner
{
	width: 1200px;
	height: auto;
	margin: 100px auto;
	overflow: hidden
}

.content .main .advantage .advantage_banner li
{
	width: 280px;
	height: 380px;
	color: #fff;
	float: left
}

.content .main .advantage .advantage_banner li .txt
{
	width: 100%;
	height: 100%;
	padding-top: 80px;
	background: rgba(0,0,0,.7) url(../Images/advantage-border.png) no-repeat 50%;
	background-size: 100% 100%;
	opacity: 0;
	transition: opacity .15s ease;
	-webkit-transition: opacity .15s ease;
	-moz-transition: opacity .15s ease;
	-ms-transition: opacity .15s ease;
	-o-transition: opacity .15s ease
}

.content .main .advantage .advantage_banner li .txt h3
{
	font-weight: 400;
	font-size: 30px
}

.content .main .advantage .advantage_banner li .txt .border
{
	display: block;
	width: 60px;
	border-top: 2px solid #fff;
	margin: 40px auto
}

.content .main .advantage .advantage_banner li .txt p
{
	font-size: 16px
}

.content .main .advantage .advantage_banner .ali1
{
	background: url(../Images/advantage-01.jpg) no-repeat 50%;
	background-size: 100% 100%
}

.content .main .advantage .advantage_banner .ali2
{
	background: url(../Images/advantage-02.jpg) no-repeat 50%;
	background-size: 100% 100%
}

.content .main .advantage .advantage_banner .ali3
{
	background: url(../Images/advantage-03.jpg) no-repeat 50%;
	background-size: 100% 100%
}

.content .main .advantage .advantage_banner .ali4
{
	background: url(../Images/advantage-04.jpg) no-repeat 50%;
	background-size: 100% 100%
}

.content .main .advantage .advantage_banner li:hover .txt
{
	opacity: 1
}

.content .main .advantage .advantage_banner .ali2,.content .main .advantage .advantage_banner .ali3,.content .main .advantage .advantage_banner .ali4
{
	margin-left: 26px
}

.content .main .cooperation .cooperation_banner
{
	width: 1200px;
	margin: 70px auto
}

.content .main .cooperation .cooperation_banner ul
{
	width: 100%;
	height: auto;
	margin: 0 auto;
	overflow: hidden;
	padding: 20px 40px;
	border-bottom: 1px solid #ebebeb
}

.content .main .cooperation .cooperation_banner ul li
{
	float: left;
	padding: 17px;
	border-right: 1px solid #ebebeb;
	
}
.content .main .cooperation .cooperation_banner ul li:hover div{
	margin-top: -10px;
	transform: scale(1.05) translate(10px);
	-webkit-transform: scale(1.05) translate(10px);
	-o-transform: scale(1.05) translate(10px);
	-moz-transform: scale(1.05) translate(10px); 
	-ms-transform: scale(1.05) translate(10px);
	transform-origin: left center;
}
.content .main .cooperation .cooperation_banner ul li div
{
	width: 189px;
	height: 105px;
	transition: all .2s ease;
	-webkit-transition: all .2s ease;
	-moz-transition: all .2s ease;
	-ms-transition: all .2s ease;
	-o-transition: all .2s ease;
}

.content .main .cooperation .cooperation_banner ul .coli1 div
{
	background: url(../Images/cooperation-01.png) no-repeat 50%;
	background-size: 100% 100%;
	
}

.content .main .cooperation .cooperation_banner ul .coli2 div
{
	background: url(../Images/cooperation-02.png) no-repeat 50%;
	background-size: 100% 100%
}

.content .main .cooperation .cooperation_banner ul .coli3 div
{
	background: url(../Images/cooperation-03.png) no-repeat 50%;
	background-size: 100% 100%
}

.content .main .cooperation .cooperation_banner ul .coli4 div
{
	background: url(../Images/cooperation-04.png) no-repeat 50%;
	background-size: 100% 100%
}

.content .main .cooperation .cooperation_banner ul .coli5 div
{
	background: url(../Images/cooperation-05.png) no-repeat 50%;
	background-size: 100% 100%
}

.content .main .cooperation .cooperation_banner ul .coli6 div
{
	background: url(../Images/cooperation-06.png) no-repeat 50%;
	background-size: 100% 100%
}

.content .main .cooperation .cooperation_banner ul .coli7 div
{
	background: url(../Images/cooperation-07.png) no-repeat 50%;
	background-size: 100% 100%
}

.content .main .cooperation .cooperation_banner ul .coli8 div
{
	background: url(../Images/cooperation-08.png) no-repeat 50%;
	background-size: 100% 100%
}

.content .main .cooperation .cooperation_banner ul .coli9 div
{
	background: url(../Images/cooperation-09.png) no-repeat 50%;
	background-size: 100% 100%
}

.content .main .cooperation .cooperation_banner ul .coli10 div
{
	background: url(../Images/cooperation-10.png) no-repeat 50%;
	background-size: 100% 100%
}

.content .main .cooperation .cooperation_banner ul .coli11 div
{
	background: url(../Images/cooperation-11.png) no-repeat 50%;
	background-size: 100% 100%
}

.content .main .cooperation .cooperation_banner ul .coli12 div
{
	background: url(../Images/cooperation-12.png) no-repeat 50%;
	background-size: 100% 100%
}

.content .main .cooperation .cooperation_banner ul .coli13 div
{
	background: url(../Images/cooperation-13.png) no-repeat 50%;
	background-size: 100% 100%
}

.content .main .cooperation .cooperation_banner ul .coli14 div
{
	background: url(../Images/cooperation-14.png) no-repeat 50%;
	background-size: 100% 100%
}

.content .main .cooperation .cooperation_banner ul .coli15 div
{
	background: url(../Images/cooperation-15.png) no-repeat 50%;
	background-size: 100% 100%
}
.content .main .contact
{
	width: 100%;
	height: 550px;
	text-align: center;
	padding-top: 0px;
	color: #fff;
	letter-spacing: 2px;
	transition: height .8s ease .1s;
	-o-transition: height .8s ease .1s;
	-webkit-transition: height .8s ease .1s;
	-moz-transition: height .8s ease .1s;
	-ms-transition: height .8s ease .1s
}
.content .main .contact .text,.content .main .contact .number{
	position: relative;
	z-index: 2;
}

.content .main .contact .title
{
	font-size: 25px
}

.content .main .contact .state
{
	line-height: 100px
}

.content .main .contact .state i
{
	margin-right: 10px
}

.content .main .contact .number
{
	width: 480px;
	height: 160px;
	background: url(../Images/number.svg) no-repeat 50%;
	background-size: 100% 100%;
	margin: 50px auto 0;
	transition: all .8s ease .1s;
	-o-transition: all .8s ease .1s;
	-webkit-transition: all .8s ease .1s;
	-moz-transition: all .8s ease .1s;
	-ms-transition: all .8s ease .1s
}

.content .main .contact .number.active
{
	margin-top: 100px;
	transform: scale(1.105);
	-webkit-transform: scale(1.105);
	-moz-transform: scale(1.105);
	-o-transform: scale(1.105);
	-ms-transform: scale(1.105)
}

.content .main .contact .step
{
	width: 100%;
	height: 231px;
	position: absolute;
	z-index: 2;
	bottom: 60px;
	background: url(../Images/footer-line.png) no-repeat 50%;
	background-size: 100% 100%;
	transition: all .15s ease;
	-webkit-transition: all .5s ease .1s;
	-o-transition: all .5s ease .1s;
	-ms-transition: all .5s ease .1s;
	-moz-transition: all .5s ease .1s
}

.content .main .contact.active
{
	height: 600px
}

.plus-sign{
    padding-top: 10px;
}