@charset "utf-8";

.banner{position:relative;padding:30px 0;background:url(../images/banner_bg.png) no-repeat bottom center/cover;z-index: 1;}
.banner .gp-container{position: relative;}
.bannerSwiper{overflow:hidden;position:relative}
.banner a{display: block;position: relative;}
.banner a::before{content: '';display: block;position: absolute;left: 0;top: 0;width: 100%;height: 100%;background: url(../images/banner_cover.png) no-repeat bottom center/100%;z-index: 2;}
.banner .img{width:1000px;flex-shrink:0;margin-right:42px}
.banner img{transition:all .25s ease}
.banner .swiper-slide-active img{transition:transform 4.7s linear;transform:scale(1.1)}
.banner img:hover{opacity:1}
.banner .gp-img-responsive{padding-bottom:41.67%}
.banner .info{flex:1;padding-top:27px}
.banner .title{color:#fff;line-height:34px;font-weight:700;margin-bottom: 26px;position: absolute;left: 40px;bottom: 0;z-index: 3;width: calc(100% - 300px);}
/* .banner .title span{background-image:linear-gradient(#004098,#004098);background-position:0 100%;background-size:0 1px;background-repeat:no-repeat;transition:background-size .5s ease}
.banner a:hover .title span{background-size:100% 1px}
.banner .summary{color:#294566;line-height:28px;margin-bottom:140px}
.banner .info .flex{align-items:center}
.banner .date{color:#416fa3;line-height:1;font-family:Arial}
.banner .more{color:#416fa3;padding-right:38px;line-height:1;text-align:right;position:relative;transition:all .35s ease}
.banner a:hover .more{padding-right:50px;transform:translateY(-8px)}
.banner .more::before{content:'';display:block;width:28px;height:15px;background:url(../images/banner-triangle.png) no-repeat right center;background-size:100% auto;position:absolute;top:0;right:0} */
.banner .banner-pagination{position:absolute;left:auto;right:32px;bottom: 26px;width:auto;z-index:2}
/* .banner .banner-pagination .swiper-pagination-bullet{right: 3;} */
.banner .banner-arrow{position:absolute;bottom:0;right:0;z-index:2}
.arrow-btn{width:60px;height:60px;background:rgba(255,255,255,.5) url(../images/banner-arrow.png) no-repeat center center;cursor:pointer;transition:all .35s ease;position: absolute;left: -130px;top: 50%;transform: translateY(-50%);}
.arrow-btn:hover{background:#0068b7 url(../images/banner-arrow-white.png) no-repeat center center}
.banner-button-next{/* margin-left:10px; */transform: translateY(-50%) rotateY(180deg);left: auto;right: -130px;}
.swiper-container-horizontal>.swiper-pagination-bullets.banner-pagination .swiper-pagination-bullet{width:10px;height:10px;margin:7.5px;background:#fff;opacity:1}
.swiper-container-horizontal>.swiper-pagination-bullets.banner-pagination .swiper-pagination-bullet-active{background:#0068b7}

.row1{padding: 70px 0 80px;}
.modeTil{align-items:flex-end}
.modeTil .name{margin-right:34px;flex-shrink:0;font-family:'Noto Sans SC'}
.modeTil .CH{font-weight:700;color:#000;line-height:1;margin-bottom:8px}
.modeTil .EN{color:#999;font-family:Arial;text-transform:uppercase;line-height:1}
.modeTil .more,.modeTil .tabMore{flex:1}
.modeTil .more.off{display:none}
.modeTil .more.on{display:block}
.modeTil .more a{position:relative;display:block;text-align:right;height:38px}
.modeTil .more a::before{content:'';display:block;width:calc(100% - 19px);height:1px;background:#d9d9d9;position:absolute;left:0;bottom:0;z-index:1}
.modeTil .more span{display:inline-block;color:#000;border:1px solid #d9d9d9;border-radius:19px 19px 19px 0;line-height:36px;width:110px;box-sizing:content-box;text-align:center;overflow:hidden;position:relative;z-index:1;transition:all .35s ease}
.modeTil .more span::before{content:'';display:block;width:100%;height:100%;background:#0068b7;border-radius:19px 19px 19px 0;position:absolute;right:100%;bottom:0;z-index:-1;transition:all .35s ease;transform:rotateZ(45deg);transform-origin:left bottom}
.modeTil .more span:hover{color:#fff}
.modeTil .more span:hover::before{right:0;transform:rotateZ(0)}

.newTab{position:relative}
.tab .tilList{position:absolute;left:256px;bottom:100%;justify-content:flex-start;font-family:'Noto Sans SC';font-weight:500;gap:60px}
.tab .boxTitle{padding-bottom:16px;cursor:pointer;position:relative}
.tab .boxTitle::before{content:'';display:block;width:0%;height:4px;background:#0068b7;position:absolute;left:0;bottom:0;z-index:1;transition:all .35s ease}
.tab .boxTitle.on{color:#0068b7}
.tab .boxTitle.on::before{width:100%}
.newTab .boxList{padding-top:32px}
.newTab .box{display:none}
.tab .box.on{display:block;animation:tabShow .35s ease forwards}
@keyframes tabShow{
    0%{opacity:.2}
    100%{opacity:1}
}

.newTab .box ul a{display:block;transition:all .35s ease}
.newTab .box ul a:hover{transform:translateY(-10px)}
.newTab .box .gp-img-responsive{padding-bottom:75%}

.newTab .box1{width: 46.67%;float: left;}
.newTab .box1 a{position:relative;display: block;}
.newTab .box1 a::before{content: '';display: block;position: absolute;left: 0;top: 0;width: 100%;height: 100%;background: url(../images/img_cover.png) no-repeat bottom center/100%;z-index: 2;}
.newTab .box1 .title{height:60px;line-height:30px;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;position: absolute;z-index: 5;color: #fff;left: 30px;right: 30px;bottom: 22px;}
.newTab .box1 a:hover .title{font-weight:700}
.newTab .box1 .date{height:30px;line-height:30px;overflow: hidden;position: absolute;z-index: 5;color: #fff;left: 30px;bottom: 94px;}

.newTab .box2{width: 53.32%;float: right;}
.newTab .box2 ul{margin: 0 -15px 0 15px;}
.newTab .box2 a{position: relative;padding: 0 0 30px;min-height: 517px;margin:0 15px;}
.newTab .box2 .img{margin-bottom: 19px;}
.newTab .box2 .title{line-height: 1.36;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 3;overflow: hidden;}
.newTab .box2 .summary{margin: 15px 0 0;color: #999;line-height: 1.625;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 4;overflow: hidden;}
.newTab .box2 .date{position:absolute;line-height:1;margin-top:25px;color:#0068b7;background:url(../images/new-more.png) no-repeat right center;bottom: 0;width: 100%;left: 0;}

.row2{padding: 67px 0 81px;background:#e7eef3}
.academic{position:relative}
.academic .boxList{padding-top:10px}
.academic .box{display:none}
.academic .box.on{display:block}
.academic ul{margin:0 -20px;padding: 8px 0 0;}
.academic li{margin-top:20px}
.academic li a{background:#fff;margin:0 20px;transition:all .35s ease}
.academic li a:hover{transform:translateY(-8px);box-shadow:2px 4px 5px rgba(34,87,148,.4);background-image:-moz-linear-gradient(90deg,#297ad4 0,#3870af 100%);background-image:-webkit-linear-gradient(90deg,#297ad4 0,#3870af 100%);background-image:-ms-linear-gradient(90deg,#297ad4 0,#3870af 100%)}
.academic .img{width:320px;flex-shrink:0;margin-right:30px}
.academic .info{width:calc(100% - 350px);padding: 29px 30px 0 0;box-sizing:border-box}
.academic .gp-img-responsive{padding-bottom: 75%;}
.academic .title{color:#000;line-height:30px;height:60px}
.academic a:hover .title{color:#fff;font-weight:700}
.academic .summary{color:#999;line-height:24px;margin-top: 17px;height:72px}
.academic a:hover .summary{color:rgba(255,255,255,1)}
.academic .date{color:#999;margin-top: 21px;line-height:1}
.academic a:hover .date{color:rgba(255,255,255,.5)}

.row3{padding: 76px 0 31px;}
.row3 .line{border-right: 1px solid #e5e5e5;margin-top: 40px;}
.notice{flex:1;max-width:520px;padding-top:40px}
.notice li{margin-top:23px}
.notice li:first-child{margin-top:0}
.notice li .flex{align-items:center}
.notice a{display:block;padding-bottom:20px;border-bottom:1px dashed #d9d9d9;transition:all .35s ease}
.notice a:hover{transform:translateY(-8px)}
.row3 .tag{line-height:28px;width:90px;text-align:center;border:1px solid rgba(34,87,148,.4);color:#0068b7;border-radius:15px}
.row3 a:hover .tag{background:#0068b7;color:#fff;font-weight:700}
.notice .date{color:#999}
.notice .title{line-height:28px;color:#000;margin-top:12px}
.notice a:hover .title{font-weight:700;color:#0068b7}

.active{flex:1;max-width:880px;padding-top: 36px;position: relative;}
.active ul{display:flex;display:-ms-flexbox;flex-wrap:wrap;margin: 0 -15px;}
.active li{width: 50%;}
.active li:first-child{margin-top:0}
.active li a{background:#fff;transition:all .35s ease;display: block;margin: 0 15px;padding: 20px 22px 32px;position: relative;z-index: 2;box-shadow: 0px 10px 30px 0px rgba(60, 19, 20, 0.2);}

.active li a:hover{box-shadow:2px 4px 5px rgba(34,87,148,.4)}
.active a:hover{transform:translateY(-8px)}
.active .img{width: 100%;}
.active .gp-img-responsive{padding-bottom: 75%;border:1px solid #d9d9d9}
.active .info{max-height:250px;overflow:hidden;padding:20px 0 0;box-sizing:border-box}
.active .tag{display:inline-block;width:auto;padding-left:15px;padding-right:15px}
.active .title{line-height: 1.5;margin-top: 16px;margin-bottom: 23px;}
.active a:hover .title{font-weight:700}
.active .msg{margin-bottom: 12px;}
.active .msg span{color:#999;line-height:22px}
.active .msg span:first-child{width: 65px;flex-shrink:0;color:#000}
.active .msg span:last-child{flex:1}

.row4{position:relative;padding:47px 0 77px;background:#e7eef3;z-index:2;overflow:hidden}
.row4 .modeCon{padding-top:30px}
.row4 .modeCon .big{width:49.75%}
.row4 .modeCon .small{width:48.66%;display:flex;display:-ms-flexbox;flex-wrap:wrap;gap:24px 23px}
.row4 .small li{width:calc(50% - 11.5px)}
.row4 .modeCon a{position:relative;display:block;transition:all .35s ease}
.row4 .modeCon a:hover{transform:translateY(-8px)}
.row4 .modeCon .img{position:relative}
.row4 .modeCon .img::before{content:'';display:block;width:100%;height:0;padding-bottom:28.37%;background-image:-moz-linear-gradient(90deg,#030000 0,rgba(0,0,0,0) 100%);background-image:-webkit-linear-gradient(90deg,#030000 0,rgba(0,0,0,0) 100%);background-image:-ms-linear-gradient(90deg,#030000 0,rgba(0,0,0,0) 100%);opacity:.7;position:absolute;left:0;bottom:0;z-index:1;pointer-events:none}
.row4 .modeCon .gp-img-responsive{padding-bottom:62.5%}
.row4 .modeCon .title{position:absolute;left:50%;bottom:0;z-index:1;width:calc(100% - 60px);box-sizing:content-box;transform:translateX(-50%);color:#fff}
.row4 .big .title{line-height:32px;height:64px;bottom:26px}
.row4 .big a:hover .title{font-weight:700}
.row4 .small .title{line-height:26px;height:52px;bottom:10px;width:calc(100% - 40px)}
.row4 .small a:hover .title{font-weight:700}

.row5{position:relative;padding:63px 0 50px;z-index:2}
.row5 .modeCon{margin-top:32px;padding:0 70px;background:rgba(255,255,255,.7);margin:0 -70px}
.row5 ul li{position:relative;padding-left:20px;padding-right:45px;padding-top:74px;padding-bottom:107px;box-sizing:border-box;transition:all .35s ease;z-index:1}
.row5 ul li:hover{background-image:-moz-linear-gradient(90deg,#297ad4 0,#3870af 100%);background-image:-webkit-linear-gradient(90deg,#297ad4 0,#3870af 100%);background-image:-ms-linear-gradient(90deg,#297ad4 0,#3870af 100%);transition-delay:0s!important;box-shadow:0 20px 40px 0 rgba(1,43,91,.4)}
.row5 ul li::after{content:'';display:block;width:100%;height:100%;background:url(../images/point-bg.png) no-repeat center bottom;background-size:230px auto;position:absolute;left:0;bottom:0;z-index:-1;opacity:0;transition:all .35s ease}
.row5 ul li:hover::after{opacity:1}
.row5 ul li:hover *{color:#fff}
.row5 ul li::before{content:'';display:block;width:1px;height:100%;max-height:280px;background:#e2e8f0;position:absolute;left:0;top:74px}
.row5 ul li:hover::before{opacity:0}
.row5 ul a{display:block;transition:all .35s ease}
.row5 ul a:hover{transform:translateY(-8px)}
.row5 ul .title{position:relative;padding-left:50px;line-height:28px;height:112px}
.row5 a:hover .title{font-weight:700}
.row5 ul .title::before{content:'';display:block;width:24px;height:22px;background:url(../images/point-icon.png) no-repeat left center/cover;position:absolute;left:0;top:0;z-index:1}
.row5 ul li:hover .title::before{background:url(../images/point-bg.png) no-repeat center;background-size:100% 100%}
.row5 ul .summary{color:#666;height:125px;line-height:25px;margin-top:35px;text-align:justify;-webkit-line-clamp:5}
.row5 ul li:hover .summary{opacity:.5}
@media screen and (max-width:1600px){
    .arrow-btn{left: 10px;z-index: 10;}
    .banner-button-next{right: 10px;left: auto;}

    .banner,.row1,.row2,.row3{padding:50px 0}
    .notice{padding-right:20px}
    .active{padding-left:20px}
    .active .title{margin:15px 0 20px}
    .active .info{/* padding:10px 20px 0 20px; */}
    .active .msg{margin-bottom:10px}
    .active .msg span{line-height:18px}
}
@media screen and (max-width:1480px){
    .banner .img{width:880px;margin-right:20px}
    .banner .summary{margin-bottom:80px}
    .banner .banner-pagination{/* width:calc(100% - 890px); */}
    .swiper-container-horizontal>.swiper-pagination-bullets.banner-pagination .swiper-pagination-bullet{margin:0 4px}
    .arrow-btn{width:45px;height:45px}
    .newTab .box2 ul{margin:0 -10px 0 10px;}
    .newTab .box2 ul a{margin:0 10px;min-height: initial;}
    .academic ul{margin:0 -10px}
    .academic li a{margin:0 10px}
    .notice{/* padding-right:10px; */}
    .active{/* padding-left:10px; */}

    .academic .img{width:240px;margin-right:20px}
    .academic .info{width:calc(100% - 260px);padding: 15px 20px 0 0;}
    .academic .summary{line-height: 20px;height: 40px;}
    .academic .date{margin-top:15px}

    .row4{padding:40px 0}
    .row5 .modeCon{padding:0 50px;margin:0 -50px}
    .row5 ul li{padding-left:15px;padding-right:20px;padding-top:40px;padding-bottom:60px}
    .row5 ul .title{padding-left:35px}
    .row5 ul .summary{margin-top:30px}
}
@media screen and (max-width:1280px){
    .banner .img{width:760px}
    .banner .info{padding-top:10px}
    .banner .banner-pagination{/* width:calc(100% - 780px); */}
    .row5 .modeCon{padding:0 40px;margin:0 -40px}
}
@media screen and (max-width:1200px){
    .banner,.row1,.row2,.row3,.row4{padding:40px 0}
    .row5{padding:50px 0}
    .modeTil .CH{font-size:34px}
    .tab .tilList{left:220px;gap:30px}
    .notice li{margin-top:10px}
    .notice a{padding-bottom:15px}
    .active .img{/* width:300px; */}
    .active .info{/* width:calc(100% - 300px); */}
    .row5 .modeCon{padding:0 20px;margin:0 -20px}
}
@media screen and (max-width:1100px){
    .banner .img{width:680px}
    .banner .summary{margin-bottom:50px}
    .banner .banner-pagination{/* width:calc(100% - 700px); */}
    .banner .title{font-size:22px;line-height:30px}
}
@media screen and (max-width:997px){
    .row5{padding:40px 0 20px}
    .row5 ul li{padding-top:30px;padding-bottom:30px}
    .row5 ul li::before{top:30px}
    .banner .img{width:70%}
    .banner .banner-pagination{/* width:calc(30% - 20px); */}
    .banner .title{font-weight:400;margin-bottom:15px;font-size:18px;line-height:26px;-webkit-line-clamp:2}
    .banner .summary{margin-bottom:25px}
    .banner .date,.banner .more{font-size:16px}
    .arrow-btn{width:40px;height:40px}
    .newTab .box .title{margin-top:10px}
    .academic ul li:nth-of-type(1){margin-top:0}
    .academic .img{margin-right:20px}
    .academic .info{width:calc(100% - 260px);padding:25px 30px 20px 0}
    .academic .date{margin-top:30px}
    .row3 .gp-container>.flex{flex-wrap:wrap}
    .active,.notice{max-width:100%;width:100%;flex:unset;padding-left:0;padding-right:0}
    .active{padding-top:20px}
    .active li{/* margin-top:20px; */}
    .row4 .modeCon{flex-wrap:wrap}
    .row4 .modeCon .big,.row4 .modeCon .small{width:100%}
    .row4 .modeCon .small{margin-top:20px}
    .row4 .modeCon .small{gap:20px}
    .row5 ul li{margin-top:20px}
    .row5 ul li:nth-of-type(1),.row5 ul li:nth-of-type(2){margin-top:0}
}
@media screen and (max-width:767px){
    .banner,.row1,.row2,.row3,.row4{padding:30px 0}
    .row5{padding:30px 0}
    .modeTil .CH{font-size:30px}
    .modeTil .EN{font-size:12px}
    .banner .img{width:100%;position:relative}
    .banner .img::before{content:'';display:block;width:100%;height:0;padding-bottom:28.37%;background-image:-moz-linear-gradient(90deg,#030000 0,rgba(0,0,0,0) 100%);background-image:-webkit-linear-gradient(90deg,#030000 0,rgba(0,0,0,0) 100%);background-image:-ms-linear-gradient(90deg,#030000 0,rgba(0,0,0,0) 100%);opacity:.7;position:absolute;left:0;bottom:0;z-index:1}
    .banner .info{position:absolute;left:0;bottom:15px;z-index:1;padding:0 15px}
    .banner .info *{color:#fff}
    .banner .title{-webkit-line-clamp:1;display: none;}
    .banner .more,.banner .summary{display:none}
    .banner .banner-pagination{/* width:40%; */bottom:10px}
    .modeTil .more span{width:90px;line-height:32px}
    .newTab .box ul{margin:0 -5px}
    .newTab .box ul a{margin:0 5px}
    .tab .tilList{left:200px}
    /* .newTab .box ul li{width:100%} */
    .newTab .box .title{height:auto}
    .newTab .box .date{margin:15px 0 0}
    .row5 .modeCon{padding:0 10px;margin:0 -10px}

    .newTab .box1{width: 100%;float: none;}
    .newTab .box2{width: 100%;float: none;margin-top:20px;}
    .newTab .box2 ul a{margin-bottom: 20px;}

}
@media screen and (max-width:680px){
    .modeTil .name{margin-right:20px}
    .tab .tilList{left:170px;gap:15px}
    .modeTil .CH{font-size:26px}
    .active li a{flex-direction:column}
    .active .img{width:100%}
    .active .info{/* width:100%; *//* padding:10px 20px; */}

    .active{padding: 0;}
    .active li{width:100%;}
    .active li a{margin-bottom:20px;padding-bottom: 15px;}

}
@media screen and (max-width:580px){
    .tab .tilList{position:relative;left:0;top:0;bottom:0;margin:15px 0 0}
    .tab .boxTitle{padding-bottom:10px}
    .row4 .big .title{bottom:15px;width:calc(100% - 30px)}
    .row4 .small .title{bottom:8px;width:calc(100% - 20px);line-height:20px;height:auto}
}
@media screen and (max-width:479px){
    .banner .banner-pagination{/* width:calc(100% - 100px); */}
    .academic li a{flex-direction:column}
    .academic .img{width:100%}
    .academic .info{width:100%;padding:15px}
    .academic .title{line-height:28px;height:auto}
    .academic .date{margin-top:10px}
    .academic .title,.newTab .box .title{font-size:18px}
    .academic .summary{margin-top:10px}
    .row4 .small li{width:100%}
}