/* main */
.conter { zoom: 1; }

/* slide */
.slide { position: relative; width: 100%; height: 450px; overflow: hidden;}
.slide .hd { width: 100%; position: absolute; bottom: 10px; text-align: center; font-size: 0; z-index: 1; }
.slide .hd li { display: inline-block; *display: inline; width: 20px; height: 22px; margin: 0 5px; cursor: pointer; overflow: hidden; background: url(../images/dot.png) no-repeat 0 -22px; zoom: 1; }
.slide .hd li.on { background-position: 0 0; }
.slide .bd { position: relative; z-index: 0; overflow: hidden; }
.slide .bd li { width: 100% !important; height: 450px; overflow: hidden; text-align: center; }
.slide .bd li img { position: absolute; left: 50%; top: 0; width: 1920px; height: 450px; margin-left: -960px; }
.slide .prev, .slide .next { display: none; position: absolute; top: 0; width: 72px; height: 450px; z-index: 1; }
.slide .prev { left: 0; }
.slide .next { right: 0; }
.slide .prev:before, .slide .next:before { content: ''; position: absolute; display: block; top: 50%; width: 32px; height: 55px; margin-top: -27px; background: url(../images/btn.png) no-repeat; background-size: 32px 294px; }
.slide .prev:before { background-position: 0 0; left: 20px; }
.slide .next:before { background-position: 0 -158px; right: 20px; }
.slide .prev:hover:before { background-position: 0 -69px; }
.slide .next:hover:before { background-position: 0 -239px; }

