body{background-color: #fff;} /* 上边距 */ .mT5{margin-top:5px;} .mT10{margin-top:10px;} /* 字号 */ .f12{font-size: 12px;} .f14{font-size: 14px;} .f16{font-size: 16px;} .f18{font-size: 18px;} .f20{font-size: 20px;} .f22{font-size: 22px;} .f24{font-size: 24px;} /* header */ .header{height: auto;width: 100%;min-width: 1200px;left:0; right: 0;margin: 0 auto;position: absolute; z-index: 5; background-color: #12468f; box-shadow:0 0 10px rgba(0,0,0,.4);} .nav-logo { height: 75px; width: 1200px; margin: 7px auto; } .logo{height: 75px;display: block;} .search-div { width: 280px; height: 35px; position: relative; z-index: 1;margin: 20px 0; overflow: hidden;-webkit-box-sizing: border-box; box-sizing: border-box; border-radius:10px;} .search-div input { width: 233px; height: 33px; border: 1px solid #ddd; padding: 0 5px; } .search-div>span { display: block; position: absolute; width: 35px; height: 35px; right: 0; top: 0; background: url("../images/s_bg.png") center center / 20px 17.5px no-repeat #e2e6eb; cursor: pointer; } .search-div>span:hover{opacity:.8} .logo img{height: 100%;} /* nav */ /* .nav-div { width: 100%; background: rgba(0,0,0,.3);} .nav{position: relative;text-align: left; width: 770px; margin: 0 auto;} .nav>li>a{display: block;height:72px;line-height:72px;width: 140px;border-right: 2px solid #fff;cursor: pointer;-webkit-transition: all .3s;-o-transition: all .3s;transition: all .3s; -webkit-box-sizing: border-box; box-sizing: border-box; text-align: center; color: #fff; } .nav .nav-active>a,.nav>li:hover>a{color: #047087; background: #fff; -webkit-transition: all .3s;-o-transition: all .3s;transition: all .3s;} .nav-active:after{content: '';height: 3px;width: 100%;background-color:#075a6a;position: absolute;left: 0;top: -3px;-webkit-transition: all .2s;-o-transition: all .2s;transition: all .2s;} .nav-bar{position: absolute;left: 0;top: -3px;width: 0;height: 3px;background-color: #075a6a;-webkit-transition: all .2s;-o-transition: all .2s;transition: all .2s;}*/ .nav-div { width: 100%; border-top:1px solid rgba(255,255,255,.1)} .nav{position: relative;text-align: left; width: 1200px; margin: 0 auto;} .nav>li{float: left;position: relative;} .nav>li>a{display: block;height:72px;line-height:72px;width: 140px;cursor: pointer;-webkit-transition: all .3s;-o-transition: all .3s;transition: all .3s; -webkit-box-sizing: border-box; box-sizing: border-box; text-align: center; color: #b1bdcd; } .nav .nav-active>a, .nav>li:hover>a{color:#fff; -webkit-transition: all .3s;-o-transition: all .3s;transition: all .3s;} .nav-active:after{content: '';height: 2px;width: 2em;background-color:#fff;position: absolute;left: 50%;margin-left:-1em;bottom: 3px;-webkit-transition: all .2s;-o-transition: all .2s;transition: all .2s;} .nav ul{display:none;position: absolute;z-index:50;line-height:36px;top:100%;left:0;padding:5px 0;min-width: 100%;background-color:#fff;border:1px solid #d2d2d2;-webkit-box-shadow:0 2px 4px rgba(0,0,0,.12);box-shadow:0 2px 4px rgba(0,0,0,.12);border-radius:4px;white-space:nowrap;} .nav ul a{display:block;padding: 0 30px;} .nav ul li:hover a{background-color: #fff;} .nav-bar{position: absolute;left: 0;bottom: 6px;width: 0;height: 2px;margin-left:-1em;background-color: #ffffff;-webkit-transition: all .2s;-o-transition: all .2s;transition: all .2s;} .anim{-webkit-animation-duration:.3s;animation-duration:.3s;-webkit-animation-fill-mode:both;animation-fill-mode:both;} @-webkit-keyframes upbit {from{-webkit-transform: translate3d(0,30px,0);opacity: .3}to{-webkit-transform: translate3d(0,0,0);opacity: 1}} @keyframes upbit {from{-webkit-transform: translate3d(0,30px,0);transform: translate3d(0,30px,0);opacity: .3}to{-webkit-transform: translate3d(0,0,0);transform: translate3d(0,0,0);opacity: 1}} .anim-upbit{-webkit-animation-name: upbit;animation-name: upbit} /* banner */ #banner{width: 100%;min-width:1200px;margin:0 auto;overflow:hidden;position: relative;} .banner-pic{width: 100%;position: relative;left:0;top:0;} .banner-pic>div{width: 100%;display:block;position: absolute;top: 0;overflow: hidden;left: 100%;z-index: 1;} .banner-pic>div.banner-active{left: 0;position: relative;top: 0;} .banner-pic>div>a{display: block;width: 100%;} .banner-pic>div>a>img{width: 100%;display:block;} .banner-pic>a>img{width:100%} /* banner 按钮 */ .banner-left,.banner-right{position: absolute;top:0;*top:48%;bottom:0;margin:auto;width:31px;height:61px;background-image:url("../images/imgMenu.png");cursor: pointer;z-index:10;opacity:0;filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0);-webkit-transition: all .2s linear;-o-transition: all .2s linear;transition: all .2s linear;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none; } .banner-left{ left: 2%;background-position:0 -122px;} .banner-right{right:2%;background-position:0 0; } #banner:hover .banner-left{left: 6%;opacity:.5;filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50);-webkit-transition: opacity,left .2s linear;-o-transition: opacity,left .2s linear;transition: opacity,left .2s linear;} #banner:hover .banner-right{right: 6%;opacity:.5;filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50);-webkit-transition: opacity,left .2s linear;-o-transition: opacity,left .2s linear;transition: opacity,left .2s linear;} .banner-left:hover{-webkit-transition: opacity,left .2s linear;-o-transition: opacity,left .2s linear;transition: opacity,left .2s linear;background-position:0 -183px;} .banner-right:hover{-webkit-transition: opacity,right .2s linear;-webkit-transition: opacity,left .2s linear;-o-transition: opacity,left .2s linear;transition: opacity,left .2s linear;background-position:0 -61px;} /* banner 小圆点 */ .banner-bottom{ position: absolute;bottom: 10px;text-align: center;width: 100%;z-index: 10;filter:progid:DXImageTransform.Microsoft.Alpha(opacity=80);opacity: .8;} .banner-bottom i.banner-label{display:inline-block;width:40px;height:10px;margin: 0 2px;background-color: #fff;cursor: pointer;} .banner-bottom i.banner-label.iconActive{ background-color: #ff5456; } /* footer */ .footer{width:100%;min-width:1200px;padding:18px 0;text-align:center;color:#fff;font-size:14px;background: #083a68 ;} .footer a{color:#fff;margin: 0 .5em 0 0;} .footer a:hover{text-decoration: underline;} .to-top{display:none;width: 46px;height: 46px;line-height:46px;text-align:center;background: #1353ad;opacity: .6;color: #fff;font-size: 14px;z-index: 100;border-radius:50%;} .to-top:hover{background: #3f9bd3;opacity: .85;}