.banner {
        position: relative;
}


.banner a {
        display: block;
        position: relative;
}

.bannerPic {
        padding-bottom: 56.3%;
}

.bannertxt {
        line-height: 32px;
        bottom: 20.81%;
        position: absolute;
        display: inline-block;
        left: 16.15%;
        text-align: center;
        padding: 1.3% 2.9%;
        box-sizing: border-box;
        background: #cdad69;
}

.banner .slick-prev {
        width: 60px;
        height: 60px;
        left: 104px;
        margin: 0;
        top: calc(50% - 28px);
        background: url(../images/prev.png) no-repeat;
}


.banner .slick-next {
        width: 60px;
        height: 60px;
        right: 104px;
        margin: 0;
        top: calc(50% - 28px);
        background: url(../images/next.png) no-repeat;
}

.bannertxt:before, .bannertxt:after,
.bannertxt span:before,
.bannertxt span:after {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 0;
        height: 80px;
        background-color: rgba(181, 147, 75, 0.25);
        -webkit-transition: 0.4s;
        transition: 0.4s;
}

.bannertxt:after,
.bannertxt span:before {
        left: auto;
        right: 0;
}

.bannertxt span:before,
.bannertxt span:after {
        -webkit-transition-delay: 0.4s;
        transition-delay: 0.4s;
}

.bannertxt:hover:before, .bannertxt:hover:after,
.bannertxt:hover span:before,
.bannertxt:hover span:after {
        width: 250px;
}

.bannertxt:active {
        background: #cdad69;
}

/* main */
.main {
        display: block;
}

.mode1 {
        overflow: hidden;
        padding-bottom: 120px;
        box-sizing: border-box;
}

.title {
        padding: 100px 0 50px;
        box-sizing: border-box;
        vertical-align: bottom;
        position: relative;
}

.title1 {
        display: inline-block;
        color: #404040;
        vertical-align: bottom;
        width: 28.3%;
}

.title1 a {
        display: inline-block;
        margin-bottom: 22px;
        font-family: "SourceHanSansCN-Bold-Alphabetic";
        /* font-weight: bold; */
        font-size: 6rem;
        letter-spacing: 6px;
        color: #404040;
}

.title1 span {
        font-size: 3.6rem;
        display: block;
        color: #404040;
        font-weight: lighter;
}

.title2 {
        display: inline-block;
        vertical-align: bottom;
        font-size: 3.6rem;
        position: absolute;
        right: 0;
        bottom: 50px;
        /* line-height: 1; */
        font-family: 'SourceHanSansCN-Bold-Alphabetic';
        letter-spacing: 3.6px;
}

.title2 span {
        padding: 0px 42px;
        background: #b5934b;
        border-radius: 60px;
        box-sizing: border-box;
        display: inline-block;
        margin: 0 5px;
        font-family: 'SourceHanSansCN-Bold-Alphabetic';
}

.mode1r {
        width: 522px;
}

.mode1Pic {
        padding-bottom: 141.4%;
}

.mode1l {
        /*padding: 0 9.4%;*/
        background: #316cda;
        overflow: hidden;
        position: relative;
}
.mode1l li{
        position:
        relative;
        margin-bottom: 15px;
}
.mode1l li::before {
        content: '';
        display: block;
        width: 2px;
        /*height: 35px;*/
        background: #fff;
        position: absolute;
        left: calc(50% - 1px);
        top: 116%;
}
.mode1l li:last-child::before{
display:none}

.dater {
        display: inline-block;
        margin-left: 10px;
         text-align: center;
}
.dater p {
        font-size: 2.0rem;
        font-family: 'SourceHanSansCN-Bold-Alphabetic';
        line-height: 1.65;
         min-width: 130px;
}

.more2 {
        color: #a3c3ff;
        display: inline-block;
        line-height: 2.5;
        font-weight: lighter;
        transition: all .3s ease-in-out;
}

.more2:hover {
        transform: translateX(5px);
        color: #fff
}

.datel span {
        font-size: 2.0rem;
        letter-spacing: 3.6px;
        display: inline-block;
        line-height: 1.7;
        font-family: 'SourceHanSansCN-Bold-Alphabetic';
}

.datel span:nth-child(2) {
       /* margin-left: 3.2%;*/
}

.start {
        overflow: hidden;
}

.date .start:nth-child(1) {
        /* margin-bottom: 24.39%; */
}

