/* header */
.header { position: relative; z-index: 1; background: #328ddb; background: linear-gradient(45deg, #10559e 3%, #368bd7 55%, #40BAF5 91%); }

.conter{overflow: hidden;}

/*banner*/
.banner {position: relative;height: 320px; overflow:hidden}
.banner img {position: absolute; top: 0; left: 50%;margin-left: -960px;}
.banner h2{ position: absolute; top: 200px;width: 100%; margin: 0 auto; text-align: center; color: #fff;font-size: 32px;}
.banner h3{ position: absolute; top: 250px;width: 100%; margin: 0 auto; text-align: center; color: #fff;font-size: 14px;}
.banner h3 a{color: #fff}

/*main*/
.main{background: url(../images/mainbg.gif) no-repeat top center;}

.sidebar{width: 220px;}
.sidebar h2 { display: block; height: 60px; padding-top: 25px; font-size: 24px; color: #011B65; font-weight: bold; }
.sidebar h2 span { text-transform: uppercase; font: 500 14px/24px Arial, Helvetica, sans-serif; display: block; color: #707c8a;}

.sidemenu { margin-top: 25px; }
.sidemenu li a { display: block; width: 200px; height: 40px; padding-left: 20px; line-height: 40px; }
.sidemenu li.on a { width: 200px; color: #fff; background-color: #011B65 }

.sidenav {margin-top: 25px; overflow: hidden;}
.sidenav h3 { height: 38px; margin-top: 5px; padding-left: 10px; color: #2c3035; background: #e3e3e3; cursor: pointer; font: normal 14px/38px "Microsoft YaHei"; }
.sidenav h3 em { float: right; display: block; width: 40px; height: 38px; background: url(../images/add.png) 16px 16px no-repeat; cursor: pointer; }
.sidenav h3.on { background: #011B65;}
.sidenav h3.on em { background-position: 16px -53px; }
.sidenav h3.on a{color: #fff }
.sidenav ul { padding: 8px 20px; color: #999; display: none; /* 默认都隐藏 */ }
.sidenav ul li { line-height: 22px; padding-left: 20px; background: url(../images/tb.gif) no-repeat left center; color: #7D7D7D; }

.lianxi { width: 220px; padding: 20px 0;}
.lianxi img { margin-left: 8px }
.lianxi .ph { background: url(../images/in_phone.jpg) no-repeat left center; text-align: right; padding: 0 25px 0 65px; font-family: Arial, Helvetica, sans-serif; }
.lianxi .ph .y_1 { font-size: 19px; }
.lianxi .ph .y_2 { color: #ccc; font-size: 10px; }

.mainbar{width: 830px; min-height: 600px; padding-bottom: 20px;}

/* news */
.news { overflow: hidden; padding: 10px 0 0; }
.news li { padding: 25px 0; border-bottom: 1px dashed #e3e3e3; overflow: hidden; -webkit-transition: all 0.3s ease-in-out; }
.news li span { display: block; width: 100px; height: 95px; padding-top: 5px; float: left; font-size: 56px; color: #eee; font-family: sans-serif; text-align: center; background: #707c8a }
.news li span em { display: block; font-size: 16px; font-family: Arial; }
.news li .item { position: relative; float: left; width: 680px; height: 80px; padding: 10px 25px; background: #f9f9f9; overflow: hidden; }
.news li .item .frame { position: absolute; top: 0; right: 0; z-index: 9; width: 0; height: 0; border-top: 30px solid #707c8a; border-left: 30px solid transparent; }
.news li .item .frame em { position: absolute; top: -30px; left: -13px; z-index: 10px; font: 18px Helvetica, Arial, sans-serif; color: #fff }
.news li .item h2 { line-height: 32px; font-size: 16px; color: #2c3035; -webkit-transition: all 0.3s ease-in-out; }
.news li .item p { line-height: 24px; font-size: 12px; color: #666; }
.news li:hover span { background: #011B65 }
.news li:hover .item .frame { border-top: 30px solid #011B65; -webkit-transition: all 0.3s ease-in-out; }
.news li:hover h2 { color: #1e88e5; }

/*pro*/
.prolist { padding: 35px 0 0; overflow: hidden; }
.prolist li { position: relative; float: left; width: 258px; margin: 0 25px 30px 0; text-align: center; background: #fff; border: 1px solid #707c8a; overflow: hidden; -webkit-transition: all 0.3s ease-in-out; }
.prolist li:hover { border: 1px solid #e3e8f6; }
.prolist li a { display: block; }
.prolist li a .frame { position: absolute; top: 0; right: 0; z-index: 9; width: 0; height: 0; border-top: 30px solid #707c8a; border-left: 30px solid transparent; }
.prolist li a .frame em { position: absolute; top: -30px; left: -13px; z-index: 10px; font: 18px Helvetica, Arial, sans-serif; color: #fff }
.prolist li:hover a .frame { border-top: 30px solid #011B65; -webkit-transition: all 0.3s ease-in-out; }
.prolist li img { padding-top: 10px; }
.prolist li h3 { line-height: 24px; color: #011B65; }
.prolist li h3 em { color: #011B65; }
.prolist li h4 { line-height: 30px; color: #666; padding: 0 0 10px; }
.prolist li a .cover { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; text-align: center; background: rgba(220, 228, 250, 0.9); filter: alpha(opacity=0); -moz-opacity: 0; -khtml-opacity: 0; opacity: 0; }
.prolist li a .cover i { font-size: 60px; color: #011b65 }

.rele li {width: 243px; margin: 0 40px 30px 0; }

.gall{ position: relative; overflow: hidden; width: 100%; height: 420px; margin-top: 35px}
.gall .gallimg{ position: relative; overflow: hidden; width:420px; height: 420px; }
.gall .gallimg li img{ display: block; width:400px; height:400px; padding: 9px; border: 1px solid #e3e8f6;}

.gall .small{ position: relative; width: 70px; height: 420px; margin-right: 30px; display:inline;}

.gall .sPrev,.gall .sNext{ position: absolute; left: 20px; display: block; width: 29px; margin-left: }
.gall .sPrev{ top:0; height: 15px; background: url(../images/sPrev.png) no-repeat; }
.gall .sNext{ bottom: 0; height: 15px; background: url(../images/sNext.png) no-repeat; }

.gall .smallimg{width: 70px; margin: 25px 0 20px;}
.gall .smallimg ul{overflow: hidden; zoom: 1;}
.gall .smallimg li{ width:70px; height: 70px; margin-bottom: 5px; cursor:pointer;}
.gall .smallimg img{ display:block; width:60px; height:60px; padding: 4px; border: 1px solid #e3e8f6; }
.gall .smallimg .on img{ border-color: #011B65; }

.desc { position: relative; display: inline; width: 550px; height: 420px }
.desc h1 { font: bold 24px/30px 'Microsoft YaHei', Arial; color: #333; margin-bottom: 5px; }
.desc ul { height: 323px; padding: 10px 0; }
.desc ul li { line-height: 40px; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.desc ul li.xian { border-bottom: 1px dashed #ccc; margin: 1.2rem 0; }
.desc ul li span { font-size: 14px; color: #011B65 }

.btn { position: absolute; bottom: 0; left: 0; height: 42px }
.btn a { float: left; width: 258px; height: 40px; margin-right: 30px; font-size: 16px; line-height: 40px; border: 1px solid transparent; overflow: hidden; text-align: center; -webkit-border-radius: 2px; -moz-border-radius: 2px; -ms-border-radius: 2px; -o-border-radius: 2px; border-radius: 2px; -webkit-user-select: none; -moz-user-select: none; user-select: none; display: -moz-inline-stack; display: block; zoom: 1; color: white; background: #e00200; }
.btn a.last{background: #368BD7}
.btn a:hover { color: #fff; background: #f82828; }
.btn a.last:hover{background: #3ba0f8}

.inner{ margin: 15px 0; overflow: hidden;}
.inner h2{height: 32px; margin-top: 20px; font-size: 18px; font-weight: bold; border-bottom: 1px solid #e3e8f6}
.inner h2 span{ display: block; width: 100px; height: 31px; color: #011B65; text-align: center; border-bottom: 2px solid #011B65}
.inner .info { overflow: hidden; margin: 20px 0; line-height: 24px; }

/* .conbox */
.conbox { width: 830px; min-height: 500px; padding-top: 35px; overflow: hidden; }
.conbox h1 { height: 45px; color: #333; font: 24px/45px "Microsoft YaHei"; text-align: center; }
.conbox .time { text-align: center; height: 42px; line-height: 42px; border-bottom: dotted 1px #aaa; }
.conbox .info { overflow: hidden; margin: 20px 0; line-height: 24px; }
.conbox .fanye { padding-top: 10px; line-height: 32px; border-top: dotted 1px #aaa; }
.conbox .fanye strong { color: #011B65; font-weight: bold; }

.conbox .con { overflow: hidden; line-height: 28px; }

/* download */
.downbox { width: 830px; padding-top: 35px;}
.download { overflow: hidden; }
.download li { margin-bottom: 20px; overflow: hidden }
.download li em { float: left; width: 80px; height: 80px; text-align: center; color: #fff; background: #011B65; }
.download li em .fa { line-height: 80px; }
.download li span { display: inline-block; float: left; width: 570px; height: 78px; font-size: 14px; color: #666; line-height: 78px; padding-left: 30px; border-top: 1px solid #e6e6e6; border-bottom: 1px solid #e6e6e6; background: #f2f2f2; overflow: hidden }
.download li a { display: inline-block; float: left; width: 148px; height: 78px; font-size: 14px; color: #333; line-height: 78px; border: 1px solid #e6e6e6; }
.download li a .fa { font-size: 30px; line-height: 78px; padding: 0 18px 0 22px; }
.download li a:hover { color: #1e88e5 }

/*singlepage*/
.topnav { width: 100%; overflow: hidden; background-color: #F7FBFB; box-shadow: inset 0 -1px 0 #e3e3e3; }
.topnav li { float: left; width: 219px; list-style: none; }
.topnav li:first-child { border-left: 1px solid #e3e3e3; }
.topnav a, .topnav span { color: #555; width: 218px; font-size: 16px; text-transform: uppercase; padding: 20px 0; float: left; text-align: center; border-right: 1px solid #e3e3e3; border-bottom: 1px solid #e3e3e3; background-color: #F7FBFB; letter-spacing: .5px; transition: all 0.2s ease-in-out }
.topnav a:hover { color: #1e88e5; background-color: #FFF; }
.topnav .active span { color: #1e88e5; font-weight: bold; background-color: #FFF; border-bottom: 1px solid #FFF; }
.topnav a:after, .topnav span:after { content: ""; clear: both }

.single{min-height: 500px; padding: 40px 0; overflow: hidden;}
.single h1 { font-weight: normal; color: #1c2334; margin-top: 0; margin-bottom: 20px; font-size: 30px; }
.single h1 em { margin-left: 10px; font-size: 26px; }
.single .md { margin: 30px 0; background-color: #FFF; background-image: -webkit-linear-gradient(right, #FFF, #dedede); background-image: linear-gradient(to left, #FFF, #dedede); display: block; height: 1px; width: 100%; }
.single .info { overflow: hidden; margin: 20px 0; line-height: 24px; }

/*.brand*/
.brand{overflow: hidden;}
.brand dl{ width: 830px; margin: 35px 0 25px; }
.brand dl dt{float: left;width: 200px; height: 110px; text-align: center; }
.brand dl dt a,.brand dl dt a img{display: block;}
.brand dl dt a span{display: block; height: 21px; margin-top: 9px; line-height: 21px;}
.brand dl dd{ position: relative; float: right; width: 600px; height: 110px; line-height: 26px;}
.brand dl dd p{ text-indent: 2em}
.brand dl dd a.more { display: block; color: #011b65;height: 21px; line-height: 21px; font-family: Arial; }
.brand dl dd a:hover.more { color: #368bd7 }
.brand dl dd a.more .fa { margin-left: 5px; font-size: 15px; }

/* case */
.case{margin-top: 35px; overflow: hidden;}
.case li{float: left; width: 266px; height: 218px; margin: 0 16px 20px 0; text-align: center;}
.case li a,.case li a img{display: block;}
.case li a span{display: block; height: 21px; margin-top: 9px; line-height: 21px;}

/* contact */
.contact{ margin-top: 35px}

.contact .subtitle { color: #696969; font-weight: normal; font-size: 15px; margin: 0 auto 40px; line-height: 30px; }
.contact .touch{width: 500px;}
.contact .touch h2 { font-size: 18px; text-align: left;  color: #000; font-weight: 400; margin: 0; padding-bottom: 15px; margin: 0; text-transform: uppercase; border-bottom: 1px solid #e7eaf1; }
.contact .touch .bor{ width: 220px; border-bottom: 2px solid #016fc6; text-align: center; margin-bottom: 30px; margin-top: -2px; }
.contact .touch .row{ width: 100%;height: 320px; line-height: 24px; overflow: hidden;}
.contact .msg{width: 550px;}
.contact .msg .pr30{padding-right: 30px;}
.contact .msg .col { float: left; width: 260px;}
.contact .msg .col .colcon { width: 100%; }

#contact-form label { color: #696969; font-size: 13px; display: block; margin-bottom: 10px; font-weight: normal; }
#contact-form input[type="text"] { -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 5px; background-color: #f7f9fc; border: solid 1px #e7eaf1; color: #696969; font-size: 14px; width: 100%; text-indent: 15px; padding: 10px 0; margin-bottom: 15px; }
#contact-form textarea { -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 5px; background-color: #f7f9fc; border: solid 1px #e7eaf1; color: #696969; font-size: 14px; width: 100%; text-indent: 15px; padding: 10px 0; margin-bottom: 20px; height: 120px; }
#contact-form input[type="submit"] { font-size: 12px; color: #fff; font-weight: 400; text-transform: uppercase; display: block; text-align: center; padding: 10px 0; width: 120px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; background-color: #368BD7; border: 0; }
#contact-form input[type="submit"]:hover { background: #3ba0f8; color: #fff; }

.map{width: 100%; height: 500px; margin: 45px 0; overflow: hidden;}

/*page*/
.pagination { clear: both; padding: 10px 0; margin: 10px 0; text-align: center; }
.page { display: inline-block; *display: inline; *zoom: 1; font-size: 12px; border-radius: 3px; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05); }
.page li { list-style: none; display: inline; float: left; line-height: 1em; text-decoration: none; border: 1px solid #ddd; border-left-width: 0; }
.page li a { display: inline-block; padding: .8em; background-color: #f9f9f9; color: #999; }
.page li a:link { background: #fff; color: #4C78A5; }
.page li a:hover { text-decoration: none; }
.page li a:link:hover { color: #000; }
.page li.thisclass { padding: .8em; background-color: #368bd7; color: #fff; }
.page li.thisclass a { padding: 0; background-color: #368bd7; color: #fff; }
.page li:first-child { border-left-width: 1px; border-radius: 3px 0 0 3px; padding: .8em; }
.page li:first-child a { padding: 0; }
.page li:last-child { border-radius: 0 3px 3px 0; padding: .8em; }
.page li:last-child a { padding: 0; }
.page .pageinfo { color: #444; }

/* Validform */
.Validform_checktip{ margin-left:8px; line-height:20px; height:20px; overflow:hidden; color:#999; font-size:12px; }
.Validform_right{ color:#71b83d; padding-left:20px; background:url(../images/right.png) no-repeat left center; }
.Validform_wrong{ color:red; padding-left:20px; white-space:nowrap; background:url(../images/error.png) no-repeat left center; }
.Validform_loading{ padding-left:20px; background:url(../images/onLoad.gif) no-repeat left center; }
.Validform_error{ background-color:#ffe7e7; }
#Validform_msg{ color:#7d8289; font: 12px/1.5 tahoma, arial, \5b8b\4f53, sans-serif; width:280px; -webkit-box-shadow:2px 2px 3px #ccc; -moz-box-shadow:2px 2px 3px #ccc; background:#fff; position:absolute; top:0px; right:50px; z-index:99999; display:none; filter: progid:DXImageTransform.Microsoft.Shadow(Strength=3, Direction=135, Color='#999999'); }
#Validform_msg .iframe{ position:absolute; left:0px; top:-1px; z-index:-1; }
#Validform_msg .Validform_title{ line-height:25px; height:25px; text-align:left; font-weight:bold; padding:0 8px; color:#fff; position:relative; background-color:#011B65; }
#Validform_msg a.Validform_close:link,#Validform_msg a.Validform_close:visited{ line-height:22px; position:absolute; right:8px; top:0px; color:#fff; text-decoration:none; }
#Validform_msg a.Validform_close:hover{ color:#cc0; }
#Validform_msg .Validform_info{ padding:8px; border:1px solid #011B65; border-top:none; text-align:left; }