@charset "utf-8";
body{
    background: url(../img/bg.png) repeat left center;
}
@keyframes rotate {
    from {
      transform: rotate(0deg);
    }
    to {
      transform: rotate(360deg);
    }
}
@keyframes yuan1 {
    0% {
      width: 100%;
      height: 100%;
    }
    100% {
      width: 110%;
      height: 110%;
    }
}
@keyframes yuan2 {
    0% {
        width: 110%;
        height: 110%;
    }
    100% {
        width: 120%;
        height: 120%;
    }
}
@keyframes yuan3 {
    0% {
        width: 120%;
        height: 120%;
    }
    100% {
        width: 130%;
        height: 140%;
    }
}
@keyframes yuan4 {
    0% {
        width: 130%;
        height: 130%;
    }
    100% {
        width: 140%;
        height: 140%;
    }
}
@keyframes yuan5 {
    0% {
        width: 330px;
        height: 330px;
    }
    100% {
        width: 370px;
        height: 370px;
    }
}
@keyframes yuan6 {
    0% {
        width: 370px;
        height: 370px;
    }
    100% {
        width: 410px;
        height: 410px;
    }
}
@keyframes yuan7 {
    0% {
        width: 410px;
        height: 410px;
    }
    100% {
        width: 460px;
        height: 460px;
    }
}
@keyframes yuan8 {
    0% {
        width: 460px;
        height: 460px;
    }
    100% {
        width: 500px;
        height: 500px;
    }
}
.banner .news_images a{
    display: block;
    width: 100%;
    padding: 40% 0 0;
    position: relative;
}
.banner .news_images img{
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    left: 0;
    top: 0;
}
.banner .slick-dots{
    bottom: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.banner .slick-dots li{
    width: 32px;
    height: 32px;
    margin-right: 20px;
    position: relative;
}
.banner .slick-dots li:last-of-type{
    margin-right: 0;
}
.banner .slick-dots li:last-of-type::before{
    display: none;
}
.banner .slick-dots li button,.banner .slick-dots li button:before{
    width: 10px;
    height: 10px;
}
.banner .slick-dots li button:before {
    border-radius: 100%;
    content: '';
    opacity: 1;
    background: rgba(255, 255, 255, 1);
    transform: translate(-50%,-50%);
    z-index: 10;
}
.banner .slick-dots li.slick-active,.banner .slick-dots li.slick-active button,.banner .slick-dots li.slick-active button:before{
    width: 32px;
    height: 32px;
}
.banner .slick-dots li.slick-active button:before{
    background: url(../img/dotsIcon.png) no-repeat center;
}
.banner .slick-prev,.banner .slick-next{
    width: 55px;
    height: 55px;
    border-radius: 100%;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 99;
}
.banner .slick-prev{
    left: 50px;
    background: rgba(255, 255, 255, 0.3) url(../img/prevIcon.png) no-repeat center;
}
.banner .slick-prev:hover{
    background: rgba(150, 0, 1, 1) url(../img/prevIcon.png) no-repeat center;
}
.banner .slick-next{
    left: auto;
    right: 50px;
    background: rgba(255, 255, 255, 0.3) url(../img/nextIcon.png) no-repeat center;
}
.banner .slick-next:hover{
    background: rgba(150, 0, 1, 1) url(../img/nextIcon.png) no-repeat center;
}
.tit{
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 30px;
    position: relative;
    overflow: hidden;
}
.tit h2{
    font-family: Source Han Serif CN;
    font-size: 38px;
    font-weight: bold;
    line-height: 55px;
    letter-spacing: 0em;
    color: #8F0001;
    position: relative;
}
.tit h2::before{
    display: block;
    content: "";
    width: 1600px;
    height: 52px;
    background: url(../img/titBg.png) no-repeat left center;
    position: absolute;
    left: 100%;
    top: 50%;
    transform: translateY(-50%);
}
.tit h2 span{
    color: #494949 
}
.tit a{
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    display: block;
    font-family: Source Han Sans CN;
    font-size: 16px;
    font-weight: normal;
    line-height: 24px;
    letter-spacing: 0em;
    color: #B84B4B;
    background: #ffffff url(../img/more.png) no-repeat left center;
    padding-left: 30px;
}
.tit a:hover{
    color: #8F0001;
}
/* indexCon1 */
.indexCon1{
    padding: 80px 0;
}
.indexCon1 .tit,.indexCon3 .tit{
    justify-content: center;
    margin-bottom: 50px;
}
.newBanner{
    width: 47.5%;
}
.newBanner a{
    display: block;
    width: 100%;
    height: 420px;
    overflow: hidden;
    position: relative;
}
.newBanner a img{
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: all .3s;
}
.newBanner a:hover img{
    transform: scale(1.2);
}
.newBanner a p.txt{
    width: 100%;
    padding: 40px 135px 25px 40px;
    box-sizing: border-box;
    background: linear-gradient(0deg, #8F0001 0%, rgba(143, 0, 1, 0) 80%);
    font-family: Microsoft YaHei;
    font-size: 18px;
    font-weight: bold;
    line-height: 26px;
    letter-spacing: 0em;
    color: #FFFFFF;
    position: absolute;
    left: 0;
    bottom: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.newBanner a p.time{
    position: absolute;
    top: 0;
    left: 15px;
    width: 90px;
    height: auto;
    background: #F3C863;
    font-family: Source Han Serif CN;
    font-size: 18px;
    font-weight: 500;
    line-height: 26px;
    letter-spacing: 0em;
    color: #FFFFFF;
    text-align: center;
}
.newBanner a p.time span{
    display: block;
    font-family: Source Han Serif CN;
    font-size: 38px;
    font-weight: bold;
    line-height: 44px;
    letter-spacing: 0em;
    color: #FFFFFF;
}
.newBanner a p.time::before{
    display: block;
    content: "";
    border-top: 20px solid #F3C863;
    border-left: 45px solid transparent;
    border-right: 45px solid transparent;
    position: absolute;
    top: 100%;
    left: 0;
}
.newBanner .slick-dots{
    bottom: 34px;
    right: 40px;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    z-index: 999;
}
.newBanner .slick-dots li{
    width: 10px;
    height: 10px;
    margin-right: 15px;
    position: relative;
}
.newBanner .slick-dots li:last-of-type{
    margin-right: 0;
}
.newBanner .slick-dots li:last-of-type::before{
    display: none;
}
.newBanner .slick-dots li button,.newBanner .slick-dots li button:before{
    width: 10px;
    height: 10px;
}
.newBanner .slick-dots li button:before {
    border-radius: 100%;
    content: '';
    opacity: 1;
    background: rgba(255, 255, 255, 0.5);
    transform: translate(-50%,-50%);
    z-index: 10;
}
.newBanner .slick-dots li.slick-active,.newBanner .slick-dots li.slick-active button,.newBanner .slick-dots li.slick-active button:before{
    width: 10px;
    height: 10px;
}
.newBanner .slick-dots li.slick-active button:before{
    background: rgba(255, 255, 255, 1);
}
.newList{
    width: 49%;
}
.newList li a{
    display: flex;
    padding: 21px 0;
    border-bottom: 1px dashed #FFD5D5;
    align-items: center;
}
.newList li a p span{
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.newList li a p.time{
    width: 74px;
    height: 62px;
    border-radius: 0px 10px 0px 10px;
    overflow: hidden;
    text-align: center;
    background: rgba(243, 200, 99, 1) url(../img/newListIcon2.png) no-repeat center;
    background-size: auto 90%;
    font-family: Georgia;
    font-size: 14px;
    font-weight: normal;
    line-height: 18px;
    letter-spacing: 0em;
    color: #FFFFFF;
}
.newList li a p.time span{
    font-family: Georgia;
    font-size: 32px;
    font-weight: normal;
    line-height: 36px;
    letter-spacing: 0em;
    color: #FFFFFF;
}
.newList li a p.txt{
    width: calc(100% - 74px);
    padding-left: 45px;
    box-sizing: border-box;
}
.newList li a p.txt span:nth-of-type(1){
    font-family: Microsoft YaHei;
    font-size: 18px;
    font-weight: normal;
    line-height: 26px;
    letter-spacing: 0em;
    color: #494949;
}
.newList li a p.txt span:nth-of-type(2){
    font-family: Microsoft YaHei;
    font-size: 14px;
    font-weight: 290;
    line-height: 26px;
    letter-spacing: 0em;
    color: #494949;
    margin-top: 10px;
}
.newList li a:hover p.time{
    background: #8F0001 url(../img/newListIcon1.png) no-repeat center;
    background-size: auto 90%;
}
.newList li a:hover p.txt span:nth-of-type(1){
    color: #8F0001;
}
.newList li a:hover p.txt span:nth-of-type(2){
    color: #C78080;
}

/* indexCon2 */
.indexCon2{
    padding: 65px 0;
    background: rgba(238, 238, 238, 0.73) url(../img/bg2.png) no-repeat bottom -260px center;
}
.indexCon2 .tit a{
    background: #f3f2f3 url(../img/more.png) no-repeat left center;
}
.notice{
    width: 40%;
}
.notice li a{
    display: flex;
    padding: 10px 0;
    border-bottom: 1px dashed #FFD5D5;
    align-items: center;
}
.notice li a p span{
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.notice li a p.time{
    width: 86px;
    height: 78px;
    border-radius: 20px 0px 20px 0px;
    overflow: hidden;
    text-align: center;
    background: transparent;
    font-family: Georgia;
    font-size: 14px;
    font-weight: normal;
    line-height: 1;
    letter-spacing: 0em;
    color: #8F0001;
}
.notice li a p.time span{
    font-family: Georgia;
    font-size: 32px;
    font-weight: normal;
    letter-spacing: 0em;
    margin: 10px 0 5px;
}
.notice li a p.txt{
    width: calc(100% - 86px);
    padding-left: 35px;
    box-sizing: border-box;
    font-family: Microsoft YaHei;
    font-size: 18px;
    font-weight: normal;
    line-height: 30px;
    max-height: 60px;
    letter-spacing: 0em;
    color: #494949;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
}
.notice li a:hover p.time{
    background: #8F0001;
    color: #ffffff;
}
.notice li a:hover p.txt{
    color: #8F0001;
}
.teacher{
    width: 55%;
}
.teacher ul li{
    width: 48%;
    margin-right: 4%;
    float: left;
}
.teacher ul li:nth-of-type(2n){
    margin-right: 0;
}
.teacher ul li a{
    display: block;
}
.teacher ul li p.img{
    width: 100%;
    height: 248px;
    overflow: hidden;
}
.teacher ul li p.img img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: all .3s;
}
.teacher ul li p.txt{
    width: 100%;
    padding: 15px 30px;
    background: #FFFFFF;
    box-sizing: border-box;
}
.teacher ul li p.txt span{
    display: block;
}
.teacher ul li p.txt span:nth-of-type(1){
    font-family: Microsoft YaHei;
    font-size: 18px;
    font-weight: normal;
    line-height: 26px;
    letter-spacing: 0em;
    color: #494949;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.teacher ul li p.txt span:nth-of-type(2){
    font-family: Microsoft YaHei;
    font-size: 14px;
    font-weight: 290;
    line-height: 23px;
    letter-spacing: 0em;
    max-height: 46px;
    color: #494949;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    margin: 10px 0;
}
.teacher ul li p.txt span:nth-of-type(3){
    font-family: Georgia;
    font-size: 14px;
    font-weight: normal;
    line-height: 26px;
    letter-spacing: 0em;
    color: #FFB917;
}
.teacher ul li a:hover img{
    transform: scale(1.2);
}
.teacher ul li a:hover p.txt span:nth-of-type(1){
    color: #8F0001;
}
/* indexCon3 */
.indexCon3{
    padding: 65px 0 100px;
    background: url(../img/videoBg.png) no-repeat right bottom;
}
.videoLeft{
    width: 67%;
    position: relative;
}
.videoLeft .video{
    display: block;
    width: 78%;
    height: 500px;
    position: relative;
    z-index: 10;
    background: #000;
}
.videoLeft .video video{
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.videoLeft .video .btn{
    display: block;
    width: 62px;
    height: 62px;
    background: url(../img/bfIcon.png) no-repeat center;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    cursor: pointer;
}
.videoLeft .video.on .btn{
    display: none;
}
.videoSub{
    width: 500px;
    height: 500px;
    position: absolute;
    right: 0;
    top: 0;
}
.videoSub li{
    width: 42%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.videoSub li p{
    padding: 100% 0 0;
    border-radius: 100%;
    position: relative;
}
.videoSub li p img{
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    left: 15%;
    top: 0;
    z-index: 10;
border-radius: 50%;
}
.videoSub li::before,.videoSub li::after,.videoSub li p::after,.videoSub li p::before{
    display: block;
    content: "";
    border-radius: 100%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    background: #FFCF60;
    z-index: 2;
}
.videoSub li p::after{
    width: 340px;
    height: 340px;
    opacity: 0.6;
    animation: yuan5 2.5s linear infinite;
}
.videoSub li p::before{
    width: 370px;
    height: 370px;
    opacity: 0.5;
    animation: yuan6 2.5s linear infinite;
}
.videoSub li::after{
    width: 410px;
    height: 410px;
    opacity: 0.4;
    animation: yuan7 2.5s linear infinite;
}
.videoSub li::before{
    width: 460px;
    height: 460px;
    opacity: 0.3;
    animation: yuan8 2.5s linear infinite;
}
.videoRight{
    width: 33%;
    height: 500px;
    position: relative;
}
.videoRight ul li{
    width: 28%;
    position: absolute;
    transition: all .3s;
}
.videoRight ul li:nth-of-type(1){
    top: 0;
    left: 50px;
}
.videoRight ul li:nth-of-type(2){
    top: 0;
    right: 50px;
}
.videoRight ul li:nth-of-type(3){
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.videoRight ul li:nth-of-type(4){
    bottom: 0;
    left: 50px;
}
.videoRight ul li:nth-of-type(5){
    bottom: 0;
    right: 50px;
}
.videoRight ul li a{
    display: block;
    padding: 100% 0 0;
    border-radius: 100%;
    overflow: hidden;
}
.videoRight ul li a p.icon{
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    left: 0;
    top: 0;
    animation: rotate 15s linear infinite;
}
.videoRight ul li a p.icon::before{
    display: block;
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    transform: translate(-50%,-100%);
}
.videoRight ul li:nth-of-type(1) a p.icon::before{
    width: 30px;
    height: 30px;
    background: url(../img/videoIcon1.png) no-repeat center;
}
.videoRight ul li:nth-of-type(2) a p.icon::before{
    width: 42px;
    height: 43px;
    background: url(../img/videoIcon2.png) no-repeat center;
}
.videoRight ul li:nth-of-type(3) a p.icon::before{
    width: 35px;
    height: 26px;
    background: url(../img/videoIcon3.png) no-repeat center;
}
.videoRight ul li:nth-of-type(4) a p.icon::before{
    width: 36px;
    height: 36px;
    background: url(../img/videoIcon4.png) no-repeat center;
}
.videoRight ul li:nth-of-type(5) a p.icon::before{
    width: 46px;
    height: 49px;
    background: url(../img/videoIcon5.png) no-repeat center;
}
.videoRight ul li a img{
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 10;
border-radius: 50%;
}
.videoRight ul li::before,.videoRight ul li::after,.videoRight ul li a::after,.videoRight ul li a::before{
    display: block;
    content: "";
    border-radius: 100%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    border: 1px solid #FFCF60;
    z-index: 2;
}
.videoRight ul li a::after{
    width: 110%;
    height: 110%;
    opacity: 1;
}
.videoRight ul li a::before{
    width: 120%;
    height: 120%;
    opacity: 0.75;
}
.videoRight ul li::after{
    display: none;
    width: 130%;
    height: 130%;
    opacity: 0.55;
}
.videoRight ul li::before{
    display: none;
    width: 140%;
    height: 140%;
    opacity: 0.25;
}
.videoRight ul li:hover a::after{
    animation: yuan1 2.5s linear infinite;
}
.videoRight ul li:hover a::before{
    animation: yuan2 2.5s linear infinite;
}
.videoRight ul li:hover::after{
    display: block;
    animation: yuan3 2.5s linear infinite;
}
.videoRight ul li:hover::before{
    display: block;
    animation: yuan4 2.5s linear infinite;
}
.videoRight ul li:hover{
    transform: scale(1.1);
}
.videoRight ul li:nth-of-type(3):hover{
    transform: scale(1.1) translate(-50%, -50%);
}
.imgLink{
    margin-bottom: 50px;
}
.imgLink p{
    float: left;
    font-family: Source Han Sans CN;
    font-size: 16px;
    font-weight: normal;
    line-height: 30px;
    letter-spacing: 0em;
    color: #494949;
    width: 80px;
}
.imgLink ul{
    float: left;
    width: calc(100% - 80px);
}
.imgLink ul li{
    width: calc(100% / 7);
    padding: 0 25px;
    float: left;
    box-sizing: border-box;
}
.imgLink ul li a{
    display: block;
    width: 100%;
    height: 30px;
    overflow: hidden;
    position: relative;
}
.imgLink ul li a img{
    display: block;
    width: auto;
    height: auto;
    max-height: 100%;
    object-fit: cover;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    transition: all .3s;
}
.imgLink ul li a:hover img{
    transform: scale(1.2) translate(-50%, -50%);
}
.indexCon1 .tit,
.indexCon1 .newBanner,
.indexCon1 .newList,
.indexCon2 .notice,
.indexCon2 .teacher,
.indexCon3 .tit,
.indexCon3 .videoTab{
    visibility: visible;
    opacity: 0;
}
.indexCon1.animation .tit{
    visibility: inherit;
    opacity: 1;
    animation: 0.8s ease .3s 1 normal backwards running fadeInUp;
}
.indexCon1.animation .newBanner{
    visibility: inherit;
    opacity: 1;
    animation: 0.8s ease .3s 1 normal backwards running fadeInLeft;
}
.indexCon1.animation .newList{
    visibility: inherit;
    opacity: 1;
    animation: 0.8s ease .3s 1 normal backwards running fadeInRight;
}
.indexCon2.animation .notice{
    visibility: inherit;
    opacity: 1;
    animation: 0.8s ease .4s 1 normal backwards running fadeInLeft;
}
.indexCon2.animation .teacher{
    visibility: inherit;
    opacity: 1;
    animation: 0.8s ease .4s 1 normal backwards running fadeInRight;
}
.indexCon3.animation .tit{
    visibility: inherit;
    opacity: 1;
    animation: 0.8s ease .4s 1 normal backwards running fadeInUp;
}
.indexCon3.animation .videoTab{
    visibility: inherit;
    opacity: 1;
    animation: 0.8s ease .4s 1 normal backwards running fadeInUp;
}