.date {
        /**/
        position: absolute;
        top: 54%;
        left: 50%;
        width: 80%;
        transform: translate(-50%,-50%);
}

.mode2 {
        overflow: hidden;
        padding-bottom: 127px;
        background: #f4f8ff;
        box-sizing: border-box;
}

.more3 {
        padding: 14px 48px;
        box-sizing: border-box;
        letter-spacing: 1px;
        background: #cdad69;
        position: absolute;
        right: 0;
        bottom: 101px;
}

.more33 {
        padding: 14px 48px;
        box-sizing: border-box;
        letter-spacing: 1px;
        position: relative;
        background: #316cda;
        /* float: right; */
        z-index: 10;
        margin-top: 24px;
        display: inline-block;
}

.more3:hover, .more33:hover {
        -webkit-animation: pulse 2s linear infinite;
        animation: pulse 2s linear infinite;
}

@-webkit-keyframes pulse {
        0% {
                -webkit-transform: scale(1.03);
                transform: scale(1.03)
        }

        50% {
                -webkit-transform: scale(.8);
                transform: scale(.8)
        }

        100% {
                -webkit-transform: scale(1.03);
                transform: scale(1.03)
        }
}

@keyframes pulse {
        0% {
                -webkit-transform: scale(1.03);
                transform: scale(1.03)
        }

        50% {
                -webkit-transform: scale(.8);
                transform: scale(.8)
        }

        100% {
                -webkit-transform: scale(1.03);
                transform: scale(1.03)
        }
}

@-webkit-keyframes bounce {
        0%, 10%, 100%, 20%, 50%, 80% {
                -webkit-transform: translateY(0);
                transform: translateY(0)
        }

        40% {
                -webkit-transform: translateY(-15px);
                transform: translateY(-15px)
        }

        60% {
                -webkit-transform: translateY(-15px);
                transform: translateY(-15px)
        }
}

.mode2Ul {
        margin: 0 -35px;
        overflow: hidden;
}

.mode2Ul li {
        margin-bottom: 70px;
        float: left;
}

.swiper-slide a {
        display: block;
        margin: 0 35px;
        transition: all .3s linear;
}

.swiper-slide:hover a {
        background: #316cda;
        padding: 10px;
}

.swiper-slide:hover .name, .swiper-slide:hover .nameInfor {
        color: #FFF
}

.swiper-button-prev {
        position: absolute;

        left: 90%;
        top: 15%;
}

.swiper-button-next {
        position: absolute;

        right: 0;
        top: 15%;
}

.swiper-pagination-fraction, .swiper-pagination-custom, .swiper-container-horizontal>.swiper-pagination-bullets {
        bottom: 84%;
        left: 45%;
        display: inline-block;
}

.swiper-pagination-fraction span {
        font-size: 1.6rem;
}

.mode2con {
        position: relative;
}

.mode2Pic {
       /* width: 205px;*/
        margin: 0 auto;
        background: #fff;
        border-radius: 50%;
        overflow: hidden;
        margin-bottom: 20px;
}

.mode2Ul li:hover .mode2Pic {
        transform: translateY(3px);
}

.mode2Img {
        padding-bottom: 100%;
}

.mode2Infor {
        padding: 10px 0 10px;
        border-top: 2px solid #9d9fa3;
        border-bottom: 2px solid #9d9fa3;
        box-sizing: border-box;
}

.name {
        color: #232221;
        line-height: 1.6;
        font-weight: bold;
}

.nameInfor {
        line-height: 30px;
        height: 60px;
        overflow: hidden;
        color: #232221;
        font-weight: bold;
}

.mode2Ul li:hover a {
        transform: translateX(8px);
}

.swiper {
        overflow: hidden;
}

/* mode3 */
.mode3 {
        overflow: hidden;
        min-height: 600px;
        padding-top: 15px;
        box-sizing: border-box;
        padding-bottom: 129px;
        position: relative;
}

.mode3::before {
        content: '';
        display: block;
        width: calc(50% + 296px);
        height: 816px;
        background: rgba(181,147,75,1);
        position: absolute;
        left: 0;
        top: 497px;
        z-index: 10;
}

.mode3::after {
        content: '';
        display: block;
        width: 67.19%;
        height: 990px;
        background: #007eff;
        position: absolute;
        right: 0;
        top: 323px;
}

.more3r {
        width: 374px;
        margin-left: 110px;
        position: relative;
        z-index: 20;
        display: none;
        padding-top: 13%;
}

