﻿@charset "utf-8";
/* CSS Document */
body{  }
.container{width: 100%; height:100%;  box-sizing: border-box; padding-left:336px;}
/*.header{ width:100%; box-sizing: border-box; padding:15px 20px; position: relative;  display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: space-between; align-items: center; z-index: 1200; background-color:#1b3271; display: none;animation: fadeInDown 0.5s ease-in-out; -webkit-animation: fadeInDown 0.5s ease-in-out;}
.header > .logo{ display: block; width: 160px; }
.header > .logo > img{ width: 100%; }
.btnMenu,.search{ width:24px; z-index: 1000;}
.btnMenu{ width: 80px;  background-color: rgba(255,255,255,0.01);}
.btnMenu > img,.search > img{ width:100%; transition: all 0.5s linear; -webkit-transition: all 0.5s linear; }
.search{  margin-left: 56px; }
.search > img:nth-of-type(1){ display: block; }
.search > img:nth-of-type(2){ display: none; }
.sechActive > img:nth-of-type(2){ display: block; }
.sechActive > img:nth-of-type(1){ display: none; }*/

.aside{  width:336px; z-index: 1600; height: 100%; background-color: #1b3271;  display: flex; box-sizing: border-box;  flex-direction: column; flex-wrap: nowrap; justify-content: flex-start; align-items: flex-start;  position: fixed; left:0;top:0;}
.aside > .logo{ display: block; width: 100%; box-sizing: border-box; padding:15% 25%; flex-shrink: 0; }
.aside > .logo > img{ width: 100%; }
.asideScroll{ width: 100%; height: 100%; box-sizing: border-box; padding:3% 0; position: relative;}


.asideOnline{ width: 100%; box-sizing: border-box; padding:5%; flex-shrink: 0;  position: absolute; left:0; bottom:0; margin-top: 15%;}
.asideOnline > .QRcode{ width: 100%; color: #FFF }
.asideOnline > .QRcode > p{ width: 30%;margin:0 auto; overflow: hidden; }
.asideOnline > .QRcode > p > img{ width: 100%; }
.asideOnline > .QRcode > h3{ font-weight: 550; line-height: 3; text-transform: uppercase; font-size: 14px;text-align: center; text-decoration: underline; }
.asideOnline > .olCopyright{ width: 100%; line-height: 1.6; font-size: 14px; color: rgba(255,255,255,0.4); text-align: center; margin-top: 3%;}
.asideOnline > .olCopyright a{color: rgba(255,255,255,0.4);}

.main{ width: 100%;  height: auto;  overflow: hidden;}
.banner{ width: 100%; overflow: hidden; position: relative; }
.banner > img{ width: 100%; }
.banner > div{ width: 100%; height: 100%; position: absolute; left:0; top:0; box-sizing: border-box; padding:5%; display: flex; flex-direction: column; flex-wrap: nowrap; justify-content: center; align-items: flex-start; }
.banner > div > h3,.banner > div > p{ width: 100%; color: rgba(255,255,255,0.8); text-transform: uppercase; line-height: 1.6; }
.banner > div > h3{ font-family: 'Impact'; font-weight: bold; font-size: 50px; }
.banner > div > p{ font-size: 32px; }
.colDJHot{ width: 100%; }
.djHotTab{ width: 100%; box-sizing: border-box; padding:5% 6% 0 6%; text-align: left; }
.djHotTab > p{ display: inline-block; font-size: 20px; line-height:3; padding:0 5%; color: #333; cursor: pointer; background-color: #f5f5f5; margin-right: 2%;  }
.djHotTab > p a{display: inline-block; color: #333;  }
.djHotTab > p.active{ background-color: rgba(201,4,0,1); color: #FFF; }
.djHotTab > p.active a{color: #FFF; }
.djHotTab > p.active a:hover{color: #FFF; }
.djHotMain{ width: 100%; box-sizing: border-box; padding:5% 6%; position: relative;}
.djHotMain::before{ content: ' '; width:100%; background-color: #f9f9f9; height: 60%; position: absolute; left:0; bottom:0; z-index: 310; }
.djHotMain > .djHotItem{ width: 100%; display: none; flex-direction: row-reverse; flex-wrap: nowrap; justify-content: space-between; align-items: stretch; position: relative; z-index: 360; box-sizing: border-box; padding-right:3%;}
.djhi-left{ width: 100%; display: flex; flex-direction: column; flex-wrap: nowrap; justify-content: space-between; align-items: flex-start; box-sizing: border-box; padding-right:4%; padding-left:3%;animation: fadeInLeft 0.5s ease-in-out; -webkit-animation: fadeInLeft 0.5s ease-in-out;}
.djHotMain > .djHotItem:nth-of-type(2){ display: none !important; }
.djHotMain > .djHotItem:nth-of-type(3){ display: none !important; }
.djhi-header{ width: 100%; font-weight: 550; color: #ededed; font-size: 90px; text-transform: uppercase; text-align: left; flex-shrink: 0; margin-bottom: 8%; }
.djhi-about{ width: 100%; flex: 1; display: flex; flex-direction: column; flex-wrap: nowrap; justify-content: space-around; align-items: flex-start; }
.djhi-about > h4,.djhi-about > h3,.djhi-about > div,.djhi-about > p{ width: 100%; font-weight: normal; font-size: 20px; line-height: 1.8; text-align: left;}
.djhi-about > h4{ color: #c90400; order:1;}
.djhi-about > h3{ order:2; }
.djhi-about > div{ font-size: 16px; line-height: 2;margin-top: 3%; margin-bottom: 3%; color: #999; order:3;}
.djhi-about > p{ font-size: 16px; text-align: left; order:4;}
.djhi-about > p > a{ display: inline-block; padding:0 5%; line-height: 2.5; background-color: rgba(201,4,9,1); color: #FFF !important; transition: all 0.5s linear; -webkit-transition: all 0.5s linear;}
.djhi-about > p > a:hover{ background-color: rgba(201,4,9,0.8) }
.djhi-img{ width: 48%; overflow: hidden; display: block; flex-shrink: 0;animation: fadeInRight 0.5s ease-in-out; -webkit-animation: fadeInRight 0.5s ease-in-out;}
.djhi-img > img{ width: 100%; }
.colDJList{ width: 100%; box-sizing: border-box; padding:5% 9% 5% 8%; }
.colDJList > ul > li{ width: 100%; box-sizing: border-box; padding-top: 2%; padding-bottom: 2%; border-bottom: 1px solid #d2d2d2; display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: space-between; align-items: stretch; }
.colDJList > ul > li:nth-of-type(1){ border-top: 1px solid #d2d2d2; }
.djItem-img{ display: block; width: 200px; overflow: hidden; flex-shrink: 0; }
.djItem-img > img{ width: 100%; }
.djItem-about{ width: 100%; box-sizing: border-box; padding:0 15% 0 3%; display: flex; flex-direction: column; flex-wrap: nowrap; justify-content: space-around; align-items: flex-start;}
.djItem-about > h3,.djItem-about > p,.djItem-about > h4{ width: 100%; font-weight: normal; line-height: 1.6; text-align: left; font-size: 18px;}
.djItem-about > p{ height: auto; max-height: 48px; overflow: hidden; line-height: 24px; font-size: 14px; color: #999; }
.djItem-about > h4{ height: 24px; line-height: 24px; color: #999; font-size: 14px; margin-top: 5px; display: none; }
.djItem-aside{ flex-shrink: 0; display: flex; flex-direction: column; flex-wrap: nowrap; justify-content: flex-start; align-items: flex-end;}
.djItem-aside > div{ display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: flex-start; align-items: center; }
.djItem-aside > div > p{ height: 2px; width: 30px;  margin-right:20px; background-color: #ededed }
.djItem-aside > div > h3{ height: 30px; line-height: 30px; font-weight: normal; font-size: 15px; }
.djItem-aside > a{ display: block; width: 24px; height: 24px; line-height: 24px; border-radius: 50%; background-color: rgba(201,4,0,1); color: #FFF !important; text-align: center; margin-top: 5%;}
.djItem-aside > a > i{ font-size: 12px; }
.resultForm{ width: 100%; box-sizing: border-box; padding:0 9% 0 8%; margin-top: 5%; }
.resultForm > section{ height: auto; background-color: #f7f7f7; padding-top: 10px; padding-bottom: 10px;}
.resultForm > section > div{ width: 36%; height: 42px; box-sizing: border-box; border:1px solid #dcdcdc; background-color: #FFF;margin:0 auto; display: flex; padding-left:10px; background-color: #FFF;}
.resultForm > section > div > p:nth-of-type(1){ width: 100%; height: 40px; animation: fadeInLeft 0.5s ease-in-out; -webkit-animation: fadeInLeft 0.5s ease-in-out;}
.resultForm > section > div > p:nth-of-type(1) > input{ width: 100%; height: 40px; border:0; color: #FFF; background-color: transparent; font-size: 14px; }
.resultForm > section > div > p:nth-of-type(2){ width:60px; height: 40px; flex-shrink: 0; animation: fadeInRight 0.5s ease-in-out; -webkit-animation: fadeInRight 0.5s ease-in-out; box-sizing: border-box; border-left:1px solid #dcdcdc;}
.resultForm > section > div > p:nth-of-type(2) > input{ width: 100%; height: 40px; border:0; background-color: transparent; color: #2968ab; font-size: 20px; font-family:"iconfont" !important; }

.pages{ width: 100%; text-align: center; padding-bottom: 6%; }
.pages  li{display: inline-block;font-size: 16px;margin-top: 10px;}
.pages  li a{ display: inline-block; margin:0 5px; padding:0 10px; height: 30px; line-height: 30px; line-height: 30px;color: #333;}
.pages  li a:hover,.pages  li.active{ background-color: #00a0e9; color: #FFF !important; }
.djPages li:hover,.djPages li.active{background-color: rgba(201,4,0,1);}

/*.footer{ width: 100%; box-sizing: border-box; padding:10px; background-color: #f2f1f9; display: none;animation: fadeInUp 0.5s ease-in-out; -webkit-animation: fadeInUp 0.5s ease-in-out;}
.footer section,.footer aside{ width: 100%; font-size: 14px; line-height: 24px; text-align: center; color: #333;}
.footer section{ color: #999; }
.float{ position: fixed; width: 200px; left:0; top:0; z-index: 1600; height: 100%; background-color: #1b3271;  display: none; box-sizing: border-box; padding:20px; flex-direction: column; flex-wrap: nowrap; justify-content: space-between; align-items: flex-start; animation: fadeInLeft 0.5s ease-in-out; -webkit-animation: fadeInLeft 0.5s ease-in-out;}
.float .close{ display: inline-block; background-color: rgba(255,255,255,0.01); color: rgba(255,255,255,0.8) !important; width: 100%; text-align: left; z-index: 1000; height: 50px; background-image: url(../images/btn-close.png); background-repeat: no-repeat; background-position: left center; background-size: 32px auto;}
.float .close > i{ font-size: 24px; display: inline-block; display: none;}
.menu,.menu > ul{ width: 100%;  }
.menu > ul{ margin-top: 8%; }
.menu > ul > li{ width: 100%; }
.menu > ul > li > a{display: flex; padding-top: 6%; padding-bottom: 6%; flex-direction: row; flex-wrap: nowrap; justify-content: center; align-items: center; color: rgba(255,255,255,0.4);transition: all 0.5s linear; -webkit-transition: all 0.5s linear;}
.menu > ul > li > a:hover{ color: #FFF !important; }
.menu > ul > li > div{ width: 100%; display: none; }
.menu > ul > li > div > a{display: flex; width: 100%; height: auto; flex-direction: row; flex-wrap: nowrap; justify-content: center; align-items: center;  color: rgba(255,255,255,0.4); }
.menu > ul > li > div > a > p{ margin-right: 6%;width:0; overflow: hidden; transition: all 0.5s linear; -webkit-transition: all 0.5s linear; display: none;animation: fadeInLeft 0.5s ease-in-out; -webkit-animation: fadeInLeft 0.5s ease-in-out;}
.menu > ul > li  > div > a > h3{ font-weight: normal; font-size: 12px; transition: all 0.5s linear; -webkit-transition: all 0.5s linear; line-height: 2;animation: fadeInRight 0.5s ease-in-out; -webkit-animation: fadeInRight 0.5s ease-in-out; }
.menu > ul > li.active > a{ color: rgba(255,255,255,1) !important; background-color: rgba(25,79,165,1); }
.menu > ul > li > div > a:hover,.menu > ul > li > div > a.active{ color: rgba(255,255,255,1) !important;  }
.menu > ul > li > div > a:hover > p,.menu > ul > li > div > a.active > p{ width:auto; display: block;}
.menu > ul > li.active > a > h3{ animation: fadeInRight 0.5s ease-in-out; -webkit-animation: fadeInRight 0.5s ease-in-out;}
.menu > ul > li.active > div{ display: block; }
.online{ width: 100%; }
.online > .QRcode{ width: 100%; color: #FFF }
.online > .QRcode > p{ width: 30%;margin:0 auto; overflow: hidden; }
.online > .QRcode > p > img{ width: 100%; }
.online > .QRcode > h3{ font-weight: 550; line-height: 3; text-transform: uppercase; font-size: 12px;text-align: center; text-decoration: underline; }
.online > .olCopyright{ width: 100%; line-height: 1.6; font-size: 12px; color: rgba(255,255,255,0.4); text-align: center; margin-top: 3%;}

.box{ width: 100%; height: 100%; background-color: rgba(0,0,0,0.8); position: fixed; left:0; top:0; z-index: 1120; display: none; flex-direction: column; flex-wrap: nowrap; justify-content: center; align-items: center;}
.box .header{ position: fixed; background-color: transparent;justify-content: flex-end; }
.box .menu{ position: absolute; margin-top: -1.4%; top:50%; right: 6%; }
.searchForm{ width: 60%; padding:10px 0 10px 10px; box-sizing: border-box; border-bottom:1px solid #FFF; display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: center; align-items: stretch; animation: fadeIn 0.5s ease-in-out; -webkit-animation: fadeIn 0.5s ease-in-out; }
.searchForm > p:nth-of-type(1){ width: 100%; height: 30px; animation: fadeInLeft 0.5s ease-in-out; -webkit-animation: fadeInLeft 0.5s ease-in-out;}
.searchForm > p:nth-of-type(1) > input{ width: 100%; height: 30px; border:0; color: #FFF; background-color: transparent; font-size: 14px; }
.searchForm > p:nth-of-type(2){ width:80px; height: 30px; flex-shrink: 0; animation: fadeInRight 0.5s ease-in-out; -webkit-animation: fadeInRight 0.5s ease-in-out;}
.searchForm > p:nth-of-type(2) > input{ width: 100%; height: 30px; border:0; background-color: transparent; color: #FFF; font-size: 14px; }*/
.colDown{  width: 90%; background-color:#FFF; box-sizing: border-box; margin:0 auto; padding:2% 4%;}
.downList{ width:100%; margin-bottom: 5%; }
.downList > ul > li{ width: 100%; display: flex; flex-direction: row; justify-content: space-between; align-items: center; padding-top:1.5%; padding-bottom: 1.5%; border-bottom: 1px solid #f3f3f3;}
.downList > ul > li > a{ display: block; font-size: 18px; line-height: 24px; text-align: left; }
.downList > ul > li > span{ font-size: 14px; color: #999; line-height: 24px; flex-shrink: 0; margin-left:3%; align-self: flex-start;}
/*******/
.newsHotTab > p.active,.busiHotTab > p.active{ background-color: rgba(25,79,165,1); }
.busiHotTab > p > a{ color: #333 !important; }
.busiHotTab > p.active > a{ color: #FFF !important; }
.djhi-about > h4.newsHotDate{ color: rgba(25,79,165,1);}
.djhi-about > p > a.newsHotMore{ background-color: rgba(25,79,165,1); }
.djhi-about > p > a.newsHotMore:hover{ background-color: rgba(25,79,165,0.8); }
.busiMain,.busiMain > .busiItem{ width:100%;}
.busiMain > .busiItem > .bi-header{ width: 100%; box-sizing: border-box; padding-top:3%; padding-right:6%; padding-bottom:2%; padding-left:6%;  }
.busiMain > .busiItem > .bi-header > h3,.busiMain > .busiItem > .bi-header > p{ width: 100%; font-weight: 550; font-size: 42px; text-align: left; text-transform: uppercase; line-height: 1.6; color: #ededed; box-sizing: border-box; padding-left:3%;}
.busiMain > .busiItem > .bi-header > h3{animation: fadeInDown 0.5s ease-in-out; -webkit-animation: fadeInDown 0.5s ease-in-out;}
.busiMain > .busiItem > .bi-header > p{ color: #333; animation: fadeInUp 0.5s ease-in-out; -webkit-animation: fadeInUp 0.5s ease-in-out;}
.busiMain > .busiItem > .bi-about,.servMain,.jobAside{ width: 100%; box-sizing: border-box; padding-top:3%; padding-right:6%; padding-bottom:3%; padding-left:6%; background-color: #f9f9f9; }
.busiMain > .busiItem > .bi-about > section{ width:100%; height: auto;  }
.biAboutF1{ width: 100%; display: flex; flex-wrap: nowrap; flex-direction: row; justify-content: space-between; align-items: stretch; }
.biAboutF1 > .baF1-img{ width: 50%; overflow: hidden; animation: fadeInLeft 0.5s ease-in-out; -webkit-animation: fadeInLeft 0.5s ease-in-out;}
.biAboutF1 > .baF1-img > img{ width: 100%; }
.biAboutF1 > .baF1-right{ width: 50%; box-sizing: border-box; padding-left:2%; font-size: 16px; height: 480px; line-height: 32px; overflow: hidden;  text-align: left; animation: fadeInRight 0.5s ease-in-out; -webkit-animation: fadeInRight 0.5s ease-in-out; }
.baF2-img{ width: 100%; overflow: hidden; animation: fadeInLeft 0.5s ease-in-out; -webkit-animation: fadeInLeft 0.5s ease-in-out;}
.baF2-img > img{ width: 100%; }
.baF2-right{ width: 100%; padding:2%; box-sizing: border-box; line-height: 2; font-size: 16px; text-align: left;animation: fadeInRight 0.5s ease-in-out; -webkit-animation: fadeInRight 0.5s ease-in-out;}

.biAboutF3{ width: 100%; display: flex; flex-wrap: nowrap; flex-direction: row-reverse; justify-content: space-between; align-items: stretch; }
.biAboutF3 > .baF3-img{ width: 60%; position: relative;animation: fadeInRight 0.5s ease-in-out; -webkit-animation: fadeInRight 0.5s ease-in-out;}
.servSearch{ width:100%;  overflow: hidden;}
.servSearch > img{ width: 100%; }
.biAboutF3 > .baF3-img > div{ width: 23%; height: 0; padding-top: 33.0%; position: absolute; left:-11.5%; bottom: 0; animation: fadeInUp 0.5s ease-in-out; -webkit-animation: fadeInUp 0.5s ease-in-out;}
.biAboutF3 > .baF3-img > div > img{ width: 100%; height: 100%; position: absolute; left:0; top:0; }
.biAboutF3 > .baF3-right{ width: 40%; box-sizing: border-box; padding-right:10%; padding-top: 5%; padding-left:3%; font-size: 16px; height: auto; line-height: 2; overflow: hidden;  text-align: left; animation: fadeInLeft 0.5s ease-in-out; -webkit-animation: fadeInLeft 0.5s ease-in-out; }

.biAboutF4{ width: 100%; display: flex; flex-wrap: nowrap; flex-direction: row; justify-content: space-between; align-items: stretch; }
.biAboutF4 > .baF4-img{ width: 50%;position: relative; animation: fadeInLeft 0.5s ease-in-out; -webkit-animation: fadeInLeft 0.5s ease-in-out;}
.biAboutF3 > .baF3-img > p{ width:100%;  overflow: hidden;}
.biAboutF4 > .baF4-img > p > img{ width: 100%; }
.biAboutF4 > .baF4-img > div{ width: 23%; height: 0; padding-top: 33.0%; position: absolute; right:-11.5%; bottom: 0;animation: fadeInUp 0.5s ease-in-out; -webkit-animation: fadeInUp 0.5s ease-in-out; }
.biAboutF4 > .baF4-img > div > img{ width: 100%; height: 100%; position: absolute; left:0; top:0; }
.biAboutF4 > .baF4-right{ width: 50%; box-sizing: border-box; padding-right: 3%; padding-top: 5%; padding-left: 10%; font-size: 16px; height: auto; line-height: 2; overflow: hidden;  text-align: left; animation: fadeInRight 0.5s ease-in-out; -webkit-animation: fadeInRight 0.5s ease-in-out; }
/********/
.servSearch{ width:100%;  overflow: hidden; position: relative;}
.servSearch > img{ width: 100%; }
.servSearch > .servSearchMain,.servQA-header{ width: 100%; height: 100%; position: absolute; left:0; top:0; display: flex; flex-direction: column; flex-wrap: nowrap; justify-content: flex-start; align-self: center; box-sizing: border-box; padding:3%; }
.servSearch > .servSearchMain > h3,.servQA-header > h3{ font-weight: 550;  display: inline-block; display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: center; align-self: center; /**/ }
.servSearch > .servSearchMain > h3 > p,.servQA-header > h3 > p{ font-size: 26px; line-height: 2.5; position: relative; border-bottom: 1px solid #CCC; position: relative;}
.servSearch > .servSearchMain > h3 > p::after,.servQA-header > h3 > p::after{ content: ' '; width: 30%; height: 2px; background-color: #194fa5; position: absolute; left:50%; bottom:-2px; margin-left:-15%; }
.servSearch > .servSearchMain > p,.servQA-header > p{ width: 100%; text-align: center; line-height: 2; text-transform: uppercase; color: #999; font-size: 16px; margin-top: 0.6%; }
.servQA{ width: 100%; margin-bottom: 5%; }
.servQA > .servQA-header{ position: initial; display:none;}
.qaMain{ width: 100%; box-sizing: border-box; padding:30px 10px 30px 30px; background-color: #ccdaea; display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: space-between; align-self: flex-start;  }
.qaList{ width: 100%; box-sizing: border-box; padding:3%; background-color: #FFF; height: auto; }
.qaList > ul > li{ width: 100%; margin-bottom: 2%; }
.qaList > ul > li > .qaItem-title{ width: 100%; line-height: 1.5; font-size: 16px; text-align: left; margin-bottom: 20px;}
.qaList > ul > li > .qaItem-title > i{ color: #1593d3; font-size: 16px; }
.qaList > ul > li > .qaItem-answer{ width: 100%; box-sizing: border-box; border:1px solid #dcdcdc; background-color: #f7f7f7; padding:2%; line-height: 24px; font-size: 14px; text-align: left; position: relative;}
.qaList > ul > li > .qaItem-answer::before{ content: ' '; width:0; height: 0; position: absolute; left:10px; top:-14px; border-left: 10px solid transparent; border-right: 10px solid transparent; border-bottom: 14px solid #dcdcdc;}
.qaList > ul > li > .qaItem-answer::after{ content: ' '; width:0; height: 0; position: absolute; left:10px; top:-13px; border-left: 10px solid transparent; border-right: 10px solid transparent; border-bottom: 14px solid #f7f7f7;}
.qaLoadMore{ width: 100%; display: block; box-sizing: border-box; background-color: #f7f7f7; border:1px solid #dcdcdc; font-size: 18px; text-align: center; line-height: 3; color: #333 !important; transition: all 0.5s linear; -webkit-transition: all 0.5s linear;}
.qaLoadMore:hover{ background-color: #1b3271; border:1px solid #1b3271;  color: #FFF !important;}
.qaIcon{ width: 200px; overflow: hidden; margin-left:-10px; align-self: flex-end; flex-shrink: 0; }
.qaIcon > img{ width:100%; }
.servOnline{ width:100%; }
.servOnline::after{ content: ' '; display: block; clear: both; }
.servOnline > ul > li{ width: 50%; float: left; overflow: hidden;  background-color: #84ca2e;transition: all 0.5s linear; -webkit-transition: all 0.5s linear;}
.servOnline > ul > li:nth-of-type(2){background-color: #a78f7e}
.servOnline > ul > li > .soItem-img{ width: 100%; height: 0; padding-top: 70%; position: relative; overflow: hidden; }
.servOnline > ul > li > .soItem-img > img{ width: 100%; height: 100%; position: absolute; left:0; top:0; transition: all 0.5s linear; -webkit-transition: all 0.5s linear; }
.servOnline > ul > li > .soItem-about{ width: 100%; box-sizing: border-box; padding:3% 5%; color: #FFF; text-align: left;}
.servOnline > ul > li > .soItem-about > h3,.servOnline > ul > li > .soItem-about > div,.servOnline > ul > li > .soItem-about > h4,.servOnline > ul > li > .soItem-about > p{ width: 100%; line-height: 30px; height: 30px; font-size: 24px; font-weight: normal; line-height: 30px; overflow: hidden; }
.servOnline > ul > li > .soItem-about > div{ font-size: 14px;  }
.servOnline > ul > li > .soItem-about > h4{ font-size: 22px; font-weight: 550; }
.servOnline > ul > li > .soItem-about > p{ text-align: left; margin-top: 10px;}
.servOnline > ul > li > .soItem-about > p > a{ width: 80px; height: 30px; line-height: 30px; display: block; font-size: 14px; background-color: #FFF; border-radius: 2px; color: #333 !important; text-align: center;}
.servOnline > ul > li:hover > .soItem-img > img{ transform: scale(1.05); -webkit-transform: scale(1.05); }
.servOnline > ul > li:hover{  background-color:#1b3271;}
/*******/
.banner > div.bannerJob{ height: auto; flex-direction: row; flex-wrap: nowrap; justify-content: flex-start; align-items: center; padding:3%;}
.banner > div.bannerJob > a{ display: block; width: 25%;}
.banner > div.bannerJob > a > img{ width: 100%; }
.banner > div.bannerJob > p{ width:auto; flex-shrink: 0; padding:0 50px; }
.jobAside{  display: flex; flex-direction: row-reverse; flex-wrap: nowrap; justify-content: space-between; align-self: center;padding-bottom:0%; }
.jobOnline{ display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: flex-start; align-items: center; }
.jobOnline > p{ width: 120px; overflow: hidden; flex-shrink: 0; margin-right: 10px; }
.jobOnline > p > img{ width: 100%; }
.jobOnline > h3{ width: 160px; font-weight: normal; font-size: 14px; line-height: 30px; text-align: left; color: #999; }
.jobTool{  }
.jobTool > ul > li{ float: left; margin-left:10px; }
.jobTool > ul > li > a{ display: flex; flex-direction: column; flex-wrap: nowrap; justify-content: center; align-items: center; box-sizing: border-box; height: 120px; box-sizing: border-box; padding:0 60px; border-radius: 4px; background-color: #97c355;  color: #FFF !important;transition: all 0.5s linear; -webkit-transition: all 0.5s linear;}
.jobTool > ul > li:nth-of-type(2) > a{ background-color: #1a82d2; }
.jobTool > ul > li > a > p{ width: 80px; margin:0 auto; box-sizing: border-box; padding:0 10px;}
.jobTool > ul > li > a > p img{ width: 100%; transition: all 0.5s linear; -webkit-transition: all 0.5s linear; }
.jobTool > ul > li > a > h3{ font-weight: normal; font-size: 16px;}
.jobTool > ul > li > a:hover{ border-radius: 12px; transform: translateY(-10px); -webkit-transform: translateY(-10px);}
.jobTool > ul > li > a:hover > p img{ transform: scale(1.1,1.1); -webkit-transform: scale(1.1,1.1); }
.jobTool > ul > li > a:hover > h3{ font-weight: 550; }
/*******/
.joinAbout,.joinActive{ width: 100%; box-sizing: border-box; padding:8% 9% 8% 8%; background-image: url(../images/emp-22.png); background-size: 100% 100%; background-position: center center; background-repeat: no-repeat; }
.JAMain{ width: 100%; height: auto; box-sizing: border-box; display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: flex-start; align-self: stretch; }
.JAMain > .JAAbout{ width: 100%; display: flex; flex-direction: column; flex-wrap: nowrap; justify-content: flex-start; align-self: flex-start; }
.JAMain > .JAAbout > h3{ width: 100%; text-align: left; color: #5581fd; font-weight: 550; font-size: 42px; }
.JAMain > .JAAbout > div{ width: 100%; font-size: 16px; line-height: 24px; margin-top: 3%; }
.JAMain > .JAItem{ width: 22%; margin-left:2%; background-color: #f2f2f2; flex-shrink: 0;transition: all 0.5s linear; -webkit-transition: all 0.5s linear; cursor: pointer;}
.JAMain > .JAItem > .JAItemImg{ width: 100%; height: 0; padding-top: 66.7%;position: relative; overflow: hidden; }
.JAMain > .JAItem > .JAItemImg img{ width: 100%; height: 100%; position: absolute; left:0;top:0;  transition: all 0.5s linear; -webkit-transition: all 0.5s linear;}
.JAMain > .JAItem > .JAItemAbout{ width: 100%;box-sizing: border-box; padding: 5%; transition: all 0.5s linear; -webkit-transition: all 0.5s linear; background-image: url(../images/icon-logo.png); background-repeat: no-repeat; background-position: right bottom; background-size: 40% auto;}
.JAMain > .JAItem > .JAItemAbout > h3{ font-weight: 550; font-size: 18px; height: 30px; line-height: 30px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;text-align: left; }
.JAMain > .JAItem > .JAItemAbout > h3 > a{ color: #194fa5 !important;transition: all 0.5s linear; -webkit-transition: all 0.5s linear; }
.JAMain > .JAItem > .JAItemAbout > div{ width: 100%; height: 144px; line-height: 24px; text-align: left; font-size: 14px; overflow: hidden; }
.JAMain > .JAItem:hover{ background-color: #194fa5; }
.JAMain > .JAItem:hover > .JAItemImg img{ transform: scale(1.05,1.05); -webkit-transform: scale(1.05,1.05); }
.JAMain > .JAItem:hover > .JAItemAbout,.JAMain > .JAItem:hover > .JAItemAbout > h3 > a{ color: #FFF !important; }
.JAActive-header{ width: 100%; padding-top: 2%; padding-bottom: 2%; text-align: center; font-size: 28px; color: #194fa5; font-weight: 550; }
.joinActive{ background-color: #f2f2f2; background-image: url(none); padding-top: 3%;padding-bottom: 3%; }
.joinFlash{ width:100%; position: relative; overflow: hidden; }
.swiper2{ width: 100% !important; padding-bottom: 40px;}
.swiper2 .swiper-pagination { display:inline-block;  padding-top:2%; padding-bottom:10px; bottom:0; text-align:center; padding-right:10px; box-sizing:border-box; width:100%;  }
.swiper2 .swiper-pagination-bullet{opacity:1; margin:0 5px!important; width:10px; height:10px; border-radius:5px; box-sizing:border-box; border:0px solid rgba(255,255,255,0.6); background-color: rgba(255,255,255,1); position: relative;}
.swiper2 .swiper-pagination-bullet-active{width:20px; background-color:rgba(85,129,253,1); border:0px solid rgba(255,255,255,1);}
.swiper2 .swiper-slide{ position:relative; overflow: hidden; width: 100%; color: #FFF !important;  display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: space-between; align-items: stretch;}
.swiper2 .swiper-slide > p{ width:70%; overflow: hidden; height: 0; padding-top: 30%; flex-shrink: 0; position: relative; }
.swiper2 .swiper-slide > p img{width: 100%; height: 100%; position: absolute; left:0; top:0; }
.swiper2 .swiper-slide > div{ width:100%;  background-color: #194fa5; box-sizing: border-box; padding:2%; display: flex; flex-direction: column; flex-wrap: nowrap; justify-content: flex-end; align-items: flex-start;}
.swiper2 .swiper-slide > div > h3,.swiper2 .swiper-slide > div > p{ width: 100%; font-weight: normal; font-size: 42px; text-align: left; line-height: 1.6;}
.swiper2 .swiper-slide > div > h3 > a{ color: #FFF !important; }
.swiper2 .swiper-slide > div > p{ font-size: 14px; line-height: 2.2;}
.swiper2 .swiper-button-next,.swiper2 .swiper-button-prev{ color:rgba(255,255,255,0.2); background-color:rgba(0,0,0,0.1); border-radius:0%; height:40px; width:30px; line-height:40px; text-align:center; background-image:url(none); cursor:pointer; margin-top:-20px; box-sizing:border-box; display: none; } 
.swiper2 .swiper-button-next:hover,.swiper2 .swiper-button-prev:hover{ color:rgba(237,31,36,1) !important; } 
.swiper2 .swiper-button-next i,.swiper2 .swiper-button-prev i{ font-size:1.0rem; }
/*******/
.spiritList{ width: 100%; height: auto; }
.spiritList > ul > li{ float: left; width: 23.5%; margin-right: 2%; position: relative; }
.spiritList > ul > li:nth-of-type(4n){ margin-right: 0; }
.spiritList > ul > li > div{ width: 100%; height: 100%; box-sizing: border-box; padding:12%; position: absolute; left:0; top:0;background-image: url(../images/cultureItem.png); background-repeat: no-repeat; background-position: center center; background-size: 100% 100%;animation: spin 25s infinite linear; -webkit-animation: spin 25s infinite linear; display: none; }
.spiritList > ul > li > div > img{ width: 100%; opacity: 0;  }
.spiritList > ul > li > p{ width: 100%; box-sizing: border-box; padding:12%;  position: relative;}
.spiritList > ul > li > p::before{ content: ' '; width:0; height: 0; position: absolute; left:50%; margin-left:-10px; bottom:0; border-left: 10px solid transparent; border-right: 10px solid transparent; border-bottom: 14px solid #93edfc; display: none;}
.spiritList > ul > li > p::after{ content: ' '; width:0; height: 0; position: absolute; left:50%; margin-left:-10px; bottom:-1px; border-left: 10px solid transparent; border-right: 10px solid transparent; border-bottom: 14px solid #eaeffc; display: none;}
.spiritList > ul > li.active > div{ display: block; }
.spiritList > ul > li.active > p{ }
.spiritList > ul > li.active > p::before,.spiritList > ul > li.active > p::after{ display: block; }
.spiritList > ul > li > p > img{ width: 100%; }
.spiritList > ul > li > h3{ display: none;}
.spiritAbout{ width: 100%; box-sizing: border-box; padding:3%; border:1px solid #93edfc; background-color: #eaeffc; line-height: 2; font-size: 24px; text-align: center; border-radius: 8px; }
.spiritList > ul > li > h3 > span,.spiritAbout > span{ font-weight: 550; }

.cultureList{ width: 100%;display:none; }
.cultureList > ul > li{ width: 32%; float: left; margin-right: 2%; margin-bottom: 1%; margin-top: 1%; }
.cultureList > ul > li:nth-of-type(3n){ margin-right: 0; }
.cultureList > ul > li > a{ display: block; width: 100%; background-color: #FFF; box-sizing: border-box; border:1px solid #EEE; color: #333 !important; transition: all 0.5s linear; -webkit-transition: all 0.5s linear;}
.cultureList > ul > li > a > p{ width: 100%; height: 0; padding-top: 53%; position: relative; overflow: hidden; }
.cultureList > ul > li > a > p img{ width: 100%; height: 100%; position: absolute; left:0; top:0; transition: all 0.5s linear; -webkit-transition: all 0.5s linear; }
.cultureList > ul > li > a > div{ width: 100%; height:auto; padding:3%; display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: space-between;align-items: stretch; box-sizing: border-box; }
.cultureList > ul > li > a > div > h3{ width: 100%; font-weight: normal; font-size: 18px; line-height: 30px; text-align: left; overflow: hidden; height: 30px;  }
.cultureList > ul > li > a > div > p{ font-size: 14px; width: auto; height: 30px; line-height: 30px;text-align: right; overflow: hidden;  flex-shrink: 0; }
.cultureList > ul > li > a:hover{  background-color: #194fa5; color: #FFF !important;}
.cultureList > ul > li > a:hover > p img{ transform: scale(1.05,1.05); -webkit-transform: scale(1.05,1.05); }
/******/
.aboutHistory{ width: 100%; padding-top: 3%; padding-bottom: 3%; }
.aboutHistory > header{ width: 100%; padding-bottom: 8%; position: relative;}
.aboutHistory > header > p{ width: 32px; overflow: hidden; position: absolute; left:36%; top:0; transform: translateX(-14px); -webkit-transform: translateX(-14px); }
.aboutHistory > header > p img{ width: 100%; }
.aboutHistory > header::after{content: ''; width: 1px; height:100%; border-right:1px dashed #333; position: absolute; left: 36%; top:20px; }
.aboutHistory > ul > li{ width: 100%; display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: space-between; align-items: stretch; position: relative; cursor: pointer; }
.aboutHistory > ul > li::after{ content: ''; width: 1px; height:100%; border-right:1px dashed #333; position: absolute; left: 36%; top:0; }
.aboutHistory > ul > li + li{ padding-top: 2%; }
.aboutHistory > ul > li:hover{ background-color: rgba(255,255,255,0.6); }
.aboutHistory > ul > li > .histDate{ width: 36%; flex-shrink: 0;  border-bottom: 1px dashed transparent;box-sizing: border-box;  padding-bottom: 1.5%; font-size: 36px; text-align: right; font-weight: 550; font-family:'Impact'; color: #b1b1b2; margin-right: 30px; padding-right: 30px;  position: relative;}
.aboutHistory > ul > li > .histDate > p{ content:''; width:24px; height: 24px;  border-radius: 50%; position: absolute; right:-12px; top:3%; z-index: 1210;  background-color: #aab8d7; transform: translateX(2px); transition: all 0.5s linear; -webkit-transition: all 0.5s linear;}
.aboutHistory > ul > li > .histDate > p::before{ content:''; width:12px; height: 12px;  border-radius: 50%; position: absolute; left:50%; top:50%; margin-top: -6px; margin-left:-8px; z-index: 1230;  background-color: #194fa5; transform: translateX(2px);}
.aboutHistory > ul > li:hover > .histDate > p{ width:36px; height: 36px; background-color: #cad5e8; transform: translateX(2px);right:-18px;}

.aboutHistory > ul > li > .histRight{ width: 100%; box-sizing: border-box;  padding-bottom: 1.5%; border-bottom: 1px dashed #999; font-size: 18px; line-height: 2; text-align: left; }
/*****/
.aboutMain,.contactMain{  background-size: 100% auto; background-repeat: no-repeat; background-position:center top; }
.aboutMain > .banner > img,.contactMain > .banner > img{ opacity: 0; }
.aboutCol{ width: 94%; height: auto; margin-top: 10%;  }
.aboutF1,.aboutF4{ width:100%; position: relative;background-color: #FFF;  }
.aboutF1 > img{ width: 100%; }
.aboutF1 > section{ width: 100%; height: 100%; position: absolute; left:0; top:0;  display: flex; flex-direction: column; flex-wrap: nowrap; justify-content: flex-start; align-items: center; box-sizing: border-box; padding-top: 3.5%; }
.aboutF1 > section > h3{ font-weight: normal; font-size: 36px; line-height: 3; text-align: center; }
.aboutF1 > section > p{ width: 40px; height: 4px; background-color: #e8410d; }
.aboutF1 > section > div{ width: 100%; font-size: 16px; line-height: 2; text-align: center; margin-top: 3%; }
.aboutF2{ width: 100%; background-color: #FFF;}
.aboutF2 > ul > li{ width: 100%; display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: space-between; align-items: stretch; }
.aboutF2 > ul > li:nth-of-type(2n){ flex-direction: row-reverse; }
.aboutF2 > ul > li > p{ width:50%; overflow: hidden; }
.aboutF2 > ul > li > p img{ width: 100%; }
.aboutF2 > ul > li > div{ width: 50%; box-sizing:  border-box; padding:0 5%; font-size: 16px; line-height: 2; align-self: center; text-indent: 2.6rem;}
.aboutF3,.aboutF3r-top{ width: 100%; display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: flex-start; align-items: stretch; }
.aboutF3{ padding-top: 5%; position: relative; background-color: #FFF;}
.aboutF3 > .aboutF3-left{ width: 42%; overflow: hidden; flex-shrink: 0;}
.aboutF3 > .aboutF3-left img{ width: 100%; }
.aboutF3 > .aboutF3-right{ width: 100%;display: flex; flex-direction: column; flex-wrap: nowrap; justify-content: space-between; align-items: flex-start; }
.aboutF3r-top > p{ width: 50%; overflow: hidden;  }
.aboutF3r-top > p img{ width: 100%; }
.aboutF3r-btm{ width: 60%; overflow: hidden; position: absolute; right:0; bottom:0; box-sizing: border-box; padding-top:0;  box-sizing: border-box; padding-right: 10%;}
.aboutF3r-btm img{ width: 100%; }
.aboutF4{ box-sizing: border-box; padding:5% 8%; text-align: center; font-size: 16px; line-height: 2; text-align: left; background-color: #FFF;}
.aboutF5{ width:100%; background-color: #4f3f92; box-sizing: border-box; padding-left: 6.4%; }
.aboutF5 > .aboutF5Main{ width: 100%; height: auto; display: flex; flex-direction: row-reverse; flex-wrap: nowrap; justify-content: flex-start; align-items: stretch; }
.aboutF5-img{ width: 55.6%; flex-shrink: 0;  transform: translateY(10%); -webkit-transform: translateY(10%);}
.aboutF5-img img{ width: 100%; }
.aboutF5-about{ width: 100%; color: #FFF; box-sizing: border-box; padding-right: 2.5%; display: flex; flex-direction: column; flex-wrap: nowrap; justify-content: center; align-items: flex-start; }
.aboutF5-about > h3{ width: 45%;  }
.aboutF5-about > h3 img{ width: 100%; }
.aboutF5-about > div{ width: 100%; font-size: 16px; line-height: 36px; overflow: hidden; max-height: 324px; margin-top: 4% }
.aboutF6{ width: 100%;box-sizing: border-box; padding-top:10%; padding-bottom: 10%; background-image: url(../images/emp-41.png); background-repeat: no-repeat; background-position: center bottom; background-size: 100% auto; background-color: #FFF; }
.aboutF6-honor{ width:80%; margin:0 auto; }
.aboutF6-honor > ul > li{ width:32%; float: left; overflow: hidden; margin-right: 2%; }
.aboutF6-honor > ul > li img{ width: 100%; }
.aboutF6-honor > ul > li:nth-of-type(3n){ margin-right: 0; }
/*****/
.contactMain{ background-image: url(none);}
.contactCol{ margin-top: 0; padding-left:5%;box-sizing: border-box; padding-bottom: 5%; }
.colContact{ width: 100%; background-color: #FFF;  }
.contactHeader{ width: 100%; line-height: 3; font-size: 32px; text-align: center; box-sizing: border-box; border-bottom:1px solid #d1d1d1; color: #194fa5; position: relative;}
.contactHeader::after{ content: ' '; width: 10%; height: 1px; background-color: #194fa5; position: absolute; left:50%; bottom:0; margin-left: -5%; }
.contactList{ width: 100%; }
.contactList > .contactLeft,.contactList > .contactRight{ width: 50%; float: left; height: auto; padding-top: 3%; padding-bottom: 6%; padding-left:5%; padding-right: 3%; box-sizing: border-box;}
.contactList > .contactLeft{animation: fadeIn 1.5s ease-in-out; -webkit-animation: fadeIn 1.5s ease-in-out;}
.contactList > .contactRight{ padding-left:0; padding-right:0; animation: fadeIn 1.5s ease-in-out; -webkit-animation: fadeIn 1.5s ease-in-out;}
.contactList > .contactLeft > h3,.contactList > .contactRight > h3{ width: 100%; font-weight: normal; font-size: 26px; text-align: left; line-height: 1.3; margin-bottom: 3%;}
.contactList > .contactLeft > p,.contactList > .contactRight > h4{ font-weight: normal; width: 100%; font-size: 16px; line-height: 2.5; text-align: left; color: #999;}
.contactList > .contactLeft > p > i,.contactList > .contactRight > h4 > i{ font-size: 20px;  }
.contactList > .contactRight > p{ width:30%; box-sizing: border-box; padding:2%; border:1px solid #EEE; overflow: hidden; margin-top: 10px;}
.contactList > .contactRight > p img{ width: 100%; }
.map{ width: 100%; overflow: hidden; animation: fadeIn 1.5s ease-in-out; -webkit-animation: fadeIn 1.5s ease-in-out;}
.map img{ width: 100%; }


.warterSup-title{width: 78%; margin:0 auto;background-color: rgba(255,255,255,0.5); box-sizing: border-box; padding:1.5% 2%; line-height: 1.6; font-size: 20px; text-align: left; color: #FFF;}
.warterSup-list{ width: 78%; margin:0 auto; box-sizing: border-box; padding-bottom: 10%; }
.warterSup-list > ul > li{ width: 100%; box-sizing: border-box; background-color: #FFF; }
.warterSup-list > ul > li > a{ display: block; width: 100%; box-sizing: border-box; padding:2.5%; margin-top: 2.5%;}
.warterSup-list > ul > li > a:hover{ color: #333 !important; }
.warterSup-list > ul > li > a > h3{ width: 100%; height: auto; line-height: 3; font-size: 24px; box-sizing: border-box; padding:0 2.5%; color: #FFF; text-align: left;background-color: #194fa5; }
.warterSup-list > ul > li > a > .wsItem-about{ width: 100%; display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: space-between; align-items: stretch; margin-top: 2.5%; }
.warterSup-list > ul > li > a > .wsItem-about > div{ width: 54%; box-sizing: border-box; padding-top: 4%; font-size: 18px; line-height: 2; text-align: left; overflow: hidden; position: relative;}
.warterSup-list > ul > li > a > .wsItem-about > div::before{ content: ' '; width: 100%; height: 12%; background-color: #f2f2f2; position: absolute; left:0; top:0; }
.warterSup-list > ul > li > a > .wsItem-about > p{ width: 43%; overflow: hidden; }
.warterSup-list > ul > li > a > .wsItem-about > p >img{ width: 100%; }

.yewuList{ width: 90%; height: auto; margin:0 auto; padding-top: 3%; padding-bottom: 15%; box-sizing: border-box; }
.yewuList > ul > li{ width: 18.4%; float: left; margin-right: 2%; position: relative; }
.yewuList > ul > li:nth-of-type(4n){ margin-right: 0; }
.yewuList > ul > li > a{ display: block; width: 100%; height: 0; padding-top: 166.6667%; position: relative; }
.yewuList > ul > li > a > img{ width: 100%; height: 100%; position: absolute; left:0; top:0; z-index: 180; }
/*.yewuList > ul > li > a::after{ content: ' '; width: 100%; height: 100%; }*/
.yewuList > ul > li > .yewuItemAbout{ display: block; width: 100%; height: 100%; background-color: rgba(83,135,219,0.8); position: absolute; left:0; top:0; z-index: 200; box-sizing: border-box; padding:7%; transition: all 0.5s linear; -webkit-transition: all 0.5s linear;}
.yewuList > ul > li > .yewuItemAbout > div{ width: 100%; height: 100%; box-sizing: border-box; border:1px solid #FFF; display: flex; flex-direction: column; flex-wrap: nowrap; justify-content: center; align-items: center; }
.yewuList > ul > li > .yewuItemAbout > div > p{ width: 55%; margin:0 auto; }
.yewuList > ul > li > .yewuItemAbout > div > h5{ width: 35px; margin:10% auto; }
.yewuList > ul > li > .yewuItemAbout > div > p img,.yewuList > ul > li > .yewuItemAbout > div > h5 > img{ width: 100%; }
.yewuList > ul > li > .yewuItemAbout > div > h3{ font-weight: 550; font-size: 22px; line-height: 2; }
.yewuList > ul > li > .yewuItemAbout > div > h3 > a{ color: #FFF !important; }
.yewuList > ul > li > .yewuItemAbout > div > h4{ line-height: 2; font-weight: normal; font-size: 14px; color: #FFF; }
.yewuList > ul > li:hover > .yewuItemAbout{ display: block; width: 100%; height: 100%; background-color: rgba(255,255,255,0.2);}
/***/
.contactBg{ background-color: #ced2e4; background-image: url(../images/banner-contact.png); background-attachment: fixed; background-repeat: no-repeat; background-position: right top; }
.aboutBg{ background-color: #ced2e4; background-image: url(../images/banner-about.png); background-attachment: fixed; background-repeat: no-repeat; background-position: right top; background-size:100% 100%; }
.jobBg{ background-color: #f9f9f9;/* background-image: url(../images/banner-job.png); background-attachment: fixed; background-repeat: no-repeat; background-position: right top; background-size:100% 100%; */}

.historyBg{background-color: #ced2e4; background-image: url(../images/history.png); background-attachment: fixed; background-repeat: no-repeat; background-position: right top; background-size:100% 100%; }
.wartersupplyBg{background-color: #ced2e4; background-image: url(../images/watersupply.png); background-attachment: fixed; background-repeat: no-repeat; background-position: right top; background-size:100% 100%;}
.yewuBg{background-color: #ced2e4; background-image: url(../images/yewu.png); background-attachment: fixed; background-repeat: no-repeat; background-position: right top; background-size:100% 100%;}


.newsarticle{ width: 100%; box-sizing: border-box; padding:5% 9% 5% 8%; }
.newsarticle > h1,.newsarticle > p{width: 100%;line-height: 3;font-weight: normal;font-size: 28px;text-align: left;}
.newsarticle > p{ font-size: 16px; text-transform: uppercase; }
.colarticle{flex: 1;line-height: 40px !important;font-size: 14px;box-sizing: border-box;text-align: left;}
.colarticle p,.colarticle span{line-height: 40px !important;font-family: "微软雅黑","宋体" !important;text-indent:2em !important;font-size: 16px !important;}
.colarticle span{text-indent:0em !important;}
.colarticle img{max-width:100%;margin: 1% auto;}
.colarticle table{border:1px solid #000 !important;margin: 0 auto !important;width:90% !important;}
.colarticle table,.colarticle table tr th,.colarticle table tr td { border:1px solid #000 !important; }




.warterSup-title{width: 78%; margin:0 auto;background-color: rgba(117,153,209,0.8); box-sizing: border-box; padding:2% 3%; line-height: 1.6; font-size: 20px; text-align: left; color: #FFF; margin-bottom: 2%;}
.warterSup-list{ width: 78%; margin:0 auto; box-sizing: border-box; padding-bottom: 10%; }
.warterSup-list > ul > li{ width: 100%; box-sizing: border-box; background-color: #FFF; padding:4% 4% 0 4%;}
/*.warterSup-list > ul > li > a{ display: block; width: 100%; box-sizing: border-box; padding:4% 4% 0 4%; }*/
/*.warterSup-list > ul > li > a:hover{ color: #333 !important; }*/
.warterSup-list > ul > li > h3{ width: 100%; height: auto; line-height: 3; font-size: 24px; box-sizing: border-box; padding:0 2.5%; color: #FFF; text-align: left;background-color: #194fa5; }
.warterSup-list > ul > li > .wsItem-about{ width: 100%; display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: space-between; align-items: stretch; margin-top: 2.5%; }
.warterSup-list > ul > li > .wsItem-about > div{ width: 54%; box-sizing: border-box; padding-top: 4%; font-size: 18px; line-height: 2; text-align: left; overflow: hidden; position: relative;}
.warterSup-list > ul > li > .wsItem-about > div::before{ content: ' '; width: 100%; height: 12%; background-color: #f2f2f2; position: absolute; left:0; top:0; }
.warterSup-list > ul > li > .wsItem-about > p{ width: 43%; overflow: hidden; }
.warterSup-list > ul > li > .wsItem-about > p >img{ width: 100%; }
/********/
.wslMode{ width:100%; }
.wslMode-item{ width: 100%; background-color: #f4f5f7; box-sizing: border-box; padding:50px 302px 50px 30px; position: relative; height: auto; margin-bottom: 20px; float: left;}
.wslModeItem-about{ width: 100%; overflow: hidden; height: 316px; box-sizing: border-box; padding-right: 5%; font-size: 16px; line-height:31px;  }
.wslModeItem-img{ width: 272px; height: 316px; overflow: hidden; position: absolute; right:30px; top:50px; }
.wslModeItem-img img{ width: 272px; }
.wslMode-img{ width: 100%; overflow: hidden; }
.wslMode-img img{ width: 100%; }

.wslHeader{ width: 100%; position: relative; z-index: 200;}
.wslHeader::after{ content: ' '; width: 100%; height: 10px; background-color: #f9f9f9; position: absolute; right:0; top:50%; margin-top: -5px; z-index: 220; }
.wslHeader h3,.wslHeader p{ display: block; font-weight: 550; color: #1b3271; line-height: 1.5; width:220px; background-color: #FFF; position: relative; z-index: 320; font-size: 36px; position: relative; z-index: 240;}
.wslHeader p{ text-transform: uppercase; font-size: 20px; font-weight: normal;}

.wslContent{width: 100%; box-sizing: border-box; padding:3% 0; line-height: 30px; text-align: left; font-size: 16px; color: #666;}
.advList{ width: 100%; }
.advList > .advItem{ width: 100%; background-color: #194fa5; position: relative; padding-left:60px; float: left; margin-bottom: 20px; box-sizing: border-box;}
.advList > .advItem > .advItemTitle{ width: 60px; height: 100%; position: absolute; left:0; top:0; }
.advList > .advItem > .advItemTitle > p{ width: 60px; height: 60px; line-height: 60px; font-size: 48px; text-align: center;text-transform: uppercase; color: #FFF; position: absolute; left:0; top:50%; margin-top: -30px; }
.advList > .advItem > .advItemRight{ width: 100%; box-sizing: border-box; padding:30px; line-height: 30px; text-align: left; font-size: 16px; background-color: #f4f5f7; }

.wslHonor{width: 100%; box-sizing: border-box; height: auto; padding: 3%; background-color: #f4f5f7; position: relative; z-index: 180;}
.wslHonor::after{ content: ' '; width: 100%; height: 50%; background-color: #194da1; position: absolute;left:0; bottom:0; z-index: 200; }
.wslHonor > .wslHonorItem{ display: block; width: 44%; float: left; margin-right: 2%;  position: relative; z-index: 220;}
.wslHonor > .wslHonorItem:nth-of-type(3n){ margin-right: 0; }
.wslHonor > .wslHonorItem:nth-of-type(1){width: 24%; }
.wslHonor > .wslHonorItem:nth-of-type(2){ width: 28%; }
.wslHonor > .wslHonorItem > p{ width: 100%; height: 0; padding-top: 75%; position: relative;  }
.wslHonor > .wslHonorItem > p > img{ width: 100%; height: 100%; position: absolute; left:0; top:0; box-shadow: 0 0 6px rgba(0,0,0,0.13); box-sizing: border-box; border:1px solid rgba(0,0,0,0.13);  }
.wslHonor > .wslHonorItem:nth-of-type(1) > p{padding-top: 137.8%;}
.wslHonor > .wslHonorItem:nth-of-type(2) > p{padding-top: 118%;}
.wslHonor > .wslHonorItem > h4{ width: 100%; height: 68px; font-weight: normal; font-size: 14px; box-sizing: border-box; padding:10px 16px; line-height: 24px; overflow: hidden; text-align: center; color: #FFF !important;}



.wslAbout{ width: 100%; box-sizing: border-box; padding:3%; line-height: 30px; text-align: left; font-size: 16px; color: #666;}
.wslTitle{ width: 100%;height: 40px; line-height: 40px; font-size: 24px; font-weight: 550; color: #194fa5; 
	text-align: center; margin-top: 10px; margin-bottom: 20px;}
.hotCheck{ width: 100%; height: auto; padding-bottom: 20px;}
.hotCheck > .hotCheckItem{ display: block; width: 44%; float: left; margin-right: 2%; background-color: #f4f5f7;}
.hotCheck > .hotCheckItem:nth-of-type(3n){ margin-right: 0; }
.hotCheck > .hotCheckItem:nth-of-type(1){width: 24%; }
.hotCheck > .hotCheckItem:nth-of-type(2){ width: 28%; }
.hotCheck > .hotCheckItem > p{ width: 100%; height: 0; padding-top: 75%; position: relative; }
.hotCheck > .hotCheckItem > p > img{ width: 100%; height: 100%; position: absolute; left:0; top:0; }
.hotCheck > .hotCheckItem:nth-of-type(1) > p{padding-top: 137.8%;}
.hotCheck > .hotCheckItem:nth-of-type(2) > p{padding-top: 118%;}
.hotCheck > .hotCheckItem > h4{ width: 100%; height: 68px; font-weight: normal; font-size: 14px; box-sizing: border-box; padding:10px 16px; line-height: 24px; overflow: hidden; text-align: center;}


.dayCheck{ width: 100%; height: auto; padding-bottom: 20px;}
.dayCheck > .dayCheckItem{ display: block; width: 30%; float: left; margin-right: 2%; background-color: #f4f5f7;}
.dayCheck > .dayCheckItem:nth-of-type(4n){ margin-right: 0; }
.dayCheck > .dayCheckItem:nth-of-type(1),.dayCheck > .dayCheckItem:nth-of-type(4){ width: 17%; }
.dayCheck > .dayCheckItem > p{ width: 100%; height: 0; padding-top: 75%; position: relative; }
.dayCheck > .dayCheckItem > p > img{ width: 100%; height: 100%; position: absolute; left:0; top:0; }
.dayCheck > .dayCheckItem:nth-of-type(1) > p,.dayCheck > .dayCheckItem:nth-of-type(4) > p{padding-top: 132%;}
.dayCheck > .dayCheckItem > h4{ width: 100%; height: 68px; font-weight: normal; font-size: 14px; box-sizing: border-box; padding:10px 16px; line-height: 24px; overflow: hidden; text-align: center;}

.regular{ width: 100%; height: auto; padding-bottom: 20px;}
.regular > .regularItem{ display: block; width: 31%; float: left; margin-right: 3.5%; background-color: #f4f5f7;}
.regular > .regularItem:nth-of-type(3n){ margin-right: 0; }
/*.regular > .regularItem > a{ display: block; overflow: hidden; }*/
.regular > .regularItem > p{ width: 100%; height: 0; padding-top: 75%; position: relative; }
.regular > .regularItem > p > img{ width: 100%; height: 100%; position: absolute; left:0; top:0; }
.regular > .regularItem > h4{ width: 100%; height: 68px; font-weight: normal; font-size: 14px; box-sizing: border-box; padding:10px 16px; line-height: 24px; overflow: hidden; text-align: center;}

.daily{ width: 100%; height: auto; padding-bottom: 20px;}
.daily > .dailyItem{ display: block; width: 18.4%; float: left; margin-right: 2%; background-color: #f4f5f7;}
.daily > .dailyItem:nth-of-type(5n){ margin-right: 0; }
/*.daily > .dailyItem > a{ display: block; overflow: hidden; }*/
.daily > .dailyItem > p{ width: 100%; height: 0; padding-top: 134.41%; position: relative; }
.daily > .dailyItem > p > img{ width: 100%; height: 100%; position: absolute; left:0; top:0; }
.daily > .dailyItem > h4{ width: 100%; height: 68px; font-weight: normal; font-size: 14px; box-sizing: border-box; padding:10px 16px; line-height: 24px; overflow: hidden; text-align: center;}


.wslDang,.wslTuan{ width: 100%; box-sizing: border-box; padding-bottom:20px;}
.wslDang > .wslDangItem,.wslTuan > .wslTuanItem{ width: 32%; float: left; overflow: hidden; margin-right: 2%;}
.wslDang > .wslDangItem:nth-of-type(3n),.wslTuan > .wslTuanItem:nth-of-type(3n){ margin-right: 0; }
.wslDang > .wslDangItem > a,.wslTuan > .wslTuanItem > a{ display: block; width: 100%; height: 0; padding-top:55.25%; position: relative; overflow: hidden;  }
.wslTuan > .wslTuanItem > a{ padding-top: 66.3%; }
.wslDang > .wslDangItem > a > img,.wslTuan > .wslTuanItem > a > img{ width: 100%; height: 100%; position: absolute; left:0; top:0; }

.wslSafe{ width: 100%; box-sizing: border-box; padding-left:10%; padding-right: 10%;}
.wslSafe > .wslSafeItem{ width: 48%; float: left; overflow: hidden; margin:0 1%;}
/*.wslSafe > .wslSafeItem:nth-of-type(3n),.wslTuan > .wslTuanItem:nth-of-type(3n){ margin-right: 0; }*/
.wslSafe > .wslSafeItem > a{ display: block; width: 100%; height: 0; padding-top:57.778%; position: relative; overflow: hidden;  }
.wslSafe > .wslSafeItem > a > img{ width: 100%; height: 100%; position: absolute; left:0; top:0; }

.drill{ width: 100%; position: relative; background-color: #f4f5f7; }
.drill > .drillImg{ width: 56.73%; overflow: hidden; float: left; }
.drill > .drillImg > p{ width: 50%; float: left; overflow: hidden; box-sizing: border-box; border-right: 1px solid #FFF; }
.drill > .drillImg > p > a{ display: block; width: 100%; height: 0; padding-top: 107.097%; position: relative; overflow: hidden; }
.drill > .drillImg > p > a > img{ width: 100%; height: 100%;position: absolute; left:0; top:0; }
.drill > .drillAbout{ width: 43.27%; float: right; box-sizing: border-box; padding:4%; }
.drill > .drillAbout > p{ width: 100%; height: auto; line-height: 24px; text-align: left; font-size: 14px; max-height: 96px; }

.qualificat{ width: 100%; position: relative;}
.qualificat .qualificatBg{ width: 100%; overflow: hidden; }
.qualificat .qualificatBg img{ width: 100%; }
.qualificat .qualificatList{ width: 100%; height: 100%; box-sizing: border-box; padding:4% 10%; position: absolute; left:0; top:0;}
.qualificat .qualificatList .qlItem{ width:48%; float: left; overflow: hidden;  }
.qualificat .qualificatList .qlItem:nth-of-type(2n){ float: right; }
.qualificat .qualificatList .qlItem img{ width: 100%; }

/********/
.hjAbout{ width: 680px; margin:0 auto; }
.hjAboutImg1,.hjAboutImg2{ width:460px; height: 270px; float: left; overflow: hidden; }
.hjAboutImg2{ width: 180px; float: right;}
.hjAboutImg1 img,.hjAboutImg2 img{ width:460px; height: 270px;}
.hjAboutImg2,.hjAboutImg2 img{ width: 180px; }
.hjTeam{ width: 100%; overflow: hidden; }
.hjTeam img{ width: 100%; }
.hjMachine{ width: 100%; height: auto; }
.hjMachine .hjMachineItem{ display: block; width: 25%; float: left; overflow: hidden; }
.hjMachine .hjMachineItem p{ width: 64%; margin:0 auto; overflow: hidden; }
.hjMachine .hjMachineItem p img{ width: 100%; }
.hjMachine .hjMachineItem h4{ width: 100%; font-size: 16px; text-align: center; font-weight: normal; line-height: 60px; overflow: hidden; height: 60px;}
.hjAbility{ width: 100%; position: relative; overflow: hidden; }
.hjAbility img{ width: 100%; }
.hjAbility .hjAbilityAbout{ width: 43%; height: 100%; position: absolute; left:0; top:0; }
.hjAbility .hjAbilityAbout p{ width: 100%; height: 90px; line-height: 30px; font-size: 16px; text-align: left; overflow: hidden; position: absolute; left:0; top:50%; margin-top: -45px; box-sizing: border-box; padding:0 10%; color: #FFF; }
.hjHonor{ width: 100%; box-sizing: border-box; padding:3%; height: auto; background-color: #f4f5f7;}
.hjHonor .hjHonorItem{ width: 20%; float: left; box-sizing: border-box; padding:0 2%;}
.hjHonor .hjHonorItem img{ width: 100%; }

.hjCom{ width: 100%; height: auto; box-sizing: border-box; border:1px solid #FFF; }
.hjCom .hjComItem{ width: 100%; height: auto; border-bottom: 1px solid #FFF; position: relative; padding-left:96px; box-sizing: border-box; font-size: 16px;}
.hjComItem-header{ width: 96px; height: 100%; background-color: #dee6f7; position: absolute; left:0; top:0; }
.hjComItem-header p{ width: 20px; height: auto; line-height: 24px; font-size: 16px; position: absolute; left:50%; top:50%; margin-left: -10px; }
.hjComItem-right{ width: 100%;  height: auto;background-color: #DDD; box-sizing: border-box; border-left:1px solid #FFF;}
.hjComItem-right .hjComItemRight-line{ width: 100%; height: auto;  position: relative; border-bottom: 1px solid #FFF; padding-left:150px; box-sizing: border-box;}
.hjComItem-right .hjComItemRight-line:nth-last-of-type(1){ border-bottom: 0; }
.hjComIrl-title{ width: 150px; height: 100%; background-color: #e9eef8; position: absolute; left:0; top:0; }
.hjComIrl-title p{ width: 100%; height: 24px;  line-height: 24px; position: absolute; left:0; top:50%; margin-top: -12px; text-align: center; }
.hjComIrl-about{ width: 100%; height: auto; box-sizing: border-box; padding:2%; line-height: 24px; text-align: left; font-size: 16px; border-left:1px solid #FFF; background-color: #f4f5f7 }



.zlbjCol{width: 100%;height: auto;}
.zlbjF1{ width:100%; position: relative;background-color: #FFF;  }
.zlbjF1 > img{width: auto;margin: 0 auto;padding-top: 18%;margin-bottom: 80px;padding-left: 80px;}
.zlbjF1 > section{ width: 100%; height: 100%; position: absolute; left:0; top:0;  display: flex; flex-direction: column; flex-wrap: nowrap; justify-content: flex-start; align-items: center; box-sizing: border-box; padding-top: 3.5%; }
.zlbjF1 > section > h3{ font-weight: normal; font-size: 36px; line-height: 3; text-align: center; }
.zlbjF1 > section > p{ width: 40px; height: 4px; background-color: #e8410d; }
.zlbjF1 > section > div{ width: 100%; font-size: 16px; line-height: 2; text-align: center; margin-top: 3%; }
.zlbjbanner{ width: 100%; overflow: hidden; position: relative; }
.aboutMain > .zlbjbanner > img{ width: 100%;opacity:1 }




.zlbjF2,.zlbjF3,.zlbjF4{ width:100%; position: relative;background-color: #FFF;  }
.zlbjF2 > img，.zlbjF3 > img，.zlbjF4 > img{ width: 100%; }
.zlbjF2 > section,.zlbjF3 > section,.zlbjF1 > section{ width: 100%; height: 100%; position: absolute; left:0; top:0;  display: flex; flex-direction: column; flex-wrap: nowrap; justify-content: flex-start; align-items: center; box-sizing: border-box; padding-top: 3.5%; }
.zlbjF2 > section > h3,.zlbjF3 > section > h3,.zlbjF1 > section > h3{ font-weight: normal; font-size: 36px; line-height: 3; text-align: center; }
.zlbjF2 > section > p,.zlbjF3 > section > p,.zlbjF1 > section > p{width: 229px;height: 2px;background: url(../images/zlbj_p.png);}
.zlbjF2 > section > h4,.zlbjF3 > section > h4,.zlbjF1 > section > h4{ font-weight: normal; font-size: 16px; line-height: 3; text-align: center;color:#666666 }
.zlbjF2 > section > div,.zlbjF3 > section > div,.zlbjF1 > section > div{ width: 100%; font-size: 16px; line-height: 2; text-align: center; margin-top: 3%; }
.zlbjF3 > section > h3,.zlbjF3 > section > h4,.zlbjF3 > section > div{color:#fff}



.ygtdCol{width: 100%;height: auto;}
.ygtd{ width:100%; position: relative;background-color: #FFF;  }
.ygtd > img{ width: 100%; }
.ygtd > section{width: 100%;height: 180%;position: absolute; left:0; top:0;display: flex;flex-direction: column;flex-wrap: nowrap;justify-content: flex-start;align-items: center;box-sizing: border-box;padding-top: 3.5%;}
.ygtd > section > h3{ font-weight: normal; font-size: 36px; line-height: 3; text-align: center; }
.ygtd > section > p{width: 229px;height: 2px;background: url(../images/zlbj_p.png);}
.ygtd > section > h4{ font-weight: normal; font-size: 16px; line-height: 3; text-align: center;color:#666666 }
.ygtd-list{width: 1400px;margin:0 auto;margin-top: 30px;overflow: hidden;}
.ygtd-list ul li{float:left;width: 220px;height: 140px;background-color:#5883b4;margin:10px;padding:20px;border-radius:5px;position:relative;background-image: url(../images/ygtd_01.png);background-position: bottom right;background-size: 25%;background-repeat: no-repeat;}
.ygtd-list ul li h3{font-size: 15px;color:#fff;margin-top:30px;line-height:60px;font-weight:normal;position: relative;}
.ygtd-list ul li h3::after{content: ' ';width:38px;height:4px;background:#fff;position:absolute;left:0;}
.ygtd-list ul li p{position:absolute;bottom:28px;left:20px;}
.ygtd-list ul li:nth-of-type(2){background-color: #b75bc8;background-image: url(../images/ygtd_02.png); }
.ygtd-list ul li:nth-of-type(3){background-color: #416bbf;background-image: url(../images/ygtd_03.png); }
.ygtd-list ul li:nth-of-type(4){background-color: #4f3f92;background-image: url(../images/ygtd_04.png); }
.ygtd-list ul li:nth-of-type(5){background-color: #58b3b4;background-image: url(../images/ygtd_05.png); }
.ygtd-list ul li:nth-of-type(6){background-color: #19c0d1;background-image: url(../images/ygtd_06.png); }
.ygtd-list ul li:nth-of-type(7){background-color: #27cda3;background-image: url(../images/ygtd_07.png); }
.ygtd-list ul li:nth-of-type(8){background-color: #d74d5d;background-image: url(../images/ygtd_08.png); }
