.container{width:1240px;margin:0 auto}
.header .nav .sub-nav,.header .user-info .profile{background-color:rgba(5,15,36,.94)}
.header{height:50px;line-height:50px;color:#fff;background-color:#050f24;font-size:16px}
.header a{color:#fff;text-decoration:none}
.header .logo,.header .nav{float:left}
.header .logo{font-size:20px;margin-right:40px;height:50px;line-height:50px;margin:0 40px 0 0}
.header .logo a{color:#fff}
.header .logo i{font-size:30px;vertical-align:-3px}
.header .nav .nav-item{float:left;padding:0 20px;position:relative}
.header .nav .nav-item.on:after,.header .nav .nav-item:hover:after{content:"";width:100%;height:2px;position:absolute;bottom:0;left:0;background-color:#3ba5ff}
.header .nav .nav-item.on>a,.header .nav .nav-item:hover>a{color:#70bdff}
.header .nav .nav-item:hover .sub-nav{padding:20px 25px;max-height:500px;transition:max-height .3s ease}
.header .nav .nav-item:hover .sub-nav.single-col{padding:0;width:100%}
.header .nav .sub-nav{position:absolute;top:50px;left:0;z-index:10;overflow:hidden;max-height:0;text-align:center;white-space:nowrap}
.header .nav .sub-nav.single-col li{width:auto;margin-right:0;text-align:center}
.header .nav .sub-nav li{width:130px;display:inline-block;margin-right:80px;text-align:left;vertical-align:top}
.header .nav .sub-nav li:last-child{margin-right:0}
.header .nav .sub-nav a{display:block}
.header .nav .sub-nav a:hover{color:#70bdff}
.header .nav .sub-nav .col-title{color:#636668}
.header .user-info{display:inline-block;position:relative}
.header .user-info:hover .profile{max-height:150px}
.header .user-info .profile{position:absolute;width:100px;top:50px;left:-30px;z-index:10;text-align:center;max-height:0;transition:max-height .3s ease;overflow:hidden}
.fr{float:right}
h1{font-size:2em;margin:.67em 0}

.content{width:1200px;margin:0 auto;position:relative}
.banner-wrap{height:160px;color:#fff;background-size:cover}
.banner-wrap .content{overflow:hidden}
.banner-wrap .title{margin-top:45px;font-size:28px}
.banner-wrap .desc{margin-top:15px;font-size:18px}


/* 特色按钮 */
.primary-btn{display:inline-block;width:180px;height:48px;line-height:48px;background:linear-gradient(90deg,rgba(200,81,255,1),rgba(126,105,255,1));box-shadow:0 6px 40px 0 rgba(145,88,246,.5);border-radius:24px;color:#fff;font-size:18px;border:none;text-align:center}
.animation-btn{position:relative;-webkit-transition:all .1s;box-shadow:0 6px 40px 0 rgba(0,0,0,.35);transition:all .1s;z-index:0;overflow:hidden}
.animation-btn .anim{-moz-transform:translateY(-50%) translateX(-50%);-ms-transform:translateY(-50%) translateX(-50%);-webkit-transform:translateY(-50%) translateX(-50%);transform:translateY(-50%) translateX(-50%);position:absolute;top:50%;left:50%;z-index:-1}
.anim:before{position:relative;content:'';display:block;margin-top:100%}
.anim:after{content:'';position:absolute;top:0;bottom:0;left:0;right:0;border-radius:50%}
.animation-btn .anim{-moz-animation:anim-out .75s;-webkit-animation:anim-out .75s;animation:anim-out .75s}
.animation-btn .anim:after{-moz-animation:anim-out-pseudo .75s;-webkit-animation:anim-out-pseudo .75s;animation:anim-out-pseudo .75s}
.animation-btn .anim,.animation-btn .anim:after{animation-iteration-count:infinite;animation-duration:1.3s}
@-webkit-keyframes anim-in{0%{width:0%}
100%{width:100%}
}
@-moz-keyframes anim-in{0%{width:0%}
100%{width:100%}
}
@-ms-keyframes anim-in{0%{width:0%}
100%{width:100%}
}
@keyframes anim-in{0%{width:0%}
100%{width:100%}
}
@-webkit-keyframes anim-in-pseudo{0%{background:rgba(0,0,0,.25)}
100%{background:0 0}
}
@-moz-keyframes anim-in-pseudo{0%{background:rgba(0,0,0,.25)}
100%{background:0 0}
}
@-ms-keyframes anim-in-pseudo{0%{background:rgba(0,0,0,.25)}
100%{background:0 0}
}
@keyframes anim-in-pseudo{0%{background:rgba(0,0,0,.25)}
100%{background:0 0}
}
@-webkit-keyframes anim-out{0%{width:0%}
100%{width:100%}
}
@-moz-keyframes anim-out{0%{width:0%}
100%{width:100%}
}
@-ms-keyframes anim-out{0%{width:0%}
100%{width:100%}
}
@keyframes anim-out{0%{width:0%}
100%{width:100%}
}
@-webkit-keyframes anim-out-pseudo{0%{background:rgba(0,0,0,.25)}
100%{background:0 0}
}
@-moz-keyframes anim-out-pseudo{0%{background:rgba(0,0,0,.25)}
100%{background:0 0}
}
@-ms-keyframes anim-out-pseudo{0%{background:rgba(0,0,0,.25)}
100%{background:0 0}
}
@keyframes anim-out-pseudo{0%{background:rgba(0,0,0,.25)}
100%{background:0 0}
}
.animation-btn:hover{background:linear-gradient(90deg,rgba(177,49,236,1),rgba(97,74,236,1));box-shadow:0 6px 40px 0 rgba(0,0,0,.1);border:none}