.modetit {
        display: inline-block;
        padding-bottom: 42px;
        border-bottom: 1px solid #fff;
}

.modetit h2 {
        font-size: 4.8rem;
        font-family: 'SourceHanSansCN-Bold-Alphabetic';
        font-weight: bold;
}

.mode3rTop {
        position: relative;
        margin-bottom: 30px;
}

.modet {
        position: absolute;
        right: 0;
        bottom: -8px;
        font-style: normal;
        padding-left: 9px;
        background: #316cda;
}

.mode3rInfor {
        line-height: 36px;
        height: 468px;
        overflow: hidden;
        margin-bottom: 37px;
}

.mode2title {
        padding: 62px 0 96px;
}
.mode2title .more33{ position: absolute; bottom: auto; left: auto; top: 35%; right: 0px; }

.more33 {
        /* position: static; */
}

.mode3ldata {
        margin-left: 50px;
}

.mode3l {
        position: relative;
        z-index: 10;
        padding-top: 22%;
}

.mode3l li a {
        line-height: 53px;
}

.mode3l li {
        overflow: hidden;
}

.mode3l li.on span, .mode3l li.on p {
        color: #316cda;
}

.mode3con .tabListbox {
        display: none;
}

/* mode4 */
.mode4 {
        overflow: hidden;
        padding-bottom: 142px;
}

.mode4 .title {
        padding: 142px 0 110px;
        box-sizing: border-box;
}

.mode4Pic {
        display: block;
        overflow: hidden;
        position: relative;
        z-index: 200;
}

.mode4Img {
        padding-bottom: 50.73%;
}

.mode4Pic:before, .mode4Pic:after {
        content: '';
        position: absolute;

}

.mode4Pic:before {
        right: 0;
        background: rgba(46, 103, 208, .8);
        width: 100%;
        height: 50%;
        top: 0;
        -webkit-transition: 0.5s ease-in-out;
        transition: 0.5s ease-in-out;
}

.mode4Pic:after {
        left: 0;
        bottom: 0;
        background: rgba(46, 103, 208, .8);
        width: 100%;
        height: 50%;
        box-sizing: border-box;
        -webkit-transition: 0.5s ease-in-out;
        transition: 0.5s ease-in-out;
}


.video:hover .mode4Pic:before {
        height: 0;
        width: 50%;
}

.video:hover .mode4Pic:after {
        height: 0;
        width: 50%;
}

.play {
        display: inline-block;
        position: absolute;
        z-index: 200000000000;
        left: calc(50% - 103px);
        top: calc(50% - 106.5px);
        cursor: pointer;
        width: 206px;
        text-align: center;
}

.play span {
        width: 128px;
        height: 128px;
        overflow: hidden;
        display: inline-block;
        margin-bottom: 22px;
}

.play p {
        display: inline-block;
        padding: 14px 54px;
        box-sizing: border-box;
        background: #b5934b;
}

.video {
        position: relative;
}

/* mode5 */
.mode5 {
        background: #fff;
        overflow: hidden;
        padding-bottom: 308px;
}

.mode5 .title {
        padding: 140px 0;
        box-sizing: border-box;
}

.mode5l {
        width: 505px;
        overflow: hidden;
        background: #316cda;
        display: block;
}

.mode5lPic {
        padding-bottom: 58.61%;
}

.mode5txt {
        padding: 49px 49px 63px 41px;
        box-sizing: border-box;
        overflow: hidden;
}

.mode5ltit {
        line-height: 1.5;
        margin-bottom: 15px;
}

.mode5lInfor {
        line-height: 36px;
        height: 144px;
        overflow: hidden;
        font-weight: lighter;
        margin-bottom: 120px;
}

.mode5more {
        position: relative;
        line-height: 42px;
}

.mode5more::before {
        content: '';
        display: block;
        width: 32px;
        height: 18px;
        background: url(../images/mode5b.png) no-repeat;
        left: -47px;
        position: absolute;
        top: calc(50% - 9px);
}

.mode5l .mode5more:hover {
        -webkit-animation: tada 2s linear infinite;
        animation: tada 2s linear infinite
}

