@charset "utf-8";
.fix{ display: none;}
.wholeBg{ background: url(../images20240718/pagebg0301.png) no-repeat center top; background-size: 100% auto;}
.mode_text p{ color: #2e4099; line-height: 28px; letter-spacing: 0.9px; text-align: justify;}

.bannerNHC{ }
.bannerNHC .img{ padding-bottom: 28.125%;}

/* Img Slider */
.sliderMode{ margin-top: 34px; background: url(../images20240718/slider_bg.png) no-repeat center bottom/cover; padding: 50px 50px 70px;}
.slick{ margin: 0 -10px;}
.slick .item{ margin: 0 10px;}
.slick-arrow{ font-size: 0; position: absolute; top: 50%; transform: translateY(-50%); width: 50px; height: 70px;
    background: url(../images20240718/arrows.png) no-repeat center/cover; z-index: 1; border: none; outline: none;}
.slick-prev{ left: -50px;}
.slick-next{ right: -50px; transform: translateY(-50%) rotateZ(180deg);}

/* Open Data Lable */
@font-face {
    font-family: 'AlimamaShuHeiTi';
    src: url(../fontsNHC/AlimamaShuHeiTi-Bold.otf);
    src: url(../fontsNHC/AlimamaShuHeiTi-Bold.ttf);
    src: url(../fonts/alimamashuheiti-bold.woff);
    src: url(../fonts/alimamashuheiti-bold.woff2);
}
.openData{ margin-top: 110px;}
.openDataTil{ text-align: center; font-size: 50px; letter-spacing: 2.5px; font-weight: bold; }
.openDataTil a{ display: inline-block; background: url(../images20240718/opendatatil2.png) no-repeat bottom/cover; line-height: 58px; padding-bottom: 10px; color: #4b23fe; z-index: 1; position: relative;
    font-family: 'AlimamaShuHeiTi';}
.openDataTil a::before{ content: ''; display: block; width: 604px; height: 220px; background: url(../images20240718/opendatatil1.png) no-repeat center/cover;
position: absolute; left: 50%; top: 50%; transform: translate3d(-50%,-50%,0); z-index: -1;}
.gp-clearFix::after{ content: ''; display: table; clear: both;}
.flex{ display: flex; display: -ms-flexbox; justify-content: space-between;}
.openData > ul{ padding-right: 10px; margin: 66px -20px 0;}

.gp-row2 li{ float: left; width: 50%;}
.gp-row3 li{ float: left; width: 33.33%;}
.gp-row4 li{ float: left; width: 25%;}

.gp-row3 a{ display: block; margin: 0 20px; background: url(../images20240718/libg1.png) no-repeat top/cover; border-radius: 10px; position: relative;}
.gp-row3 a::before{ content: ''; display: block; width: 110%; height: 110%; background: url(../images20240718/libg2.png) no-repeat top right;
position: absolute; top: -10px; right: -10px; z-index: -1; transition: all 0.35s ease; border-radius: 10px;}
.gp-row3 a:hover::before{ transform: translate3d(-10px,10px,0); width: 100%; height: 100%;}
.gp-row3 .liTil{ font-weight: bold; color: #fff; line-height: 50px; height: 50px; overflow: hidden; padding-left: 20px; border-bottom: 1px solid rgba(255, 255, 25, 0.3);}
.gp-row3 .liCon{ padding: 32px 30px;}
.gp-row3 .summary{ color: #fff; line-height: 26px; height: 78px; }
.gp-row3 .liData{ color: #ada1e5; margin-top: 28px; line-height: 1;}
.gp-row3 .liData span{ color: #00f78b;}

.openData .download{ width: calc(100% - 10px); background: url(../images20240718/libg3.png) no-repeat top center/cover; margin-top: 20px; padding: 60px 45px; box-sizing: border-box; border-radius: 10px; position: relative;}
.openData .download::before{ content: '';display: block;width: calc(100% + 10px); height: 100%; border: 1px solid #4b23fe; border-radius: 10px;
    position: absolute; left: 0px; bottom: -10px; z-index: -1;}
.openData .download ul{ margin: 0 -76px;}
.openData .download li{ padding-bottom: 30px;}
.openData .download li:nth-last-of-type(1),
.openData .download li:nth-last-of-type(2){ padding-bottom: 0; }
.openData .download li:nth-last-of-type(1) a::before,
.openData .download li:nth-last-of-type(2) a::before{ display: none;}
.openData .download li:nth-of-type(odd){ width: calc(50% - 2px); border-right: 1px solid #7c6afe; }
.openData .download a{ display: block; color: #fff; margin: 0 76px; padding-bottom: 30px; position: relative; transition: all 0.35s ease;}
.openData .download a:hover{ transform: translateY(-8px);}
.openData .download a::before{ content: ''; display: block; width: 150%; height: 1px; background: #7c6afe; position: absolute; bottom: 0; left: 0; transition: all 0.35s ease;}
.openData .download a:hover::before{ bottom: -8px;}
.openData .download li:nth-of-type(even) a::before{ left: auto; right: 0;}
.openData .download .title{ line-height: 1; height: 18px; overflow: hidden;}
.openData .download .summary{ opacity: 0.5; line-height: 24px; height: 48px; overflow: hidden; margin-top: 18px;}
.openData .download .date{ margin-top: 25px;}
.openData .download .downBtn{ position: absolute; right: 0; bottom: 25px; z-index: 1; width: 90px; line-height: 28px; border: 1px solid #b728fd; text-align: center;}

/* award */
.award{  margin-top: 110px; overflow: hidden;}
.awardTil{ margin-top: 46px; position: relative;}
.awardTil a{ margin: 0 auto; display: block; line-height: 70px; max-width: 420px; text-align: center; font-weight: bold; color: #fff; background: #4b23fe; position: relative;}
.awardTil a::before,
.awardTil a::after{ content: ''; display: block; width: 100%; height: 1px; background: #4b23fe;
    position: absolute; top: 24px; left: calc(100% + 45px);}
.awardTil a::before{ left: auto; right: calc(100% + 45px);}
.awardTil a .before{ display: block; width: 8px; height: 40px; border-right: 2px solid #4b23fe; position: absolute; left: -35px; top: 2px;}
.awardTil a .before::before{ content: ''; display: block; width: 2px; height: 25px; background: #4b23fe; position: absolute; left: 0; top: 10px;}
.awardTil a .after{ display: block; width: 8px; height: 40px; border-left: 2px solid #4b23fe; position: absolute; right: -35px; top: 2px;}
.awardTil a .after::before{ content: ''; display: block; width: 2px; height: 25px; background: #4b23fe; position: absolute; right: 0; top: 10px;}
.awardBox{ position: relative; z-index: 1;}
.boxTil2{ font-weight: bold; color: #4b23fe; text-align: center; max-width: 820px; line-height: 1; margin: 50px auto 0; position: relative;}
.boxTil2::before,.boxTil2::after{ content: ''; display: block; width: 126px; height: 18px; background: url(../images20240718/til-icon.png) no-repeat left;
    position: absolute; left: 0; transform: translateX(-100%); top: 0; z-index: 1;}
.boxTil2::after{ left: auto; right: 0; transform: translateX(100%) rotateZ(180deg);}
.boxCon{ margin-top: 40px; padding: 40px 50px 50px; background: url(../images20240718/boxbg.png) no-repeat center/cover; border-radius: 10px;}
.boxCon li{ margin-bottom: 20px;}
.boxCon li:last-child{ margin-bottom: 0px;}
.boxCon a{ padding: 30px 30px 40px; background: url(../images20240718/box_abg.png) no-repeat center top/cover;}
.boxCon .imgBox{ width: 270px; flex-shrink: 0; margin-right: 30px;}
.boxCon .img{ background: rgba(168, 185, 189, 0.9); padding-bottom: 66.67%; }
.boxCon .infoCon{ flex: 1; }
.boxCon .infoCon .title{ line-height: 20px; height: 20px; color: #263999; font-weight: bold;}
.boxCon .infoCon .summary{ line-height: 24px; color: #2e4099; margin: 17px 0;}
.boxCon .infoCon span{ display: inline-block; color: #4b23fe; min-width: 156px; line-height: 14.5px; margin-bottom: 14px;}
.boxCon .infoCon span:nth-of-type(even){ padding-left: 20px; border-left: 1px solid #a9b3ff;}
.boxCon .infoCon span:nth-of-type(5n){ margin-bottom: 0;}

/* demand research */
.demand{ margin: 50px 0 72px;}




/* 响应式样式 */
@media screen and (max-width:1200px) {
    .gp-row3 a::before{ width: 100%; height: 100%; background-size: 100% 100%;}
}

@media screen and (max-width:1100px) {
    
}
@media screen and (max-width:1024px) {
    .openData, .award{ margin-top: 60px;}
    .openData > ul{ margin: 50px -10px 0;}
    .gp-row3 a{ margin: 0 10px;}
    .openData .download,
    .boxCon{ padding: 40px 30px;}
    .openData .download ul{ margin: 0 -30px;}
    .openData .download a{ margin: 0 30px;}
    .boxCon a{ padding: 20px 20px 30px;}
    .boxCon .infoCon .summary{ margin: 10px 0;}
    .boxCon .infoCon span{ margin-bottom: 6px;}
}

@media screen and (max-width:996px) {
    .openData, .award{ margin-top: 40px;}
    .awardTil{ margin-top: 30px;}
    .boxTil2{ margin: 30px auto 0;}
    .demand{ margin: 40px 0;}
    .gp-row3 .liTil{ padding-left: 10px;}
    .gp-row3 .liCon{ padding: 20px 15px;}
    .gp-row3 .liData{ margin-top: 15px;}
}

@media screen and (max-width:900px) {
    .gp-row3 li{ width: 50%; margin-bottom: 20px;}
    .boxCon .imgBox{ margin-right: 20px;}
}

@media screen and (max-width:840px) {
    .boxCon a{ flex-direction: column;}
    .boxCon .imgBox{ width: 100%;}
    .boxCon .infoCon{ width: 100%; margin-top: 20px;}
}

@media screen and (max-width:767px) {
    .sliderMode{ padding: 30px 40px;}
    .slick-arrow{ width: 35px; height: 50px;}
    .slick-prev{ left: -40px;}
    .slick-next{ right: -40px;}
    .openData .download ul{ margin: 0 -15px;}
    .openData .download a{ margin: 0 15px;}
    .openDataTil{ font-size: 40px;}
    .awardTil a{ line-height: 45px;}
}

@media screen and (max-width:680px) {
    .openData, .award{ margin-top: 30px;}
    .openDataTil{ font-size: 32px; line-height: 35px;}
    .openDataTil a{ padding-bottom: 4px;}
    .openDataTil a::before{ width: 400px; height: 150px; background-size: 100% 100%;}
    .awardTil{ margin-top: 20px;}
    .boxTil2{ margin: 20px auto 0;}
    .openData .download, .boxCon{ padding: 30px 20px; margin-top: 30px;}
    .demand{ margin: 30px 0;}
}

@media screen and (max-width:540px) {
    .gp-row2 li{ width: 100%;}
    .gp-row3 li{ width: 100%;}
    .gp-row3 li{ margin-bottom: 30px;}
    .gp-row3 li:last-child{ margin-bottom: 0px;}
    .openData .download li:nth-of-type(odd){ border: none; width: 100%;}
    .openData .download a::before{ width: 100%;}
    .slick-prev{ left: -30px;}
    .slick-next{ right: -30px;}

    .gp-row3 .summary{ height: auto; min-height: 40px;}
    .gp-row3 .liData{ justify-content: flex-start;}
    .gp-row3 .liData div:first-child{ margin-right: 20px;}
}

@media screen and (max-width:479px) {
    .boxCon .infoCon span{ min-width: unset;}
    .boxCon .infoCon span:nth-of-type(odd){ padding-right: 10px;}
    .boxCon .infoCon span:nth-of-type(even){ padding-left: 10px;}
}

@media screen and (max-width:414px) {
    .openDataTil a::before{ width: 300px; height: 100px;}
    .boxCon a{ padding: 20px 15px;}
    .boxCon .infoCon span{ display: block; padding: 0 !important; border: none !important;}
    .boxCon .infoCon br{ display: none;}
    .openData .download a{ padding-bottom: 15px;}
    .openData .download li{ padding-bottom: 15px;}
    .sliderMode{ padding: 20px; margin-top: 0px;}
    .openData > ul{ margin: 30px -10px 0;}
    .openData .download, .boxCon{ padding: 20px 15px;}
    .openDataTil{ font-size: 26px; letter-spacing: 1.5px;}
    .boxCon a{ padding: 20px 10px;}
    .openData .download, .boxCon{ padding: 20px 10px;}
}

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