@charset "utf-8";
/* CSS Document */

body{
	background-color: #fff;
}
.columnContent img{ max-width: 100%;}
a img{
	border: none !important;
}
body{ font-size: 14px; /*font-family: Arial, Helvetica, sans-serif;*/font-family: "Lato", Arial, Helvetica, sans-serif;}
a{color:#000;text-decoration:none;}

@media only screen and (max-width:480px) {
}
@media only screen and (min-width : 481px) and (max-width : 1024px) {
}
@media only screen and (min-width:1025px) {
	body{ font-size: 14px;}
}



.pageHeader{ background-color: #fff; padding-top: 0px; background-image: url("../images/headerBg.png"); background-position: top center; background-repeat: no-repeat;
	border-top: solid 6px #2a59a7;
	background-position: center -6px ;
}
.pageBody{}
.pageAside{}
.pageContent{}
.pageFooter{ background-color: #eee; }




.pageFooter{  background-position: top center; background-color: #2a59a7;}
@media only screen and (max-width:480px) {
	.pageFooter{}
}
@media only screen and (min-width : 481px) and (max-width : 1024px) {
	.pageFooter{ }
}
@media only screen and (min-width:1025px) {
	.pageFooter{ height:350px;}
}



.pageHeader{}
.pageHeader .wrapper{display: flex; flex-wrap: wrap; }
.pageHeader .row{ align-items: center;}
.wrapper{ max-width:1200px;}

.pageHeader a{ color: #000;}
.logo{
	width:260px;
	height: 95px;
	background-color: #fff;
	line-height:80px;
	text-align: center;
	background-image:url("../images/logo.png");
	background-size: cover;
	text-indent: -9999px;
	z-index: 1000;
	flex-shrink: 0;
}
.logo a{ width: 100%; height: 100%; display: block;}
@media only screen and (max-width:480px) {
	.logo{ width: 100%; height: 64px;}
	.pageHeader{background: none;}
}
@media only screen and (min-width : 481px) and (max-width : 1024px) {
	.logo{ width: 550px; height: 94px;}
	.pageHeader{min-height:154px;}
}
@media only screen and (min-width:1025px) {
	.logo{ width: 550px; height: 94px;}
	.pageHeader{min-height:154px;}
}







.nav{
	flex-grow: 1;
	display: flex;
	justify-content: center;
	height: 56px;
}
.nav .navList{ margin: auto;}
.nav li{   padding: 0 0px; text-align: center; line-height: 56px; position: relative; border-top: solid 4px #2a59a7;}
.nav li.current{border-top: solid 4px #1a264f;}

.nav a{ color: #000; padding: 0 40px;border-right: 1px solid #cbcbcb;}
.nav li:nth-child(1) a{border-left: 1px solid #cbcbcb;}

.nav li.current a{font-weight: bold;}
/*
.nav li.current li a{font-weight: normal;}
.nav li ul{position: absolute; left: 0; top: 56px; width: 100px;}
.nav li ul{ display: none;}
.nav li:hover ul{ display: block;}
*/


@media only screen and (max-width:480px) {
	.nav{
		display: none;
	}
}
@media only screen and (min-width : 481px) and (max-width : 1024px) {
	.nav{
		display: none;
	}
}
@media only screen and (min-width:1025px) {
}



.language{ text-align: right; display: none;}
.userInfo{ text-align: right; margin-left: 30px;}


@media only screen and (max-width:480px) {
	.userInfo{ margin-right: 60px; font-size: 12px;}
}
@media only screen and (min-width : 481px) and (max-width : 1024px) {
	.userInfo{ margin-right: 60px; font-size: 12px;}
}
@media only screen and (min-width:1025px) {
	.language{ display: block;}
}



.pageHeader .subNav{
	position: absolute;
	left: 0px;
	top: 160px;
	width: 100%;
	background-color: rgba(255,255,255,0.9);
	z-index: 500;
	padding: 0;
	display: none;
}
.pageHeader .subNav.open{ display: block;}

.pageHeader .subNav .wrapper{justify-content: flex-start; padding: 20px 0px; max-width: 1100px;align-items:start;}
.pageHeader .subNav .columnName{ width: 160px;}
.pageHeader .subNav .columnName span{ font-size: 24px; padding-top: 00px; display: block;}

.pageHeader .subNav ul{ width: 450px; display: grid; grid-template-columns: 50% 50%;}
.pageHeader .subNav li{ line-height: 40px; height: 40px; border-bottom: solid 1px #ddd; font-size: 14px; text-indent: 2em; width: 160px; margin-right: 10px; display: flex;}
.pageHeader .subNav li a{ display: block; background-image: url(../images/subNav/itemBg.png); background-position: left top;}
.pageHeader .subNav li a:hover{ font-weight: bold; color: #015fc0; background-position: left bottom;}
.pageHeader .subNav .preview{ position: relative; width: 300px; height: 160px; overflow: hidden; background-color: #ccc; margin-left: auto; margin-right: 0; border-radius: 4px;}



.pageHeader #subNav_2 .preview{ background-image: url(../images/subNav/preview2.jpg);}
.pageHeader #subNav_3 .preview{ background-image: url(../images/subNav/preview3.jpg);}
.pageHeader #subNav_4 .preview{ background-image: url(../images/subNav/preview4.jpg);}
.pageHeader #subNav_5 .preview{ background-image: url(../images/subNav/preview5.jpg);}
.pageHeader #subNav_6 .preview{ background-image: url(../images/subNav/preview6.jpg);}
.pageHeader #subNav_7 .preview{ background-image: url(../images/subNav/preview7.jpg);}
.pageHeader #subNav_8 .preview{ background-image: url(../images/subNav/preview8.jpg);}
.pageHeader #subNav_9 .preview{ background-image: url(../images/subNav/preview9.jpg);}
.pageHeader #subNav_10 .preview{ background-image: url(../images/subNav/preview10.jpg);}
.pageHeader #subNav_11 .preview{ background-image: url(../images/subNav/preview11.jpg);}


/*
#subNav_1{ display: none;}
#subNav_2{ display: none;}
#subNav_3{ }
#subNav_4{ display: none;}
#subNav_5{ display: none;}
#subNav_6{ display: none;}
#subNav_7{ display: none;}
#subNav_8{ display: none;}
#subNav_9{ display: none;}
#subNav_10{ display: none;}
#subNav_11{ display: none;}
*/
.modalNavSwitch{ right: 15px; top:15px;}


.search{ width: 300px; background-color: #eeeeee; height: 30px; border-radius: 15px; padding: 0 10px;margin-left: 0; margin-right: auto;}
.search form{ display: flex; align-items: center; justify-content: space-between; width: 100%;}
.search select{ border: none; background:none; line-height: 30px; heigth:30px; color: #666;}
.search select .option{ color: #999; background-color: #fff;}

.search select option option{color: #999;}
.search input{ flex-grow: 1; line-height: 30px; height: 30px; border: none; background: none; color: #333; width: 60%; text-indent: 1em;}
.search .searchButton{ width: 30px; height:30px; overflow: hidden; border: none; background: none; color: #666; font-size: 20px;}


@media only screen and (max-width:480px) {
	.search{ width: 100%; margin: 10px 0;}
	.search input{ width: 100%;}
}
@media only screen and (min-width : 481px) and (max-width : 1024px) {
	.search{ width: 100%; margin: 10px 0;}
	.search input{ width: 100%;}
}
@media only screen and (min-width:1025px) {
	.search{ width: 280px; position: absolute; right: 50px; top: 40px;}
}




.articleDetail{ max-width: 1000px; margin: auto;}




.pageHeader .quickLink{ width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; position: relative;}
.pageHeader .quickLink .icon{ font-size: 20px; color: #666;}
.pageHeader .quickLink .count{ background-color: #666; color: #fff; display: block; border-radius: 50%; font-size: 8px; text-align: center; width: 14px; height: 14px; line-height: 14px; position: absolute; left: 25px; top: 5px;}


.pageHeader .quickLink.focus .count {
    animation: focus 2s;
}

@keyframes focus {
    0% {
		transform: scale(1.0);
    }
	25% {
		transform: scale(1.3);
	}
	50% {
		transform: scale(1.0);
	}
	75% {
		transform: scale(1.3);
	}
    100% {
		transform: scale(1.0);
    }
}


.pageFooter{ background-color: #2a59a7; font-size: 12px; color: #666; width: 100%; padding-bottom: 20px;}
.pageFooter .wrapper{  height: auto; display: flex; flex-wrap: wrap;}


#contact{ 
	color:white;
	font-size:14px;
	line-height: 24px;
	width: 50%;
	position: relative;
}
#contact strong{
	font-size: 30px;
	line-height: 40px;
	left:4000px;
	word-spacing: 5px;
}
#contact > div:nth-child(2){
	padding-top: 0px;
	line-height: 38px;
}
#contact > div:nth-child(3){
	padding-top: 3px;
	line-height: 38px;
	word-spacing: 3px;
}
#contact .qr{
	display: flex;
	margin-top: 20px;
}
#contact .qr img{
	margin-right: 40px;
}



@media only screen and (max-width:480px) {
}
@media only screen and (min-width : 481px) and (max-width : 1024px) {
	#contact .qr{
		position: absolute;
		right: 20px;
		bottom: 20px;
	}
}
@media only screen and (min-width:1025px) {
	#contact .qr{
		position: absolute;
		right: 20px;
		bottom: 20px;
	}
}





.footerNav{
	width: 50%;
}
.footerNav ul{
	display: grid;
	margin-top: 60px;
	flex-wrap: nowrap;
	grid-template-columns: 2fr 2fr 3fr;
}
.footerNav li{
	width: 100%;
	border-left: solid 1px #7f9bca;
	line-height: 24px;
	font-size: 14px;
	height: 220px;
	font-weight: bold;
	text-align: center;
}
.footerNav ul > li:nth-child(3){
	border-right: solid 1px #7f9bca;
}
.footerNav li ul{
	display: block;
	margin-top: 10px;;
}
.footerNav li li{
	border: none;
	font-size: 12px;
	padding-left: 0;
	height: auto;
	font-weight: normal;
	width: auto;
	border: none !important;
}
.footerNav a{
	color: #fff;
}



@media only screen and (max-width:480px) {
	#contact{ width: 100%;}
	.footerNav{ width: 100%;}
	.footerNav li{}
}
@media only screen and (min-width : 481px) and (max-width : 1024px) {
	#contact{ width: 100%;}
	.footerNav{ width: 100%;}
	.footerNav li{}
}
@media only screen and (min-width:1025px) {
}



/*
.articleList.attachStyle_4{
}
.articleList.attachStyle_4 li{
	height: auto;
	margin: auto;
	width: 240px;
}
.articleList .preview{
	width: 240px;
	height: 240px;
}
.articleList.attachStyle_4 .desc{
	display: none;
}
.articleList.attachStyle_4 .title{
	height: 4em;
	line-height: 2em;
}

.articleDetail .info{
	background-color: #f4f4f4;
	line-height: 3em;
}
*/


.rootColumn_2 .banner{ background-image: url(../images/banner/2.jpg);}
.rootColumn_3 .banner{ background-image: url(../images/banner/3.jpg);}
.rootColumn_4 .banner{ background-image: url(../images/banner/4.jpg);}
.rootColumn_5 .banner{ background-image: url(../images/banner/5.jpg);}
.rootColumn_6 .banner{ background-image: url(../images/banner/6.jpg);}
.rootColumn_7 .banner{ background-image: url(../images/banner/7.jpg);}
.rootColumn_8 .banner{ background-image: url(../images/banner/8.jpg);}
.rootColumn_9 .banner{ background-image: url(../images/banner/9.jpg);}
.rootColumn_10 .banner{ background-image: url(../images/banner/10.jpg);}
.rootColumn_11 .banner{ background-image: url(../images/banner/11.jpg);}

.rootColumn_20 .banner{ background-image: url(../images/banner/3.jpg);}
.rootColumn_21 .banner{ background-image: url(../images/banner/3.jpg);}
.rootColumn_22 .banner{ background-image: url(../images/banner/3.jpg);}
.rootColumn_23 .banner{ background-image: url(../images/banner/3.jpg);}
.rootColumn_24 .banner{ background-image: url(../images/banner/3.jpg);}
.rootColumn_25 .banner{ background-image: url(../images/banner/3.jpg);}
.rootColumn_26 .banner{ background-image: url(../images/banner/3.jpg);}
.rootColumn_27 .banner{ background-image: url(../images/banner/3.jpg);}
.rootColumn_67 .banner{ background-image: url(../images/banner/2.jpg);}

.pagination .tips{ display: none;}

.modalNavList{
	margin-top: 80px;
}
.modalNavList li{
	line-height: 3.5em;
}
.modalNavList li li{
	line-height: 3.5em;
}
.modalNav{
	top: 5%;
}

/*



#about{
	color:white;
	font-size:15;
	line-height: 20px;
}
#about strong{
	font-size: 15px;
	line-height: 40px;
	left: 1053px;
	word-spacing: 5px;
}
#about > div:nth-child(1){
	padding-top: 20px;
	line-height: 38px;
}
#about > div:nth-child(2){
	padding-top: 8px;
	line-height: 24px;
}

#product{
	color:white;
	font-size:14px;
	line-height: 24px;
}

#solution1{
	color:white;
	font-size:14px;
	line-height: 24px;
}
*/

.couplet{
	position: fixed;
	z-index: 500;
	left: 10px;
	background-color: #217fc4;
	top: 180px;
	padding: 40px 20px;
	color: #fff;
	border-radius: 10px;
	display: none;
}
.couplet p{
	line-height: 2em;
}
.couplet strong{
	font-size: 18px;
}
.couplet .button{
	margin-top: 20px;
	line-height: 1.5em;
	height: 1.5em;
	font-size: 14px;
}
@media only screen and (max-width:480px) {
}
@media only screen and (min-width : 481px) and (max-width : 1400px) {
}
@media only screen and (min-width:1401px) {
	.couplet{
		display: block;
	}
}