@-webkit-keyframes tada {
        0% {
                -webkit-transform: scale(1);
                transform: scale(1)
        }

        10%, 20% {
                -webkit-transform: scale(.9) rotate(-8deg);
                transform: scale(.9) rotate(-8deg)
        }

        30%, 50%, 70% {
                -webkit-transform: scale(1.3) rotate(8deg);
                transform: scale(1.3) rotate(8deg)
        }

        40%, 60% {
                -webkit-transform: scale(1.3) rotate(-8deg);
                transform: scale(1.3) rotate(-8deg)
        }

        100%, 80% {
                -webkit-transform: scale(1) rotate(0);
                transform: scale(1) rotate(0)
        }
}

@keyframes tada {
        0% {
                -webkit-transform: scale(1);
                transform: scale(1)
        }

        10%, 20% {
                -webkit-transform: scale(.9) rotate(-8deg);
                transform: scale(.9) rotate(-8deg)
        }

        30%, 50%, 70% {
                -webkit-transform: scale(1.3) rotate(8deg);
                transform: scale(1.3) rotate(8deg)
        }

        40%, 60% {
                -webkit-transform: scale(1.3) rotate(-8deg);
                transform: scale(1.3) rotate(-8deg)
        }

        100%, 80% {
                -webkit-transform: scale(1) rotate(0);
                transform: scale(1) rotate(0)
        }
}

.mode5r {
        margin-left: 535px;
}

.mode5rUl {
        margin: 0 -15px;
        overflow: hidden;
}

.mode5rUl li {
        width: 50%;
        float: left;
        margin-bottom:67px;
        transition: all .3s ease-in-out;
}

.mode5rUl li:hover {
        transform: translateX(5px);
}

.mode5rUl li a {
        display: block;
        margin: 0 15px;
}

.mode5rPic {
        padding-bottom: 58.68%;
}

.mode5rtxt {
        background: #b5934b;
        padding: 15px;
        box-sizing: border-box;
}

.mode5rtxt p {
        line-height: 36px;
        height: 72px;
        overflow: hidden;
}

.mode5rUl li:hover .mode5rtxt {
        background: #316cda;
}

/* mode6 */
.mode6 {
        overflow: hidden;
        padding: 51px 0 46px;
        margin-bottom: 25px;
        background: #f4f8ff;
}

.mode6Ul {
        overflow: hidden;
        position:
                relative;
        text-align: justify;
}

.mode6Ul li {
        display: inline-block
}

.mode6Ul::after {
        content: '';
        display: inline-block;
        height: 0;
        width: 100%;
}

.mode6Ul a {
        display: inline-block;
        color: #999;
        padding: 0px 0px;
        margin: 0 !important;
        font-weight: lighter;
}


.mode6Ul>li>a:hover {
        color: #316cda;
}
.mode2 .swiper-wrapper {
        /* margin: 0 -35px; */
        overflow: hidden;
}
@media screen and (max-width: 1930px){
        .mode5l {
                width: 505px;
        }
        .mode5r{
                margin-left:535px;
        }
        .mode5lInfor {
               margin-bottom: 130px;
            }
}
@media screen and (max-width: 1878px){
      
        .mode5lInfor {
               margin-bottom: 97px;
            }
}
@media screen and (max-width: 1861px) {
        .mode3::before {
                /* width: 63.94%; */
                height: 816px;
                left: 0;
                top: 497px;
        }
        .mode5lInfor {
                margin-bottom: 63px;
            }
}
@media screen and (max-width: 1851px){
        .mode5lInfor {
                margin-bottom: 7px;
            }
            .mode5txt {
                padding: 12px 49px 38px 41px;
                
            }
}
@media screen and (max-width: 1801px) {
        .date{
                width: 84%;
        }
        .mode1l::before {
                top: calc(50% - 139px);
        }

        .mode3::before {
                /* width: 59.94%; */
                height: 816px;
                left: 0;
                top: 497px;
        }
        .mode5lInfor {
                margin-bottom: 7px;
            }
            .mode5txt {
                padding: 12px 49px 38px 41px;
                
            }
}

@media screen and (max-width: 1601px) {
        .mode5lInfor {
                margin-bottom: 96px;

        }
         .title1 a {
                font-size: 4rem
        }
        .mode1l li {
                margin-bottom: 20px;
        }
        .title2 {
                font-size: 2.5rem
        }

        .datel span, .dater p {
                font-size: 2.1rem
        }

        .more2 {
                font-size: 2rem
        }

        .mode1l::before {
                height: 46px;
                top: calc(50% - 127px);
        }

        .mode3::before {
                width: calc(50% + 285px);
                height: 816px;
                left: 0;
                top: 497px;
        }
        .mode5lInfor {
                margin-bottom: 7px;
            }
            .mode5txt {
                padding: 19px 49px 38px 41px;
            }
}

