@charset "utf-8";
/**
 * Created by sunJia on 2026/02/24.
 * @Description: Index Style
 */
.fmSerifSC{ font-family: "NotoSerifSC";}
.banner{position: relative;}
.banner a{display:block;position:relative;}
.banner a::before{ content: '';display: block;width: 100%;height: 0;padding-bottom: 14%;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0));
    background: -webkit-linear-gradient(to top, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0));
    background: -moz-linear-gradient(to top, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0));
    position: absolute;right: 0;bottom: 0;z-index: 1;}
.banner .swiper-slide{ overflow: hidden;}
.banner .gp-img{height: 100vh; padding-bottom: 36.45%;padding-bottom: 0; position: relative;font-size: 0;}
.banner .gp-img::before{content: '';display: none;opacity: 1;height: 100%;position: absolute;left: 0;right: 0;bottom: 0;z-index: 2;
	background: rgba(32, 36, 45, 0.25);pointer-events: none;
}
.banner .gp-img video,.banner .gp-img img{width:100%; height: 100%; object-fit: cover;}
.banner .swiper-slide-active{ z-index: 10;}
.banner .swiper-slide img{ transform-origin: center; transform: scale(1.1);transition: all 5s linear;}
.banner .swiper-slide-active img{ transform: scale(1);}
.banner .gp-img video{width:100%;height: auto;position: absolute;left: 0;top: 50%;transform: translateY(-50%);}
.banner a .title{
    position: absolute;
    right: 50%;
    bottom: .4rem;
    z-index: 10;
    transform: translateX(50%);
    width: 90%;
    color: #fff;
    font-family: 'jiangxizhuokai';
    text-shadow: 0px 5px 5px rgba(0, 43, 106, 0.88);
    text-align: center;
    }
.banner a .title .top{}
.banner a .welcome{font-family: 'jiangxizhuokai';color: #fff;text-transform: uppercase; text-align: center;
    text-shadow: 0px 5px 5px rgba(0, 43, 106, 0.88);font-size: 1rem;
    position: absolute; right: 50%;top: 50%;transform: translate(50%, -50%);width: 100%;}