/* app */
.app { height: 300px; overflow: hidden; }
.app h2 { position: relative; height: 80px; padding-top: 10px; text-align: center; font: bold 28px/30px "Microsoft YaHei"; color: #2c3035; }
.app h2:before, .app h2:after { position: absolute; display: block; font: normal normal normal 16px/1 "FontAwesome"; font-size: 28pt; text-rendering: auto; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
.app h2:before { content: "\f10d"; top: 0; left: 45px; }
.app h2:after { content: "\f10e"; bottom: 0; right: 45px; }
.app h2 span { letter-spacing: 1px; }
.app h2 p { line-height: 50px; font-size: 14px; color: #666; font-weight: normal;}
.app ul { width: 1100px; margin-top: 20px; }
.app ul li { float: left; overflow: hidden; text-align: center; text-align: center; height: 190px; width: 120px; margin-left: 76px; }
.app ul li p { width: 100%; height: 120px; overflow: hidden; position: relative; margin-bottom: 10px; }
.app ul li img { width: 120px; height: 120px; position: absolute; z-index: 2; transform: rotateY(0deg); transition: all 0.6s ease 0s; backface-visibility: hidden; left: 50%; margin-left: -60px; }
.app ul li .img2 { transform: rotateY(-180deg); z-index: 1; }
.app ul li:hover .img1 { transform: rotateY(180deg); }
.app ul li:hover .img2 { transform: rotateY(0deg); }
.app ul h3 { height: 48px; font-family: "Microsoft YaHei"; font-size: 16px; color: #2c3035; }
.app ul h3 span { font: normal 14px/14px Helvetica, Arial, sans-serif; -webkit-transform: scale(0.8); -o-transform: scale(1); display: inline-block; color: #666; }
.app ul i { display: block; margin-top: 5px; color: #1e88e5; font-size: 1.2em; font-weight: 600; visibility: hidden; }
.app ul li:hover i { visibility: visible; }
.app ul li:hover h3, .app ul li:hover h3 span { color: #1e88e5; }

/* title */
.title h2 { font-size: 36px; line-height: 1.4em; color: #000; text-align: center; }
.title h3 { width: 300px; margin: 6px auto 0; background: url(../images/title_bg.jpg) left center repeat-x; text-align: center; }
.title h3 span { padding: 0 17px; color: #333; font-size: 16px; background: #fff; }

/* case */
.case { position: relative; z-index: 1;}
.case .hd { zoom: 1; }
.case .hd a { position: absolute; top: 50%; width: 38px; height: 38px; margin-top: -20px; color: #ccc; border: 1px solid #ccc; text-align: center; z-index: 2; cursor: pointer; font-size: 18px; line-height: 38px; -webkit-transition: all 0.3s ease-in-out; }
.case .hd a.next { left: -60px; }
.case .hd a.prev { right: -60px; }
.case .hd a:hover.next, .case .hd a:hover.prev { border-color: #1e88e5; background: #1e88e5; color: #fff; }
.case .bd { width: 100%; overflow: hidden; }
.case .bd ul { width: 100%; padding-top: 10px !important; zoom: 1; }
.case .bd ul li { position: relative; float: left; width: 252px; margin-top: 0px; margin-right: 28px; padding: 20px 0px 30px 0px; border: 1px solid #ccc; text-align: center; -webkit-transition: all 0.3s ease-in-out; }
.case .bd ul li:hover { margin-top: -10px; border: 1px solid #1e88e5; }
.case .bd ul li a { display: block; cursor: pointer; }
.case .bd ul li img { display: block; width: 200px; height: 160px; margin: 0 auto; padding: 10px 0;}
.case .bd ul li span { display: block; color: #2c3035; padding: 10px 0 31px; }
.case .bd ul li i { display: block; width: 40px; height: 3px; margin: 0 auto; background: #2c3035; -webkit-transition: all 0.3s ease-in-out; }
.case .bd ul li:hover i { background: #1e88e5; }

/* products */
.probox{ padding: 40px 0; background: #2c3035; overflow: hidden;}

.probox .title h2 { color: #fff; }
.probox .title h3 { background: url(../images/title_bg_w.jpg) left center repeat-x;}
.probox .title h3 span { color: #fff; background: #2c3035; }

.probox .hd { overflow: hidden; background: url(../images/title_bg.jpg) repeat-x bottom; padding-top: 35px; text-align: center }
.probox .hd a { display: inline-block; *display: inline; *zoom: 1; margin: 0px 15px; border-bottom: 2px solid #212427; font-size: 16px; color: #8192a6; height: 40px; line-height: 40px; vertical-align: middle; -webkit-transition: all 0.3s ease-in-out; }
.probox .hd a:hover, .probox .hd a.on { color: #1e88e5; border-bottom: 2px solid #1e88e5; }

.prolist { display: none; padding-top: 40px; overflow: hidden;}
.prolist li { float: left; overflow: hidden; width: 250px; margin: 0 32px 30px 0; border-bottom: 2px solid #707c8a; padding-bottom: 12px; text-align: left; position: relative; -webkit-transition: all 0.3s ease-in-out; }
.prolist li a { display: block; cursor: pointer; }
.prolist li h4 { font-size: 14px; color: #707c8a; padding: 5px 0 0; -webkit-transition: all 0.3s ease-in-out; background: url(../images/jt.png) no-repeat center right; }
.prolist li:hover { border-bottom: 2px solid #1e88e5; }
.prolist li:hover h4 { color: #fff; background: url(../images/jt_w.png) no-repeat center right; }

.prolist h5 { height: 35px; line-height: 35px; margin-top: 10px; vertical-align: middle; border: 1px solid #707c8a; text-align: center; -webkit-transition: all 0.3s ease-in-out; }
.prolist h5 a { display: block; text-transform: uppercase; font-size: 14px; color: #707c8a; -webkit-transition: all 0.3s ease-in-out; }
.prolist h5 a em { padding-left: 5px; }
.prolist h5:hover { border-color: #1e88e5; background: #1e88e5 }
.prolist h5:hover a { color: #fff; }

.cover { position: absolute; top: 0px; left: 0px; width: 250px; height: 250px; background: rgba(30, 136, 229, 0.8); text-align: center; filter: alpha(opacity=0); -moz-opacity: 0; -khtml-opacity: 0; opacity: 0; }

/* about */
.about .fl { width: 480px; text-align: left; margin-top: 50px; overflow: hidden; }
.about .fl h2 { background: url(../images/lan.jpg) no-repeat left bottom; font-size: 18px; color: #484848; padding-bottom: 20px; margin-bottom: 20px; }
.about .fl p { font-size: 12px; color: #666; line-height: 24px; }
.about .fl a { display: block; width: 120px; height: 30px; margin-top: 40px; line-height: 30px; text-align: center; vertical-align: middle; background: #2c3035; color: #fff; text-transform: uppercase; -webkit-transition: all 0.3s ease-in-out; }
.about .fl a em { padding-left: 5px; }
.about .fl a:hover { background: #1e88e5; }
.about .fr { width: 457px; height: 285px; margin-top: 40px; padding: 20px 63px 39px 72px; overflow: hidden; background: url(../images/sy_about.png) no-repeat; }

.tabbox { background: #eee }
.tabbox .hd { height: 35px; padding-bottom: 20px; background: #fff }
.tabbox .hd ul { text-align: center; }
.tabbox .hd ul li { position: relative; display: inline-block; width: 145px; height: 35px; line-height: 35px; background: #eee }
.tabbox .hd ul li.on:before { content: ''; display: block; position: absolute; bottom: -20px; left: 65px; width: 0; height: 0; font-size: 0; border: 10px solid #fff; border-color: transparent transparent #eee; border-width: 14px 10px; }
.tabbox .hd ul li a { display: block; color: #2c3035; }
.tabbox .hd ul li a .fa { padding-right: 15px; font-size: 20px; vertical-align: middle; }
.tabbox .hd ul li.on { background: #1e88e5 }
.tabbox .hd ul li.on a { color: #fff; }

.tabbox .bd { min-height: 340px; }
.tabbox .bd ul { position: relative; display: none; width: 100%; }

.tabbox .bd ul li { float: left; width: 266px; height: 200px; margin-left: 12px; }
.tabbox .bd ul li .pic { position: relative; display: block; width: 266px; height: 200px; }
.tabbox .bd ul li img { width: 266px; height: 200px; }
.tabbox .bd ul li h3 { position: absolute; left: 0; bottom: 0; width: 266px; height: 40px; line-height: 40px; text-align: center; background: rgba(0, 0, 0, 0.6); color: #fff; -webkit-transition: all 0.3s ease-in-out; }
.tabbox .bd ul li.on h3 { display: none; }
.tabbox .bd ul li .mask { position: absolute; left: 0; top: 0; width: 266px; height: 200px; background: url(../images/mask.png) no-repeat; filter: alpha(opacity=0); -moz-opacity: 0; -khtml-opacity: 0; opacity: 0; -webkit-transition: all 0.3s ease-in-out; }
.tabbox .bd ul li.on .mask { filter: alpha(opacity=100); -moz-opacity: 1; -khtml-opacity: 1; opacity: 1; }
.tabbox .bd ul li .content { position: absolute; left: 0; top: 240px; display: none; width: 100%; }
.tabbox .bd ul li.on .content { display: block; }
.tabbox .bd ul li .content h4 { line-height: 31px; font-size: 18px; color: #2c3035; text-align: center; font-weight: bold; }
.tabbox .bd ul li .content p { color: #666; text-align: center; line-height: 24px; }
.tabbox .bd ul li .content .more { display: block; width: 80px; height: 25px; margin: 20px auto 0; line-height: 25px; font-size: 12px; text-align: center; color: #FFF; background-color: #2c3035; text-transform: uppercase; -webkit-transition: all 0.3s ease-in-out; }
.tabbox .bd ul li .content .more:hover { background: #1e88e5; }
.tabbox .bd ul li.h340 { width: 248px; margin-left: 36px; }
.tabbox .bd ul li.h340 h3{ width: 248px;}
.tabbox .bd ul li.h340 .mask { background-image: url(../images/mask340.png);}
.tabbox .bd ul li.h340 .pic, .tabbox .bd ul li.h340 img, .tabbox .bd ul li.h340 .mask { width: 248px; height: 340px; }

/* contact */

.contact{ height: 618px; padding-top:60px; background:url(../images/map.jpg) no-repeat center; overflow:hidden;}

.form { overflow: hidden; width: 570px; height: 618px; margin: auto; text-align: center; background: url(../images/ly_bj.png) no-repeat center; }
.form .title { padding: 40px 0 30px; }
.form_input { width: 420px; margin: 0 auto; padding-bottom: 15px; overflow: hidden; }
.form_input p { float: left; width: 65px; color: #191919; line-height: 35px; vertical-align: middle; }
.form_input input { float: left; width: 290px; height: 35px; margin-right: 25px; padding: 0px 15px; border: none; background: #e3eaeb; outline: medium none; vertical-align: middle; -webkit-transition: all 0.3s ease-in-out; }
.form_input textarea { float: left; width: 290px; height: 110px; border: none; background: #e3eaeb; outline: medium none; padding: 15px; -webkit-transition: all 0.3s ease-in-out; }
.form button { width: 190px; height: 35px; margin-bottom: 65px; outline: medium none; line-height: 35px; border: none; text-align: center; color: #fff; font-size: 14px; cursor: pointer; background: #2c3035; font-family: "Microsoft YaHei"; -webkit-transition: all 0.3s ease-in-out; }
.form button:hover { background: #1e88e5; }
.form h4 { font-size: 12px; color: #5a5a5a; line-height: 26px; }
.form h4 .fa { margin-right: 10px; color: #1e88e5; font-size: 14px; }
.form h4 .fa-size { font-size: 20px; }

/* news */
.news{width: 774px; height: 422px; overflow: hidden;}

.news .hd { height: 40px; padding-bottom: 20px }
.news .hd li { position: relative; float: left; display: block; width: 258px; height: 40px; line-height: 40px; text-align: center; background: #eee }
.news .hd li a { display: block; width: 258px; height: 40px; color: #2c3035; font-size: 18px }
.news .hd li a em { margin-left: 10px; font-size: 14px }
.news .hd li.on { background: #1e88e5 }
.news .hd li.on a { color: #fff }
.news .hd li.on:before { content: ''; display: block; position: absolute; bottom: -20px; left: 122px; width: 0; height: 0; font-size: 0; border: 10px solid #fff; border-color: #1e88e5 transparent transparent; border-width: 10px 6px; }

.newslist dl { overflow: hidden; }
.newslist dl dt { float: left; }
.newslist dl dt img { display: block; }
.newslist dl dd { padding-left: 283px; padding-top: 14px; }
.newslist dl dd h3 { font-weight: normal; height: 20px; line-height: 20px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.newslist dl dd h3 a { font-size: 16px; color: #2c3035; }
.newslist dl dd h3 a:hover { color: #1e88e5; }
.newslist dl dd p { height: 60px; margin-top: 12px; line-height: 20px; color: #666; font-size: 12px; text-indent: 2em }
.newslist dl dd .smore { display: block; margin-top: 23px; width: 75px; height: 25px; line-height: 25px; text-align: center; font-size: 12px; background: #2c3035; color: #fff; -webkit-transition: all 0.3s ease-in-out;}
.newslist dl dd .smore:hover { background: #1e88e5; }

.newslist ul { width: 774px; overflow: hidden; }
.newslist li { float: left; width: 380px; margin: 20px 14px 0 0; overflow: hidden; }
.newslist li a { display: block; cursor: pointer; }
.newslist li .time { display: block; float: left; width: 72px; height: 72px; text-align: center; color: #fff; background-color: #2c3035; border-radius: 4px 0 0 4px; -webkit-transition: all 0.3s ease-in-out;}
.newslist li .time span { display: block; margin-top: 5px; font: normal 32px/35px sans-serif; }
.newslist li .time em { display: block; line-height: 20px; font-size: 12px; }
.newslist li .tit { height: 72px; padding: 0 10px; overflow: hidden; border-radius: 0 4px 4px 0; }
.newslist li .tit h3 { height: 35px; padding-top: 5px; line-height: 35px; font-size: 18px; color: #2c3035; }
.newslist li .tit p { line-height: 26px; font-size: 12px; color: #666 }
.newslist li a:hover .time { background: #1e88e5; }
.newslist li a:hover .tit h3 { color: #1e88e5; }

/* ask */
.ask { width: 290px; height: 422px; overflow: hidden; }
.ask h2 { font-weight: normal; border-bottom: 2px solid #eee; height: 38px; margin-bottom: 20px; padding: 0 11px; font: 18px/28px "Microsoft Yahei", Helvetica, Arial, sans-serif; color: #2c3035; background: url(../images/line.gif) no-repeat left top; }
.ask h2 span { margin-left: 10px; height: 28px; font-size: 16px; color: #666; }
.ask dl { padding: 14px 0; border-bottom: 1px dotted #eee; }
.ask dl dt { height: 30px; line-height: 30px; background: url(../images/wen.gif) no-repeat left 6px; padding-left: 26px; }
.ask dl dt a { color: #2c3035; }
.ask dl dt a:hover { color: #1e88e5 }
.ask dl dd { line-height: 22px; font-size: 12px; background: url(../images/da.gif) no-repeat left 2px; padding: 0 0 0 26px; }
.ask .more { display: block; width: 120px; height: 30px; margin-top: 23px; line-height: 30px; text-align: center; vertical-align: middle; background: #2c3035; color: #fff; text-transform: uppercase; -webkit-transition: all 0.3s ease-in-out; }
.ask a.more:hover { background: #1e88e5 }

/*==========以下部分是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 #aaa; -moz-box-shadow:2px 2px 3px #aaa; 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:#2c3035; }
#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 #2c3035; border-top:none; text-align:left; }