@media screen and (max-width:1460px) {
        .title1 {
                width: 34.3%;
        }
.mode1l li::before{
        top: 98%;
}
        .mode1l {
               /* padding: 0 3.4%;*/

        }

      .title1 span {
    font-size: 2.6rem;
}
        .mode3::before {
                width: calc(50% + 185px);
                /* height: 672px; */
                top: 408px;
        }

        .mode5l {
                width: 405px;
        }

        .mode5txt {
                padding: 18px 20px;
        }

        .mode5r {
                margin-left: 435px;
        }

        .mode5lInfor {
                margin-bottom: 63px;
        }

        .mode6Ul>li {
                /* margin-bottom: 10px; */
        }

        .title1 a {
                font-size: 4rem
        }

        .title2 {
                font-size: 2.5rem
        }

        .datel span, .dater p {
                font-size: 1.8rem;
        }

        .more2 {
                font-size: 1.8rem;
        }

        .mode1l::before {
                height: 46px;
                top: calc(50% - 153px);
        }

}
@media screen and (max-width: 1440px){
   .mode5lInfor {
    margin-bottom: 32px;
}     
}
@media screen and (max-width: 1400px){
        .mode5lInfor {
         margin-bottom: 20px;
     }     
     
    .nameInfor,.name,.mode3l li span, .mode3l li p,.mode3rInfor,.mode5lInfor,.mode5rtxt p{
        font-size: 1.6rem;
    }
        .mode5rUl li{
                margin-bottom: 77px;
        }
    .swiper-slide a {
        margin: 0px 15px;
       
    }
    .mode3ldata {
        margin-left: 10px;
    }
    .mode3l li a {
        line-height: 43px;
    }
    .mode5ltit{
        font-size: 2rem;
    }
        .date{
                width: 85%;
        }
     }

@media screen and (max-width:1345px){
        .mode5rUl li{
                margin-bottom: 130px;
        }
}
@media screen and (max-width:1324px) {
        .mode1l::before {
                height: 46px;
                top: calc(50% - 82px);
        }
}
@media screen and (max-width:1301px) {
        .title1 {
                width: 30.3%;
        }
.mode1l li {
    margin-bottom: 20px;
}
        .mode1l li::before {
    top: 87%;
}
        .mode1r {
                width: 420px;
        }

        .date .start:nth-child(1) {
                /* margin-bottom: 17.39%; */
        }

        .mode3::before {
                width: calc(50% + 132px);
        }

        .mode5lInfor {
                margin-bottom: 10px;
        }

        .title1 a {
                font-size: 4rem
        }

        .title2 {
                font-size: 2.5rem
        }
        .mode5txt {
    padding: 33px 20px;
      }

}
@media screen and (max-width:1214px) {
        .mode1l::before {
                height: 46px;
                top: calc(50% - 44px);
        }

        .mode3::before {
                /* width: calc(50% + 128px); */
        }
        .mode5rUl li{
                margin-bottom: 66px;
        }
               .mode1l::before {
                height: 46px;
                top: calc(50% - 77px);
        }
        .mode1l li{
                margin-bottom: 18px;
        }
}
@media screen and (max-width:1200px) {
        .title1 {
                width: 35.3%;
        }

        .title1 a {
                font-size: 4rem;
                margin-bottom: 0px;
        }

        .title1 span, .title2 {
                font-size: 2.6rem;
                display: block;
        }

        .mode3::before {
                width: 57.94%;
                top: 397px;
                /* height: 682px; */
        }

        .mode3::after {

                top: 275px;
        }

        .mode4 .title {
                padding: 50px 0 50px;
        }

        .mode5 .title {
                padding: 40px 0;
                box-sizing: border-box;
        }

        .mode5 {
                padding-bottom: 30px;
        }

        .mode5txt {
                padding: 29px 20px;
        }

        .mode5lInfor {
                margin-bottom: 38px;
        }

        .mode5rtxt {
                padding: 10px;
        }

        .mode4 {
                overflow: hidden;
                padding-bottom: 60px;
        }

        .mode6 {
                padding: 25px 0;

        }

        .banner .slick-prev {
                left: 45px;

        }


        .banner .slick-next {
                right: 45px;

        }
          .mode1l::before {
                height: 46px;
                top: calc(50% - 77px);
        }
.mode1l li{
        margin-bottom: 10px;
     }

}