@font-face {
    font-family: 'jiangxizhuokai';
    src: url('../fonts/江西拙楷3.0.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}


.wrapbanner{overflow: hidden;position: relative;box-sizing: border-box;z-index: 2;flex: 1; min-width: 0;
    flex-direction: row-reverse;align-items: flex-start;}
.bannerArea{ position: absolute; bottom: .4rem; right: 50%; transform: translateX(50%); z-index: 1; align-items: center;}
.banner .swiper-pagination{position: relative; font-size: 0;text-align: right;width: auto;}
.banner .swiper-pagination .swiper-pagination-bullet{width: 0.12rem;height: 0.12rem;opacity: 1;border-radius: 50%; margin: 0 .1rem;
	background: rgba(255,255,255,.5);position: relative;transition: all 0s ease-in-out;}
.banner .swiper-pagination .swiper-pagination-bullet-active{ background: #4a6fa5;}
.banner .arrow{ width: .32rem; height: .32rem; line-height: .32rem; position: relative; z-index: 1; cursor: pointer; color: #fff;}
.banner .prev{ margin-right: .1rem;}
.banner .next{ margin-left: .1rem;}

.indexContent{
    position: relative;
    z-index: 2;
}

.modeTil{
    position: relative;
    align-items: center;
}
/* .modeTil::before{
    content: '';
    display: block;
} */
.modeTil .tilTitle{
    line-height: 1;
    position: relative;
    z-index: 1;
    color: #4a6fa5;
}
.modeTil .tilTitle img{
    max-width: .54rem;
}
.modeTil .tilTitle i{
    width: .54rem;
    margin-right: .15rem;
}
.modeTil .tilTitle span{
    position: absolute;
    right: -.03rem;
    bottom: -.03rem;
    z-index: -1;
    color: #cee7f2;
}
.modeTil .tilTitle span.white{
    color: #fff;
    clip-path: polygon(0 0, 1.05rem 0, 1.05rem 100%, 0 100%);
}
.modeTil .tilMore{
    line-height: .55rem;
    font-size: .18rem;
    border-radius: 0 .27rem .27rem 0;
    background: #4a6fa5;
    color: #fff;
    padding-right: .3rem;
    padding-left: .24rem;
}
.modeTil .tilMore i{
    display: inline-block;
    line-height: 1;
    transform: rotate(-45deg);
    overflow: hidden;
}
.tilMore:hover i::before,
.mode02 li:hover i::before{
    display: inline-block;
    /* transform: translate(50px, 50px); */
    animation: moreAnimate 1.6s linear infinite;
    /* transition: all 0.3s ease-in-out; */
}
@keyframes moreAnimate {
    0%{ transform: translate(0%, 0%);}
    20%{ transform: translate(200%, 100%);}
    21%{ transform: translate(-200%, -100%);}
    40%{ transform: translate(0%, 0%);}
}

.row01{
    padding: .88rem 0 1.2rem;
    background: url(../images/row01-bg.jpg) no-repeat center center;
    background-size: cover;
}
.row01 .modeTil{
    justify-content: center;
    width: 100%;
}
.row01 .modeTil .tilTitle{
    transform: translateX(-.4rem);
}
.row01 .modeTil .tilMore{
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
}
.row01 .modeCon{
    margin-top: .6rem;
}
.mode1Swiper{
    position: relative;
    overflow: hidden;
}
.mode1Swiper .swiper-slide{
    transform-origin: center top;
    transform: scale(.8);
    transition: all 0.3s ease-in-out;
}
.mode1Swiper .swiper-slide-active{
    transform: scale(1);
}
.mode1Swiper .swiper-slide a{
    display: block;
    transition: all 0.3s ease-in-out;
}
.mode1Swiper .swiper-slide a:hover{
    transform: translateY(-0.1rem);
}
.mode1Swiper .arrows{
    width: 100%;
    max-width: 6.5rem;
    position: absolute;
    bottom: .4rem;
    right: 50%;
    transform: translateX(50%);
    z-index: 10;
    color: #4a6fa5;
    pointer-events: none;
}
.mode1Swiper .arrows div{ pointer-events: all;}
.mode1Swiper .prev{}
.mode1Swiper .next{}
.row01 .info{
    background: #fff;
    padding: .25rem .3rem .55rem;
}
.row01 .info .title{
    line-height: 1.41;
    color: #373837;
}
.row01 .info .date{
    line-height: 1;
    margin-top: .33rem;
}

/* row02 */
.row02{
    background: #daebf2 url(../images/row02-bg2.png) no-repeat bottom right;
    overflow: hidden;
}
.row02 .left{
    width: 69.72%;
    margin: 1rem 0;
    padding: .4rem .3rem .5rem .4rem;
    position: relative;
    z-index: 2;
}
.row02 .left::before{
    content: '';
    display: block;
    width: 64.5vw;
    width: 12.4rem;
    height: calc(100% + 2rem);
    background: url(../images/row02-bg.png) no-repeat center center/cover;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    z-index: -1;
}
.row02 .left::after{
    content: '';
    display: block;
    width: 100%;
    height: 100%;
    background: url(../images/row02-bg-blue.png) no-repeat center center/cover;
    position: absolute;
    top: 0;
    right: 0;
    z-index: -1;
}
.row02 .tilTitle{
    color: #fff;
}
.row02 .tilTitle span{
    color: #406c9f;
}
.row02 .modeTil .tilMore{
    background: transparent;
    padding: 0;
}
.row02 .leftCon{
    margin-top: .4rem;
}
.row02 .large{
    width: 65.22%;
}
.row02 .large .title{
    line-height: 1.67;
    color: #fff;
    margin-top: .14rem;
}
.row02 .large .img{
    overflow: hidden;
}
.row02 .large .gp-img-responsive{
    padding-bottom: 56.25%;
    transform: scale(1);
    transition: all 0.3s ease-in-out;
}
.row02 .large:hover .gp-img-responsive{
    transform: scale(1.05);
}
.row02 .small{
    width: 34.78%;
    padding-left: .3rem;
}
.row02 .small li{
    /* margin-bottom: .25rem; */
}
.row02 .small li:last-child{
    margin-bottom: 0;
}
.row02 .small a{
    position: relative;
    display: block;
    padding-top: .25rem;
    padding-bottom: .17rem;
    border-bottom: 1px solid rgba(255,255,255,.2);
}
.row02 .small a::before{
    content: '';
    display: block;
    height: 0;
    background: #4a6fa5;
    position: absolute;
    left: -0.1rem;
    right: -0.1rem;
    bottom: 0;
    z-index: -1;
    transition: all 0.3s ease-in-out;
}
.row02 .small a:hover::before{
    height: 100%;
}
.row02 .small li:nth-of-type(1) .title{
    -webkit-line-clamp: 3;
}
.row02 .small .title{
    line-height: 1.5;
}
.row02 .small .date{
    color: #fff;
    margin-top: .15rem;
}

.row02 .right{
    width: 30.28%;
    margin: 1rem 0;
    padding-left: .3rem;
}
.row02 .right li{
    position: relative;
    margin-top: .3rem;
}
.row02 .right li:first-child{
    margin-top: 0;
}
.row02 .right .modeTil{
    flex-direction: column;
    width: 100%;
    text-align: center;
    position: absolute;
    right: 50%;
    top: 50%;
    transform: translate(50%, -50%);
}
.row02 .right .liTitle{
    color: #fff;
}
.row02 .right .tilMore{
    line-height: 1;
    margin-top: .64rem;
    transition: all 0.3s ease-in-out;
}
.row02 li:hover .tilMore{
    transform: scale(1.1);
}
.row02 .right .gp-img-responsive{
    padding-bottom: 71.25%;
}

/* row03 */
.row03{
    padding: .8rem 0.5rem 1.65rem;
}
.row03 .modeTil{
    justify-content: center;
    z-index: 5;
}
.row03 .modeTil::before{
    content: '';
    display: block;
    width: 100%;
    height: 200%;
    background: url(../images/row03-til-bg.png) no-repeat center top/7.84rem auto;
    position: absolute;
    top: -1px;
    right: 50%;
    transform: translateX(50%);
    z-index: -1;
    pointer-events: none;
    -ms-pointer-events: none;
}
.row03 .modeCon{
    position: relative;
    margin-top: -.6rem;
    border-radius: .3rem;
    overflow: hidden;
    background: url(../images/row03-bg.jpg) no-repeat center center/cover;
    font-size: 0;
}
.row03 .shade{
    width: 20%;
    transform: translateX(0px);
    transition: all 0.3s ease-in-out;
}
.row03 [data-index="1"] .shade{ transform: translateX(100%);}
.row03 [data-index="2"] .shade{ transform: translateX(200%);}
.row03 [data-index="3"] .shade{ transform: translateX(300%);}
.row03 [data-index="4"] .shade{ transform: translateX(400%);}
.row03 .modeCon ul{
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    width: 100%;
    height: 100%;

}
.row03 .modeCon li{
    width: 20%;
    border-right: 1px solid rgba(255,255,255,.3);
}
.row03 .modeCon li.active,
.row03 .modeCon li:last-child{
    border-right-color: transparent;
}
.row03 .modeCon li a{
    position: relative;
    display: block;
    height: 100%;
    text-align: center;
}
.row03 .modeCon .box{
    display: flex;
    display: -ms-flexbox;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    min-height: 2rem;
    width: 100%;
    position: absolute;
    right: 50%;
    top: 50%;
    transform: translate(50%, -50%);
    z-index: 1;
}
.row03 li:nth-of-type(1) .box .icon{
    width: .74rem;
}
.row03 li:nth-of-type(2) .box .icon{
    width: .65rem;
}
.row03 li:nth-of-type(3) .box .icon{
    width: .91rem;
}
.row03 li:nth-of-type(4) .box .icon{
    width: .66rem;
}
.row03 li:nth-of-type(5) .box .icon{
    width: .7rem;
}
.row03 .modeCon li img{
    transition: all .3s ease-in-out;
}
.row03 .modeCon li.active img{
    transform: rotateY(180deg);
}

.row03 .modeCon .name{
    width: 100%;
    max-width: 2.6rem;
    margin: 0 auto;
    color: #fff;
    margin-top: .3rem;
}
.row03 .modeCon .active .name{
    font-size: .24rem;
    text-shadow: 0px 5px 5px rgba(89, 58, 0, 0.88)
}

/* row04 */
.row04{}
.row04 .gp-container{
    position: relative;
    z-index: 2;
}
.row04 .modeTil{
    margin-top: -.75rem;
    z-index: 2;
}
.row04 .modeTil .tilTitle{
    line-height: 1.5rem;
    color: #fff;
}
.row04 .modeTil .tilTitle::before{
    content: '';
    display: block;
    width: 55vw;
    height: 100%;
    background: url(../images/row04-til-bg.png) no-repeat center right/auto 100%;
    position: absolute;
    right: -1.35rem;
    top: 0;
    z-index: -1;
}
.row04 .modeTil .tilTitle span{
    color: #32568b;
}
.row04 .modeCon{
    position: relative;
    z-index: 1;
    margin-top: -.75rem;
    overflow: hidden;
    padding: 1.95rem 0 1.7rem;
    background: url(../images/row04-bg.jpg) no-repeat center/cover;
}
.row04 .row04Swiper{
    overflow-x: clip;
    overflow-y: hidden\0;
}
.row04 .modeCon ul{}
.row04 .modeCon li{
    position: relative;
    z-index: 1;
    width: 16.66%;
    border-radius: 50%;
    background: rgba(255,255,255,.8);
}
.row04 .modeCon li:nth-of-type(even){
    margin-top: 1.2rem;
}
.row04 .modeCon li::before{
    content: '';
    display: block;
    width: .01rem;
    height: 100vh;
    background: rgba(255,255,255,.6);
    position: absolute;
    left: 50%;
    bottom: 100%;
}
.row04 .modeCon a{
    position: relative;
    z-index: 1;
    color: #4a6fa5;
    text-align: center;
    line-height: 1;
}
.row04 .modeCon a::before{
    content: '';
    display: block;
    width: 100%;
    padding-bottom: 100%;
}
.row04 .modeCon .box{
    width: 100%;
    position: absolute;
    top: 50%;
    right: 50%;
    transform: translate(50%, -50%);
    z-index: 1;
}
.row04 .ico{
    font-size: 0;
}
.row04 .ico img{
    max-width: .96rem;
    max-height: .8rem;
    transition: all .3s ease-in-out;
}
.row04 a:hover .ico img{
    transform: rotateY(180deg);
}
.row04 .data{
    margin: .1rem 0 .12rem;
}
.row04 .data .num{
    display: inline-block;
    line-height: inherit;
}
.row04 .name{
    color: #373837;
}
.row04 .swiper-pagination{
    left: 50%;
    transform: translateX(-50%);
    bottom: 1rem;
}
.row04 .swiper-pagination-bullet{
    width: .24rem;
    height: .1rem;
    border-radius: .05rem;
    margin: 0 .08rem;
    background: rgba(255,255,255,.7);
    opacity: 1;
}
.row04 .swiper-pagination-bullet-active{
    background: #4a6fa5;
}

/* row05 */
.row05{
    padding: 1rem 0 1.1rem;
}
.row05 .modeTil{
    justify-content: center;
    width: 100%;
}
.row05 .modeTil .tilMore {
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
}
.row05 .modeCon{
    overflow: hidden;
}
.row05Swiper{
    width: 100%;
    position: relative;
    margin: 0.6rem auto 0;
}
.row05Swiper .gp-img-responsive{
    background: transparent;
    padding-bottom: 132.5%;
}
.row05Swiper .gp-img-responsive img:hover{
    transform: scale(1.05);
    opacity: 1;
}
.row05Swiper .swiper-slide{
    /* max-width: 17.95%; */
    width: 17.95%;
    /* transition: all .3s ease-in-out; */
}
.row05Swiper .swiper-slide-active{
    width: 24.64%;
    background: url(../images/access-bg.png) no-repeat center/100% 100%;
    padding: .78vw;
    padding-bottom: 0;
    box-sizing: border-box;
}
.row05Swiper .arrow{
    width: .3rem;
    height: .22rem;
    background: url(../images/row05-arrow.png) no-repeat center/auto 100%;
    position: absolute;
    right: 50%;
    transform: translateX(50%);
    bottom: .35rem;
    z-index: 1;
}
.row05Swiper .prev{
    transform: translateX(calc(50% - 11vw)) rotateY(180deg);
}
.row05Swiper .next{
    transform: translateX(calc(50% + 11vw));
}







/* Responsive style */
@media screen and (max-width:1600px){
    .row02 .left{
        padding: .35rem .3rem;
    }
    .row04 .data{
        margin: .05rem 0 0.08rem;
    }
}

@media screen and (max-width:1386px){
  
}

@media screen and (max-width:1320px){
  
}

@media screen and (max-width:1280px){
    .row03 .modeTil::before{
        top: -.03rem;
        background-position: center bottom;
    }
}

@media screen and (max-width:1200px){
  
}

@media screen and (max-width:996px){
    .banner .gp-img{ height: 0; padding-bottom: 47.91%;}
    .banner .gp-img img{ height: unset;}
    .banner .swiper-slide img{ transform: none;}
    .banner a .welcome{ font-size: .7rem;}
    .row01{ padding: .5rem 0;}
    .row01 .modeCon{ margin-top: .3rem;}
    .row01 .info{ padding: .2rem .2rem .3rem;}
    .row01 .info .date{ margin-top: .2rem;}
    .row05 .modeTil,
    .row01 .modeTil{ justify-content: flex-start;}
    .modeTil .tilTitle i{ font-size: 0;}
    .modeTil .tilTitle img{ max-width: .45rem;}
    .modeTil .tilTitle span.white{ display: none;}
    .row01 .modeTil .tilTitle{ transform: translateX(0);}
    .modeTil .tilTitle i{ margin-right: .05rem;}
    .row01 .modeTil .tilMore{ padding-left: .15rem; padding-right: .15rem; line-height: 0.45rem;}
    .mode1Swiper .swiper-slide{ transform: scale(.9);}
    .mode1Swiper .swiper-slide-active{ transform: scale(1);}
    .mode1Swiper .arrows{ bottom: 0; max-width: 5rem;}
    .row02 .left{ margin: .5rem 0 0; padding: .3rem; width: 100%;}
    .row02 .left::before{ height: calc(100% + 1rem);}
    .row02 .leftCon{ margin-top: .3rem;}
    .row02 .left::before{ display: none;}
    .row02 .small{ padding-left: .2rem;}
    .row02 .small a{ padding-bottom: .15rem; padding-top: .15rem;}
    .row02 .small .date{ margin-top: .1rem;}
    .row02 .right{ width: 100%; margin: .3rem 0 .5rem; padding-left: 0;}
    .row02 .right ul{ display: flex; display: -ms-flexbox; flex-direction: row; justify-content: space-between;}
    .row02 .right li{ width: calc(50% - .15rem); margin-top: 0;}
    .row02 .modeCon{ flex-direction: column;}
    .row03{ padding: .5rem .5rem 1.3rem;}
    .row03 .modeTil::before{ top: -.05rem; background-size: 6.6rem auto; height: 160%;}
    .row03 li:nth-of-type(1) .box .icon{ width: 0.55rem;}
    .row03 li:nth-of-type(2) .box .icon{ width: 0.5rem;}
    .row03 li:nth-of-type(3) .box .icon{ width: 0.65rem;}
    .row03 li:nth-of-type(4) .box .icon{ width: 0.5rem;}
    .row03 li:nth-of-type(5) .box .icon{ width: 0.55rem;}
    .row03 .modeCon{ padding-top: .8rem; margin-top: -0.5rem;}
    .row03 .modeCon .box{ min-height: 1.4rem;}
    .row03 .modeCon .name{ margin-top: .1rem;}
    .row03 .modeCon .active .name{ font-size: .18rem;}
    .row03 .shade{ display: none;}
    .row03 .modeCon ul{ flex-wrap: wrap;}
    .row03 .modeCon li{ width: 50%; margin-bottom: .5rem;}
    .row03 .modeCon ul,
    .row03 .modeCon .box{ position: relative;}
    .row04 .modeTil .tilTitle{ line-height: 1rem;}
    .row04 .modeTil .tilTitle::before{ right: -.7rem; width: 100vw;}
    .row04 .modeCon{ padding: 1.1rem 0;}
    .row04 .swiper-pagination{ bottom: .6rem;}
    .row05{ padding: .5rem 0;}
    .row05Swiper{ margin: 0.3rem auto 0;}
    .row05Swiper .prev{ transform: translateX(calc(50% - 15vw)) rotateY(180deg);}
    .row05Swiper .next{ transform: translateX(calc(50% + 15vw));}
    
}

@media screen and (max-width:768px){
    .banner a .welcome{ font-size: .4rem;}
    .banner a .title{
        bottom: .2rem;
        width: 100%;
        margin: 0 auto;
        padding: 0 .2rem;
        box-sizing: border-box;
        overflow : hidden;
        text-overflow: ellipsis;
        display: -webkit-box; /* Chrome 4+, Safari 3.1, iOS Safari 3.2+ */
        display: -moz-box; /* Firefox 17- */
        display: -ms-flexbox; /* IE 10 */
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
    }
    .row02 .leftCon{ flex-direction: column;}
    .row02 .large{ width: 100%;}
    .row02 .small{ width: 100%; padding-left: 0; margin-top: .3rem;}
    .row03 .modeTil::before{ top: -0.1rem;}
    .row03 .modeCon{ padding-top: 1rem;}
    .row03 .modeCon ul{ justify-content: center;}
    .row03 .modeCon .box{ min-height: 1rem;}
    .modeTil .tilTitle span{ bottom: -0.02rem; right: -0.02rem;}
    .modeTil .tilTitle{ align-items: center;}
    .row05Swiper .swiper-slide-active{ padding: 0;}
    .row05Swiper .arrow{ bottom: calc(50% - .1rem);}

}

@media screen and (max-width:680px){
    
}

@media screen and (max-width:491px){
    .banner .gp-img{ padding-bottom: 0; height: 2.2rem;}
    .banner .swiper-slide img{ height: 100% !important;}
    .bannerArea{ bottom: 0.1rem;}
    .modeTil .tilTitle i{ width: unset;}
    .modeTil .tilTitle img{ max-width: 0.4rem;}
    .modeTil .tilMore,
    .row01 .modeTil .tilMore{ line-height: 0.35rem; padding-left: .1rem; padding-right: .1rem; font-size: .14rem;}
    .banner a .welcome{ font-size: .3rem;}
    .mode1Swiper .arrows{ bottom: .08rem; max-width: 92%;}
    .row02 .left{ padding: .2rem .1rem;}
    .row02 .leftCon{ margin-top: .1rem;}
    .row02 .small{ margin-top: .2rem;}
    .row02 .right ul{ flex-direction: column;}
    .row02 .right li{ width: 100%; margin-top: .2rem;}
    .row02 .right li:first-child{ margin-top: 0;}
    .row03{ padding: .3rem .2rem 1rem;}
    .row03 .modeTil::before{ height: 190%; background: #fff; top: -.25rem; background-size: 150% auto;}
    .row04 .modeTil .tilTitle{ line-height: .6rem;}
    .row04 .modeTil .tilTitle::before{ right: -.2rem;}
    .row04 .modeCon li:nth-of-type(even){ margin-top: .6rem;}
    .row04 .ico img{ max-width: .7rem; max-height: .6rem;}
    .row05Swiper .prev{ transform: rotateY(180deg); right: auto; left: 0;}
    .row05Swiper .next{ transform: none; right: 0;}
    .modeTil .tilTitle img{ max-width: .35rem;}
    .modeTil .tilTitle span{ bottom: 0; right: 0;}
    .modeTil .tilTitle i{ margin-right: .03rem;}
}

@media screen and (max-width:414px){
    .row03 .modeCon li{ width: 100%; margin-bottom: .3rem;}
}

@media screen and (max-width:375px){
    .banner a .title{
        padding: 0 .1rem;
    }
    .banner a .title .bottom{
        font-size: .16rem;
    }
    .row04 .ico img{
        max-width: .5rem;
        max-height: .4rem;
    }
    
}