blockquote,
body,
button,
dd,
div,
dl,
dt,
fieldset,
form,
h1,
h2,
h3,
h4,
h5,
h6,
img,
input,
li,
ol,
p,
pre,
select,
td,
textarea,
th,
ul {
    padding: 0;
    margin: 0;
    font-family: PingFang SC, -apple-system, Helvetica Neue, Arial, Hiragino Sans GB, Microsoft YaHei, WenQuanYi Micro Hei, sans-serif
}

body,
button,
input,
select,
textarea {
    outline: none
}

table {
    border-collapse: collapse;
    border-spacing: 0
}

caption,
th {
    text-align: left
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: 400;
    font-size: 100%
}

em,
i {
    font-style: normal
}

img {
    border: 0
}

li {
    list-style: none
}

textarea {
    resize: none
}

a,
a:focus,
a:hover,
a:visited {
    text-decoration: none
}

* {
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.clearfix {
    display: block;
    zoom: 1
}

.clearfix:after {
    content: " ";
    display: block;
    height: 0;
    line-height: 0;
    clear: both;
    visibility: hidden
}

.hide {
    display: none !important;
    opacity: 0;
    visibility: hidden
}

.ellipsis {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

@font-face {
    font-family: iconfont;
    src: url("../fonts/font_1487662_xkcykvkmo6.woff2") format("woff2"), url("../fonts/font_1487662_xkcykvkmo6.woff") format("woff"), url("../fonts/font_1487662_xkcykvkmo6.ttf") format("truetype")
}

.iconfont {
    font-family: iconfont !important;
    font-size: 16px;
    -webkit-text-stroke-width: .2px
}

@font-face {
    font-family: icomoon;
    src: url("../fonts/icomoon.ttf") format("truetype"), url("../fonts/icomoon.woff") format("woff"), url("../fonts/icomoon.svg") format("svg");
    font-weight: 400;
    font-style: normal;
    font-display: block
}

.iconfont,
[class*=" icon-"],
[class^=icon-] {
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

[class*=" icon-"],
[class^=icon-] {
    font-family: icomoon !important;
    speak: none;
    font-weight: 400;
    font-variant: normal;
    text-transform: none;
    line-height: 1
}

.icon-nav-user:before {
    content: "\E92E"
}

.icon-nav-menu:before {
    content: "\E92F"
}

.icon-yanjing:before {
    content: "\E922"
}

.icon-double-arrow:before {
    content: "\E920"
}

.icon-product-icon2:before {
    content: "\E927"
}

.icon-product-icon1:before {
    content: "\E928"
}

.icon-product-icon3:before {
    content: "\E929"
}

.icon-product-icon4:before {
    content: "\E92A"
}

.icon-product-icon5:before {
    content: "\E92B";
    color: #3c93d1
}

.icon-product-icon6:before {
    content: "\E92C";
    color: #ffb320
}

.icon-plus:before {
    content: "\E91D"
}

.icon-duigou:before {
    content: "\E91C"
}

.icon-rank:before {
    content: "\E916"
}

.icon-star-empty:before {
    content: "\E91A"
}

.icon-close:before {
    content: "\E91F"
}

.icon-star:before {
    content: "\E918"
}

.icon-plus-border:before {
    content: "\E91B"
}

.icon-profile:before {
    content: "\E913"
}

.icon-product-1:before {
    content: "\E90F"
}

.icon-product-2:before {
    content: "\E912"
}

.icon-product-3:before {
    content: "\E914"
}

.icon-product-4:before {
    content: "\E915"
}

.icon-menu:before {
    content: "\E92D"
}

.icon-yanjing-open:before {
    content: "\E926"
}

.icon-check-box:before {
    content: "\E921"
}

.icon-youxiang:before {
    content: "\E923"
}

.icon-weixin:before {
    content: "\E924"
}

.icon-shouji:before {
    content: "\E925"
}

.icon-minus:before {
    content: "\E91E"
}

.icon-product-5:before {
    content: "\E917"
}

.icon-product-6:before {
    content: "\E919"
}

.icon-calendar:before {
    content: "\E90B"
}

.icon-person:before {
    content: "\E90C"
}

.icon-persons:before {
    content: "\E909"
}

.icon-position:before {
    content: "\E90A"
}

.icon-swiper-right:before {
    content: "\E90D"
}

.icon-swiper-left:before {
    content: "\E90E"
}

.icon-college:before {
    content: "\E903"
}

.icon-product-8:before {
    content: "\E911"
}

.icon-product-7:before {
    content: "\E910"
}

.icon-search-glass:before {
    content: "\E908"
}

.icon-book:before {
    content: "\E900"
}

.icon-service:before {
    content: "\E904"
}

.icon-base:before {
    content: "\E905"
}

.icon-trumpet-on:before {
    content: "\E906"
}

.icon-trumpet-off:before {
    content: "\E907"
}

.icon-pause:before {
    content: "\E901"
}

.icon-play:before {
    content: "\E902"
}

.nav-box {
    position: relative
}

.nav-wrapper {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 80px;
    min-width: 1200px;
    display: block;
    background: #fff;
    z-index: 20;
    -webkit-box-shadow: 0 1px 1px rgba(26, 26, 26, .1);
    box-shadow: 0 1px 1px rgba(26, 26, 26, .1)
}

.nav-wrapper .nav-scroll {
    position: relative;
    top: 0;
    height: 80px;
    width: 1200px;
    margin: 0 auto;
    -webkit-transition: all .3s;
    transition: all .3s;
    z-index: 2;
    opacity: 1
}

.nav-wrapper .nav-scroll .logo-img {
    float: left;
    height: 80px
}

.nav-wrapper .nav-scroll .logo-img img {
    margin-top: 25px;
    height: 30px;
    vertical-align: middle
}

.nav-wrapper .nav-scroll .nav-list {
    float: right;
    font-size: 0;
    vertical-align: middle
}

.nav-wrapper .nav-scroll .nav-list.search-active>li {
    padding: 0 10px
}

.nav-wrapper .nav-scroll .nav-list>li {
    float: left;
    height: 80px;
    padding: 0 18px;
    line-height: 80px;
    font-size: 15px;
    -webkit-transition: all .2s;
    transition: all .2s;
    position: relative
}

.nav-wrapper .nav-scroll .nav-list>li:last-child {
    padding-right: 0
}

.nav-wrapper .nav-scroll .nav-list>li.nav-hot {
    position: relative
}

@-webkit-keyframes hot-fade {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }

    50% {
        -webkit-transform: scale(.9);
        transform: scale(.9)
    }

    to {
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

@keyframes hot-fade {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }

    50% {
        -webkit-transform: scale(.9);
        transform: scale(.9)
    }

    to {
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

.nav-wrapper .nav-scroll .nav-list>li.nav-hot:after {
    content: "";
    position: absolute;
    display: block;
    width: 22px;
    height: 16px;
    top: 16px;
    right: 5px;
    background: url(../images/icon_hot@2x.png) no-repeat;
    background-size: cover;
    -webkit-transform-origin: 0 40px;
    transform-origin: 0 40px;
    -webkit-animation: hot-fade 1s infinite;
    animation: hot-fade 1s infinite
}

.nav-wrapper .nav-scroll .nav-list>li:hover .nav-icon {
    color: #3c93d1
}

.nav-wrapper .nav-scroll .nav-list>li:hover .nav-custom-menu {
    visibility: visible;
    opacity: 1
}

.nav-wrapper .nav-scroll .nav-list>li.app-download {
    padding-right: 2px
}

.nav-wrapper .nav-scroll .nav-list>li.app-download:hover {
    background: #fff;
    color: #fff
}

.nav-wrapper .nav-scroll .nav-list>li.app-download:hover a {
    border: none;
    color: #fff
}

.nav-wrapper .nav-scroll .nav-list>li .nav-icon {
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto 0;
    display: block;
    font-size: 12px;
    -webkit-transform: scale(.4) rotate(0deg);
    transform: scale(.4) rotate(0deg)
}

.nav-wrapper .nav-scroll .nav-list>li .nav-custom-menu {
    width: 144px;
    visibility: hidden;
    opacity: 0;
    position: absolute;
    -webkit-transform: translate(-50%);
    transform: translate(-50%);
    left: 50%;
    top: 55px;
    z-index: 10;
    padding-top: 20px;
    -webkit-transition: all .3s;
    transition: all .3s;
    -webkit-filter: drop-shadow(0 1px 7px rgba(0, 0, 0, .4));
    filter: drop-shadow(0 1px 7px rgba(0, 0, 0, .4))
}

.nav-wrapper .nav-scroll .nav-list>li .nav-custom-menu .custom-menu-list {
    position: relative;
    padding-top: 10px;
    padding-bottom: 10px;
    background: #fff;
    -webkit-box-shadow: 0 0 8px 0 rgba(0, 0, 0, .1);
    box-shadow: 0 0 8px 0 rgba(0, 0, 0, .1);
    border-radius: 4px
}

.nav-wrapper .nav-scroll .nav-list>li .nav-custom-menu .custom-menu-list>li {
    line-height: 22px;
    text-align: center
}

.nav-wrapper .nav-scroll .nav-list>li .nav-custom-menu .custom-menu-list>li a {
    line-height: 46px;
    display: block;
    color: #333;
    font-size: 16px
}

.nav-wrapper .nav-scroll .nav-list>li .nav-custom-menu .custom-menu-list>li:hover {
    background: #3c93d1
}

.nav-wrapper .nav-scroll .nav-list>li .nav-custom-menu .custom-menu-list>li:hover a {
    color: #fff
}

.nav-wrapper .nav-scroll .nav-list>li .nav-custom-menu .custom-menu-list>li.wordmp {
    position: relative
}

.nav-wrapper .nav-scroll .nav-list>li .nav-custom-menu .custom-menu-list>li.wordmp:hover .wordmp-box {
    visibility: visible;
    opacity: 1
}

.nav-wrapper .nav-scroll .nav-list>li .nav-custom-menu .custom-menu-list>li.wordmp .wordmp-box {
    visibility: hidden;
    opacity: 0;
    width: 150px;
    height: 150px;
    position: absolute;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    right: -155px;
    top: 0;
    -webkit-box-shadow: 0 0 8px 0 rgba(0, 0, 0, .1);
    box-shadow: 0 0 8px 0 rgba(0, 0, 0, .1);
    border-radius: 2px
}

.nav-wrapper .nav-scroll .nav-list>li .nav-custom-menu .custom-menu-list>li.wordmp .wordmp-box img {
    display: block;
    width: 100%;
    height: 100%
}

.nav-wrapper .nav-scroll .nav-list>li .nav-custom-menu .custom-menu-list:before {
    content: "";
    position: absolute;
    z-index: 10;
    left: 50%;
    top: -17px;
    margin-left: -10px;
    border: 10px solid transparent;
    border-bottom: 7px solid #fff
}

.nav-wrapper .nav-scroll .nav-list>li>a {
    display: inline-block;
    width: auto;
    height: 62px;
    padding: 0 2px 5px;
    color: #333;
    font-weight: 400;
    font-size: 16px;
    text-decoration: none
}

.nav-wrapper .nav-scroll .nav-list>li.active>a,
.nav-wrapper .nav-scroll .nav-list>li:hover>a {
    color: #3c93d1;
    border-bottom: 3px solid #3c93d1
}

.nav-wrapper .nav-scroll .nav-list>li.active>a.signup,
.nav-wrapper .nav-scroll .nav-list>li:hover>a.signup {
    color: #fff
}

.nav-wrapper .nav-scroll .nav-list>li.lang-switch:hover a,
.nav-wrapper .nav-scroll .nav-list>li.search-input-wrapper:hover a {
    border-bottom: 0
}

.nav-wrapper .nav-scroll .nav-list>li .search-input-box.active input,
.nav-wrapper .nav-scroll .nav-list>li .search-input-box:hover input {
    margin-right: -32px;
    padding: 5px 34px 5px 15px;
    opacity: 1;
    width: 206px
}

.nav-wrapper .nav-scroll .nav-list>li .search-input-box .search-glass {
    position: relative;
    top: 2px;
    z-index: 1;
    display: inline-block;
    width: 24px;
    height: 24px;
    font-size: 16px;
    cursor: pointer;
    color: #333
}

.nav-wrapper .nav-scroll .nav-list>li .search-input-box input {
    width: 0;
    height: 28px;
    border-radius: 15px;
    -webkit-transition: all .2s;
    transition: all .2s;
    opacity: 0;
    border: 0;
    border-radius: 14px;
    font-size: 14px;
    background: #eee
}

.nav-wrapper .nav-scroll .nav-list>li .search-input-box input input::-webkit-input-placeholder {
    color: #999
}

.nav-wrapper .nav-scroll .nav-list>li .search-input-box input input:-moz-placeholder {
    color: #999
}

.nav-wrapper .nav-scroll .nav-list>li .search-input-box input input:-ms-input-placeholder {
    color: #999
}

.nav-wrapper .nav-scroll .nav-list>li .app-btn {
    display: inline-block;
    height: 28px;
    width: 96px;
    margin-top: 26px;
    line-height: 28px;
    text-align: center;
    font-size: 14px;
    color: #fff;
    border-radius: 14px;
    background: #ffa00e;
    vertical-align: top;
    padding: 0;
    border: 0;
    -webkit-transition: all .2s;
    transition: all .2s
}

.nav-wrapper .nav-scroll .nav-list>li .app-btn:hover {
    padding: 0;
    color: #fff;
    border: 0;
    opacity: .7
}

.nav-wrapper .nav-scroll .nav-list>li .signup {
    display: inline-block;
    height: 28px;
    width: 64px;
    margin-top: 26px;
    line-height: 28px;
    text-align: center;
    font-size: 14px;
    color: #fff;
    border-radius: 14px;
    background: #3c93d1;
    vertical-align: top;
    padding: 0;
    border: 0;
    -webkit-transition: all .2s;
    transition: all .2s
}

.nav-wrapper .nav-scroll .nav-list>li .signup:hover {
    padding: 0;
    border: 0;
    background: #e5f6ff;
    color: #3c93d1 !important
}

.nav-wrapper .nav-scroll .nav-list>li .person {
    position: relative;
    display: inline-block;
    height: 25px;
    line-height: 1em;
    vertical-align: middle
}

.nav-wrapper .nav-scroll .nav-list>li .person .btn-box {
    background-size: cover;
    background-position: 50%;
    background-repeat: no-repeat;
    display: inline-block;
    width: 25px;
    height: 25px;
    border-radius: 50%;
    cursor: pointer
}

.nav-wrapper .nav-scroll .nav-list>li .person .btn-box .vip-icon {
    display: inline-block;
    width: 20px;
    height: 20px;
    position: absolute;
    right: -5px;
    bottom: -5px;
    background: url(../images/user-vip.png) no-repeat;
    background-size: 20px
}

.nav-wrapper .nav-scroll .nav-list>li .person.active .panel,
.nav-wrapper .nav-scroll .nav-list>li .person:hover .panel {
    opacity: 1;
    visibility: visible
}

.nav-wrapper .nav-scroll .nav-list>li .person .panel {
    -webkit-transition: all .1s;
    transition: all .1s;
    opacity: 0;
    visibility: hidden;
    position: absolute;
    top: 50px;
    left: -48px;
    z-index: 2;
    width: 122px;
    padding: 6px 0;
    background: #fff;
    border-radius: 2px;
    -webkit-box-shadow: 0 0 20px rgba(26, 26, 26, .1);
    box-shadow: 0 0 20px rgba(26, 26, 26, .1)
}

.nav-wrapper .nav-scroll .nav-list>li .person .panel:after {
    display: block;
    content: " ";
    position: absolute;
    top: -16px;
    left: 50%;
    margin-left: -10px;
    border-bottom: 10px solid #fff;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-top: 10px solid transparent
}

.nav-wrapper .nav-scroll .nav-list>li .person .panel .info-list {
    width: 100%
}

.nav-wrapper .nav-scroll .nav-list>li .person .panel .info-list .info-item {
    display: block;
    width: 100%;
    line-height: 1em;
    text-align: left;
    cursor: pointer
}

.nav-wrapper .nav-scroll .nav-list>li .person .panel .info-list .info-item:hover {
    background: #f6f6f6
}

.nav-wrapper .nav-scroll .nav-list>li .person .panel .info-list .info-item a {
    display: inline-block;
    width: 100%;
    padding: 10px 20px 10px 42px;
    font-size: 14px;
    color: #8b979d
}

.nav-wrapper .nav-scroll .nav-list>li .person .panel .info-list .info-item a.person-center {
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAiCAMAAAB/VplGAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAA5UExURUxpcYuXnYuXnYuXnYuXnYuXnYuXnYuXnYuXnYuXnYuXnYuXnYuXnYuXnYuXnYuXnYuXnYuXnYuXnRV3ygQAAAASdFJOUwA1t4bV90PgEeolyE+jZHePblDCCrkAAAC0SURBVDjLxdJJEoQgDAXQMIZJwdz/sF3algIBqnrVf/vEwAeAKikao3eYZKMr2g010h0c+UFPNq7Ov0yWca6UJGNZs2fT638TiX60adj+xqAbDpPK7mLYzlPNatEpkRm0al8eXtqxqPxMMPO14ITAi1Ngo4OKdS+6VK263HbyPXoJbMttdtZHG7XU0+WKNeCK/R8ZQfi5Rte/8MGbSaMPzPbeSijdCMzdpVolNaL3qKPMz8IPBOgo3G0ulJYAAAAASUVORK5CYII=) no-repeat;
    background-size: 15px;
    background-position: 20px
}

.nav-wrapper .nav-scroll .nav-list>li .person .panel .info-list .info-item a.setup {
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAMAAAAM7l6QAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAABCUExURUxpcYuXnYuXnYuXnYuXnYuXnYuXnYuXnYuXnYuXnYuXnYuXnYuXnYuXnYuXnYuXnYuXnYuXnYuXnYuXnYuXnYuXnWCodnEAAAAVdFJOUwAH6g4XmKT7x/Qh4LS9dFdk1kk2igHsRboAAAD3SURBVCjPhVNZFsMgCFTrgktsmtT7X7UuaEiftvOhhIkCAzJG8LQZka2wpYzXhHjUVRTaEwdCiWfZCptMsQ4LF/vOXi2drnQKp1R525Dkqp1KA7au0ALItIBrx/c5++6xw4y9CuQ9LigFaBs5aNlc/iwfDhp9dhYrEg8qXno5XnTW/p5ojoUOEXY2UiEy6eFktluKdG7o84+eXa6uyyN4810olu6hCifDXaaWmR+VuPY7VIdsrDmuYD2/EKPGmy2fpELQx4Ed84buOIarcWg94HoxTJzE3uS5oT5HrZT2QMQRxZRDuwA66PznM0DA6hHhyIqM2xP8AAb1JLZcA7+tAAAAAElFTkSuQmCC) no-repeat;
    background-size: 15px;
    background-position: 20px
}

.nav-wrapper .nav-scroll .nav-list>li .person .panel .info-list .info-item a.login-out {
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAgCAMAAAAynjhNAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAA/UExURUxpcYuXnYuXnYuXnYuXnYuXnYuXnYuXnYuXnYuXnYuXnYuXnYuXnYuXnYuXnYuXnYuXnYuXnYuXnYuXnYuXnWBWy1YAAAAUdFJOUwDz6S06ULkgbDDifKrIXg6cjdf7pPNpcQAAAPxJREFUKM+VU9sCgyAI9dLU0mwV//+tE0yFth7GS8LpCAdQKW52MS/1aJsGgO0R9gWF+X94ip7DIWWOxhpucCif90DfGE4DXvHrOBcgS3bnz+TsIjeFagsMHoOs/EU4nnLjCmGhRZG8fOvG8s7S5pFFwL6WGwdZdu0gca5KHvB0OZj9UEsrGyeGsG99Lmej9EhNjL3PvgBawspbJWF+uRwiXb6y0oQFksSFCUPeSnd0MffNKVn1b7q7ZkLNj3c094mfILT1sq+drrMV4mooslUD1+uzCcSyVRfWMFk7BXd5t1WV5kShRoLnTcq2sx908t/PM6fDaG0OF8Yj/QBGGhuOK9Or+QAAAABJRU5ErkJggg==) no-repeat;
    background-size: 15px;
    background-position: 20px
}

.nav-wrapper .nav-scroll .nav-list>li .switch-btn span {
    position: relative;
    display: inline-block;
    font-size: 12px;
    color: #999;
    line-height: 1
}

.nav-wrapper .nav-scroll .nav-list>li .switch-btn span:before {
    position: absolute;
    display: inline-block;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #eaf8ff;
    z-index: -1
}

.nav-wrapper .nav-scroll .nav-list>li .switch-btn span.active {
    font-size: 16px;
    color: #3c93d1;
    font-weight: 600
}

.nav-wrapper .nav-scroll .nav-list>li .switch-btn span.active:before {
    content: " "
}

.nav-wrapper .nav-scroll .nav-list>li .switch-btn span.switch-text--cn:before {
    left: -5px;
    top: -4px
}

.nav-wrapper .nav-scroll .nav-list>li .switch-btn span.switch-text--en:before {
    left: 6px;
    top: 2px
}

.nav-wrapper .nav-tab-scroll {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 56px;
    z-index: 1;
    overflow: hidden
}

.nav-wrapper.active-header .nav-scroll {
    top: -56px;
    opacity: 0
}

.nav-wrapper.active-header .tab-nav {
    top: 0
}

.nav-wrapper.active-content .nav-scroll {
    top: -56px;
    opacity: 0
}

.nav-wrapper.active-content .tab-nav {
    top: -56px
}

.banner-box {
    height: 420px;
    width: 100%;
    margin-top: 56px
}

.banner-box .banner {
    position: fixed;
    top: 80px;
    left: 0;
    height: 420px;
    width: 100%;
    background: url("../images/banner.jpg") no-repeat;
    background-size: cover;
    background-position: 50%
}

.banner-box .banner .banner-title {
    width: 100%;
    height: 420px;
    background: rgba(0, 0, 0, .2);
    opacity: 1
}

.banner-box .banner .banner-title h2 {
    padding-top: 120px;
    font-size: 55px;
    color: #fff;
    text-align: center;
    line-height: 60px;
    letter-spacing: .05em
}

.banner-box .banner .banner-title p {
    padding-top: 12px;
    line-height: 40px;
    font-size: 22px;
    color: #fff;
    text-align: center;
    letter-spacing: .1em;
    font-weight: 300
}

.banner-box .banner .banner-title .register-box {
    margin-top: 30px;
    font-size: 0
}

.banner-box .banner .banner-title .register-box .btn {
    display: inline-block;
    height: 35px;
    padding: 6px 12px;
    cursor: pointer;
    font-size: 14px;
    -webkit-transition: all .2s;
    transition: all .2s;
    background: #fff;
    color: #ae6596;
    border-radius: 4px;
    border: 0;
    line-height: 23px;
    border-radius: 0;
    padding: 0;
    width: 136px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    font-size: 16px;
    margin-right: 50px;
    opacity: .8;
    letter-spacing: .1em;
    font-weight: 400;
    -webkit-transition: .2s;
    transition: .2s
}

.banner-box .banner .banner-title .register-box .btn:hover,
.banner-box .banner .banner-title .register-box .btn:visited {
    background: #fff;
    color: #ae6596
}

.banner-box .banner .banner-title .register-box .btn:hover {
    opacity: 1
}

.banner-box .banner .banner-title .register-box .person,
.banner-box .banner .banner-title .register-box .register {
    font-weight: 400;
    color: #fff;
    font-size: 16px;
    opacity: .9;
    letter-spacing: .1em;
    -webkit-transition: .2s;
    transition: .2s
}

.banner-box .banner .banner-title .register-box .person:hover,
.banner-box .banner .banner-title .register-box .register:hover {
    opacity: 1
}

.banner-box .banner .banner-tip-box {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 50px
}

.banner-box .banner .banner-tip-box .banner-tip {
    position: absolute;
    left: 0;
    bottom: 0;
    width: auto;
    height: 40px;
    padding: 0 20px;
    text-align: left;
    font-size: 10px;
    letter-spacing: .1em;
    color: #eee
}

.banner-box .banner .banner-tip-box .banner-tip p {
    line-height: 14px
}

.banner-box img {
    width: 100%;
    height: 100%
}

.login-container {
    display: none
}

@media screen and (max-width:768px) {
    .nav-box {
        display: none
    }
}

.footer {
    position: relative;
    bottom: 0;
    left: 0;
    right: 0;
    height: 300px;
    background: #333;
    color: #eee;
    text-align: left;
    font-size: 0;
    z-index: 10;
    overflow-x: hidden
}

.footer .footer-layout {
    width: 1180px;
    margin: 0 auto;
    padding-top: 60px
}

.footer .footer-layout .footer-l {
    display: block;
    width: 700px;
    float: left
}

.footer .footer-layout .footer-l .footer-item {
    float: left;
    width: 230px
}

.footer .footer-layout .footer-l .footer-item .item-label {
    margin-bottom: 25px;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.4em;
    letter-spacing: .05em;
    list-style: none
}

.footer .footer-layout .footer-l .footer-item .item-label.item-label-below {
    margin-top: 40px
}

.footer .footer-layout .footer-l .footer-item .item-text {
    margin-bottom: 16px;
    line-height: 1.4em;
    letter-spacing: .05em;
    list-style: none;
    font-size: 12px
}

.footer .footer-layout .footer-l .footer-item .item-text:last-child {
    margin-bottom: 0
}

.footer .footer-layout .footer-l .footer-item .item-text a {
    letter-spacing: .05em;
    line-height: 1em;
    font-size: 14px;
    color: #eee
}

.footer .footer-layout .footer-r {
    float: right;
    display: block;
    width: 430px;
    left: -35px
}

.footer .footer-layout .footer-r .footer-item {
    width: 100%
}

.footer .footer-layout .footer-r .footer-item .share-icon {
    width: 100%;
    height: 43px
}

.footer .footer-layout .footer-r .footer-item .share-icon .icon-box {
    position: relative;
    float: left;
    width: 120px;
    padding: 10px;
    height: 170px;
    margin-left: 20px;
    background: hsla(0, 0%, 100%, .06);
    line-height: 1
}

.footer .footer-layout .footer-r .footer-item .share-icon .icon-box:first-child {
    margin-left: 0
}

.footer .footer-layout .footer-r .footer-item .share-icon .icon-box img {
    width: 100px;
    height: 100px
}

.footer .footer-layout .footer-r .footer-item .share-icon .icon-box p {
    margin-top: 23px;
    text-align: center;
    font-size: 14px;
    color: #fff;
    line-height: 1
}

.footer .footer-layout .footer-bottom {
    position: absolute;
    bottom: 60px;
    height: 17px;
    font-size: 14px;
    color: #eee;
    line-height: 17px
}

@media screen and (max-width:768px) {
    .footer {
        display: none
    }
}

.mobile-nav {
    background: #464cd0;
    height: px2rem(50)
}

.mobile-nav.mobile-crumbs .nav-menu {
    position: relative;
    background: #fff;
    -webkit-box-shadow: 0 px2rem(1) 0 0 rgba(0, 0, 0, .06);
    box-shadow: 0 0 0 px2rem(1) rgba(0, 0, 0, .06)
}

.mobile-nav.mobile-crumbs .nav-menu a {
    color: #aaa
}

.mobile-nav .nav-menu {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%;
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    z-index: 11;
    overflow-x: hidden;
    background: rgba(70, 76, 208, .8)
}

.mobile-nav .nav-menu .input-box {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    height: px2rem(50);
    margin-right: px2rem(10);
    padding: px2rem(10) px2rem(15);
    font-size: px2rem(0);
    color: #333
}

.mobile-nav .nav-menu .input-box input {
    width: 100%;
    height: px2rem(30);
    padding: px2rem(5) px2rem(10);
    background: #fff;
    border-radius: px2rem(20);
    border: 0;
    -webkit-appearance: none;
    font-size: px2rem(14)
}

.mobile-nav .nav-menu .nav-app {
    display: block;
    width: px2rem(24);
    height: px2rem(24);
    margin-right: px2rem(10)
}

.mobile-nav .nav-menu .nav-app img {
    display: block;
    width: 100%;
    height: 100%
}

.mobile-nav .nav-menu a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: px2rem(40);
    height: px2rem(40);
    color: #fff
}

.mobile-nav .nav-menu a.nav-item--login i {
    font-size: px2rem(20)
}

.mobile-nav .nav-menu a.nav-item--menu {
    margin-right: px2rem(6)
}

.mobile-nav .nav-menu a i {
    font-size: px2rem(19)
}

.mobile-nav .nav-menu .title-box {
    -ms-flex-align: center;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    height: px2rem(50);
    margin-right: px2rem(10);
    padding: px2rem(10) px2rem(15) px2rem(10) 0;
    font-size: px2rem(0)
}

.mobile-nav .nav-menu .title-box,
.mobile-nav .nav-menu .title-box .back-btn {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    align-items: center
}

.mobile-nav .nav-menu .title-box .back-btn {
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 px2rem(40);
    flex: 0 0 px2rem(40);
    height: px2rem(40);
    font-size: px2rem(17);
    color: #3c93d1
}

.mobile-nav .nav-menu .title-box .page-title {
    position: relative;
    left: 46px;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    max-width: px2rem(165);
    font-size: px2rem(17);
    font-weight: 600;
    color: #333;
    text-align: center
}

.mobile-nav .nav-panel {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 100;
    opacity: 0;
    visibility: hidden;
    background: rgba(0, 0, 0, .5);
    -webkit-transition: all .2s;
    transition: all .2s
}

.mobile-nav .nav-panel.active {
    opacity: 1;
    visibility: visible
}

.mobile-nav .nav-panel.active .panel-nav {
    -webkit-transform: translateY(0) scaleX(1);
    transform: translateY(0) scaleX(1)
}

.mobile-nav .nav-panel .panel-nav {
    position: relative;
    height: 100%;
    width: 100%;
    -webkit-transform: translateY(200px) scale3d(.7, .7, 1);
    transform: translateY(200px) scale3d(.7, .7, 1);
    margin-top: px2rem(50);
    -webkit-box-shadow: 0 0 10px 0 rgba(0, 0, 0, .1);
    box-shadow: 0 0 10px 0 rgba(0, 0, 0, .1);
    -webkit-transition: all .2s;
    transition: all .2s;
    font-size: 0
}

.mobile-nav .nav-panel .panel-nav .panel-header {
    position: absolute;
    right: px2rem(15);
    top: px2rem(-15);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: px2rem(42);
    width: px2rem(42);
    background: #464dd0;
    border-radius: 50%;
    color: #fff
}

.mobile-nav .nav-panel .panel-nav .panel-header i {
    font-size: px2rem(18)
}

.mobile-nav .nav-panel .panel-nav .panel-menu {
    padding: px2rem(15) px2rem(25);
    padding-bottom: px2rem(90);
    padding-top: px2rem(35);
    height: 100%;
    overflow-y: auto;
    background: #fff;
    border-radius: px2rem(20) px2rem(20) 0 0
}

.mobile-nav .nav-panel .panel-nav .panel-menu .panel-menu-nav {
    margin-bottom: px2rem(15);
    color: #333
}

.mobile-nav .nav-panel .panel-nav .panel-menu .panel-menu-nav .menu-nav-label {
    position: relative;
    padding-left: px2rem(10);
    font-size: px2rem(15);
    font-weight: 600;
    line-height: 1
}

.mobile-nav .nav-panel .panel-nav .panel-menu .panel-menu-nav .menu-nav-label:before {
    content: " ";
    display: inline-block;
    position: absolute;
    left: 0;
    top: 0;
    width: px2rem(4);
    height: 1em;
    border-radius: px2rem(3);
    background: #3c93d1
}

.mobile-nav .nav-panel .panel-nav .panel-menu .panel-menu-nav .menu-nav-list {
    padding: px2rem(10) px2rem(15);
    padding-left: 0;
    width: px2rem(390)
}

.mobile-nav .nav-panel .panel-nav .panel-menu .panel-menu-nav .menu-nav-list .menu-nav-item {
    display: inline-block;
    padding: px2rem(6) px2rem(10);
    padding-right: px2rem(40);
    font-size: px2rem(15)
}

.mobile-nav .nav-panel .panel-nav .panel-menu .panel-menu-nav .menu-nav-list .menu-nav-item a {
    color: #3c93d1
}

@media screen and (min-width:769px) {
    .mobile-nav {
        display: none
    }
}

.footer-mobile {
    position: relative;
    background: #333;
    color: #aaa;
    padding: px2rem(20) px2rem(15);
    font-size: px2rem(12);
    font-weight: 500
}

.footer-mobile .footer-nav-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: px2rem(10)
}

.footer-mobile .footer-nav-item:last-child {
    margin-bottom: 0
}

.footer-mobile .footer-nav-item .nav-item-label {
    width: px2rem(80)
}

.footer-mobile .footer-nav-item .nav-item-text {
    margin-right: px2rem(15);
    color: #aaa;
    font-size: px2rem(11);
    font-weight: 400
}

.footer-mobile .footer-nav-item .nav-item-text:last-child {
    margin-right: 0
}

.footer-mobile .footer-nav-ccb {
    position: relative;
    display: block;
    text-align: center
}

.footer-mobile .footer-nav-ccb:after {
    position: absolute;
    left: 60px;
    right: 60px;
    top: 50%;
    content: " ";
    height: 1px;
    background: #555
}

.footer-mobile .footer-nav-ccb .ccb-text {
    position: relative;
    z-index: 1;
    padding: 0 px2rem(20);
    background: #333
}

.footer-mobile-sicfl .footer-nav-item .nav-item-label {
    width: px2rem(110)
}

.footer-mobile-sicfl .footer-nav-item:nth-child(2) .nav-item-label {
    width: px2rem(70)
}

.footer-mobile-sicfl .footer-nav-item:nth-child(2) .nav-item-text {
    margin-right: px2rem(30)
}

@media screen and (min-width:769px) {
    .footer-mobile {
        display: none
    }
}

.assistant-fix {
    position: fixed;
    bottom: 200px;
    right: 50px;
    width: 40px;
    height: 130px;
    z-index: 1000;
    font-size: 0;
    line-height: 1
}

.assistant-fix .assistant-item {
    position: relative;
    display: inline-block;
    width: 40px;
    height: 42px
}

.assistant-fix .assistant-item i {
    display: inline-block;
    width: 40px;
    height: 40px
}

.assistant-fix .assistant-item:hover .assistant-panel {
    display: block
}

.assistant-fix .assistant-item:hover:first-child i {
    background-position: 0 -126px
}

.assistant-fix .assistant-item:hover:nth-child(2) i {
    background-position: 0 -168px
}

.assistant-fix .assistant-item:hover:last-child i {
    background-position: 0 -210px
}

.assistant-fix .assistant-item .assistant-panel {
    display: none;
    position: absolute;
    top: 0;
    right: 100%;
    padding-right: 12px
}

.assistant-fix .assistant-item .assistant-panel .assistant-panel-wechat {
    width: 115px;
    height: 128px;
    padding: 12px;
    text-align: center;
    background: #fff;
    -webkit-box-shadow: 0 0 5px #ccc;
    box-shadow: 0 0 5px #ccc;
    border-radius: 4px
}

.assistant-fix .assistant-item .assistant-panel .assistant-panel-wechat p {
    font-size: 14px;
    color: #333;
    line-height: 1
}

.assistant-fix .assistant-item .assistant-panel .assistant-panel-wechat img {
    margin-top: 6px;
    width: 84px;
    height: 84px
}

.assistant-fix .assistant-item .assistant-panel .assistant-panel-phone {
    width: 129px;
    height: 65px;
    padding: 12px;
    text-align: center;
    background: #fff;
    -webkit-box-shadow: 0 0 5px #ccc;
    box-shadow: 0 0 5px #ccc;
    border-radius: 4px
}

.assistant-fix .assistant-item .assistant-panel .assistant-panel-phone p {
    font-size: 14px;
    color: #333;
    line-height: 1
}

.assistant-fix .assistant-item .assistant-panel .assistant-panel-phone p.phone {
    margin-top: 12px;
    color: #3c93d1
}

.assistant-fix .assistant-item:first-child i {
    top: 8px;
    background: url(../images/assistant-bar.png) no-repeat;
    background-position: 0 -84px;
    background-size: 40px
}

.assistant-fix .assistant-item:nth-child(2) i {
    background: url(../images/assistant-bar.png) no-repeat;
    background-position: 0 -42px;
    background-size: 40px
}

.assistant-fix .assistant-item:last-child i {
    background: url(../images/assistant-bar.png) no-repeat;
    background-position: 0 0;
    background-size: 40px
}

@media screen and (max-width:768px) {
    .assistant-fix {
        display: none
    }
}

.breadcrumb-wrapper {
    width: 100%;
    line-height: 34px
}

.breadcrumb {
    width: 100%;
    margin: 0 auto;
    padding: 0;
    padding-left: 0;
    height: 20px;
    line-height: 20px;
    font-size: 13px;
    background: none
}

@media screen and (max-width:992px) and (min-width:0) {
    .breadcrumb {
        width: 100%;
        margin-bottom: 0
    }
}

.breadcrumb li {
    height: 20px;
    line-height: 20px;
    display: inline-block
}

.breadcrumb li.active {
    color: #999
}

.breadcrumb a {
    color: #3c93d1
}

.wrapper {
    min-height: 100%;
    /* padding-top: 80px; */
    /* padding-bottom: 340px */
}

.wrapper .main {
    width: 1200px;
    margin: 0 auto
}

.wrapper .main .content {
    float: left;
    width: 912px
}

.wrapper .main .sidebar {
    float: right;
    width: 258px
}

.footer {
    margin-top: -300px
}

section.sidebar-ad {
    margin-bottom: 20px;
    background: #fff;
    -webkit-box-shadow: 0 0 6px 0 rgba(0, 0, 0, .08);
    box-shadow: 0 0 6px 0 rgba(0, 0, 0, .08);
    border-radius: 4px
}

section.sidebar-ad .section-label {
    padding: 20px;
    border-bottom: 1px solid #eee
}

section.sidebar-ad .section-label .label-text {
    float: left;
    font-size: 15px;
    color: #333
}

section.sidebar-ad .section-label .label-text i {
    margin-right: 6px
}

section.sidebar-ad .section-label .label-more {
    float: right;
    font-size: 15px;
    color: #999
}

section.sidebar-ad .section-content-list {
    padding: 9px 0
}

section.sidebar-ad .section-content-list .section-content-item {
    padding: 11px 20px
}

section.sidebar-ad .section-content-list .section-content-item.section-content-item--new .section-content-item--href .section-content-item--info {
    margin-left: 0
}

section.sidebar-ad .section-content-list .section-content-item .section-content-item--href {
    display: block
}

section.sidebar-ad .section-content-list .section-content-item .section-content-item--href .section-content-item--header {
    float: left;
    width: 40px;
    height: 40px;
    border-radius: 50%
}

section.sidebar-ad .section-content-list .section-content-item .section-content-item--href .section-content-item--info {
    margin-left: 54px
}

section.sidebar-ad .section-content-list .section-content-item .section-content-item--href .section-content-item--info .section-content-item--info-title {
    font-size: 15px;
    color: #333;
    font-weight: 500;
    line-height: 1.4
}

section.sidebar-ad .section-content-list .section-content-item .section-content-item--href .section-content-item--info .section-content-item--info-desc {
    margin-top: 4px;
    font-size: 12px;
    line-height: 1.4;
    color: #999
}

.college-ad {
    margin-bottom: 18px
}

.college-ad.colleges .college-btn {
    background: #4d76ff;
    background-image: url(../images/college-ad-bg1.png);
    background-repeat: no-repeat;
    background-size: cover;
    text-shadow: 0 0 6px rgba(42, 31, 243, .3)
}

.college-ad.global .college-btn {
    background: #527aff;
    background-image: url(../images/college-ad-bg3.png);
    background-repeat: no-repeat;
    background-size: cover;
    text-shadow: 0 0 6px rgba(19, 73, 237, .3)
}

.college-ad.grad .college-btn {
    background: #ffc044;
    background-image: url(../images/college-ad-bg2.png);
    background-repeat: no-repeat;
    background-size: cover;
    text-shadow: 0 0 6px #f4a918
    position: relative;
}

.college-ad .college-btn {
    display: block;
    width: 100%;
    height: 80px;
    color: #fff;
    font-size: 22px;
    font-weight: 500;
    line-height: 80px;
    text-align: center;
    border-radius: 4px;
    -webkit-box-shadow: 0 0 6px 0 rgba(0, 0, 0, .08);
    box-shadow: 0 0 6px 0 rgba(0, 0, 0, .08);
    position: relative
}

.college-ad .college-btn p {
    padding: 0 30px
}

.college-ad .college-btn .icon {
    position: absolute;
    right: 10px;
    top: 35px;
    font-size: 12px;
    font-weight: 400
}

@media screen and (max-width:768px) {
    section.sidebar-ad .section-label {
        padding: px2rem(15)
    }

    section.sidebar-ad .section-label .label-more,
    section.sidebar-ad .section-label .label-text {
        font-size: px2rem(15)
    }

    section.sidebar-ad .section-content-list .section-content-item.section-content-item--new .section-content-item--href .section-content-item--info {
        margin-left: 0
    }

    section.sidebar-ad .section-content-list .section-content-item .section-content-item--href .section-content-item--header {
        width: px2rem(40);
        height: px2rem(40)
    }

    section.sidebar-ad .section-content-list .section-content-item .section-content-item--href .section-content-item--info {
        margin-left: px2rem(56)
    }

    section.sidebar-ad .section-content-list .section-content-item .section-content-item--href .section-content-item--info .section-content-item--info-title {
        font-size: px2rem(15)
    }

    section.sidebar-ad .section-content-list .section-content-item .section-content-item--href .section-content-item--info .section-content-item--info-desc {
        font-size: px2rem(12)
    }
}

.ufly-link-ad {
    margin-top: 40px;
    width: 100%
}

.ufly-link-ad .ad-href {
    display: block
}

.ufly-link-ad .ad-href img {
    width: 100%
}

.college-images .dialog-images,
.college-images .section-content,
.college-videos .dialog-images,
.college-videos .section-content {
    position: relative;
    width: 100%;
    overflow: hidden;
    font-size: 0
}

.college-images .dialog-images .swiper-slide,
.college-images .section-content .swiper-slide,
.college-videos .dialog-images .swiper-slide,
.college-videos .section-content .swiper-slide {
    position: relative;
    display: inline-block;
    width: 219px;
    min-height: 142px;
    margin-right: 12px;
    cursor: pointer;
    border-radius: 4px
}

.college-images .dialog-images .swiper-slide img,
.college-images .section-content .swiper-slide img,
.college-videos .dialog-images .swiper-slide img,
.college-videos .section-content .swiper-slide img {
    width: 100%;
    height: 142px;
    border-radius: 4px
}

.college-images .dialog-images .swiper-slide .video-time,
.college-images .section-content .swiper-slide .video-time,
.college-videos .dialog-images .swiper-slide .video-time,
.college-videos .section-content .swiper-slide .video-time {
    position: absolute;
    right: 10px;
    top: 110px;
    width: 49px;
    height: 22px;
    background: rgba(0, 0, 0, .8);
    border-radius: 11px;
    font-size: 12px;
    color: #fff;
    line-height: 22px;
    text-align: center
}

.college-images .dialog-images .swiper-slide .video-name,
.college-images .section-content .swiper-slide .video-name,
.college-videos .dialog-images .swiper-slide .video-name,
.college-videos .section-content .swiper-slide .video-name {
    max-height: 40px;
    margin-top: 14px;
    line-height: 1.4;
    text-overflow: -o-ellipsis-lastline;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    font-size: 15px;
    color: #333
}

.college-images .dialog-images .images-button,
.college-images .dialog-images .videos-button,
.college-images .section-content .images-button,
.college-images .section-content .videos-button,
.college-videos .dialog-images .images-button,
.college-videos .dialog-images .videos-button,
.college-videos .section-content .images-button,
.college-videos .section-content .videos-button {
    position: absolute;
    top: calc(50% - 28px);
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 36px;
    height: 48px;
    background: rgba(0, 0, 0, .6);
    border-radius: 5px;
    z-index: 1;
    font-size: 26px;
    text-align: center;
    color: #fff;
    cursor: pointer
}

.college-images .dialog-images .images-button.images-button,
.college-images .dialog-images .videos-button.images-button,
.college-images .section-content .images-button.images-button,
.college-images .section-content .videos-button.images-button,
.college-videos .dialog-images .images-button.images-button,
.college-videos .dialog-images .videos-button.images-button,
.college-videos .section-content .images-button.images-button,
.college-videos .section-content .videos-button.images-button {
    top: 50%
}

.college-images .dialog-images .images-button.images-button-next,
.college-images .dialog-images .images-button.videos-button-next,
.college-images .dialog-images .videos-button.images-button-next,
.college-images .dialog-images .videos-button.videos-button-next,
.college-images .section-content .images-button.images-button-next,
.college-images .section-content .images-button.videos-button-next,
.college-images .section-content .videos-button.images-button-next,
.college-images .section-content .videos-button.videos-button-next,
.college-videos .dialog-images .images-button.images-button-next,
.college-videos .dialog-images .images-button.videos-button-next,
.college-videos .dialog-images .videos-button.images-button-next,
.college-videos .dialog-images .videos-button.videos-button-next,
.college-videos .section-content .images-button.images-button-next,
.college-videos .section-content .images-button.videos-button-next,
.college-videos .section-content .videos-button.images-button-next,
.college-videos .section-content .videos-button.videos-button-next {
    left: 10px
}

.college-images .dialog-images .images-button.images-button-next i,
.college-images .dialog-images .images-button.videos-button-next i,
.college-images .dialog-images .videos-button.images-button-next i,
.college-images .dialog-images .videos-button.videos-button-next i,
.college-images .section-content .images-button.images-button-next i,
.college-images .section-content .images-button.videos-button-next i,
.college-images .section-content .videos-button.images-button-next i,
.college-images .section-content .videos-button.videos-button-next i,
.college-videos .dialog-images .images-button.images-button-next i,
.college-videos .dialog-images .images-button.videos-button-next i,
.college-videos .dialog-images .videos-button.images-button-next i,
.college-videos .dialog-images .videos-button.videos-button-next i,
.college-videos .section-content .images-button.images-button-next i,
.college-videos .section-content .images-button.videos-button-next i,
.college-videos .section-content .videos-button.images-button-next i,
.college-videos .section-content .videos-button.videos-button-next i {
    margin-left: -2px
}

.college-images .dialog-images .images-button.images-button-prev,
.college-images .dialog-images .images-button.videos-button-prev,
.college-images .dialog-images .videos-button.images-button-prev,
.college-images .dialog-images .videos-button.videos-button-prev,
.college-images .section-content .images-button.images-button-prev,
.college-images .section-content .images-button.videos-button-prev,
.college-images .section-content .videos-button.images-button-prev,
.college-images .section-content .videos-button.videos-button-prev,
.college-videos .dialog-images .images-button.images-button-prev,
.college-videos .dialog-images .images-button.videos-button-prev,
.college-videos .dialog-images .videos-button.images-button-prev,
.college-videos .dialog-images .videos-button.videos-button-prev,
.college-videos .section-content .images-button.images-button-prev,
.college-videos .section-content .images-button.videos-button-prev,
.college-videos .section-content .videos-button.images-button-prev,
.college-videos .section-content .videos-button.videos-button-prev {
    right: 10px
}

.college-images .dialog-images .images-button.images-button-prev i,
.college-images .dialog-images .images-button.videos-button-prev i,
.college-images .dialog-images .videos-button.images-button-prev i,
.college-images .dialog-images .videos-button.videos-button-prev i,
.college-images .section-content .images-button.images-button-prev i,
.college-images .section-content .images-button.videos-button-prev i,
.college-images .section-content .videos-button.images-button-prev i,
.college-images .section-content .videos-button.videos-button-prev i,
.college-videos .dialog-images .images-button.images-button-prev i,
.college-videos .dialog-images .images-button.videos-button-prev i,
.college-videos .dialog-images .videos-button.images-button-prev i,
.college-videos .dialog-images .videos-button.videos-button-prev i,
.college-videos .section-content .images-button.images-button-prev i,
.college-videos .section-content .images-button.videos-button-prev i,
.college-videos .section-content .videos-button.images-button-prev i,
.college-videos .section-content .videos-button.videos-button-prev i {
    margin-right: -2px
}

.college-images .dialog-images .images-button i,
.college-images .dialog-images .videos-button i,
.college-images .section-content .images-button i,
.college-images .section-content .videos-button i,
.college-videos .dialog-images .images-button i,
.college-videos .dialog-images .videos-button i,
.college-videos .section-content .images-button i,
.college-videos .section-content .videos-button i {
    display: inline-block;
    margin-top: 11px
}

.college-images .dialog-container,
.college-videos .dialog-container {
    display: none;
    position: fixed;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, .4);
    z-index: 10000
}