@media screen and (max-width:1101px) {
        .mode3::before {
                width: 53.94%;
                top: 307px;
                /* height: 667px; */
        }

        .title {
                padding: 50px 0 25px;
        }

        .mode2 {
                padding-bottom: 10px;
        }

        .mode3::after {
                top: 213px;
        }

        .mode5l {
                width: 315px;
        }

        .mode5r {
                margin-left: 345px;
        }

        .mode5lInfor {
                margin-bottom: 143px;
        }

        .more33 {/* bottom: -62px; */}
}
@media screen and (max-width:1100px){
        .mode5lInfor {
                margin-bottom: 83px;
            }
}
@media screen and (max-width:997px) {
        .swiper-button-prev {
                position: absolute;
                left: 85%;
                top: 10%;
        }
  .mode1Pic {
        padding-bottom: 117.4%;
    }      
        .swiper-button-next {
                position: absolute;
                right: 0;
                top: 10%;
        }
        .swiper-pagination-fraction, .swiper-pagination-custom, .swiper-container-horizontal > .swiper-pagination-bullets {
                bottom: 89%;
                left: 43%;
                display: inline-block;
            }
        .title {
                padding: 50px 0 25px;

        }

        .title2 {

                bottom: 25px;
        }

        .title1 a {
                font-size: 3rem;

        }

        .title1 span, .title2 {
                font-size: 2rem;
        }

        .mode1r {
                width: 100%;
                float: none;
        }

       
        .datel span {
                font-size: 2.1rem;
        }

        .dater p {
                font-size: 2.1rem;
        }

     

        .mode3::after {
                top: 159px;
        }

        .more3r {
                width: 290px;

                padding-top: 5%;
        }

        .mode3::before {
                top: 206px;
                height: 830px;
                width: 64.4%;
        }

        .mode3l {
                padding-top: 15%;
        }

        .mode3rInfor {
                margin-bottom: 31px;
        }

        .more3 {
                font-size: 14px;
                padding: 10px 15px;
                bottom: 42px;
        }

        .mode5l {
                width: 100%;
                float: none;
                margin-bottom: 30px;
        }

        .mode5r {
                margin-left: 0px;
        }

        .mode5lInfor {
                height: auto;
        }
}

@media screen and (max-width:900px) {
        .mode3::before {
                top: 206px;
                /* height: 692px; */
                width: 57.4%;
        }
}

@media screen and (max-width:767px) {
        .bannertxt {
                padding: 0.12% 1.9%;
        }
 .mode3l {
                padding-top: 0%;
        }
        .date .start:nth-child(1) {
              /*  margin-bottom: 22.39%;*/
        }

        .title1 {
                width: 100%;
                margin-bottom: 10px;
        }

        .title2 {
                position: static;
                display: block;
                /* text-align: right; */
        }


        .mode1 {
                padding-bottom: 80px;

        }

        .mode2 {
                padding-bottom: 40px;

        }

        .more3r {
                width: 100%;
                padding-top: 5%;
                float: none;
                margin: 0;
        }

        .mode3::after {
                width: 100%;
                top: 174px;
                /* height: 1000px !important; */
                /* height: 891px; */
        }

        .mode3rInfor {
                height: 216px;
        }

        .mode3::before {
                top: 62%;
                height: 706px;
                width: 100%;
        }

        .modetit h2 {
                font-size: 3rem;
        }

        .modetit {
                padding-bottom: 20px;

        }

        .mode3 {
                padding-bottom: 90px;
        }

        .mode4 .title {
                padding: 0 0 30px;
        }

        .play span {

                transform: scale(.5);
                margin-bottom: 0;
        }

        .play p {
                padding: 7px 29px;

        }

        .banner .slick-prev {
                left: 20px;
        }


        .banner .slick-next {
                right: 20px;
        }

        .mode6Ul>li {
                width: 33.33%;
                display: block;
                float: left;
                margin-bottom: 10px;
        }

        .mode6 {
                padding-bottom: 15px
        }
}

