ul{
    padding: 0;
}
li{
    list-style: none;
}
a:hover,a:focus,a:active,a:visited{
    text-decoration: none;
}
html{
    font-size: 100px;
    overflow-x: hidden;
}
.top{
    background: #182b84;
    background-image: linear-gradient(to right, #182b84 40%, #12429f 50%, #182b84 60%);
    color: #fff;
    font-size: .14rem;
    line-height: .5rem;
}
#navbar-menu.fadeInDown{
    visibility: visible!important;
}
.navbar-default{
    background: none;
}
nav.navbar.bootsnav{
    border-bottom: none;
}
.nav>li>a{
    padding: 0;
}
.navbar-nav > li > a{
    font-size: .16rem;
}
.navbar-nav > li#index{
    width: 1.5rem;
    margin-top: -.35rem;
    transition: width 0.3s ease-in-out;
}
.nav>li>a>img{
    max-width: 100%;
    filter: drop-shadow(0 5px 8px #182b84);
}
.burger {
    font-size: 6px;
    cursor: pointer;
    padding: 3em 1.5em;
}
.burger.showHitArea {
    border: 1px solid olive;
}
.burger > div {
    width: 4em;
    height: 0.5em;
    border-radius: 1em;
    background: #fff;
}
.burger > div::before, .burger > div::after {
    transition: font-size 0s;
    content: "";
    display: block;
    position: absolute;
    width: 4em;
    height: 0.5em;
    background: #fff;
    border-radius: 1em;
}
.burger > div::before {
    margin-top: -1.5em;
}
.burger > div::after {
    margin-top: 1.5em;
}
.burger2 > div {
    transition: background 0.4s, font-size 0s;
}
.burger2 > div::before, .burger2 > div::after {
    transition: font-size 0s;
    transform-origin: center center;
}
.burger2.toggled > div::before {
    -webkit-animation: burg2top 0.4s linear forwards;
    animation: burg2top 0.4s linear forwards;
}
.burger2.toggled > div {
    background: transparent;
}
.burger2.toggled > div::after {
    -webkit-animation: burg2bottom 0.4s linear forwards;
    animation: burg2bottom 0.4s linear forwards;
}
.burger2.unToggled > div::before {
    -webkit-animation: burg2topReset 0.4s linear forwards;
    animation: burg2topReset 0.4s linear forwards;
}
.burger2.unToggled > div {
    background: #fff;
}
.burger2.unToggled > div::after {
    -webkit-animation: burg2bottomReset 0.4s linear forwards;
    animation: burg2bottomReset 0.4s linear forwards;
}
@-webkit-keyframes burg2top {
    20% {
        margin-top: 0em;
        transform: rotate(0deg);
    }
    60% {
        margin-top: 0em;
        transform: rotate(55deg);
    }
    100% {
        margin-top: 0em;
        transform: rotate(45deg);
    }
}
@keyframes burg2top {
    20% {
        margin-top: 0em;
        transform: rotate(0deg);
    }
    60% {
        margin-top: 0em;
        transform: rotate(55deg);
    }
    100% {
        margin-top: 0em;
        transform: rotate(45deg);
    }
}
@-webkit-keyframes burg2bottom {
    20% {
        margin-top: 0em;
        transform: rotate(0deg);
    }
    60% {
        margin-top: 0em;
        transform: rotate(-55deg);
    }
    100% {
        margin-top: 0em;
        transform: rotate(-45deg);
    }
}
@keyframes burg2bottom {
    20% {
        margin-top: 0em;
        transform: rotate(0deg);
    }
    60% {
        margin-top: 0em;
        transform: rotate(-55deg);
    }
    100% {
        margin-top: 0em;
        transform: rotate(-45deg);
    }
}
@-webkit-keyframes burg2topReset {
    0% {
        margin-top: 0em;
        transform: rotate(45deg);
    }
    20% {
        transform: rotate(0deg);
    }
    60% {
        margin-top: 1.7em;
        transform: rotate(0deg);
    }
    100% {
        margin-top: 1.5em;
        transform: rotate(0deg);
    }
}
@keyframes burg2topReset {
    0% {
        margin-top: 0em;
        transform: rotate(45deg);
    }
    20% {
        transform: rotate(0deg);
    }
    60% {
        margin-top: 1.7em;
        transform: rotate(0deg);
    }
    100% {
        margin-top: 1.5em;
        transform: rotate(0deg);
    }
}
@-webkit-keyframes burg2bottomReset {
    0% {
        margin-top: 0em;
        transform: rotate(-45deg);
    }
    20% {
        transform: rotate(0deg);
    }
    60% {
        margin-top: -1.7em;
        transform: rotate(0deg);
    }
    100% {
        margin-top: -1.5em;
        transform: rotate(0deg);
    }
}
@keyframes burg2bottomReset {
    0% {
        margin-top: 0em;
        transform: rotate(-45deg);
    }
    20% {
        transform: rotate(0deg);
    }
    60% {
        margin-top: -1.7em;
        transform: rotate(0deg);
    }
    100% {
        margin-top: -1.5em;
        transform: rotate(0deg);
    }
}
.focus{
    overflow: hidden;
    position: relative;
}
.news{
    background: #f7f7f7 url("../images/news.png") no-repeat;
    padding: .5rem 0;
}
.news h2,.course h2,.advantage h2,.scene h2{
    font-size: .3rem;
    height: 1em;
    margin: .5rem auto 1rem;
    text-align: center;
    position: relative;
}
.news h2 b,.course h2 b,.advantage h2 b,.scene h2 b{
    margin-left: -2em;
    top: 0;
    z-index: 3;
}
.news h2:before,.course h2:before{
    background: #f7f7f7;
}
.news h2:before,.course h2:before,.advantage h2:before,.scene h2:before{
    width: 5em;
    z-index: 2;
}
.news h2:after,.course h2:after{
    background: #333;
}
.news h2:after,.course h2:after,.advantage h2:after,.scene h2:after{
    width: 10em;
    z-index: 1;
}
.news h2 b,.news h2:before,.news h2:after,.news h2 span,.course h2 b,.course h2:before,.course h2:after,.course h2 span,.advantage h2 b,.advantage h2:before,.advantage h2:after,.advantage h2 span,.scene h2 b,.scene h2:before,.scene h2:after,.scene h2 span{
    position: absolute;
    left: 50%;
}
.news h2:before,.news h2:after,.course h2:before,.course h2:after,.advantage h2:before,.advantage h2:after,.scene h2:before,.scene h2:after{
    content: "";
    display: block;
    height: 2px;
    top: 50%;
    transform: translateX(-50%);
}
.news h2 span,.course h2 span{
    color: #f7f7f7;
}
.news h2 span,.course h2 span,.advantage h2 span,.scene h2 span{
    font-family: 'Roboto Slab', serif;
    font-size: 1.8rem;
    /*filter:blur(1px) grayscale(.9);*/
    margin-left: -1.2em;
    top: -1rem;
    text-shadow: 0 0 5px rgb(0 0 0 / 10%);
    z-index: 1;
}
.course h2 span{
    margin-left: -1.6em;
}
.advantage h2 span{
    margin-left: -2.5em;
}
.tab{
    background: rgb(0 0 0 / 3%);
    border-radius: 4px;
    box-shadow: 0 0 8px rgb(0 0 0 / 10%) inset;
    height: .5rem;
    margin-bottom: .3rem;
}
.tab2{
    display: flex;
    justify-content: space-around;
    position: relative;
}
.tab2 li{
    color: rgb(12 52 129 / 40%);
    font-size: .2rem;
}
.tab2 li.on{
    color: #182b84;
}
.tab2 li:before{
    font-size: .32rem;
    margin-right: .1rem;
}
.tab2 li b{
    font-weight: normal;
    float: right;
    line-height: .46rem;
}
.tab2 li.on b,.tab2 li.on:before{
    font-weight: bold;
}
#lavalamp {
    background: #182b84;
    border-radius: 2px;
    height: 4px;
    bottom: 0;
    left: 0;
    position: absolute;
    opacity: 1;
    transition: all 800ms ease;
    z-index:-1;
}
#lavalamp:hover {
    -moz-transition-duration: 3000s;
    -ms-transition-duration: 3000s;
    -o-transition-duration: 3000s;
    -webkit-transition-duration: 3000s;
    transition-duration: 3000s;
}
#tab2{
    overflow: hidden;
}
.list2 li{
    border-bottom: 1px solid #e1e1e1;
    font-size: .12rem;
    padding: .15rem;
}
.list2 li a{
    color: #333;
    font-size: .16rem;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: .24rem;
    padding-top: 0.12rem;
}
.list2 li span,.list2 li a:hover{
    color: #182b84;
}
.course,.scene{
    padding: 0.5rem 0;
}
.course .info{
    margin: .2rem auto .6rem;
}
.course .info .shadow,.list4 .shadow,.list5 .shadow {
    padding-bottom: .1rem;
    transition: all 0.5s ease-in-out;
}
.course .info .shadow:hover,.list4 .shadow:hover,.list5 .shadow:hover{
    transform: translateY(-.3rem);
}
.course .info .img,.list4 .img,.list5 .img{
    position: relative;
}
.course .info img,.list4 img{
    transition: all 0.3s ease-in-out;
}
.course .info .img .tex,.list4 .img .tex{
    color: #fff;
    background: rgb(0, 0, 0 ,.8);
    height: 100%;
    padding: .4rem .4rem 0;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
    transition: all .5s ease-in-out;
}
.course .info .shadow:hover .tex,.list4 .shadow:hover .tex,.list5 .shadow:hover .tex{
    background-image: linear-gradient(90deg, rgba(12, 52, 129, 0), rgba(255, 255, 255, 0.1), rgba(12, 52, 129, 0));
    background-size: .6rem 100%;
    background-repeat: no-repeat;
    background-position: left -.6rem top 0;
    animation: shine 1s ease;
}
.course .info .shadow:hover img,.list4 .shadow:hover img{
    filter: blur(3px);
}
.course .info .img .tex h3,.list4 .img .tex h3{
    font-size: .28rem;
    margin: 0 0 .1rem;
}
.course .info p,.list4 p{
    display: -webkit-box;
    line-height: 1.5;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    text-overflow: ellipsis;
}
.course .info .shadow:hover .tex,.list4 .shadow:hover .tex,.list5 .shadow:hover .tex{
    opacity: 1;
}
.course .info ul,.list4,.list5{
    display: flex;
    flex-wrap: wrap;
}
.course .info ul{
    justify-content: space-around;
}
.list4,.list5{
    background: #fff;
    justify-content: space-between;
    padding-top: .5rem;
}
.course .info .shadow > h3{
    font-size: .28rem;
    line-height: .28rem;
    margin: .28rem 0;
}
.course .info h3 a,.list4 h3 a,.list5 h3 a{
    color: #333;
}
.list5 h3 a{
    font-size: .18rem;
}
.course .info .tex span,.list4 .tex span{
    display: block;
    line-height: .24rem;
    margin-bottom: .2rem;
    opacity: .6;
}
.course .info h3 span,.list4 h3 span{
    font-size: .14rem;
    float: right;
    font-weight: bold;
}
.course .info .tex span:before,.course .info h3 span:before{
    font-size: .2rem;
    float: left;
}
@-webkit-keyframes shine {
    to {
        background-position: right -.6rem top 0;
    }
}
@keyframes shine {
    to {
        background-position: right -.6rem top 0;
    }
}
.advantage{
    background: url("../images/speciality.png");
    padding-bottom: 1rem;
}
.box{
    overflow: hidden;
}
.advantage h2{
    color: #182b84;
    margin-top: -.16rem;
    margin-bottom: 1rem;
}
.advantage h2 span{
    color: #fdfdfd;
}
.advantage h2:before{
    background: #fdfdfd;
}
.advantage h2:after{
    background: #182b84;
}
.blur{
    display: contents;
    margin-top: -1rem;
}
.tab3 li{
    display: inline-block;
    padding: 30px 0;
    position: relative;
    width: 33%;
}
.tab3 li a{
    color: #333;
    display: block;
    font-size: .2rem;
    font-weight: bold;
    padding: .2rem 0;
    position: absolute;
    top: 0;
    width: 100%;
    text-align: center;
}
.tab3 li a:hover,.tab3 li.on a{
    color: #182b84;
}
.tab3 li a:before{
    margin-right: .4em;
}
#tab3{
    position: relative;
    color: #fff;
}
#tab3 .swiper-slide{
    position: relative;
}
#tab3 .swiper-slide img{
    width: 100%;
}
#tab3 .swiper-slide > .info{
    background: rgb(12 52 129 / 80%);
    width: 0;
    height: 100%;
    position: absolute;
    top: 0;
    transition: all .6s ease-out .8s;
}
.posr{
    position: relative;
    height: 100%;
}
#tab3 .swiper-slide > .info .num{
    font-family: Lato;
    font-size: .6rem;
    transform: translate(.3rem,.45rem);
    position: absolute;
    top: -45%;
    left: 10%;
    opacity: 0;
    transition: all .4s ease-out 1.4s;
}
#tab3 .swiper-slide > .info p{
    opacity: 0;
    position: absolute;
    left: 16%;
}
#tab3 .swiper-slide > .info p:nth-of-type(1){
    font-size: .3rem;
    top: 52%;
    transition: all .3s ease-out 1.6s;
}
#tab3 .swiper-slide > .info p:nth-of-type(2){
    color: #e1e1e1;
    font-style: italic;
    font-size: .24rem;
    top: 60%;
    transition: all .3s ease-out 1.9s;
}
#tab3 .swiper-slide > .info p:nth-of-type(3){
    top: 85%;
    width: 68%;
    transition: all .3s ease-out 2.1s;
}
#tab3 .swiper-slide > .info a{
    background: #fff;
    border-radius: 50%;
    display: block;
    font-size: .24rem;
    line-height: 1.5;
    width: .5rem;
    height: .5rem;
    opacity: 0;
    position: absolute;
    left: 0;
    top: 50%;
    text-align: center;
    transition: all .3s ease-out 2.4s;
}
#tab3 .swiper-slide.swiper-slide-active > .info{
    width: 50%;
}
#tab3 .swiper-slide.swiper-slide-active > .info .num{
    top: 10%;
    opacity: 1;
}
#tab3 .swiper-slide.swiper-slide-active > .info p:nth-of-type(1){
    letter-spacing: .08em;
    top: 32%;
}
#tab3 .swiper-slide.swiper-slide-active > .info p:nth-of-type(2){
    top: 40%;
}
#tab3 .swiper-slide.swiper-slide-active > .info p:nth-of-type(3){
    top: 65%;
}
#tab3 .swiper-slide.swiper-slide-active > .info p,#tab3 .swiper-slide.swiper-slide-active > .info a{
    opacity: 1;
}
#tab3 .swiper-slide.swiper-slide-active > .info a{
    left: 16%;
    transform: rotate(360deg);
}
.scene{
    background: #182b84;
}
.scene h2{
    color: #fff;
}
.scene h2 span{
    color: #113885;
    margin-left: -1.3em;
}
.scene h2:before{
    background: #182b84;
}
.scene h2:after{
    background: #fff;
}
.scene .view .swiper-button-next,.scene .view .swiper-button-prev{
    color: rgb(255 255 255 / 5%);
    transition: color .5s ease-in-out;
}
.scene .view:hover .swiper-button-next,.scene .view:hover .swiper-button-prev{
    color: rgb(255 255 255 / 100%);
}
.scene .view a b{
    color: #fff;
    display: -webkit-box;
    font-size: .18rem;
    line-height: 1.5;
    letter-spacing: .05em;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    margin: .25rem 0 .1rem;
}
.scene .view span{
    color: rgb(255 255 255 / 40%);
}
.wave{
    background: #182b84;
}
.pages .wave{
    background: transparent;
}
.footer{
    background: #d80c18 url("../images/footer.jpg") no-repeat;
    background-size: cover;
    color: #fff;
}
.footer .tel{
    background: url("../images/white.png") no-repeat right;
    background-size: 2.9rem .5rem;
    border-bottom: 1px solid #ff5454;
    line-height: 2;
    padding: .25rem 0;
}
.footer .tel a{
    color: #fff;
}
.footer .flexbox{
    display: flex;
    justify-content: space-between;
    line-height: .32rem;
    margin: .4rem 0 .5rem;
}
.footer .tel:before,.footer .address:before,.footer .support:before,.footer .copyright:before{
    background: rgb(0 0 0 / 30%);
    border-radius: 50%;
    color: #e1e1e1;
    margin-right: 1em;
    padding: 5px;
}
.footer .flexbox p{
    margin: 0;
    text-indent: 2.8em;
}
.footer .flexbox a{
    color: #fff;
}
.new_media{
    display: flex;
    align-items: center;
    justify-content: space-around;
}
.new_media div{
    padding: 0 .3rem;
}
.footer .new_media .wechat:before,.footer .new_media .tik_tok:before,.footer .new_media .weibo:before{
    font-size: .32rem;
    padding: 5px;
    transition:all .6s ease-out;
}
.new_media > div{
    position: relative;
}
.footer .new_media .wechat:hover:before,.footer .new_media .tik_tok:hover:before,.footer .new_media .weibo:hover:before{
    background: rgb(0 0 0 / 30%);
    border-radius: 50%;
    box-shadow: 0 0 15px #fff;
    color: #e1e1e1;
}
.new_media img{
    opacity: 0;
    width: 150px;
    visibility: hidden;
    position: absolute;
    top: -160px;
    left: -50%;
    transition:all .3s ease-in-out;
    transform: translateX(23px);
}
.new_media > div:hover img{
    opacity: 1;
    visibility: visible;
    transform: translate(23px,-4px);
    filter: drop-shadow(0 0 8px #182b84);
}
.waves {
    position:relative;
    width: 100%;
    height:15vh;
    margin-bottom:-7px; /*Fix for safari gap*/
    min-height:100px;
    max-height:150px;
}
.parallax > use {
    animation: move-forever 25s cubic-bezier(.55,.5,.45,.5)     infinite;
}
.parallax > use:nth-child(1) {
    animation-delay: -2s;
    animation-duration: 7s;
}
.parallax > use:nth-child(2) {
    animation-delay: -3s;
    animation-duration: 10s;
}
.parallax > use:nth-child(3) {
    animation-delay: -4s;
    animation-duration: 13s;
}
.parallax > use:nth-child(4) {
    animation-delay: -5s;
    animation-duration: 20s;
}
@keyframes move-forever {
    0% {
        transform: translate3d(-90px,0,0);
    }
    100% {
        transform: translate3d(85px,0,0);
    }
}
.page_list a{
    color: #333;
}
.bnav{
    line-height: 2;
    padding: .4rem 0 .1rem;
}
.bnav span,.bnav span a,.art .listDate,.art .listAuthor,.art .click{
    color: rgb(51 51 51 / 60%);;
}
.side_menu{
    background: #fff;
    box-shadow: 0 0 20px rgb(0 0 0 / 50%);
    position: -webkit-sticky;
    position: sticky;
    margin: .3rem 0 .5rem;
    z-index: 1;
}
.side_menu a,.side_news > span,.qa span{
    font-size: .16rem;
}
.side_menu a{
    display: block;
    padding: .15rem 0;
    text-align: center;
}
.side_menu a:hover{
    background: rgb(12 52 129 / 10%);
}
.side_menu a.on{
    background: rgb(24 43 132);
    color: #fff;
}
.side_news > span,.qa span{
    color: #182b84;
    font-weight: bold;
}
.page_list > .container{
    display: flex;
}
.side_menu li{
    border-bottom: 1px solid #f7f7f7;
    line-height: 2;
}
.side_news li,.side_news ul{
    list-style: inside decimal;
    position: relative;
}
.side_news li p{
    display: -webkit-box;
    line-height: 1.5;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    text-overflow: ellipsis;
}
.side_news li span{
    font-size: .12rem;
    margin-left: .1rem;
    opacity: .6;
}
.side_news li p{
    margin: .1rem 0 .4rem .26rem;
}
.side_news li:before{
    background: #fff;
    border: 1px solid #d80c18;
    border-radius: 50%;
    content: "";
    display: block;
    width: 1.6em;
    height: 1.6em;
    position: absolute;
    top: 0;
    left: -7px;
    z-index: -1;
}
.side_news ul,.qa ul{
    border-top: 1px solid #d80c18;
    margin: .2rem 0 .5rem;
    padding-top: .25rem;
}
.side_news ul:before{
    background: #d80c18;
    content: "";
    display: block;
    width: 1px;
    height: 100%;
    position: absolute;
    left: 3px;
    z-index: -2;
}
.entered {
    --border-width: 3px;
    box-shadow: 0 0 20px rgb(0 0 0 / 50%),0 0 20px rgb(0 0 0 / 50%) inset;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 1.5rem;
    font-size: .5rem;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.5);
    background: #333;
    border-radius: var(--border-width);
    transition: all .5s ease-in-out;
}
a#bm:hover .entered{
    background: #182b84 linear-gradient(40deg, #182b84 40%, #12429f 50%, #182b84 60%);
    box-shadow: 0 0 20px rgb(0 0 0 / 50%);
    color: #fff;
}
.entered h2{
    margin: 0;
}
.entered:before{
    font-size: 0;
    opacity: 0;
    width: 0;
    transition: font-size .8s ease-in-out;
}
a#bm:hover .entered:before{
    font-weight: lighter;
    font-size: 1rem;
    opacity: 1;
    width: auto;
}
a#bm:hover .entered h2{
    opacity: 0;
    width: 0;
}
.entered::after {
    position: absolute;
    content: "";
    top: calc(-1 * var(--border-width));
    left: calc(-1 * var(--border-width));
    z-index: -1;
    width: calc(100% + var(--border-width) * 2);
    height: calc(100% + var(--border-width) * 2);
    background: linear-gradient(60deg, #5f86f2, #a65ff2, #f25fd0, #f25f61, #f2cb5f, #abf25f, #5ff281, #5ff2f0);
    background-size: 300% 300%;
    background-position: 0 50%;
    border-radius: calc(2 * var(--border-width));
    animation: moveGradient 4s alternate infinite;
}
@keyframes moveGradient {
    50% {
        background-position: 100% 50%;
    }
}
.bnav{
    border-bottom: 2px solid #182b84;
}
.list3 li{
    margin: .5rem 0;
    position: relative;
}
.list3 li:after{
    content: "";
    display: block;
    background: #182b84;
    width: 10vw;
    height: 1px;
    bottom: 0;
    left: 0;
    transition: all .2s ease-in-out;
}
.list3 li a{
    display: flex;
    align-items: center;
    transition: all 0.3s ease-in-out;
}
.list3 li:hover:after{
    box-shadow: 0 0 20px #182b84;
    width: 100%;
}
.listTitle{
    font-size: .2rem;
}
.list3 li span{
    color: rgb(51 51 51 / .6);
    margin-right: .2rem;
}
.list3 li span:before{
    font-size: .14rem;
}
.listCon{
    color: rgb(51 51 51 / .8);
    display: -webkit-box;
    line-height: 1.5;
    margin: .3rem 0 .2rem;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    text-overflow: ellipsis;
}
.listImg{
    overflow: hidden;
    width: 30%;
}
.list3 li a img{
    transition: all .5s ease-in-out;
}
.list3 li a:hover img{
    transform: scale3d(1.05,1.05,1);
}
.listText{
    width: 70%;
}
.pagenum{
    background: #fff;
    line-height: .34rem;
}
.pagenum a,.pagenum b{
    display: block;
    float: left;
    font-family: 'Jura', sans-serif;
    font-size: .3rem;
    margin: 0 5px;
}
.pagenum a.x{
    font-size: .05rem;
    position: relative;
    width: .24rem;
    height: .34rem;
    overflow: hidden;
}
.pagenum a.x:before{
    background: #fff;
    font-size: .28rem;
    position: absolute;
    top: 2px;
}
.content{
    background: #fff;
    padding-top: .2rem;
    text-align: justify;
}
.art .listDate,.art .listAuthor,.art .click{
    margin-right: .1rem;
}
.art .listDate:before,.art .listAuthor:before,.art .click:before{
    font-size: .18rem;
    margin-right: .05rem;
}
.artice{
    padding-top: .3rem;
}
.artice p{
    text-indent: 2em;
}
.artice img{
    margin-top: .3rem;
    margin-bottom: .3rem;
}
.load{
    display: flex;
    justify-content: center;
    margin: .2rem ;
}
.load span{
    margin: .1rem;
}
.form,.form + .wave{
    background: #182b84;
}
.form .container{
    display: flex;
    justify-content: center;
    padding: 10vh;
}
.login-box {
    width: auto;
    padding: 40px;
    background: rgba(0,0,0,.5);
    box-sizing: border-box;
    box-shadow: 0 15px 25px rgba(0,0,0,.6);
    border-radius: 10px;
}
.login-box h2 {
    margin: 0 0 30px;
    padding: 0;
    text-align: center;
    letter-spacing: .1em;
    color: azure;
    --color1: azure;
    --color2: aqua;
    --color3: dodgerblue;
    --color4: blue;
    --interval: 1s;
    display: block;
    text-shadow:
            0 0 10px var(--color1),
            0 0 20px var(--color2),
            0 0 40px var(--color3),
            0 0 80px var(--color4);
    will-change: filter, color;
    filter: saturate(60%);
    animation: flicker steps(100) var(--interval) 1s infinite;
}
@keyframes flicker {
    50% {
        color: white;
        filter: saturate(200%) hue-rotate(20deg);
    }
}
.login-box .user-box {
    position: relative;
}
.login-box .user-box input,.login-box .user-box textarea{
    width: 100%;
    padding: 10px 0;
    font-size: 16px;
    color: #fff;
    margin-bottom: 30px;
    border: none;
    border-bottom: 1px solid #fff;
    outline: none;
    background: transparent;
}
.login-box .user-box label {
    position: absolute;
    top:0;
    left: 0;
    padding: 10px 0;
    font-size: 16px;
    color: #fff;
    pointer-events: none;
    transition: .5s;
}
.login-box .user-box input:focus ~ label,
.login-box .user-box input:valid ~ label,
.login-box .user-box textarea:focus ~ label,
.login-box .user-box textarea:valid ~ label{
    color: lightyellow;
    --color1: yellow;
    --color2: gold;
    --color3: orange;
    --color4: darkred;
    top: -20px;
    left: 0;
    font-size: 14px;
    text-shadow:
            0 0 10px var(--color1),
            0 0 20px var(--color2),
            0 0 40px var(--color3),
            0 0 80px var(--color4);
    will-change: filter, color;
    filter: saturate(60%);
    animation: flicker steps(100) var(--interval) 1s infinite;
}
.form .btn{
    background: transparent;
    color: rgb(255 255 255 / 60%);
    outline: none;
    transition: .5s all ease-in-out;
}
.form .btn:hover{
    --color: #03e9f4;
    background: var(--color);
    box-shadow: 0 0 5px var(--color),
    0 0 25px var(--color),
    0 0 50px var(--color),
    0 0 100px var(--color);
    color: #fff;
}
.sub{
    margin-top: .2rem;
}
.sub input{
    margin: 0 .1rem;
}
.page_news dt{
    display: flex;
    margin: .5rem 0;
    align-items: center;
}
.page_news dt h2{
    font-size: .4rem;
    font-style: italic;
    font-weight: bold;
    line-height: 1.4;
}
.page_news dt p{
    line-height: 1.4;
}
.page_news dd{
    border-top: 1px solid rgb(0 0 0 / 10%);
    cursor: pointer;
}
.page_news dd:last-child{
    border-bottom: 1px solid rgb(0 0 0 / 10%);
}
.page_news dd .main{
    position: relative;
}
.page_news dd .main i{
    font-size: .3rem;
    position: absolute;
    top: .3rem;
    right: .2rem;
    transition: all .3s ease-in-out;
}
.page_news dd .main h3{
    font-weight: bold;
    width: 25%;
}
.page_news dd .main p{
    width: 15%;
}
.page_news dd .main h3,.page_news dd .main p{
    float: left;
    font-size: .2rem;
    margin: 0;
    line-height: 5;
}
.page_news dd .main p,.page_news dd .main i{
    color: rgb(0 0 0 / 40%);
}
.page_news dd .more{
    height: 0;
    visibility: hidden;
    transition: all 0.6s cubic-bezier(0.4, 0, 1, 1),opacity .2s ease-in-out;
    -webkit-transition:all 0.6s cubic-bezier(0.4, 0, 1, 1),opacity .2s ease-in-out;
    -webkit-opacity:0;
    opacity:0;
    overflow: hidden;
}
.page_news dd.open .more{
    visibility: visible;
    height: auto;
    padding: .2rem 0;
    opacity: 1;
}
.page_news dd .more li{
    margin-bottom: .5rem;
}
.page_news dd .more li a{
    background: #182b84;
    color: #fff;
    padding: 1em 2em;
}
.page_news dd .more li a:hover{
    background: #182b84 linear-gradient(to right, #182b84 40%, #12429f 50%, #182b84 60%);
}
.page_news dd i{
    transition: all .3s ease-in-out;
}
.page_news dd.open i{
    transform: rotateX(180deg);;
}
.page_news dt{
    overflow: hidden;
}
.list4 .img .tex{
    display: flex;
    padding: 0;
    width: 100%;
    flex-wrap: wrap;
    justify-content: space-around;
    align-items: center;
    align-content: center;
}
.list4 .img .tex h3{
    font-size: .16rem;
    margin-bottom: .2rem;
}
.list4 h3,.list4 .img .tex p,.list5 h3{
    text-align: center;
    width: 100%;
}
.list4 .shadow >h3,.list5 .shadow >h3{
    font-size: .18rem;
    line-height: 1;
    margin: .18rem 0 .3rem;
}
.list4 .shadow:hover .tex,.list5 .shadow:hover .tex{
    background-image: linear-gradient(90deg, rgba(12, 52, 129, 0), rgba(255, 255, 255, 0.1), rgba(12, 52, 129, 0));
}
.pages.about{
    animation: getout 1.5s ease-in-out .2s forwards;
}
@keyframes getout {
    100% {
        padding: 0;
    }
}
#scrollnav{
    position: fixed;
    z-index: 999;
    top: 50%;
    transform: translateY(-50%);
}
#scrollnav .nav{
    margin-left: .3rem;
}
#scrollnav .nav a{
    color: rgb(0 0 0 / 60%);
    font-size: .14rem;
    margin: .15rem 0;
    padding-left: 1em;
    pointer-events: none;
}
#scrollnav .nav li.active a{
    color: #182b84;
    border-left: 3px solid #182b84;
}
#scrollnav .nav>li>a:focus,#scrollnav .nav>li>a:hover{
    background: none;
}
#scrollnav .nav.menuActive a{
    color: #fff;
}
#about{
    position: relative;
    height: 100vh;
    width: 100vw;
    overflow:scroll;
    overflow-x: hidden;
}
#into{
    animation: changeheight 1.5s ease-in-out .2s forwards;
}
#into,#zj,#sz,#honor,#story,#history{
    position: sticky;
    top: 0;
}
#zj,#sz,#honor,#story{
    height: 100vh;
}
#zj,#sz,#story,#history{
    background: #fff;
}
@keyframes changeheight {
    100% {
        height: 100vh;
    }
}
#into{
    background: url("../images/01.jpg") no-repeat;
    background-size: cover;
    border-left: .3rem solid #fff;
    border-right: .3rem solid #fff;
    border-bottom: .3rem solid #fff;
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    height: calc(100vh - 1.25rem);
    justify-content: center;
    align-content: center;
}
#about h3{
    color: #000;
    font-weight: bold;
    margin-bottom: .5rem;
    text-align: center;
}
#into h3{
    text-align: center;
    text-shadow: 2px 2px 4px rgb(0 0 0 / 40%);
}
#into p {
    text-shadow: 1px 1px 2px rgb(0 0 0 / 20%);
}
#about p{
    line-height: 2;
    text-align: justify;
}
#zj,#sz{
    border-left: .3rem solid #fff;
    border-right: .3rem solid #fff;
    display: flex;
}
#zj > div,#sz > div{
    width: 50%;
}
#zj .text,#sz .text{
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    justify-content: center;
    align-content: center;
    align-items: flex-end;
    height: auto;
}
#zj .text{
    padding-left: 8vw;
}
#sz .text{
    padding-right: 8vw;
}
#zj h3,#zj p,#sz h3,#sz p{
    width: 34vw;
}
#zj p b{
    display: block;
    font-size: .16rem;
}
#zj .img{
    background: url("../images/zj.jpg") top center no-repeat;
}
#sz .img{
    background: url("../images/sz.jpg") top center no-repeat;
}
#zj .img,#sz .img{
    /*background-attachment: fixed;*/
    background-size: cover;
    height: 100%;
}
#honor{
    background: url("../images/news.png") no-repeat;
    background-size: cover;
    background-attachment: fixed;
}
#honor > div{
    padding-top: 50vh;
    transform: translateY(-35vh);
}
#honor h3{
    margin: 0;
    padding: .5rem 0;
    text-align: center;
}
#honor .pic{
    padding-bottom: .5rem;
}
#honor .swiper-horizontal>.swiper-pagination-bullets,#honor  .swiper-pagination-bullets.swiper-pagination-horizontal,#honor  .swiper-pagination-custom, .swiper-pagination-fraction{
    bottom: 0;
}
#honor .swiper-pagination .swiper-pagination-bullet{
    border-radius: 0!important;
    height: .02rem;
    width: .5rem;
    overflow: hidden;
}
#honor .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active{
    background: #182b84;
}
#story{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-content: center;
    align-items: flex-start;
    height: 100vh;
}
#story .swiper-slide{
    text-align: center;
}
#story .swiper-horizontal>.swiper-scrollbar{
    background: rgb(0 0 0 / 5%);
    top: 3px;
    height: 2px;
}
#story .swiper-horizontal>.swiper-scrollbar .swiper-scrollbar-drag{
    background: #182b84;
}
#story .swiper-slide > div > p{
    color: #fff;
    font-size: .4rem;
    text-shadow: 0px 0px 5px #000,0px 0px 15px #000000;
    text-align: center;
}
#story .swiper-slide > div:nth-of-type(1){
    background: #d80c18;
}
#story .swiper-slide > div:nth-of-type(2){
    background: #182b84;
}
#story .swiper-slide > p{
    font-size: .4rem;
    text-align: center;
}
#history{
    background: #f7f7f7;
    height: 100vh;
    position: sticky;
    top: 0;
}
#swiper-history{
    width:100%;
    position:relative;
}
#swiper-history .swiper {
    height: 4rem;
    margin:0 40px;
}
#swiper-history .short-line{
    height:1px;
    border-bottom:1px dashed #007aff;
    width:30px;
    position:absolute;
    top:50%;
}
#swiper-history .long-line{
    height:1px;
    border-bottom:1px solid #007aff;
    width:100%;
    position:absolute;
    top:50%;
    left:30px;
}
#swiper-history .swiper-slide span{
    display:block;
    width:100%;
    text-align:center;
    position:absolute;
    transition: 700ms;
}
#swiper-history .swiper-slide .detail{
    height: auto;
    top:0;
    color:#444;
    opacity: 0;
}
#swiper-history .swiper-slide .detail h4{
    font-weight: bold;
    margin-top: 0;
}
#swiper-history .swiper-slide .detail p{
    line-height: 1.8;
    margin: 0 auto;
    text-align: center;
}
#swiper-history .swiper-slide .date{
    color:#d80c18;
    font-size: .32rem;
    font-weight: bold;
    position:absolute;
    bottom:70px;
    opacity: 0;
}
#swiper-history .swiper-slide-active span{
    transition: 700ms 700ms;
}
#swiper-history .swiper-pagination-bullets{
    white-space:nowrap;
    width:auto;
    top: 50%;
    transform: translateY(-5px);
    height:10px;
    line-height:10px;
    transition: 700ms;
}
#swiper-history .swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 0;
}
#swiper-history .swiper-pagination-bullet{
    background:#fff;
    border: 1px solid #007aff;
    opacity:1;
    line-height:10px;
}
#swiper-history .swiper-pagination-bullet-active {
    background: #007aff;
}
#swiper-history .swiper-button-next,#swiper-history .swiper-button-prev{
    background-size:20px auto;
    outline:none;
}
#video{
    background: #fff url("../images/04.jpg") no-repeat;
    background-size: cover;
    padding: .5rem 0;
    position: sticky;
}
#map{
    background: #fff!important;
    padding: 1rem 0;
    z-index: 99!important;
    position: sticky;
}
.anchorBL{
    display: none!important;
}
#control{
    padding: 2.5rem 0;
}
label{
    max-width: 5rem;
}
@media (min-width: 768px){
    .tab2 a{
        color: #e1e1e1;
        display: none;
        position: absolute;
        top: 0;
        right: .2rem;
    }
    .tab2 a:hover{
        color: #182b84;
    }
    .tab2 li.on a{
        display: block;
    }
    .tab2 a:before{
        font-size: 32px;
    }
    .list2{
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
    }
    .list2 li{
        display: flex;
        flex-wrap: wrap-reverse;
        width: 46%;
    }
    .list2 li a{
        width: 100%;
    }
    .course .info{
        width: 99% ;
    }
    .course .info li{
        width: 48%;
    }
    .list3 li a{
        flex-direction: row-reverse;
    }
    .list3 li a h3,.list3 li a span,.list3 li a p{
        transition: all .3s ease-in-out;
    }
    .list3 li a span{
        transition-delay: 50ms;
    }
    .list3 li a p{
        transition-delay: 80ms;
    }
    .list3 li a:hover h3,.list3 li a:hover p{
        transform: translateX(.2rem);
    }
    .list3 li a:hover h3{
        color: #182b84;
    }
    .list3 li a:hover span:nth-of-type(1){
        margin-left: .2rem;
    }
    .listImg{
        margin-left: .8rem;
    }
    #into p{
        width: 70vw;
    }
    #history{
        padding-left: 10%;
        padding-right: 10%;
    }
}
@media (min-width: 992px) {
    body{
        padding-top: 1.25rem;
    }
    .header{
        position: fixed;
        top: 0;
        width: 100%;
        z-index: 99;
        transition: all 0.3s ease-in-out;
    }
    .header.fix{
        box-shadow: 0 2px 6px rgb(0 0 0 / 40%);
        height: .82rem;
    }
    .top{
        transition: margin-top 0.3s ease-in-out;
    }
    .fix .top{
        opacity: 0;
        margin-top: -.5rem;
    }
    .fix nav{
        background: #182b84;
        background-image: linear-gradient(to right, #182b84 40%, #12429f 50%, #182b84 60%);
        border-bottom: none;
    }
    .header .dropdown-menu{
        left: -50%;
        transform: translateX(50%);
    }
    .nav.navbar-nav{
        display: flex;
        flex-wrap: nowrap;
        float: none;
        justify-content: space-between;
    }
    .navbar-nav>li{
        height: .75rem;
    }
    nav.navbar.bootsnav ul.nav > li > a{
        line-height: .75rem;
    }
    .fix .navbar-nav > li#index{
        width: 1rem;
        margin-top: .05rem;
    }
    nav.navbar.bootsnav ul.nav > li > a{
        color: #182b84;
    }
    .fix nav.navbar.bootsnav ul.nav > li > a{
        color: #fff;
        text-shadow: 1px 1px 1px rgb(0 0 0);
    }
    .focus .tools{
        background: rgb(255 255 255 / 50%);
        color: #182b84;
        float: right;
        margin-top: -.7rem;
        position: relative;
        height: .7rem;
        width: 4rem;
        z-index: 9;
    }
    .focus .swiper-pagination{
        font-size: .2rem;
        font-family: 'Roboto Slab', serif;
        height: .7rem;
        line-height: .7rem;
        bottom: 0;
        letter-spacing: 5px;
        text-align: left;
        text-indent: 3em;
    }
    .focus .swiper-button-next,.focus .swiper-button-prev{
        background: none;
        z-index: 99;
    }
    .focus .swiper-button-next{
        left: 75%;
    }
    .focus .swiper-button-prev{
        left: 50%;
        transform: translateY(6px);
    }
    .focus .swiper-button-next:before,.focus .swiper-button-prev:before{
        color: #182b84;
        font-size: .4rem;
    }
    .focus .swiper-button-prev:before{
        transform: rotate(180deg);
    }
    .focus .swiper-button-next:after,.focus .swiper-button-prev:after{
        display: none;
    }
    .course .info{
        width: 95% ;
    }
    .page_bar{
        width: 55%;
        margin-left: 2.5vw;
    }
    .side_menu .on a{
        background: #182b84 linear-gradient(to right, #182b84 40%, #12429f 50%, #182b84 60%);
        color: #fff;
        text-shadow: 1px 2px 4px rgb(0 0 0 / 90%);
        box-shadow: 0 0 15px rgb(0 0 0 / 50%) inset;
    }
    .side_menu{
        top: .9rem;
    }
    .side_menu .swiper-wrapper{
        display: none;
    }
    .hidden-left{
        display: none;
    }
    .side_news > span,.qa span{
        line-height: .3rem;
    }
    .side_news > span:before,.qa span:before{
        color: #182b84;
        float: left;
        font-size: 28px;
        font-weight: lighter;
        margin-right: .15rem;
    }
    .page_news{
        background: #fff;
        padding-right: 3vw;
        width: 130%;
    }
    .page_list{
        position: relative;
    }
    .page_list:before {
        content: '';
        width: 50%;
        background: #f4f4f4 linear-gradient(20deg, #fff 20%, #f4f4f4 50%);
        right: 0;
        height: 100%;
        position: absolute;
        top: 0;
        z-index: -2;
    }
    .page_news dt{
        align-items: center;
    }
    .page_news dt .thumb{
        margin-left: 5%;
        width: 50%;
    }
    .list4 li {
        width: 31%;
    }
    .list5 li{
        width: 48%;
    }
    #swiper-history .swiper-slide .detail p{
        width: 60vw;
    }
    #into p{
        width: 60vw;
    }
    #history{
        padding-top: 2rem;
    }
    #video > .container,#map > .container{
        border-radius: 15px;
        box-shadow: 0 5px 15px rgb(0 0 0 / 20%);
        padding: 15px;
    }
}
@media (min-width: 1024px) {
    nav.navbar.bootsnav ul.nav > li > a{
        padding: 0;
    }
    nav.navbar.bootsnav li.dropdown ul.dropdown-menu{
        background: rgb(12,52,129,.95);
        border-top: 5px solid #d80c18;
        width: 1.4rem;
    }
    nav.navbar.bootsnav li.dropdown ul.dropdown-menu > li > a{
        border-bottom: none;
        color: #fff;
    }
    nav.navbar.bootsnav li.dropdown ul.dropdown-menu > li a:hover, nav.navbar.bootsnav li.dropdown ul.dropdown-menu > li a:hover,.dropdown-menu>li>a:hover{
        background-color: rgb(12,52,129);
        background-image: none;
    }
    .dropdown-menu{
        min-width: 1.4rem;
    }
    nav.navbar.bootsnav ul.nav > li.dropdown > a.dropdown-toggle:after{
        content: "";
    }
    .course .info{
        width: 90% ;
    }
}
@media (min-width: 1200px) {
    .page_bar{
        width: 45%;
    }
    .list4 li {
        width: 23%;
    }
    .list5 li{
        width: 31%;
    }
    #into p{
        width: 50vw;
    }
    #swiper-history .swiper-slide .detail p{
        width: 40vw;
    }
}
@media (min-width: 1440px) {
    .container{
        width: 1440px;
    }
    #lavalamp{
        left: 19.9%;
        bottom: -5px;
        width: 5%;
    }
    .tab2 li:nth-child(1):hover ~ #lavalamp {
        left: 19.9%;
    }
    .tab2  li:nth-child(2):hover ~ #lavalamp {
        left:39.5%;
    }
    .tab2  li:nth-child(3):hover ~ #lavalamp {
        left:59.1%;
    }
    .tab2  li:nth-child(4):hover ~ #lavalamp {
        left:78.6%;
    }
    .list2 li{
        width: 31%;
    }
    .course .info{
        width: 98%;
    }
    .course .info li{
        width: 31.5%;
    }
    .scene .view:before,.scene .view:after{
        content: "";
        display: block;
        height: 100%;
        width: 20vw;
        pointer-events: none;
        position: absolute;
        top: 0;
        transition: opacity .2s ease-in-out;
        z-index: 2;
        bottom: 0;
        top: 0;
    }
    .scene .view:before {
        background-image: linear-gradient(270deg,transparent 0,#182b84 90%,#182b84);
        left: 0;
    }
    .scene .view:after {
        background: linear-gradient(90deg,transparent 0,#182b84 90%,#182b84);
        right: 0;
    }
    .page_bar{
        width: 30%;
    }
    .list4 li {
        width: 22%;
    }
}
@media (min-width: 1600px){
    .course .info{
        width: 90%;
    }
    .course .info li{
        width: 31%;
    }
    .page_bar{
        width: 30%;
    }
    .page_news dt p{
        margin: .2rem 0 .7rem;
    }
    .page_news dt .thumb{
        transition: all .3s ease-in-out;
    }
    .page_news dt .thumb:hover{
        box-shadow: 5px 5px 10px #e12121;
    }
    .page_news dd .more li{
        display: flex;
        align-items: center;
    }
    .page_news dd .more li p:first-child{
        min-width: 1rem;
    }
    .page_news dd .more li p:last-child{
        flex-grow: 1;
    }
    .list4 li{
        width: 21%;
    }
    #into p{
        color: #000;
        width: 40vw;
    }
}
@media (max-width: 992px) {
    .header .navbar{
        min-height: 0;
    }
    .top .container div{
        opacity: 0;
    }
    nav.navbar.bootsnav .navbar-header{
        height: 0;
    }
    nav.navbar.bootsnav .navbar-nav {
        overflow-y: hidden;
    }
    nav.navbar.bootsnav.no-full .navbar-collapse.collapsing{
        overflow: hidden;
    }
    nav.navbar.bootsnav ul.nav li.dropdown ul.dropdown-menu > li > a{
        color: #fff;
    }
    .navbar-brand{
        position: absolute;
        top: -100px;
        width: 80%;
    }
    .navbar-brand img{
        width: 100%;
    }
    nav.navbar.bootsnav .navbar-toggle{
        background: none;
        float: right;
        margin-right: 0;
        margin-top: -75px;
    }
    nav.navbar.bootsnav.no-full .navbar-collapse{
        max-height: 9999px;
        width: 100%;
        position: absolute;
    }
    nav.navbar.bootsnav .navbar-collapse.collapse{
        background: rgb(12 52 129 / 95%);
        width: 100%;
        height: 100vh;
    }
    .navbar-nav>li>a{
        line-height: 40px;
    }
    nav.navbar.bootsnav ul.nav > li > a{
        color: #fff;
        text-shadow: none;
    }
    nav.navbar.bootsnav ul.nav li.dropdown ul.dropdown-menu > li > a{
        border-bottom: 1px #ccc dotted;
    }
    .dropdown-menu>li>a:focus, .dropdown-menu>li>a:hover{
        background: none;
    }
    nav.navbar.bootsnav li.dropdown a.dropdown-toggle:before{
        content: "\e6cc";
        transition: all .3s ease-in-out;
    }
    nav.navbar.bootsnav li.dropdown.on > a.dropdown-toggle:before{
        content: "\e6cc";
        transform: rotate(180deg);
    }
    .navbar-nav > li#index{
        display: none;
    }
    .focus .swiper-button-next,.focus .swiper-button-prev{
        display: none;
    }
    .news h2 span,.course h2 span,.advantage h2 span,.scene h2 span{
        font-size: 1.2rem;
        top: -.6rem;
    }
    .tab3 li{
        width: 32%;
    }
    .waves {
        height:40px;
        min-height:40px;
    }
    .page_list > .container{
        flex-direction:column-reverse;
    }
    .page_bar{
        position: sticky;
        top: 0;
    }
    .side_news,.qa,.hidden-right{
        display: none;
    }
    .side_menu{
        box-shadow: none;
        top: 0;
        margin: 0;
        overflow-x: hidden;
    }
    .side_menu ul{
        display: none;
    }
    .side_menu .swiper-wrapper{
        border-bottom: 1px solid #555;
        margin-bottom: 10px;
    }
    .side_menu .swiper-slide{
        padding: 0;
        width: auto;
    }
    .side_menu .swiper-slide a{
        padding: 10px 20px;
    }
    .list3{
        background: #fff;
        padding: .2rem 0;
    }
    .entered{
        position: -webkit-sticky;
        position: sticky;
        bottom: 30vh;
        z-index: -1;
        width: 90%;
        margin: 1rem auto;
    }
    .bnav{
        padding-top: 0;
    }
    .listText{
        width: 100%;
    }
    .page_news dt{
        flex-direction: column-reverse;
        position: relative;
        justify-content: center;
    }
    .page_news .info{
        color: #fff;
        position: absolute;
        width: 90%;
    }
    .page_news dt h2{
        /*animation: flicker steps(100) 3s 1s infinite;*/
        /*will-change: filter, color;*/
        /*filter: saturate(60%);*/
        text-shadow: 2px 2px 10px #000,
        2px 2px 20px #fff,
        2px 2px 35px #d80c18;
    }
    .page_news dt .thumb.animated{
        z-index: -1;
    }
    .page_news dt p{
        margin: 10vh 0 20vh;
        text-align: justify;
        text-shadow: 2px 2px 5px #000;
    }
    .page_news dt h3{
        font-size: .18rem;
        text-shadow: 2px 2px 5px #000,
        2px 2px 10px #fff,
        2px 2px 15px #182b84;
    }
    .list4 li {
        width: 31%;
    }
    .list5 li{
        width: 47%;
    }
    .pages.about .header{
        animation: fix100 1.5s ease-in-out .2s forwards;
    }
    @keyframes fix100 {
        100% {
            margin-top: -1rem;
        }
    }
    #history{
        padding-top: 1rem;
    }
}
@media (max-width: 768px) {
    .focus .swiper-button-next:before,.focus .swiper-button-prev:before{
        display: none;
    }
    .news h2, .course h2, .scene h2{
        margin: .25rem auto .5rem;
    }
    .tab{
        margin-bottom: .4rem;
    }
    .tab2 li{
        position: relative;
        display: contents;
    }
    .tab2 li a,.tab2 li b{
        display: none;
        position: absolute;
    }
    .tab2 li a{
        bottom: -2.3em;
        right: 1em;
    }
    .tab2 li b{
        border-bottom: 2px solid #182b84;
        bottom: -2.6em;
    }
    .tab2 li.on a,.tab2 li.on b{
        display: block;
    }
    .tab2 li:before{
        display: block;
    }
    .course .info{
        margin-bottom: 0;
    }
    .advantage h2{
        margin: -.16rem auto .5rem;
    }
    .course .info{
        width: 96% ;
    }
    .news h2 span,.course h2 span,.advantage h2 span,.scene h2 span{
        font-size: 1rem;
        top: -.5rem;
    }
    #tab3 .swiper-slide.swiper-slide-active > .info .num {
        left: 6%;
        top: -10%;
        font-size: .3rem;
    }
    #tab3 .swiper-slide.swiper-slide-active > .info p:nth-of-type(1){
        top: 22%;
        font-size: .18rem;
    }
    #tab3 .swiper-slide.swiper-slide-active > .info p:nth-of-type(2){
        top: 30%;
        font-size: .16rem;
    }
    #tab3 .swiper-slide.swiper-slide-active > .info a {
        top: 42%;
    }
    .footer .tel{
        background: none;
    }
    .footer .tel a:nth-of-type(1){
        margin-left: 2.8em;
    }
    .footer .support a:not(:first-child){
        margin-left: 2.8em;
    }
    .footer .flexbox{
        flex-wrap: wrap;
    }
    .footer .flexbox > div{
        margin-bottom: 30px;
    }
    .footer .new_media{
        justify-content: center;
        width: 100%;
    }
    .list3 li a{
        flex-direction: column;
    }
    .listImg{
        width: 100%;
    }
    .pagenum a, .pagenum b{
        font-size: 16px;
        margin: 0 4px;
    }
    .pagenum a:first-child{
        display: none;
    }
    .list4,.list5{
        justify-content: space-around;
    }
    .list4 li {
        width: 40%;
    }
    .list5 li{
        width: 42%;
    }
    #scrollnav{
        display: none;
    }
    #zj{
        flex-direction: column;
        height: 150vh;
    }
    #sz{
        flex-direction: column-reverse;
        height: 100vh;
    }
    #zj .img,#sz .img{
        height: 5rem;
    }
    #zj > div, #sz > div{
        width: 100%;
    }
    #zj h3, #zj p, #sz h3, #sz p{
        width: 100%;
    }
    #zj .text,#sz .text{
        padding: 0;
    }
}
@media (max-width: 500px) {
    html{
        overflow-x: hidden!important;
    }
    .top{
        line-height: normal;
    }
    nav.navbar.bootsnav .navbar-toggle{
        margin-top: -55px;
    }
    .navbar-brand {
        top: -70px;
    }
    .tab3 li a{
        font-size: .16rem;
    }
    .news h2 span,.course h2 span,.advantage h2 span,.scene h2 span{
        font-size: .7rem;
        top: -.35rem;
    }
    .course .info .img .tex{
        padding: .15rem .2rem 0;
    }
    .course .info .img .tex h3,.course .info .shadow > h3{
        font-size: .2rem;
    }
    .news .container,.advantage .container{
        padding: 0;
    }
    .course .info .img .tex h3{
        margin-bottom: .08rem;
    }
    .course .info .tex span{
        margin-bottom: .1rem;
    }
    #tab3 .swiper-slide.swiper-slide-active > .info{
        background: rgb(12 52 129 / 80%);
        background: linear-gradient(40deg, rgb(12 52 129 / 100%), rgb(12 52 129 / 0%)) !important;
        width: 100%;
    }
    #tab3 .swiper-slide > .info .num{
        left: -5px;
    }
    #tab3 .swiper-slide.swiper-slide-active > .info .num{
        left: -5px;
        top: -30px;
    }
    #tab3 .swiper-slide.swiper-slide-active > .info p:nth-of-type(1){
        left: 7%;
        top: 60px;
    }
    #tab3 .swiper-slide.swiper-slide-active > .info p:nth-of-type(2){
        left: 7%;
        top: 80px;
    }
    #tab3 .swiper-slide.swiper-slide-active > .info p:nth-of-type(3){
        display: none;
    }
    #tab3 .swiper-slide > .info a{
        left: 0;
        top: 120px;
    }
    #tab3 .swiper-slide.swiper-slide-active > .info a {
        left: 7%;
        top: 60%;
    }
    .view .swiper-slide > a b,.view .swiper-slide > span{
        margin-left: 20px;
    }
    .footer .copyright p:last-child{
        font-size: 12px;
    }
    .pagenum{
        display: flex;
    }
    .pagenum a, .pagenum b{
        margin: 0 3px;
    }
    .entered{
        font-size: .4rem;
    }
    .load{
        flex-direction: column;
    }
    .login-box{
        width: 90%;
    }
    .form .container{
        align-items: center;
        margin-bottom: -1px;
        padding: .4rem 0;
    }
    .page_news dt p{
        line-height: 2;
        margin: 2vh 0 5vh;
    }
    .page_news dd .main h3,.page_news dd .main p{
        font-size: .18rem;
    }
    .page_news dd .main i{
        font-size: .24rem;
        top: .24rem;
    }
    .page_news dd .main h3{
        width: 45%;
    }
    .page_news dd .main p:nth-of-type(1){
        width: 15%;
    }
    .page_news dd .main p:nth-of-type(2){
        width: 8%;
    }
    .page_news dd .main p:nth-of-type(4){
        display: none;
    }
    .list4 li {
        width: 75%;
    }
    .list5 li{
        width: 75%;
    }
    #about .song{
        width: 70%;
    }
    #story .swiper-slide > p{
        font-size: .3rem;
    }
    .pages.about .header{
        animation: fix57 1.5s ease-in-out .2s forwards;
    }
    @keyframes fix57 {
        100% {
            margin-top: -.57rem;
        }
    }
    #into{
        border: none;
        padding: 0 .2rem .2rem;
    }
    #zj,#sz{
        border-left: .2rem solid #fff;
        border-right: .2rem solid #fff;
        display: flex;
        height: 100vh;
    }
    #zj h3,#sz h3{
        margin-bottom: .2rem;
    }
    #zj p,#sz p{
        line-height: 1.4;
    }
    #sz .img{
        background-size: contain;
    }
    #honor{
        padding: 0 .2rem;
    }
    #history{
        padding-top: .5rem;
    }
}
@media (min-width: 750px) and (max-width: 1440px){
    .footer .flexbox{
        flex-wrap: wrap;
    }
    .footer .new_media{
        justify-content: center;
        margin-top: 40px;
        width: 100%;
    }
}
@media (min-width: 768px) and (max-width: 992px) {
    .course .info .img .tex{
        padding: .2rem .3rem 0;
    }
    .course .info .img .tex h3 {
        margin: .2rem 0 .05rem;
    }
    .course .info .img .tex span{
        margin-bottom: .1rem;
    }
    .course .info p{
        font-size: .13rem;
    }
    .course .info .img .tex h3,.course .info .shadow > h3{
        font-size: .2rem;
    }
    #tab3 .swiper-slide.swiper-slide-active > .info .num {
        left: 6%;
        top: -10%;
        font-size: .5rem;
    }
    #tab3 .swiper-slide.swiper-slide-active > .info p:nth-of-type(1){
        top: 22%;
        font-size: .24rem;
    }
    #tab3 .swiper-slide.swiper-slide-active > .info p:nth-of-type(2){
        top: 30%;
        font-size: .2rem;
    }
    #tab3 .swiper-slide.swiper-slide-active > .info a {
        top: 42%;
    }
}
@media (min-width: 992px) and (max-width: 1200px) {
    #tab3 .swiper-slide.swiper-slide-active > .info .num{
        top: 5%;
    }
}
@media (min-width: 1200px) and (max-width: 1440px) {
    .tab3 li a{
        font-size: .18rem;
    }
}
@font-face {
    font-family: 'iconfont';  /* Project id 3375494 */
    src: url('http://at.alicdn.com/t/c/font_3375494_f0l5a0nfm7g.woff2?t=1685668501264') format('woff2'),
    url('http://at.alicdn.com/t/c/font_3375494_f0l5a0nfm7g.woff?t=1685668501264') format('woff'),
    url('http://at.alicdn.com/t/c/font_3375494_f0l5a0nfm7g.ttf?t=1685668501264') format('truetype');
}
.iconfont,nav.navbar.bootsnav li.dropdown a.dropdown-toggle:before,.focus .swiper-button-next:before,.focus .swiper-button-prev:before,.tab2 li:before,.tab2 a:before,.tab3 li a:before,.course .info .tex span:before,.course .info h3 span:before,.footer .tel:before,.footer .address:before,.footer .support:before,.footer .copyright:before,.footer .new_media .wechat:before,.footer .new_media .tik_tok:before,.footer .new_media .weibo:before,.side_news > span:before,.qa span:before,.entered:before,.listDate:before,.listAuthor:before,.click:before,.pagenum a.x:before,.page_news dd .main i:after{
    font-family: "iconfont" !important;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
.tab2 li:nth-of-type(1):before {
    content: "\e872";
}
.tab2 li:nth-of-type(2):before {
    content: "\e89d";
}
.tab2 li:nth-of-type(3):before {
    content: "\e89a";
}
.tab2 li:nth-of-type(4):before {
    content: "\e892";
}
.tab2 a:before{
    content: "\e88c";
}
.course .info .tex span:before,.course .info h3 span:before{
    content: "\e716";
}
.footer .tel:before{
    content: "\e678";
}
.footer .address:before{
    content: "\e616";
}
.footer .support:before{
    content: "\e6c3";
}
.footer .copyright:before{
    content: "\e61b";
}
.footer .new_media .wechat:before{
    content: "\e8d5";
}
.footer .new_media .tik_tok:before{
    content: "\e8db";
}
.footer .new_media .weibo:before{
    content: "\e8da";
}
.tab3 li:nth-of-type(1) a:before{
    content: "\e62d";
}
.tab3 li:nth-of-type(2) a:before{
    content: "\e798";
}
.tab3 li:nth-of-type(3) a:before{
    content: "\e61c";
}
.focus .swiper-button-next:before,.focus .swiper-button-prev:before{
    content: "\e61a";
}
.side_news > span:before{
    content: "\e8b1";
}
.qa span:before{
    content: "\e6ad";
}
.entered:before{
    content: "\e72c";
}
.listDate:before{
    content: "\e600";
}
.listAuthor:before{
    content: "\e65c";
}
.click:before{
    content: "\e627";
}
.pagenum a.first:before{
    content: "\e714";
}
.pagenum a.pre:before{
    content: "\e712";
}
.pagenum a.nex:before{
    content: "\e718";
}
.pagenum a.last:before{
    content: "\e713";
}
.page_news dd .main i:after{
    content: "\e6cc";
}
.mySwiper a:before{
    content: "\e62a";
}
.diggit a:before{
    content: "\e601";
}
.icon-dianji:before {
    content: "\e602";
}