.college-images .dialog-container .dialog-content,
.college-videos .dialog-container .dialog-content {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 1084px;
    border-radius: 5px
}

.college-images .dialog-container .dialog-content .dialog-video,
.college-videos .dialog-container .dialog-content .dialog-video {
    position: relative;
    float: left;
    width: 900px;
    height: 506px;
    overflow: hidden
}

.college-images .dialog-container .dialog-content .dialog-video:hover .dialog-video--title,
.college-videos .dialog-container .dialog-content .dialog-video:hover .dialog-video--title {
    opacity: 1;
    visibility: visible
}

.college-images .dialog-container .dialog-content .dialog-video .dialog-video--title,
.college-videos .dialog-container .dialog-content .dialog-video .dialog-video--title {
    visibility: hidden;
    opacity: 0;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 50px;
    width: 100%;
    padding-left: 20px;
    padding-right: 20px;
    line-height: 50px;
    font-size: 16px;
    font-weight: 500;
    color: #fff;
    background: rgba(0, 0, 0, .6);
    -webkit-transition: all .4s;
    transition: all .4s
}

.college-images .dialog-container .dialog-content .dialog-video .dialog-video--title span,
.college-videos .dialog-container .dialog-content .dialog-video .dialog-video--title span {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    padding-right: 40px
}

