/*Html5扁平化样式库*/

/*框架基础定义*/
section { width:100%; padding-top: 1px;}
section header {margin-top: 30px;margin-bottom: 30px;}
section header h3 { width:120px; height: 40px;text-align: center; font-size: 24px; color: #004ea2;  margin-bottom: 10px; border-bottom:1px solid #004ea2;}
section header p { display: block; position: relative; text-align: center; width: 460px;}
section header p:before {display: block; content: ""; width: 100px; height: 1px; border-bottom: 0px solid #c2c2c2; position: absolute; left:-120px}
section header p:after {display: block; content: ""; width: 100px; height: 1px; border-bottom: 0px solid #c2c2c2; position: absolute; right:-120px; top:0px}
section article {width:1180px; margin:0 auto;}
section footer {}

.TipsList {}
.TipsList ul {}
.TipsList ul li { display: block; width: 295px; height: 500px; float: left; overflow: hidden;position: relative;}
.TipsList ul li .img {width: 100%; overflow: hidden;position: absolute; background-color: #cccccc;}
.TipsList ul li .img img {width: 100%;transition: all 1s;}
.TipsList ul li .word { width: 100%; padding: 20px 20px; position: absolute;}
.TipsList ul li .word i {display: block; color: #ffffff; font-style: normal; font-size: 50px; }
.TipsList ul li .word b {display: block; color: #ffffff; position: relative; left:80px; top:-20px; font-size: 18px;}
.TipsList ul li .word p {display: block; color: #ffffff; font-size: 14px; line-height: 25px;}

.TipsList ul li:nth-child(odd) .word {background-color: #f1f1f1; bottom:0; height: 60%;}
.TipsList ul li:nth-child(odd) .word i {color: #000000;}
.TipsList ul li:nth-child(odd) .word b {color: #000000;}
.TipsList ul li:nth-child(odd) .word p {color: #000000;}
.TipsList ul li:nth-child(odd) .img {height: 40%; top:0;}

.TipsList ul li:nth-child(even) .word {background-color: #004ea2; top:0; height: 60%;}
.TipsList ul li:nth-child(even) .img {height: 40%; bottom:0;}

.TipsList ul li:hover .word {background-color: #0c3969;}
.TipsList ul li:hover .word i {color: #ffffff;}
.TipsList ul li:hover .word b {color: #ffffff;}
.TipsList ul li:hover .word p {color: #ffffff;}
.TipsList ul li:hover .img img {transform:scale(1.2)}

.picList {}
.picList div { display: none;}
.picList ul {}
.picList ul li { display: block; width: 380px; height: 250px; float: left; margin-right: 20px; margin-bottom: 20px; position: relative;overflow: hidden;}
.picList ul li:nth-child(3n+0) { margin-right: 0;}
.picList ul li .pic{ width: 100%; height: 250px; overflow: hidden;}
.picList ul li .pic img { width: 100%;height: 250px;transition: all 1s;}
.picList .pic b { display: none; width: 380px; background-color: rgba(0,0,0,0.8); color: #ffffff;text-overflow:ellipsis;white-space:nowrap; overflow: hidden; text-align: center; line-height: 30px; font-size: 12px; position: absolute; bottom: 0;}
.picList ul li span {display: none;}
.picList ul li .pic:hover b { display: block;}
.picList ul li .pic:hover img {transform:scale(1.2)}


.wordBox { color: #ffffff; }
.wordBox b { display: block; color: #ffffff; text-align: center; margin-bottom: 10px;}
.wordBox p { display: block; color: #ffffff; text-align: center; font-size: 14px; line-height: 25px;}
.wordBox a { display: block; width: 120px; height: 30px; border: 1px solid #ffffff; color: #ffffff; text-align: center; position: absolute; bottom: 30px; line-height: 28px; font-size: 14px; left:50%; margin-left: -60px;}


.picList {}
.picList ul { text-align: center;}
.picList ul li { display: inline-block; overflow: hidden; position: relative;}
.picList ul li img {width: 100%; height: 100%;filter: grayscale(100%);transition: all 1s;}
.picList ul li a { display: block; width: 100%; height: 100%; background-color: rgba(0,0,0,0.2); position: absolute; top:0}
.picList ul li a i {display: block; color: #ffffff; width: 80px; height: 50px; font-size: 50px; margin-top: 80px; margin-bottom: 10px; text-align: center;}
.picList ul li a b {display: block; color: #ffffff;width: 80px; height: 40px; text-align: center; }
.picList ul li a:hover { background-color: rgba(0,0,0,0.2);}
.picList ul li:hover img {filter: grayscale(10%);transform:scale(1.2)}



.picBox { background-color: #ffffff; padding: 20px;box-shadow: 0px 0px 10px 3px #d9d9d9;}
.picBox ul {}
.picBox ul li { display: block; width: 500px; height: 400px;}
.picBox ul li .pic {display: block; width: 100%; height: 320px; overflow: hidden; background-color: #f1f1f1; margin-bottom: 10px;}
.picBox ul li .pic img {width: 100%;}
.picBox ul li .word {}
.picBox ul li .title b {display: block; color: #000000; font-weight: 700; margin-bottom: 5px;}
.picBox ul li p { font-size: 12px; color: #979797;}
.picBox ul li span {display: none;}

.picWordList {background-color: #ffffff; padding: 20px;box-shadow: 0px 0px 10px 3px #d9d9d9;}
.picWordList ul {}
.picWordList ul li { display: block; width: 570px; height: 100px; }
.picWordList ul li .pic {display: block; width: 120px; height: 80px; overflow: hidden; background-color: #f1f1f1; margin-bottom: 10px; float: left; margin-right: 10px;}
.picWordList ul li .pic img {width: 100%;}
.picWordList ul li .word {width: 400px; float: left;}
.picWordList ul li .word .title { display: block; white-space:nowrap;text-overflow:ellipsis; overflow:hidden; margin-bottom: 5px;}
.picWordList ul li .word .title b { color:#004ea2;font-weight: 700;}
.picWordList ul li .word p { display: block; height: 40px; font-size: 12px; line-height: 22px; overflow: hidden;}
.picWordList ul li .word span {display: none;}



.F1 { height: 800px;}
.F2 { height: 350px;position: relative; background-color: #8ea3b9;background-image:url(/UploadFile/image/Adc/shouye-gywm.png);}
.F3 { height: 450px;}
.F3 header h3 { width: 150px;}
.F4 { height: 600px; background-color: #f1f1f1;}


.TopBanner { height: 800px; background-color: #cccccc;}

/*内容页banner图调高*/
/*.ClassTopBanner {height: 800px;}*/