@charset "UTF-8";
/* CSS Document */
.page-content{position:absolute;top:0;left:50%;margin-left:-960px;width:1920px;height:100%}
img{max-width:100%;}
#header{left:0;z-index:4;width:100%;background:rgba(255,255,255,.6);-webkit-box-shadow:0 2px 8px rgba(0,0,0,.1);-moz-box-shadow:0 2px 8px rgba(0,0,0,.1);box-shadow:0 2px 8px rgba(0,0,0,.1);-webkit-transition:background-color .5s;transition:background-color .5s;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);-webkit-perspective:1000px;perspective:1000px;-webkit-transform-style:preserve-3d;transform-style:preserve-3d;-webkit-backface-visibility:hidden;backface-visibility:hidden}

#header .header-nav{position:absolute;right:270px;width:576px;height:100%;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
#header .nav-item{display:block;width:144px;height:120px;color:#004258;text-align:center;font-size:18px}
#header .nav-logo{padding:0 90px}
#header .logo4{position:absolute;left:270px}
#header .downgroup{position:absolute;left:550px;width:464px;height:120px;background:url(../images/yellow-bg.jpg)}
#header .nav-item-active,#header .nav-item:hover{width:144px;height:120px;border-bottom:2px solid #39b1d8;background:#fff;background:-moz-linear-gradient(top,rgba(255,255,255,0),rgba(255,255,255,1));background:-webkit-gradient(linear,rgba(255,255,255,0),rgba(255,255,255,1));background:-webkit-linear-gradient(top,rgba(255,255,255,0),rgba(255,255,255,1));background:-o-linear-gradient(top,rgba(255,255,255,0),rgba(255,255,255,1));background:-ms-linear-gradient(top,rgba(255,255,255,0),rgba(255,255,255,1));background:linear-gradient(to bottom,rgba(255,255,255,0),rgba(255,255,255,1));color:#39b1d8;filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff', GradientType=0 )}
#header.headerfixed{position:fixed;top:0}
#header .nav-bbs{width:144px}
#header .downgroup .qrcode{position:relative;margin:7px 10px;width:102px;height:108px;border-radius:8px;background:#fff;box-shadow:0 0 5px rgba(0,0,0,.2)}
#header .downgroup .qrcode-img{position:absolute;top:50%;left:50%;margin-top:-45px;margin-left:-45px;width:90px;height:90px}
#header .downgroup .qrcode-line{position:absolute;left:50%;margin-left:-48px;width:96px;height:8px;-webkit-animation:mainbarcode 2.5s linear infinite .3s 0 ease;-moz-animation:mainbarcode 2.5s linear infinite .3s 0 ease;-ms-animation:mainbarcode 2.5s linear infinite .3s 0 ease;animation:mainbarcode 2.5s linear infinite .3s 0 ease;-moz-animation:mainbarcode 2.5s linear infinite;-webkit-animation:mainbarcode 2.5s linear infinite;-o-animation:mainbarcode 2.5s linear infinite;-ms-animation:mainbarcode 2.5s linear infinite;animation:mainbarcode 2.5s linear infinite}
#header .downgroup .text2{position:absolute;top:15px;left:120px;width:20px;height:90px;color:#000;text-align:center;font-size:16px;line-height:24px}
.downgroup .dowm-btn1{position:absolute;top:9px;left:155px;width:150px;height:48px; background: url(../images/down-btn1.png);}
.downgroup .dowm-btn1:hover{position:absolute;top:9px;left:155px;width:150px;height:48px; background: url(../images/down-btn1hov.png);}
.downgroup .dowm-btn2{position:absolute;bottom:9px;left:155px;width:150px;height:48px; background: url(../images/down-btn2.png);}
.downgroup .dowm-btn2:hover{position:absolute;bottom:9px;left:155px;width:150px;height:48px; background: url(../images/down-btn2hov.png);}
.downgroup .dowm-btn3{position:absolute;top:9px;right:15px;width:132px;height:103px; background: url(../images/down-btn3.png);}
.downgroup .dowm-btn3:hover{position:absolute;top:9px;right:15px;width:132px;height:103px; background: url(../images/down-btn3hov.png);}
#header .downgroup3{position:absolute;left:550px;width:464px;height:120px;background:url(../images/yellow-bg.jpg)}
.downgroup3 .qrcode{position:relative;margin:7px 10px;width:102px;height:108px;border-radius:8px;background:#fff;box-shadow:0 0 5px rgba(0,0,0,.2)}
.downgroup3 .qrcode-img{position:absolute;top:50%;left:50%;margin-top:-45px;margin-left:-45px;width:90px;height:90px}
.downgroup3 .qrcode-line{position:absolute;left:50%;margin-left:-48px;width:96px;height:8px;-webkit-animation:mainbarcode 2.5s linear infinite .3s 0 ease;-moz-animation:mainbarcode 2.5s linear infinite .3s 0 ease;-ms-animation:mainbarcode 2.5s linear infinite .3s 0 ease;animation:mainbarcode 2.5s linear infinite .3s 0 ease;-moz-animation:mainbarcode 2.5s linear infinite;-webkit-animation:mainbarcode 2.5s linear infinite;-o-animation:mainbarcode 2.5s linear infinite;-ms-animation:mainbarcode 2.5s linear infinite;animation:mainbarcode 2.5s linear infinite}
.downgroup3 .text2{position:absolute;top:15px;left:120px;width:20px;height:90px;color:#000;text-align:center;font-size:16px;line-height:24px}
.downgroup3 .dowm-btn1{position:absolute;top:9px;left:155px;width:150px;height:48px; background: url(../images/down-btn1.png);}
.downgroup3 .dowm-btn1:hover{position:absolute;top:9px;left:155px;width:150px;height:48px; background: url(../images/down-btn1hov.png);}
.downgroup3 .dowm-btn2{position:absolute;bottom:9px;left:155px;width:150px;height:48px; background: url(../images/down-btn2.png);}
.downgroup3 .dowm-btn2:hover{position:absolute;bottom:9px;left:155px;width:150px;height:48px; background: url(../images/down-btn2hov.png);}
.downgroup3 .dowm-btn3{position:absolute;top:9px;right:15px;width:132px;height:103px; background: url(../images/down-btn3.png);}
.downgroup3 .dowm-btn3:hover{position:absolute;top:9px;right:15px;width:132px;height:103px; background: url(../images/down-btn3hov.png);}
.downgroup3{top:80px;display:none}
@media (min-width:1901px){#header{position:absolute;top:40px;height:120px;line-height:118px}
.downgroup2{display:none}
}
@media (max-width:1900px){#header{position:absolute;top:40px;z-index:4;height:80px;line-height:80px;-webkit-transition:all 1s;-moz-transition:all 1s;-o-transition:all 1s;transition:all 1s}
#header.headerfixed{position:fixed;top:0;height:60px;line-height:60px;-webkit-transition:all 1s;-moz-transition:all 1s;-o-transition:all 1s;transition:all 1s}
#header .nav-logo{padding:0 110px}
#header .nav-logo img{bottom:0!important;width:200px}
#header .nav-item:hover,#header.headerlarge .nav-item-active{height:80px}
#header.headerfixed .nav-item-active,#header.headerfixed .nav-item:hover{height:58px}
#header.headerfixed .nav-logo{padding:0 120px}
#header.headerfixed .nav-logo img{bottom:0!important;width:180px}
#header .nav-item-active,#header .nav-item:hover{width:144px;height:80px}
#header .downgroup{display:none}
#header.headerfixed .downgroup3{top:60px}

/*#header .downgroup2 .qrcode{position:absolute;top:50%;left:550px;margin-top:-40px;width:60px;height:100%}
#header.headerfixed .downgroup2 .qrcode{position:absolute;top:50%;left:550px;margin-top:-30px;width:60px;height:100%}*/

#header .downgroup2 .qrcode{position:absolute;top:50%;left:550px;margin-top:-40px;width:360px;height:100%;padding-left:24px;}
#header.headerfixed .downgroup2 .qrcode{position:absolute;top:50%;left:550px;margin-top:-30px;width:360px;height:100%;padding-left: 24px;}

#header .downgroup2 .qrcode-img{position:absolute;top:50%;margin-top:-30px;width:60px;height:60px}
#header .downgroup2 .text2{position:absolute;top:50%;left:70px;margin-top:-29px;width:14px;height:58px;color:#000;text-align:center;font-size:12px;line-height:14px}
#header .logo4{width:200px}

.downgroup2 .qrcode .download_btn{height: 60px;width: auto;}
.piaoliu_btn1,.piaoliu_btn2{width: 120px;height:28px;border-radius: 5px;line-height:28px;}
.piaoliu_btn1{background-color: #1BA5F4;}
.piaoliu_btn2{background-color: #424242;}
.piaoliu_btn{color: #fff;font-size:14px;float: right;cursor: pointer;}
.piaoliu_btn3{width: 120px;height: 58px;	background-color: #00DDDA;border-radius:5px;line-height: 58px;}		
}

}
@media (max-width:1366px){#header .page-content {position: absolute;top: 0;left: 50%;margin-left: -683px;width: 1366px;height: 100%;}
#header .logo4 {left:25px;}
#header .header-nav {right: 50px;}
#header .header-nav {left:600px;}
#header .downgroup2 .qrcode {left: 240px;}
#header.headerfixed .downgroup2 .qrcode {left:240px;}
#header .downgroup3 {left:240px;}
}
@media (max-width:1024px){#header .page-content {position: absolute;top: 0;left: 50%;margin-left: -512px;width: 1024px;height: 100%;}
#header .logo4 {left:25px;}
#header .header-nav {right: 50px;}
#header .nav-item{display:block;width:120px;color:#004258;text-align:center;font-size:18px}
#header .nav-item:hover{display:block;width:120px;color:#004258;text-align:center;font-size:18px}
#header .nav-item-active,#header .nav-item:hover{width:120px;border-bottom:2px solid #39b1d8;background:#fff;background:-moz-linear-gradient(top,rgba(255,255,255,0),rgba(255,255,255,1));background:-webkit-gradient(linear,rgba(255,255,255,0),rgba(255,255,255,1));background:-webkit-linear-gradient(top,rgba(255,255,255,0),rgba(255,255,255,1));background:-o-linear-gradient(top,rgba(255,255,255,0),rgba(255,255,255,1));background:-ms-linear-gradient(top,rgba(255,255,255,0),rgba(255,255,255,1));background:linear-gradient(to bottom,rgba(255,255,255,0),rgba(255,255,255,1));color:#39b1d8;filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff', GradientType=0 )}
#header .header-nav {left:650px;}
#header .downgroup2 .qrcode {left: 240px;}
#header.headerfixed .downgroup2 .qrcode {left:240px;}
#header .downgroup3 {left:240px;}
}