@charset "UTF-8";
/*reset css*/
html {color: #000; background: #f0f2f5; font-size: 12px;}
body { min-width: 1200px; font: 12px/100% "Microsoft YaHei"; }
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td {margin: 0; padding: 0}
table { border-collapse: collapse; border-spacing: 0 }
fieldset,img { border: 0 }
address,caption,cite,code,dfn,em,th,var { font-style: normal; font-weight: normal }
ol,ul,li { list-style: none; }
button { border:0; }
caption,th { text-align: left; }
h1,h2,h3,h4,h5,h6 { font-size: 100%; font-weight: normal; }
q:before,q:after { content: ''; }
abbr,acronym { border: 0; font-variant: normal; }
sup { vertical-align: text-top; }
sub { vertical-align: text-bottom; }
input,textarea,select { font-family: inherit; font-size: inherit; font-weight: inherit; *font-size: 100%;}
legend { color: #000; }
a:link,a:visited,a:active { color: #6f6f6f; text-decoration: none; }
a:hover { color: #fff; }
/* 4.4 reset the global color to gray */
.gray-filter {
    filter: grayscale(100%);
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* 移动端注释这部分 */
	filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);  /* ie */
	-webkit-filter: grayscale(1);
	filter: gray; /* ie6~ie9 */
}
/* 清浮动 */
.cf { display: block; }
.cf:after {
	clear: both;
	content: ".";
	display: block;
	height: 0;
	visibility: hidden;
}
/*********************公用部分***********************/
.E-header{
	position: fixed;
	top: 0;
	z-index: 200;
	width: 100%;
	height: 80px;
	font-size: 16px;
	color: #666666;
	box-shadow: 0 1px 0 0 rgba(255,255,255,0.10);
	background-color: rgba(0, 0, 0, 0);
	-webkit-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
	transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
}
.E-headerinner{
	width: 1200px;
    height: 100%;
    margin: 0 auto;
}
.E-headerinner .headerlog {
	position: relative;
	float: left;
	width: 180px;
	height: 80px;
	overflow: hidden;
}
.E-headerinner .headerlog a {
	display: block;
	width: 180px;
    height: 37px;
    margin-top: 21px;
    text-align: center;
    font-weight: bold;
    color: #1E1E1E;
    font-size: 26px;
    font-style: italic;
    font-style: oblique;
	/* background: url(../img/logo3.png) 100% 100%/155px 43px no-repeat; */
	-webkit-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
	transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
}
.headeron{
	background-color: #ffffff;
	box-shadow: 0 1px 0 0 rgba(175, 168, 168, 0.1);
}
.E-headerinner .headermenu{
	float: left;
	margin-left: 50px;
	height: 80px;
}
.E-headerinner .headermenu ul{
	height: 80px;
}
.E-headerinner .headermenu li{
	float: left;
	/* margin: 0 3px; */
	position: relative;
	height: 80px;
}
.E-headerinner .headermenu li .hot{
	position: absolute;
	top: 39px;
	margin-top: -7px;
	margin-left: 3px;
	width: 30px;
}
.E-headerinner .headermenu li.active::after{
	content:'';
    display: block;
    width: calc(100% - 50px);
    height: 4px;
    background: #336aff;
    position: absolute;
    bottom:0px;
    left: 25px;
}
.E-headerinner .headermenu li:not(.active):hover::after{
	content:'';
    display: block;
    width: calc(100% - 50px);
    height: 3px;
    background: #336aff;
    position: absolute;
    bottom:0px;
	left: 25px;
	animation: headermenuhover 0.2s;
	-moz-animation: headermenuhover 0.2s;	/* Firefox */
	-webkit-animation: headermenuhover 0.2s;	/* Safari 和 Chrome */
	-o-animation: headermenuhover 0.2s;	/* Opera */
}
.E-headerinner .q-entry {
	box-sizing: border-box;
	float: right;
	height: 80px;
	padding: 20px;
	line-height: 38px;
}
.E-headerinner .q-entry a{
	height: 20px;
	padding: 6px;
	color: #336aff;
	font-size: 10px;
	/* background: #336aff; */
	border: 1px solid #336aff;
	border-radius: 8px;
}

@keyframes headermenuhover{
	from {width: 0px;}
	to {width: calc(100% - 50px);}
}

@-moz-keyframes headermenuhover /* Firefox */
{
	from {width: 0px;}
	to {width: calc(100% - 50px);}
}

@-webkit-keyframes headermenuhover /* Safari 和 Chrome */
{
	from {width: 0px;}
	to {width: calc(100% - 50px);}
}

@-o-keyframes headermenuhover /* Opera */
{
	from {width: 0px;}
	to {width: calc(100% - 50px);}
}
.E-headerinner .headermenu li a{
	display: block;
    height: 80px;
    line-height: 80px;
    color: #fff;
	box-sizing: border-box;
	padding: 0 25px;
	font-size: 16px;
}
.headeron .E-headerinner .headermenu li a,
.headeractive .E-headerinner .headermenu li a{
	font-size: 16px;
	color: #333333;
}
.E-headerinner .headermenu li .moremenu{
	display: none;
	position: absolute;
	top: 80px;
	left: 0;
	background: rgba(33,34,38,0.99);
	box-shadow:0px 5px 14px 0px rgba(0,0,0,0.18);
}
.E-headerinner .headermenu li .moremenu dl{
	float: left;
	width: 130px;
	padding: 0 10px 20px;
}
.E-headerinner .headermenu li .moremenu dl dt{
	line-height: 50px;
	height: 50px;
	margin-top: 15px;
	padding-left: 30px;
	color: #636672;
    font-size: 16px;
}
.E-headerinner .headermenu li .moremenu dl dd{
	height: 34px;
}
.E-headerinner .headermenu li .moremenu dl dd a{
	display: block;
	height: 34px;
	line-height: 34px;
	font-size: 14px;
	padding-left: 30px;
	color: #C5C5C5;
	border-radius: 2px;
}
.E-headerinner .headermenu li .moremenu.bright{
	background-color: #fff;
}
.E-headerinner .headermenu li .moremenu.bright dl dt {
	color: #C5C5C5;
}
.E-headerinner .headermenu li .moremenu.bright dl dd a{
	color: #333333;
}
.E-headerinner .headermenu li .moremenu dl dd a.on,
.E-headerinner .headermenu li .moremenu dl dd a:hover{
	color: #fff;
	background:rgba(51,106,255,1);
}
.E-headerinner .headermenu li .dropdownmenu {
	position: relative;
}
.E-header .E-headerinner .headermenu li .dropdownmenu::after {
	content:'';
	width: 10px;
	height: 10px;
	position: absolute;
	top: 35px;
	right: 0px;
	background: url("../img/whitedownarrow.png");
}
.E-header .E-headerinner .headermenu li .dropdownmenu:hover::after {
	content:'';
	width: 10px;
	height: 10px;
	position: absolute;
	top: 35px;
	right: 0px;
	background: url("../img/whiteuparrow.png");
}
.E-header.headeron .E-headerinner .headermenu li .dropdownmenu::after,
.E-header.headeractive .E-headerinner .headermenu li .dropdownmenu::after {
	background: url("../img/blackdownarrow.png");
	background-size: cover;
}
.E-header.headeron .E-headerinner .headermenu li .dropdownmenu:hover::after,
.E-header.headeractive .E-headerinner .headermenu li .dropdownmenu:hover::after {
	background: url("../img/blackuparrow.png");
	background-size: cover;
}
/* *******banner****** */
.bannerwrap{
    position: relative;
    width: 100%;
    height: 540px;
    margin-top: 80px;
}
.bannerwrap .slideritem{
    width: 100%;
    height: 100%;
    position: relative;
}
.bannerwrap .slideritem li{
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
}
.bannerwrap .slideritem li .liinner{
    position: relative;
    width: 1200px;
    height: 100%;
    margin: 0 auto;
}
.bannerwrap .slideritem li.li0{
    background-image: url(../img/sy_bg.png);
    background-repeat: no-repeat;
    background-position: center;
}
.bannerwrap .slideritem li.li1{
    background-image: url(../img/banner1.png);
    background-repeat: no-repeat;
    background-position: center;
}
.bannerwrap .slideritem li.li2{
    background-image: url(../img/banner2.png);
    background-repeat: no-repeat;
    background-position: center;
}
.bannerwrap .slideritem li.li3{
    background-image: url(../img/banner3.png);
    background-repeat: no-repeat;
    background-position: center;
}
.bannerwrap .slideritem li .liinner .bannertxt{
    height: 300px;
    padding: 50px 0;
    position: absolute;
    top: 60px;
    left: 0;
    -webkit-animation: bannerli 0.8s ease-in-out 0.4s backwards;
	-moz-animation: bannerli 0.8s ease-in-out 0.4s backwards;
	animation: bannerli 0.8s ease-in-out 0.4s backwards;
}
@keyframes bannerli {
	0% {
		top: 10px;
		opacity: 0;
	}
	100% {
		top: 60px;
		opacity: 1;
	}
}
@-webkit-keyframes bannerli {
	0% {
		top: 10px;
		opacity: 0;
	}
	100% {
		top: 60px;
		opacity: 1;
	}
}
@-moz-keyframes bannerli {
	0% {
		left: 150px;
		opacity: 0;
	}
	100% {
		left: 200px;
		opacity: 1;
	}
}
.bannerwrap .slideritem li .liinner .bannertxt h2{
    color: #fff;
    font-size: 48px;
    line-height: 72px;
}
.bannerwrap .slideritem li.li0 .liinner .bannertxt h3{
    color: #fff;
    font-size: 36px;
    line-height: 36px;
    margin-top: 100px;
}
.bannerwrap .slideritem li.li0 .liinner .bannertxt p{
    color: rgba(255, 255, 255, 0.6);
    font-size: 24px;
    line-height: 50px;
    padding: 20px 0;
}
.bannerwrap .slideritem li .liinner .bannertxt p{
    width: 560px;
    color: #FFFFFF;
    font-size: 22px;
    line-height: 40px;
    padding: 20px 0;
}
/* box-content */
.box-cont {
	width: 1200px; 
	margin: 0 auto;
}
/*****************contentbox 公用css******************/
.contentbox{
    width: 100%;
}
.contentbox .head{
    text-align: center;
    position: relative;
    padding-top: 47px;
    padding-bottom: 22px;
}
.contentbox .head .title{
    height:80px;
    margin: 0 auto;
    line-height:80px;
    font-size: 32px;
    font-family: PingFangSC-Medium,PingFang SC;
    font-weight: 600;
    color: rgba(51,51,51,1);
}
.contentbox .titp{
    width: 1000px;
    margin: 0 auto;
    text-align: center;
    color: #333333;
    font-size: 20px;
    line-height: 30px;
}
.f-left {
    float: left;
}
.f-right {
    float: right;
}
/* ************产品优势*********** */
.product-superiority {
    margin-top: 40px;
    background: #ffffff;
}
.product-superiority .box-cont {
    margin-top: 40px;
}
.product-superiority .box-cont>div{
    height: 300px;
}
.product-superiority .box-cont div .num{
    height: 120px;
    line-height: 120px;
    color:rgba(51,119,255,0.3);
    font-size: 120px;
    margin-top: 40px;
}
.product-superiority .box-cont div h3{
    width: 700px;
    height: 50px;
    color:#282828;
    font-size: 32px;
    font-weight: 600;
    margin: -35px 0 10px 76px;
}
.product-superiority .box-cont div p{
    width: 700px;
    height: 30px;
    line-height: 30px;
    margin-left: 70px;
    color:#8F8F8F;
    font-size: 20px;
}
.product-superiority .box-cont .f-left {
    height: 300px;
}
.product-superiority .box-cont .reverse .f-right {
    text-align: right;
}
.product-superiority .box-cont .reverse .f-right h3 {
    margin: -35px 70px 10px 76px;
}

/* *********页脚流程图********* */
.flow-chart {
    height: 160px;
    background: #E1EBFF;
}
.flow-chart .box-cont {
    box-sizing: border-box;
    height: 160px;
    padding: 30px 46px;
}
.flow-chart .box-cont .stepbox {
    display: inline-block;
    width: 100px;
    height: 100px;
    font-size: 22px;
    color: #3377FF;
    text-align: center;
    vertical-align: top;
}
.flow-chart .box-cont .line {
    display: inline-block;
    color: #3377FF;
    vertical-align: top;
    margin-top: 16px;
}
.flow-chart .box-cont .step {
    width: 40px;
    height: 40px;
    margin: 0 auto;
    line-height: 40px;
    border: 2px solid #3377FF;
    border-radius: 50%;
}
.flow-chart .box-cont .desc {
    margin-top: 25px;
}
/* ******footer***** */
.footer{
	background: #131314;
}
.footerinner{
	width: 1200px;
    height: 100%;
    margin: 0 auto;
}
.footerinner .footerbg1{
	width: 1200px;
	height: 140px;
	border-bottom: 1px solid #363637;
	overflow: hidden;
}

.footerinner .footerbg1 ul {
	width: 1200px;
	height: 100%;
}

.footerinner .footerbg1 ul li {
	width: 25%;
	float: left;
	line-height: 140px;
}

.footerinner .footerbg1 ul li img {
	vertical-align: middle;
	margin-right: 15px;
	margin-bottom: 7px;
}

.footerinner .footerbg1 ul li span{
	font-size: 20px;
	color: #A3AAB6;
}

.footerlink{
	border-top:1px solid #363637;
	border-bottom:1px solid #363637;
	height: 60px;
    text-align: center;
}
.footerlink span{
    margin: 0 100px;
    font-size: 16px;
    color: #ffffff;
    line-height: 60px;
}
.footerright p{
	height: 35px;
	line-height: 35px;
	text-align: center;
	color: #6f6f6f;
}
.fixbottom{
    display: none;
}