@media screen and (max-width:600px) {
        .mode3::before {
                top: 59% !important;
                height: 756px !important;
                width: 100%;
        }

        .mode5rUl li {
                width: 100%;
        }

        .mode5rtxt p {
                height: auto;
        }

        .banner .slick-prev {
                left: 0px;
        }


        .banner .slick-next {
                right: 0px;
        }

        .mode6Ul>li {
                width: 50%;

        }
        .swiper-button-prev {
                position: absolute;
                left: 78%;
                top: 10%;
        }
        
        .swiper-button-next {
                position: absolute;
                right: 0;
                top: 10%;
        }
        .swiper-pagination-fraction, .swiper-pagination-custom, .swiper-container-horizontal > .swiper-pagination-bullets {
                bottom: 89%;
                left: 40%;
                display: inline-block;
            }
}

@media screen and (max-width:479px) {
        .mode6Ul>li {
                width: 100%;

        }

        .bannertxt {
                padding: 0.2% 1.8%;
                line-height: initial;
                font-size: 12px;
        }

        .mode3ldata {
                margin-left: 10px;
        }

        .title2 {
                /* line-height: 2; */
        }

        .mode3::before {
                top: 45% !important;
                /* height: 600px !important; */
                /* width: 100%; */
        }



        .mode3::before {
                top: 58% !important;
                height: 695px !important;
        }

        .mode3 .title {
                padding: 20px 0 0px;
        }

        .mode2Ul li {
                margin-bottom: 30px;
                float: left;
        }

        .mode4 {
                overflow: hidden;
                padding-bottom: 0;
        }

        .mode3::after {
                width: 100%;
                top: 117px;
        }
       .datel span {
                font-size: 1.6rem;
        }

        .dater p {
                font-size: 1.6rem;
                min-width: 100px;
        }
}

@media screen and (max-width:414px) {
        .swiper-button-prev {
               left: 71%;
              
        }
       
        .swiper-pagination-fraction, .swiper-pagination-custom, .swiper-container-horizontal > .swiper-pagination-bullets {
                bottom: 89%;
                left: 36%;
                
            }
        .bannertxt {
                padding: 0.6% 0.745%;
                line-height: initial;
                font-size: 12px;
        }

        .mode1l {
                padding-top: 24.48%;
                padding-bottom: 24.48%;
        }

        .date .start:nth-child(1) {
               /* margin-bottom: 42.39%;*/
        }

        .more3 {
                font-size: 14px;
                padding: 6px 9px;
                bottom: 40px;
        }

        .play span {
                transform: scale(.5);
                margin-bottom: -20px;
                margin-top: 15px;
        }

        .banner .slick-prev {
                left: 0px;
                transform: scale(.5);
        }


        .banner .slick-next {
                right: 0px;
                transform: scale(.5);
        }

        .mode2title .more33{ position: static; margin-top: 10px;}
        
        .title1{ margin-bottom: 20px;}
        .mode3::before {
                top: 57% !important;
                height: 695px !important;
        }
}
@media screen and (max-width:328px){.mode1l li{
        margin-bottom: 5px;
}}

.bigModelWrap {
	display: none;
}
.bigModel {
	display: flex;
	align-items: center;
	justify-content: center;
	position: fixed;
	width: 100%;
	height: 100vh;
	top:0;
	left: 0;
	background-color: rgba(0,0,0,.6);
	z-index: 1000;
}
.bigModel .modelCenter {
	position: relative;
	height: 523px;
	width: 637px;
	background: url(./modelBg.png) 100% 100% no-repeat #fff;
}
.bigModel .modelCenter p {
	text-align: center;
	font-weight: 500;
	font-size: 29px;
	color: #262833;
	margin: 165px 0 50px;
}
	
.bigModel .modelCenter .iptWrap {
	display: flex;
	justify-content: center;
}
.bigModel .modelCenter .iptWrap input {
	width: 90px;
	height: 80px;
	border-radius: 16px;
	border: 1px solid #DBDCDE;
	margin-right: 15px;
	font-size: 30px;
	text-align: center;
}
.bigModel .modelCenter .modelBtn {
	position: absolute;
	bottom: 0;
	display: flex;
	width: 100%;
	justify-content: center;
	padding: 30px 0 43px;
}
.bigModel .modelCenter .modelBtn span {
	width: 266px;
	height: 64px;
	border-radius: 11px;
	border: 1px solid #DBDCDE;
	font-weight: 500;
	font-size: 26px;
	color: #262833;
	line-height: 64px;
	text-align: center;
	cursor: pointer;
}
.bigModel .modelCenter .modelBtn span:nth-child(2) {
	margin-left: 33px;
	background: #3D62F9;
	color: #fff;
	border-color: #3D62F9;
	
}