.college-images .dialog-container .dialog-content .dialog-video .dialog-video--title i,
.college-videos .dialog-container .dialog-content .dialog-video .dialog-video--title i {
    font-size: 14px;
    color: #fff;
    cursor: pointer
}

.college-images .dialog-container .dialog-content .dialog-video .video-box .vjs-big-play-centered .vjs-big-play-button,
.college-videos .dialog-container .dialog-content .dialog-video .video-box .vjs-big-play-centered .vjs-big-play-button {
    margin-top: 0;
    margin-left: 0;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.college-images .dialog-container .dialog-content .dialog-video .video-box .video-js.vjs-playing .vjs-tech,
.college-videos .dialog-container .dialog-content .dialog-video .video-box .video-js.vjs-playing .vjs-tech {
    pointer-events: auto
}

.college-images .dialog-container .dialog-content .dialog-video .video-box .vjs-texttrack-settings,
.college-videos .dialog-container .dialog-content .dialog-video .video-box .vjs-texttrack-settings {
    display: none
}

.college-images .dialog-container .dialog-content .dialog-video .video-box .video-js .vjs-big-play-button,
.college-videos .dialog-container .dialog-content .dialog-video .video-box .video-js .vjs-big-play-button {
    border: 0;
    background: rgba(0, 0, 0, .7);
    width: 60px;
    height: 60px;
    border-radius: 50%;
    line-height: 60px;
    margin-top: -30px;
    margin-left: -30px
}

.college-images .dialog-container .dialog-content .dialog-video .video-box .video-js .vjs-big-play-button .vjs-icon-placeholder,
.college-videos .dialog-container .dialog-content .dialog-video .video-box .video-js .vjs-big-play-button .vjs-icon-placeholder {
    font-size: 40px
}

.college-images .dialog-container .dialog-content .dialog-video .video-box .vjs-menu li,
.college-videos .dialog-container .dialog-content .dialog-video .video-box .vjs-menu li {
    line-height: 2
}

.college-images .dialog-container .dialog-content .dialog-video .video-box .watermark,
.college-videos .dialog-container .dialog-content .dialog-video .video-box .watermark {
    width: 300px;
    position: absolute;
    left: 0;
    top: 50px;
    font-size: 12px;
    color: #fff;
    opacity: .6;
    -webkit-animation: translate 20s linear infinite;
    animation: translate 20s linear infinite
}

@-webkit-keyframes translate {
    to {
        left: -300px
    }

    0% {
        left: 100%
    }
}

@keyframes translate {
    to {
        left: -300px
    }

    0% {
        left: 100%
    }
}

.college-images .dialog-container .dialog-content .dialog-recommends,
.college-videos .dialog-container .dialog-content .dialog-recommends {
    float: left;
    width: 184px;
    height: 505px;
    background: #fff;
    overflow: hidden
}

.college-images .dialog-container .dialog-content .dialog-recommends .swiper-slide,
.college-videos .dialog-container .dialog-content .dialog-recommends .swiper-slide {
    float: left;
    height: auto;
    width: 144px;
    padding: 20px 0;
    margin: 0 auto
}

.college-images .dialog-container .dialog-content .dialog-recommends .swiper-slide .recommends-video,
.college-videos .dialog-container .dialog-content .dialog-recommends .swiper-slide .recommends-video {
    margin-top: 10px;
    cursor: pointer
}

.college-images .dialog-container .dialog-content .dialog-recommends .swiper-slide .recommends-video:first-child,
.college-videos .dialog-container .dialog-content .dialog-recommends .swiper-slide .recommends-video:first-child {
    margin-top: 0
}

.college-images .dialog-container .dialog-content .dialog-recommends .video-cover,
.college-videos .dialog-container .dialog-content .dialog-recommends .video-cover {
    position: relative;
    width: 100%;
    height: 86px;
    border-radius: 4px 4px 0 0;
    overflow: hidden
}

.college-images .dialog-container .dialog-content .dialog-recommends .video-cover img,
.college-videos .dialog-container .dialog-content .dialog-recommends .video-cover img {
    width: 100%;
    height: 100%
}

.college-images .dialog-container .dialog-content .dialog-recommends .video-cover span,
.college-videos .dialog-container .dialog-content .dialog-recommends .video-cover span {
    position: absolute;
    right: 10px;
    top: 10px;
    width: 42px;
    height: 18px;
    border-radius: 11px;
    background: rgba(0, 0, 0, .7);
    line-height: 18px;
    text-align: center;
    font-size: 12px;
    color: #fff
}

.college-images .dialog-container .dialog-content .dialog-recommends .video-name,
.college-videos .dialog-container .dialog-content .dialog-recommends .video-name {
    width: 100%;
    padding: 6px;
    border-radius: 0 0 4px 4px;
    background: #eee;
    line-height: 1.4;
    font-size: 12px;
    color: #333
}

.college-images .dialog-container .dialog-content .dialog-recommends .swiper-scrollbar,
.college-videos .dialog-container .dialog-content .dialog-recommends .swiper-scrollbar {
    background: #fff
}

.college-images .dialog-container .dialog-content .dialog-recommends .swiper-scrollbar .swiper-scrollbar-drag,
.college-videos .dialog-container .dialog-content .dialog-recommends .swiper-scrollbar .swiper-scrollbar-drag {
    background: #ddd
}

.college-images .dialog-container .dialog-content--images,
.college-videos .dialog-container .dialog-content--images {
    width: 780px
}

.college-images .dialog-container .dialog-content--images .dialog-images,
.college-videos .dialog-container .dialog-content--images .dialog-images {
    width: 780px;
    height: 506px;
    overflow: hidden
}

.college-images .dialog-container .dialog-content--images .dialog-images:hover .images-button,
.college-videos .dialog-container .dialog-content--images .dialog-images:hover .images-button {
    opacity: 1;
    visibility: visible
}

.college-images .dialog-container .dialog-content--images .dialog-images .swiper-slide,
.college-videos .dialog-container .dialog-content--images .dialog-images .swiper-slide {
    width: 780px;
    height: 506px;
    margin-right: 0
}

.college-images .dialog-container .dialog-content--images .dialog-images .swiper-slide img,
.college-videos .dialog-container .dialog-content--images .dialog-images .swiper-slide img {
    width: 100%;
    height: 100%
}

.college-images .dialog-container .dialog-content--images .dialog-images .images-button,
.college-videos .dialog-container .dialog-content--images .dialog-images .images-button {
    opacity: 0;
    visibility: hidden;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-transition: all .4s;
    transition: all .4s
}

@media screen and (max-width:768px) {

    .college-images .dialog-images .swiper-slide,
    .college-images .section-content .swiper-slide,
    .college-videos .dialog-images .swiper-slide,
    .college-videos .section-content .swiper-slide {
        width: px2rem(168);
        min-height: px2rem(100);
        margin-right: px2rem(8);
        border-radius: px2rem(4)
    }

    .college-images .dialog-images .swiper-slide img,
    .college-images .section-content .swiper-slide img,
    .college-videos .dialog-images .swiper-slide img,
    .college-videos .section-content .swiper-slide img {
        height: px2rem(100);
        border-radius: px2rem(4)
    }

    .college-images .dialog-images .swiper-slide .video-time,
    .college-images .section-content .swiper-slide .video-time,
    .college-videos .dialog-images .swiper-slide .video-time,
    .college-videos .section-content .swiper-slide .video-time {
        right: px2rem(10);
        top: px2rem(70)
    }

    .college-images .dialog-images .swiper-slide .video-name,
    .college-images .section-content .swiper-slide .video-name,
    .college-videos .dialog-images .swiper-slide .video-name,
    .college-videos .section-content .swiper-slide .video-name {
        font-size: px2rem(13)
    }

    .college-images .dialog-container,
    .college-videos .dialog-container {
        display: none;
        position: fixed;
        left: 0;
        top: 0;
        right: 0;
        bottom: 0;
        background: rgba(0, 0, 0, .4);
        z-index: 10000
    }

    .college-images .dialog-container .dialog-content,
    .college-videos .dialog-container .dialog-content {
        position: absolute;
        top: 50%;
        left: 50%;
        -webkit-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
        width: 100%;
        border-radius: 5px
    }

    .college-images .dialog-container .dialog-content .dialog-video,
    .college-videos .dialog-container .dialog-content .dialog-video {
        position: relative;
        float: left;
        width: 100%;
        height: px2rem(210);
        overflow: hidden
    }

    .college-images .dialog-container .dialog-content .dialog-video:hover .dialog-video--title,
    .college-videos .dialog-container .dialog-content .dialog-video:hover .dialog-video--title {
        opacity: 1;
        visibility: visible
    }

    .college-images .dialog-container .dialog-content .dialog-video .dialog-video--title,
    .college-videos .dialog-container .dialog-content .dialog-video .dialog-video--title {
        visibility: hidden;
        opacity: 0;
        position: absolute;
        top: 0;
        left: 0;
        z-index: 1;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        height: px2rem(50);
        width: 100%;
        padding-left: px2rem(15);
        padding-right: px2rem(15);
        line-height: px2rem(50);
        font-size: px2rem(14);
        font-weight: 500;
        color: #fff;
        background: rgba(0, 0, 0, .6);
        -webkit-transition: all .4s;
        transition: all .4s
    }

    .college-images .dialog-container .dialog-content .dialog-video .dialog-video--title span,
    .college-videos .dialog-container .dialog-content .dialog-video .dialog-video--title span {
        -webkit-box-flex: 1;
        -ms-flex: 1;
        flex: 1;
        padding-right: px2rem(30)
    }

    .college-images .dialog-container .dialog-content .dialog-video .dialog-video--title i,
    .college-videos .dialog-container .dialog-content .dialog-video .dialog-video--title i {
        font-size: px2rem(12);
        color: #fff;
        cursor: pointer
    }

    .college-images .dialog-container .dialog-content .dialog-video .video-box,
    .college-images .dialog-container .dialog-content .dialog-video .video-box .college-video-dimensions,
    .college-videos .dialog-container .dialog-content .dialog-video .video-box,
    .college-videos .dialog-container .dialog-content .dialog-video .video-box .college-video-dimensions {
        width: px2rem(375);
        height: px2rem(210)
    }

    .college-images .dialog-container .dialog-content .dialog-video .video-box .video-js.vjs-playing .vjs-tech,
    .college-videos .dialog-container .dialog-content .dialog-video .video-box .video-js.vjs-playing .vjs-tech {
        pointer-events: auto
    }

    .college-images .dialog-container .dialog-content .dialog-video .video-box .vjs-texttrack-settings,
    .college-videos .dialog-container .dialog-content .dialog-video .video-box .vjs-texttrack-settings {
        display: none
    }

    .college-images .dialog-container .dialog-content .dialog-video .video-box .video-js .vjs-big-play-button,
    .college-videos .dialog-container .dialog-content .dialog-video .video-box .video-js .vjs-big-play-button {
        border: 0;
        background: rgba(0, 0, 0, .7);
        width: px2rem(60);
        height: px2rem(60);
        border-radius: 50%;
        line-height: px2rem(60);
        margin-top: px2rem(0);
        margin-left: px2rem(0)
    }

    .college-images .dialog-container .dialog-content .dialog-video .video-box .video-js .vjs-big-play-button .vjs-icon-placeholder,
    .college-videos .dialog-container .dialog-content .dialog-video .video-box .video-js .vjs-big-play-button .vjs-icon-placeholder {
        font-size: px2rem(40)
    }

    .college-images .dialog-container .dialog-content .dialog-video .video-box .vjs-menu li,
    .college-videos .dialog-container .dialog-content .dialog-video .video-box .vjs-menu li {
        line-height: 2
    }

    .college-images .dialog-container .dialog-content .dialog-video .video-box .watermark,
    .college-videos .dialog-container .dialog-content .dialog-video .video-box .watermark {
        width: px2rem(300);
        position: absolute;
        left: 0;
        top: px2rem(40);
        font-size: px2rem(12);
        color: #fff;
        opacity: .6;
        -webkit-animation: translate 20s linear infinite;
        animation: translate 20s linear infinite
    }

    @-webkit-keyframes translate {
        to {
            left: px2rem(-300)
        }

        0% {
            left: 100%
        }
    }

    @keyframes translate {
        to {
            left: px2rem(-300)
        }

        0% {
            left: 100%
        }
    }

    .college-images .dialog-container .dialog-content .dialog-recommends,
    .college-videos .dialog-container .dialog-content .dialog-recommends {
        display: none
    }

    .college-images .dialog-container .dialog-content--images,
    .college-videos .dialog-container .dialog-content--images {
        width: 100%
    }

    .college-images .dialog-container .dialog-content--images .dialog-images,
    .college-videos .dialog-container .dialog-content--images .dialog-images {
        width: 100%;
        height: px2rem(243);
        overflow: hidden
    }

    .college-images .dialog-container .dialog-content--images .dialog-images:hover .images-button,
    .college-videos .dialog-container .dialog-content--images .dialog-images:hover .images-button {
        opacity: 1;
        visibility: visible
    }

    .college-images .dialog-container .dialog-content--images .dialog-images .swiper-slide,
    .college-videos .dialog-container .dialog-content--images .dialog-images .swiper-slide {
        width: 100%;
        height: px2rem(243);
        margin-right: 0
    }

    .college-images .dialog-container .dialog-content--images .dialog-images .swiper-slide img,
    .college-videos .dialog-container .dialog-content--images .dialog-images .swiper-slide img {
        width: 100%;
        height: 100%
    }

    .college-images .dialog-container .dialog-content--images .dialog-images .images-button,
    .college-videos .dialog-container .dialog-content--images .dialog-images .images-button {
        opacity: 0;
        visibility: hidden;
        top: 50%;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        -webkit-transition: all .4s;
        transition: all .4s
    }
}

.banner-box {
    display: none
}

::-webkit-scrollbar {
    width: 6px;
    height: 6px;
    background-color: rgba(0, 0, 0, .1)
}

::-webkit-scrollbar-thumb {
    border-radius: 6px;
    background-color: rgba(0, 0, 0, .15)
}

::-webkit-scrollbar-track {
    border-radius: 6px;
    background-color: rgba(0, 0, 0, .01)
}

.wrapper .header-banner {
    position: relative;
    width: 100%;
    height: 280px;
    overflow: hidden
}

.wrapper .header-banner .header-main {
    position: relative;
    z-index: 1;
    width: 1200px;
    margin: 0 auto;
    color: #fff;
    padding-top: 50px
}

.wrapper .header-banner .header-main .header-left {
    float: left;
    max-width: 800px
}

.wrapper .header-banner .header-main .header-left .college-name-box .college-name {
    display: inline-block;
    max-width: 550px;
    font-size: 28px;
    line-height: 1.4;
    font-weight: 600;
    vertical-align: middle
}

.wrapper .header-banner .header-main .header-left .college-name-box .certification {
    display: inline-block;
    width: 126px;
    height: 23px;
    margin-left: 10px;
    margin-top: 8px;
    vertical-align: top;
    background: url(../images/college-icon.png) no-repeat;
    background-size: 300px;
    background-position: 0 -296px
}

.wrapper .header-banner .header-main .header-left .college-name-box .certification.certification-en {
    width: 300px;
    background-position: 0 -344px
}

.wrapper .header-banner .header-main .header-left .college-name-box .settled {
    display: inline-block;
    width: 96px;
    height: 23px;
    margin-left: 6px;
    margin-top: 8px;
    vertical-align: top;
    background: url(../images/college-icon.png) no-repeat;
    background-size: 300px;
    background-position: 0 -320px
}

.wrapper .header-banner .header-main .header-left .college-name-box .settled.settled-en {
    width: 170px;
    background-position: 0 -368px
}

.wrapper .header-banner .header-main .header-left .college-name--en {
    max-width: 800px;
    margin-top: 6px;
    font-size: 20px;
    font-weight: 600
}

.wrapper .header-banner .header-main .header-left .college-infos {
    margin-top: 16px;
    font-size: 14px
}

.wrapper .header-banner .header-main .header-left .college-infos .college-infos--left {
    float: left;
    margin-right: 70px
}

.wrapper .header-banner .header-main .header-left .college-infos .college-infos--right {
    float: left
}

.wrapper .header-banner .header-main .header-left .college-infos .college-info-item {
    margin-top: 10px
}

.wrapper .header-banner .header-main .header-left .college-infos .college-info-item .college-info--text {
    color: #fff
}

.wrapper .header-banner .header-main .header-right {
    float: right;
    margin-top: 15px
}

.wrapper .header-banner .header-main .header-right .college-rank {
    float: left;
    margin-left: 20px
}

.wrapper .header-banner .header-main .header-right .college-rank.college-rank--w .college-rank--usnews {
    background-position: 0 -444px
}

.wrapper .header-banner .header-main .header-right .college-rank.college-rank--w .college-rank--qs {
    background-position: 0 -551px
}

.wrapper .header-banner .header-main .header-right .college-rank.college-rank--w .college-rank--times {
    background-position: 0 -498px
}

.wrapper .header-banner .header-main .header-right .college-rank.college-rank--w .college-rank--arwu {
    background-position: 0 -605px
}

.wrapper .header-banner .header-main .header-right .college-rank.college-rank--n .college-rank--usnews {
    background-position: 0 -471px
}

.wrapper .header-banner .header-main .header-right .college-rank.college-rank--n .college-rank--qs {
    background-position: 0 -578px
}

.wrapper .header-banner .header-main .header-right .college-rank.college-rank--n .college-rank--times {
    background-position: 0 -524px
}

.wrapper .header-banner .header-main .header-right .college-rank.college-rank--n .college-rank--arwu {
    background-position: 0 -632px
}

.wrapper .header-banner .header-main .header-right .college-rank.college-rank--n .college-rank--label:before {
    background: -webkit-gradient(linear, right top, left top, from(#96c4ff), to(#64a8ff));
    background: linear-gradient(270deg, #96c4ff, #64a8ff)
}

.wrapper .header-banner .header-main .header-right .college-rank .college-rank--label {
    position: relative;
    padding-left: 16px;
    margin-bottom: 15px;
    font-size: 15px;
    font-weight: 700;
    line-height: 1
}

.wrapper .header-banner .header-main .header-right .college-rank .college-rank--label:before {
    content: " ";
    display: inline-block;
    width: 6px;
    height: 15px;
    position: absolute;
    top: 0;
    left: 0;
    background: -webkit-gradient(linear, right top, left top, from(#7690ff), to(#3c6cff));
    background: linear-gradient(270deg, #7690ff, #3c6cff);
    border-radius: 1px
}

.wrapper .header-banner .header-main .header-right .college-rank .college-rank-item {
    width: 157px;
    height: 24px;
    margin-top: 8px;
    background: url(../images/college-icon.png) no-repeat;
    background-size: 256px
}

.wrapper .header-banner .header-main .header-right .college-rank .college-rank-item .college-rank-text {
    float: right;
    width: 81px;
    height: 24px;
    line-height: 24px;
    font-size: 13px;
    font-weight: 700;
    text-align: center;
    color: #666
}

.wrapper .header-banner .header-main .lang-box {
    position: absolute;
    right: 0;
    top: 20px;
    width: 120px;
    height: 34px;
    background: rgba(0, 0, 0, .2);
    border-radius: 4px;
    font-size: 15px;
    text-align: center;
    line-height: 34px
}

.wrapper .header-banner .header-main .lang-box.lang-box--en .lang-cn {
    color: #fff
}

.wrapper .header-banner .header-main .lang-box.lang-box--en .lang-en,
.wrapper .header-banner .header-main .lang-box.lang-box--zh_cn .lang-cn {
    color: #3c93d1
}

.wrapper .header-banner .header-main .lang-box.lang-box--zh_cn .lang-en {
    color: #fff
}

.wrapper .header-banner .banner-bg {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    -webkit-filter: blur(4px);
    filter: blur(4px);
    -webkit-transform: scale(1.05);
    transform: scale(1.05);
}

.wrapper .header-banner .banner-bg:before {
    content: " ";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: rgba(0, 0, 0, .3)
}

.wrapper .content-nav {
    position: relative;
    z-index: 10;
    width: 100%;
    height: 60px
}

.wrapper .content-nav .content-nav--hook {
    width: 100%;
    height: 60px;
    background: #fff;
    border-bottom: 1px solid #ddd;
    z-index: 2
}

.wrapper .content-nav .content-nav-list {
    width: 1200px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
     height: 100%;
}

.wrapper .content-nav .content-nav-list .content-nav-item {
    color: #333;
    height: 100%;
}

.wrapper .content-nav .content-nav-list .content-nav-item.selected {
    color: #3c93d1;
    border-bottom: 3px solid #3c93d1
}

.wrapper .content-nav .content-nav-list .content-nav-item .content-nav-item--text {
    display: inline-block;
    margin-top: 20px;
    padding: 0 5px;
    padding-bottom: 6px;
    font-size: 15px;
    font-weight: 600;
    cursor: pointer
}

.wrapper .content-container section .section-label {
    display: inline-block;
    margin: 30px 0;
    padding-left: 10px;
    border-left: 4px solid #3c93d1;
    font-size: 20px;
    line-height: 1.4;
    color: #333;
    font-weight: 700
}

.wrapper .content-container section .section-content .section-content--label {
    position: relative;
    margin-left: 10px;
    padding-left: 15px;
    padding-bottom: 19px;
    font-weight: 600;
    font-size: 16px;
    line-height: 1.4
}

.wrapper .content-container section .section-content .section-content--label:before {
    content: " ";
    position: absolute;
    left: 0;
    top: 7px;
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #3c93d1
}

.wrapper .content-container section .section-content .section-content-item--collapse {
    display: none
}

.wrapper .content-container section .section-content .section-content-item--collapse .general-section-item:first-child {
    border-top: none
}

.wrapper .content-container section .section-content--expand {
    margin-top: 13px;
    margin-bottom: 15px;
    text-align: center;
    font-size: 14px;
    color: #3c93d1
}

.wrapper .content-container section .section-content--expand span {
    vertical-align: middle;
    cursor: pointer
}

.wrapper .content-container section .section-content--expand span i {
    margin-left: 8px;
    font-size: 10px;
    vertical-align: middle
}

.wrapper .content-container section .section-content--expand .expand-btn i {
    display: inline-block;
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg)
}

.wrapper .content-container section .section-content--expand .collapse-btn {
    display: none
}

.wrapper .content-container section .section-content--expand .collapse-btn i {
    display: inline-block;
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg)
}

.wrapper .content-container .introduction .introduction-text {
    font-size: 14px;
    color: #333;
    line-height: 1.6;
    text-indent: 2em
}

.wrapper .content-container .general-info,
.wrapper .content-container .indicator-info {
    font-size: 16px;
    color: #333;
    line-height: 1.4;
    font-weight: 600
}

.wrapper .content-container .general-info .section-content,
.wrapper .content-container .indicator-info .section-content {
    padding-left: 10px
}

.wrapper .content-container .general-info .section-content .general-section-item,
.wrapper .content-container .indicator-info .section-content .general-section-item {
    padding: 12px 0;
    font-size: 14px;
    color: #333;
    border-bottom: 1px solid #ddd
}

.wrapper .content-container .general-info .section-content .general-section-item:first-child,
.wrapper .content-container .indicator-info .section-content .general-section-item:first-child {
    border-top: 1px solid #ddd
}

.wrapper .content-container .general-info .section-content .general-section-item .general-item--text,
.wrapper .content-container .indicator-info .section-content .general-section-item .general-item--text {
    float: right
}

.wrapper .content-container .general-info .section-content {
    margin-top: 20px;
    padding-left: 0
}

.wrapper .content-container .general-info .section-content .general-section-item:first-child {
    border-top: none
}

.wrapper .content-container .main-info .section-content {
    width: 924px;
    overflow: hidden;
    font-size: 0
}

.wrapper .content-container .main-info .section-content .main-info-item {
    position: relative;
    display: inline-block;
    width: 219px;
    height: 120px;
    margin-right: 12px;
    margin-bottom: 12px;
    vertical-align: top
}

.wrapper .content-container .main-info .section-content .main-info-item img {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: -1
}

.wrapper .content-container .main-info .section-content .main-info-item .main-info--text {
    margin-top: 28px;
    line-height: 1.4;
    text-align: center;
    font-size: 26px;
    color: #fff
}

.wrapper .content-container .main-info .section-content .main-info-item .main-info--label {
    margin-top: 7px;
    text-align: center;
    line-height: 1.4;
    font-size: 14px;
    color: #fff;
    font-weight: 600
}

.wrapper .content-container .rank-charts .section-content-item {
    margin-top: 40px
}

.wrapper .content-container .rank-charts .section-content>.section-content-item:first-child {
    margin-top: 0
}

.wrapper .content-container .rank-charts .rank-charts-item .rank-charts--img {
    float: left;
    width: 434px;
    height: 210px
}

.wrapper .content-container .rank-charts .rank-charts-item .rank-charts--calendar {
    float: right;
    width: 434px;
    height: 210px;
    padding: 19px 0 19px 18px;
    background: #eaf7ff;
    border-radius: 4px
}

.wrapper .content-container .rank-charts .rank-charts-item .calendar-year {
    margin-right: 6px;
    margin-bottom: 12px;
    float: left;
    width: 75px;
    height: 80px;
    border-radius: 4px;
    background: #fff;
    -webkit-box-shadow: 0 0 4px 0 rgba(46, 166, 223, .16);
    box-shadow: 0 0 4px 0 rgba(46, 166, 223, .16)
}

.wrapper .content-container .rank-charts .rank-charts-item .calendar-year .calendar-year--text {
    height: 33px;
    line-height: 33px;
    text-align: center;
    font-size: 13px;
    color: #666;
    border-bottom: 1px solid #d2eeff
}

.wrapper .content-container .rank-charts .rank-charts-item .calendar-year .calendar-year--rank {
    line-height: 46px;
    text-align: center;
    font-size: 14px;
    color: #3c93d1;
    font-weight: 600
}

.wrapper .content-container .rank-charts .section-content--expand {
    margin-top: 40px
}

.wrapper .content-container .major-ranks .section-content {
    border-top: 1px solid #ddd
}

.wrapper .content-container .major-ranks .major-rank-item {
    padding: 24px 0;
    border-bottom: 1px solid #ddd
}

.wrapper .content-container .major-ranks .major-rank-item .major-rank {
    font-size: 0
}

.wrapper .content-container .major-ranks .major-rank-item .major-rank .major-text {
    display: inline-block;
    width: 40px;
    height: 22px;
    margin-right: 10px;
    text-align: center;
    line-height: 22px;
    color: #fff;
    font-size: 14px;
    background: #7690ff;
    background: -webkit-gradient(linear, left top, left bottom, from(#7690ff), to(#3c6cff));
    background: linear-gradient(180deg, #7690ff, #3c6cff);
    border-radius: 2px;
    vertical-align: middle
}

.wrapper .content-container .major-ranks .major-rank-item .major-rank .major-name {
    margin-left: 2px;
    font-size: 16px;
    color: #333;
    font-weight: 600;
    vertical-align: middle
}

.wrapper .content-container .major-ranks .major-rank-item .submajor-rank-btn {
    margin-top: 12px;
    font-size: 0;
    color: #333;
    font-weight: 600;
    line-height: 1.4;
    cursor: pointer
}

.wrapper .content-container .major-ranks .major-rank-item .submajor-rank-btn.is-expand .hide-rankings,
.wrapper .content-container .major-ranks .major-rank-item .submajor-rank-btn.is-expand .icon-minus {
    display: inline-block
}

.wrapper .content-container .major-ranks .major-rank-item .submajor-rank-btn .hide-rankings,
.wrapper .content-container .major-ranks .major-rank-item .submajor-rank-btn .icon-minus,
.wrapper .content-container .major-ranks .major-rank-item .submajor-rank-btn.is-expand .icon-plus,
.wrapper .content-container .major-ranks .major-rank-item .submajor-rank-btn.is-expand .show-rankings {
    display: none
}

.wrapper .content-container .major-ranks .major-rank-item .submajor-rank-btn i {
    display: inline-block;
    width: 16px;
    height: 16px;
    border-radius: 3px;
    background: #3c93d1;
    line-height: 16px;
    text-align: center;
    color: #fff;
    font-size: 12px;
    margin-right: 10px;
    vertical-align: middle
}

.wrapper .content-container .major-ranks .major-rank-item .submajor-rank-btn span {
    display: inline-block;
    vertical-align: middle;
    font-size: 15px
}

.wrapper .content-container .major-ranks .major-rank-item .submajor-list {
    display: none;
    margin-top: 10px;
    margin-left: 26px
}

.wrapper .content-container .major-ranks .major-rank-item .submajor-list .submajor-item {
    padding: 12px 0;
    font-size: 13px;
    color: #666;
    border-top: 1px dashed #eee
}

.wrapper .content-container .major-ranks .major-rank-item .submajor-list .submajor-item:last-child {
    padding-bottom: 0
}

.wrapper .content-container .major-ranks .major-rank-item .submajor-list .submajor-item .submajor-name {
    float: left;
    line-height: 1
}

.wrapper .content-container .major-ranks .major-rank-item .submajor-list .submajor-item .submajor-ranking {
    float: right;
    font-size: 14px;
    font-weight: 600;
    line-height: 1
}

.wrapper .content-container .map .map-box {
    width: 912px;
    height: 142px;
    border-radius: 4px
}

.wrapper .content-container .map .map-box .bm_bottomLeftOverlay,
.wrapper .content-container .map .map-box .bm_bottomRightOverlay {
    display: none !important
}

.wrapper .content-container .map .map-box.map-fullscreen {
    position: fixed !important;
    left: 0;
    bottom: 0;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    z-index: 1000000
}

.wrapper .content-container .map .map-box .map-btns {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: absolute;
    right: 30px;
    top: 30px;
    z-index: 1
}

.wrapper .content-container .map .map-box .map-btns .fullscreen-btn {
    margin-right: 20px
}

.wrapper .content-container .map .map-box .map-btns .fullscreen-btn,
.wrapper .content-container .map .map-box .map-btns .local-btn {
    padding: 8px 12px;
    line-height: 18px;
    font-size: 14px;
    color: #333
}

.wrapper .content-container .map .map-box .map-btns .fullscreen-btn,
.wrapper .content-container .map .map-box .map-btns .local-btn,
.wrapper .content-container .map .map-exit-fullscreen {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    cursor: pointer;
    background: #fff;
    border-radius: 4px;
    -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04);
    box-shadow: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04)
}

.wrapper .content-container .map .map-exit-fullscreen {
    display: none;
    position: fixed;
    width: 500px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    font-size: 16px;
    left: 0;
    right: 0;
    top: 50px;
    margin: 0 auto;
    z-index: 1000001
}

.wrapper .sidebar {
    margin-top: 36px
}

.wrapper .data-origin-tip {
    margin-top: 20px;
    text-align: right;
    font-size: 12px;
    font-weight: 400;
    color: #999
}

.wrapper .data-origin-tip a {
    color: #3c93d1
}



.crisp-client .cc-kv6t .cc-1xry .cc-unoo .cc-7doi {
    width: 100px !important;
    height: 100px !important;
  }

  .crisp-client .cc-kv6t .cc-1xry .cc-ge4v,
  .crisp-client .cc-kv6t .cc-1xry .cc-unoo {
    width: 100px !important;
    bottom: 350px !important;
  }

  .crisp-client .cc-kv6t .cc-1xry .cc-ge4v {
    bottom: 28px !important;
  }

  .crisp-client .cc-kv6t[data-full-view=true] .cc-1xry .cc-unoo {
    width: 100px !important;
    bottom: 325px !important;
  }

  .crisp-client .cc-kv6t[data-full-view=true] .cc-1xry .cc-unoo .cc-7doi {
    width: 100px !important;
    height: 100px !important;
  }
  .crisp-client .cc-kv6t .cc-1xry .cc-unoo .cc-7doi {
    width: 100px !important;
    height: 100px !important;
  }

  .crisp-client .cc-kv6t .cc-1xry .cc-ge4v,
  .crisp-client .cc-kv6t .cc-1xry .cc-unoo {
    width: 100px !important;
    bottom: 350px !important;
  }

  .crisp-client .cc-kv6t .cc-1xry .cc-ge4v {
    bottom: 28px !important;
  }

  .crisp-client .cc-kv6t[data-full-view=true] .cc-1xry .cc-unoo {
    width: 100px !important;
    bottom: 325px !important;
  }

  .crisp-client .cc-kv6t[data-full-view=true] .cc-1xry .cc-unoo .cc-7doi {
    width: 100px !important;
    height: 100px !important;
  }
  
  
  
  
  
  
  
  
  
  
  
@media screen and (min-width: 767px) and (max-width: 1010px){
    .wrapper .main{
        width: 100%;
        padding: 0 20px;
    }
    .wrapper .main .content{
        width: 68%;
    }
    .sidebar{
        width: 30% !important;
    }
    .wrapper .content-nav .content-nav-list{
        white-space: nowrap;
        width: 100%;
        padding: 0 20px;
        overflow: hidden;
        overflow-x: auto;
        display: flex;
        justify-content: space-between;
    }
    .wrapper .content-nav .content-nav-list .content-nav-item{
        margin-right: 50px;
        color: #333;
    }
    
}
@media screen and (max-width: 767px){
    .wrapper .header-banner .header-main{
        padding-right: 15px;
        padding-left: 15px;
        padding-top: 15px;
    }
    .wrapper .header-banner .header-main .header-left .college-infos{
        display: flex;
        flex-direction: column;
    }
   .wrapper .main{
        width: 100%;
         padding: 0 20px;
    }
    .wrapper .main .content{
        width: 100%;
    }
    .sidebar{
        width: 100% !important;
    }
    .wrapper .content-nav .content-nav-list{
        white-space: nowrap;
        width: 100%;
        padding: 0 20px;
        overflow: hidden;
        overflow-x: auto;
        display: flex;
        justify-content: space-between;
    }
    .wrapper .content-nav .content-nav-list .content-nav-item{
        margin-right: 50px;
        color: #333;
    }
    .wrapper .header-banner .header-main .header-left .college-name-box .college-name{
        display: inline-block;
        font-size: 22px;
        line-height: 1.4;
        font-weight: 600;
        vertical-align: middle;
    }
    .wrapper .header-banner .header-main .header-left .college-name--en{
        max-width: 800px;
        margin-top: 6px;
        font-size: 18px;
        font-weight: 600;
    }
    .cons .flex{
        display: block !important;
    }
    .onewww p{
        display: flex;
        flex-direction: column !important;
    }
    .onewww p img{
        width: 100% !important;
        margin-bottom: 20px;
    }
}