/*================基本样式重置================*/
html,body,div,ul,ol,li,dl,dt,dd,h1,h2,h3,h4,h5,h6,p,img,span,i,a,em,strong,b,input,textarea,select { margin:0; padding:0; }
i,em { font-weight:normal; font-style:normal; }
b{font-weight: normal;}
a,i,em,span,b,img{display: block;}
body { font-family:"Microsoft Yahei","PingFang SC"; }
li { list-style:none; }
a,img,input { border:0 none; }
a { text-decoration:none; outline:none; }
a:hover { text-decoration:none; }
a:focus,input:focus { outline:0 none;}
input::-webkit-search-cancel-button{display: none;}/*清除谷歌浏览器下的 search 叉号*/
input::-ms-clear{display: none;}/*清除IE下的 search 叉号*/
textarea { resize:none; font-size:12px; } /*去掉火狐和谷歌浏览器的Textarea改变尺寸大小功能*/
/*html5*/
article,aside,dialog,footer,header,section,footer,nav,figure,menu{display:block}
/*========定义基础样式========*/
.hide { display:none;}
.vis{visibility: hidden;}
.fl { float:left;}
.fr { float:right;}
.clearfix:after { content:" "; display:block; clear:both; height:0; }
.clearfix { }
/*a标签鼠标hover高亮显示状态(可选用)*/
a .opacity { filter:alpha(opacity=100); opacity:1; -moz-opacity:1; }
a:hover .opacity { filter:alpha(opacity=80); opacity:0.8; -moz-opacity:0.8; }
/*主体宽度样式(可选用)如有新宽度,命名规则以小写w开头,后接具体宽度数据,例:*/
.w1200{width: 1200px; margin: 0 auto; }
.w1500{width: 100%; max-width:1500px; padding:0px; margin: 0 auto; }
.header{position: fixed;left: 0;top: 0;z-index: 19; width: 100%;height: 108px;-webkit-transition:all .8s cubic-bezier(0.22, 0.61, 0.36, 1); -moz-transition:all .8s cubic-bezier(0.22, 0.61, 0.36, 1); -ms-transition:all .8s cubic-bezier(0.22, 0.61, 0.36, 1); -o-transition:all .8s cubic-bezier(0.22, 0.61, 0.36, 1); transition:all .8s cubic-bezier(0.22, 0.61, 0.36, 1); }
.header .logo{width: 175px;height: 108px;text-align: center;}
.header .logo img{display: inline-block; height: 71px;}
.header .logo .img_1{display: block;}
.header .logo .img_2{display: none;}
.header .top{margin: 27px 0 18px;color: #fff; }
.header .top p{float: right;margin-right: 20px; }
.header .top a{color: #fff;padding-right: 45px; font-size: 16px;color: #fff;background: url(/img/icon_14.png) right center no-repeat;}
.header .top a:hover{font-weight: bold;}
.header .nav{margin-right: 30px;}
.header .nav .ls .one{margin-left: 48px;height: 43px; font-size: 18px;color: #fff;}
.header .nav .ls:hover .one{font-weight: bold;}
.header .nav .ls.cur .one{font-weight: bold;}
.header .nav .ls .pos{
position: fixed;
top:107px;
left: 0;
width: 100%;
height: 0;
visibility: hidden;
overflow: hidden;
box-sizing: border-box;
background: #f4f3f3;
transform-origin: 50% 0%;
/* transform: perspective(1920px) rotateX(-80deg); */
transform: perspective(1920px) rotateX(-0deg);
opacity: 0;
transition: all .6s 0s;}
.header .nav .ls:hover .pos{z-index: 11;visibility: visible;
transform: perspective(1920px) rotateX(-0deg);
height:389px;
opacity: 1;
transition: all .6s 0s;}
.header .nav .ls .pos .t{margin-top: 10px;line-height: 58px; font-size: 26px;color: #006db8;border-bottom: #c3c2c1 1px solid;}
.header .nav .ls .pos .list{padding:37px 0 60px;}
.header .nav .ls .pos .list a.fl{width: 20.6%;margin-right: 3%;}
.header .nav .ls .pos .list .pic{width: 100%;overflow: hidden;}
.header .nav .ls .pos .list .pic i{width: 100%;height: 100%;transform: scale(1);transition-duration: 0.5s;}
.header .nav .ls .pos .list p{display: inline-block;padding-right: 21px; line-height: 50px;font-size: 18px;color: #333;background: url(/img/icon_16.png) right center no-repeat;}
.header .nav .ls .pos .list a:hover .pic i{transform: scale(1.1);transition-duration: 0.5s;}
.header .nav .ls .pos .list a:hover p{color: #006db8;}
.header .nav .ls .pos dl{padding:37px 0 53px;}
.header .nav .ls .pos dl dt{float: left;width: 20.6%;height: 230px; overflow: hidden; }
.header .nav .ls .pos dl dt i{width: 100%;height: 100%;}
.header .nav .ls .pos dl dd{float: right;width: 75.73%;}
.header .nav .ls .pos dl dd a{float: left;width: 33.33%; font-size: 18px;color: #333;line-height: 41px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
.header .nav .ls .pos dl dd a:hover{color: #006db8;}
.header .nav .ls:nth-child(2) .pos .list a.fl{width:17.6%;}
.header .nav .ls:nth-child(2) .pos .list a.fl:nth-last-child(1){margin-right:0;}
.header .se{width: 17px;height: 24px;background: url(/img/icon_15.png) center no-repeat;cursor: pointer;}
.header .search{transition: all 0.5s; position: fixed;left: 0;top: 0;z-index: 11; width: 100%;height: 0px;background: #fff;overflow: hidden;}
.header .search .w1500{padding-top: 18px; height: 71px;}
.header .search .w1500 .clearfix{ height:70px;border-bottom: #c3c2c1 1px solid;}
.header .search .w1500 .but{width: 64px;height:70px;background: url(/img/icon_17.png) left center no-repeat;border: none;}
.header .search .w1500 .inp{float: left;width: 85%;}
.header .search .w1500 .inp input{width: 100%;height: 70px;line-height: 70px;font-size: 18px;}
.header .search .w1500 span{float: right;width: 50px;height: 70px;background: url(/img/icon_18.png) right center no-repeat;cursor: pointer;}
.header .search.block{transition: all 0.5s; height: 108px;}
.header_fixed{background: #fff;box-shadow: 0 0 10px rgba(0,0,0,0.1);}
.header_fixed .logo .img_1{display:none ;}
.header_fixed .logo .img_2{display:block ;}
.header_fixed .top{color: #333;}
.header_fixed .top a{color: #333;background: url(/img/icon_14s.png) right center no-repeat;}
.header_fixed .top a:hover{font-weight: normal; color: #006db8;background: url(/img/icon_14ss.png) right center no-repeat;}
.header_fixed .nav .ls .one{color: #333;}
.header_fixed .nav .ls:hover .one,.header_fixed .nav .ls.cur .one{font-weight: 100; color: #006db8;}
.header_fixed .se{background: url(/img/icon_15s.png) center no-repeat;}
.footer{background: #fff;position: relative;}
.footer .top{padding-bottom: 70px;}
.footer .top dl{float: left;margin-right: 6.4%;}
.footer .top dl dt{margin:60px 0 18px 0; font-size: 20px;color: #333;}
.footer .top dl dd a{font-size: 16px;color: #999;line-height: 32px;}
.footer .top dl dd a:hover{color: #006db8;}
.footer .top .dl_4{margin-right: 4.8%;width: 586px;}
.footer .top .dl_4 a{float: left;width: 293px;}
.footer .top .dl_6{margin-right: 0;float: right;}
@media(max-width:1900px){
.footer .top dl{margin-right: 5.7%;}
.footer .top .dl_4{margin-right: 2.8%;}
.footer .top dl dd a{font-size: 15px;}
}
@media(max-width:1771px){
.footer .top dl{margin-right: 5.4%;}
.footer .top .dl_4{margin-right: 0.8%;}
.footer .top dl dd a{font-size: 14px;}
}
@media(max-width:1680px){
.footer .top dl{margin-right: 3.7%;}
.footer .top .dl_4{margin-right: 0.4%;}
}
@media(max-width:1570px){
.footer .top dl{margin-right: 3.6%;}
.footer .top .dl_4{margin-right: 0%;}
}
.footer .bot{position: relative;height: 58px; background: #202020;}
.footer .bot .left{line-height: 58px;font-size: 16px;color: #555;}
.footer .bot .left a{margin-right: 16px; color: #555;}
.footer .bot .left a:hover{color: #006db8;}
.footer .bot .right div.fl{ margin-left: 16px;width: 35px;height: 58px;}
.footer_copyright .fl .icon{height: 35px;cursor: pointer; width: 35px;}
.footer .bot .right .icon_1{background: url(/img/icon_11.png) center no-repeat;}
.footer .bot .right .icon_2{background: url(/img/icon_10.png) center no-repeat;}
.footer_copyright .fl .icon_3{background: url(/img/icon_9.png) center no-repeat;}
.footer .bot .right .fl:hover .icon_1{background: url(/img/icon_11s.png) center no-repeat;}
.footer .bot .right .fl:hover .icon_2{background: url(/img/icon_10s.png) center no-repeat;}
.footer_copyright .fl:hover .icon_3{background: url(/img/icon_9s.png) center no-repeat;}
.footer_copyright .fl .weixin{display: none; position: absolute;right: -29px;bottom: 68px;z-index: 14; width: 100px;height: 104px;background: url(/img/icon_52.png) center bottom no-repeat;}
.footer_copyright .fl .weixin img{padding-top: 4px; margin:0 auto; width: 90px;}
.footer .Messages{transition: all 0.8s; position: absolute;right: -564px;bottom: 100px;z-index: 11; padding: 10px 35px 30px;width: 476px; background: #fff;box-shadow: 0 0 15px rgba(104,130,181,0.3);}
.footer .Messages .t{margin-bottom: 16px;position: relative; line-height: 78px; text-align: center;border-bottom: #e3e2e2 1px solid;}
.footer .Messages .t i{display: inline-block;padding-left: 37px;font-size: 24px;color: #333;font-weight: bold;background: url(/img/icon_13.png) left center no-repeat;}
.footer .Messages .t span{position: absolute;right: 0;top:25px;z-index: 10; width: 30px;height: 30px;background: url(/img/icon_18.png) center no-repeat;cursor: pointer;}
.footer .Messages dl{margin-bottom: 16px;}
.footer .Messages dt{line-height: 36px; font-size: 16px;color: #333;}
.footer .Messages dd .inp{padding:0 5px; border:#d5d5d5 1px solid;}
.footer .Messages dl.fl dd .inp{width: 219px;}
.footer .Messages dd input{width: 100%; height: 42px;line-height: 42px;font-size: 14px;color: #666;}
.footer .Messages dd textarea{padding:10px 0;width: 100%; height: 130px;line-height: 24px; font-size: 14px;color: #666; border:none;}
.footer .bot .right div.fl.inp{margin:0 22px 0 0; width: 219px;height: 42px;}
.footer .Messages dd img{float: left;margin-right: 15px; height: 42px;}
.footer .Messages dd i{float: left;line-height: 42px; font-size: 14px;color: #999; cursor: pointer;}
.footer .Messages dd i:hover{color: #006db8;}
.footer .Messages .but{margin:36px auto 0;display: block; width: 165px;height: 50px;line-height: 50px;text-align: center;font-size: 18px;color: #fff; background: #006db8;border: none;}
.footer .Messages.ans{transition: all 0.8s;right: -0px; }
@media(max-width:768px){ .w1500{width: 100%; max-width:100%; padding:0 10px; margin: 0 auto; }
.nav_box{display: none;}
}
@media(max-height:800px){
.footer_copyright{display:none;}
.footer .Messages .t{line-height: 48px;}
.footer .Messages .t i{font-size: 20px;}
.footer .Messages dt{line-height: 28px;font-size: 14px;}
.footer .Messages dd input{ height: 34px;line-height: 34px;}
.footer .Messages dd textarea{height: 80px;}
.footer .bot .right div.fl.inp{height: 36px;}
.footer .bot .right div.fl.inp i{line-height: 36px;}
.footer .Messages dd img{height: 36px;}
.footer .Messages .but{margin: 26px auto 0;height: 40px;line-height: 40px;}
}
@media(max-width:768px){
.footer .Messages{bottom: 70px;}
.footer .Messages .t{line-height: 46px;}
.footer .Messages dd textarea{height: 70px;}
.footer .Messages .but{margin: 22px auto 0;height: 36px;line-height: 36px;}
.bottom_ewm{width:100%;}
.bottom_ewm .icon_3{display:none;}
.footer_copyright .fl .icon_3{display:none;}
.footer_copyright .bottom_ewm .fl .weixin {
display: block;margin:0 auto;
position: static;}
.footer_copyright .fl{width:100%;}
.footer_copyright .fl .weixin{ display: block;margin:0 auto;
position: static;}
.footer-bot{overflow:hidden;}
}
/*由上方滑动下来且有渐显*/
.fadeInDown {
-webkit-animation-name: fadeInDown;
animation-name: fadeInDown
}
@-webkit-keyframes fadeInDown {
0% {
opacity: 0;
-webkit-transform: translate3d(0,-100%,0);
transform: translate3d(0,-100%,0)
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none
}
}
@keyframes fadeInDown {
0% {
opacity: 0;
-webkit-transform: translate3d(0,-100%,0);
-ms-transform: translate3d(0,-100%,0);
transform: translate3d(0,-100%,0)
}
100% {
opacity: 1;
-webkit-transform: none;
-ms-transform: none;
transform: none
}
}
/*由下方滑动上来 伴随着渐显*/
.fadeInUp {
-webkit-animation-name: fadeInUp;
animation-name: fadeInUp
}
@-webkit-keyframes fadeInUp {
0% {
opacity: 0;
-webkit-transform: translate3d(0,100%,0);
transform: translate3d(0,100%,0)
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none
}
}
@keyframes fadeInUp {
0% {
opacity: 0;
-webkit-transform: translate3d(0,100%,0);
-ms-transform: translate3d(0,100%,0);
transform: translate3d(0,100%,0)
}
100% {
opacity: 1;
-webkit-transform: none;
-ms-transform: none;
transform: none
}
}
/*从左滑动出来 伴随着渐显*/
.fadeInLeft {
-webkit-animation-name: fadeInLeft;
animation-name: fadeInLeft
}
@-webkit-keyframes fadeInLeft {
0% {
opacity: 0;
-webkit-transform: translate3d(-100%,0,0);
transform: translate3d(-100%,0,0)
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none
}
}
@keyframes fadeInLeft {
0% {
opacity: 0;
-webkit-transform: translate3d(-100%,0,0);
-ms-transform: translate3d(-100%,0,0);
transform: translate3d(-100%,0,0)
}
100% {
opacity: 1;
-webkit-transform: none;
-ms-transform: none;
transform: none
}
}
/*从右滑动出来 伴随着渐显*/
.fadeInRight {
-webkit-animation-name: fadeInRight;
animation-name: fadeInRight
}
@-webkit-keyframes fadeInRight {
0% {
opacity: 0;
-webkit-transform: translate3d(100%,0,0);
transform: translate3d(100%,0,0)
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none
}
}
@keyframes fadeInRight {
0% {
opacity: 0;
-webkit-transform: translate3d(100%,0,0);
-ms-transform: translate3d(100%,0,0);
transform: translate3d(100%,0,0)
}
100% {
opacity: 1;
-webkit-transform: none;
-ms-transform: none;
transform: none
}
}
/*从左滑动出来 伴随着渐显*/
.fadeInLefts {
-webkit-animation-name: fadeInLefts;
animation-name: fadeInLefts
}
@-webkit-keyframes fadeInLefts {
0% {
opacity: 0;
-webkit-transform: translate3d(-80px,0,0);
transform: translate3d(-80px,0,0)
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none
}
}
@keyframes fadeInLefts {
0% {
opacity: 0;
-webkit-transform: translate3d(-80px,0,0);
-ms-transform: translate3d(-80px,0,0);
transform: translate3d(-80px,0,0)
}
100% {
opacity: 1;
-webkit-transform: none;
-ms-transform: none;
transform: none
}
}
/*从右滑动出来 伴随着渐显*/
.fadeInRights {
-webkit-animation-name: fadeInRights;
animation-name: fadeInRights
}
@-webkit-keyframes fadeInRights {
0% {
opacity: 0;
-webkit-transform: translate3d(80px,0,0);
transform: translate3d(80px,0,0)
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none
}
}
@keyframes fadeInRights {
0% {
opacity: 0;
-webkit-transform: translate3d(80px,0,0);
-ms-transform: translate3d(80px,0,0);
transform: translate3d(80px,0,0)
}
100% {
opacity: 1;
-webkit-transform: none;
-ms-transform: none;
transform: none
}
}
.fadeOutUp {
-webkit-animation-name: fadeOutUp;
animation-name: fadeOutUp
}
@-webkit-keyframes fadeOutUp {
0% {
opacity: 1
}
100% {
opacity: 0;
-webkit-transform: translate3d(0,-100%,0);
transform: translate3d(0,-100%,0)
}
}
@keyframes fadeOutUp {
0% {
opacity: 1
}
100% {
opacity: 0;
-webkit-transform: translate3d(0,-100%,0);
-ms-transform: translate3d(0,-100%,0);
transform: translate3d(0,-100%,0)
}
}