.body{background: url(../images/body_bg.jpg) no-repeat center;background-size: cover;min-height: 100vh;}

.header{width: 100%;height: 3.87rem;background: url(../images/header_bg.png) no-repeat center bottom;background-size: cover;display: flex;justify-content: space-between;align-items: flex-start;padding: 0 2.6%;box-sizing: border-box;}
.header .logo{padding: 0.47rem 0;}
.header .logo img{height: 1.4rem;}
.header .title{height: 100%;}
.header .title img{height: 1.27rem;}
.header .date{padding: 0.8rem 0;color: #FFFFFF;line-height: 0.67rem;font-family: "Barlow-Regular";text-align: right;width: 5.8rem;white-space: nowrap;}
.header .date span{margin-right: 0.67rem;}

.main{padding: 2.2rem 1.67rem 1.67rem;display: flex;align-items: flex-start;justify-content: center;}
.main .left{width: 20%;}
.main .item{position: relative;background: url(../images/box1.png) no-repeat center;background-size: cover;box-shadow: 0px 0px 62px 0px rgba(21, 89, 237, 0.6),inset 0px 0px 80px 0px rgba(96, 146, 242, 0.3);}
.main .item .wrap{position: absolute;left: 0;top: 0;width: 100%;height: 100%;box-sizing: border-box;padding: 0.67rem 0.67rem 0;}
.main .item .titleStyle{color: #FFFFFF;line-height: 1;margin-bottom: 1rem;}
.main .item .titleStyle .icon{height: 1.33rem;margin-right: 0.27rem;}
.main .item .titleStyle h2{font-variation-settings: "opsz" auto;background: linear-gradient(180deg, #FFFFFF 0%, #97CDFF 100%);-webkit-background-clip: text; -webkit-text-fill-color: transparent;background-clip: text; text-fill-color: transparent;}
.main .item .container{width: 100%;height: calc(100% - 2.33rem);position: relative;}
.main .item .content{width: 100%;height: 100%;}
.main .item1{padding-bottom: 130.49%;margin-bottom: 0.87rem;}
.main .item1 .content .text{position: absolute;left: 50%;bottom: 0.4rem;transform: translateX(-50%);z-index: 2;color: #fff;}
.main .item1 .content .text .line1{display: flex;align-items: center;}
.main .item1 .content .text .cube{width: 10px;height: 8px;border-radius: 2px;margin-right: 5px;}
.main .item1 .content .text .name{line-height: 0.6rem;}
.main .item1 .content .text .num{line-height: 0.87rem;font-family: "Barlow-Regular";font-weight: bold;padding-left: 15px;}

.main .item2{padding-bottom: 95.05%;background-image: url(../images/box2.png);}
.main .item2 .titleStyle{margin-bottom: 0;}
.main .item2 .container{height: calc(100% - 1.33rem);}
.main .item2 #tagscloud{width:100%;height: 90%;position:relative;margin:0 auto;text-align:center;}
.main .item2 #tagscloud a{position:absolute;top:0px;left:0px;color:#333;font-family:Arial;text-decoration:none;margin:0 10px 15px 0;line-height:18px;text-align:center;font-size: 12px;padding:1px 5px;display:inline-block;border-radius:3px; transition: 0.6s;}
.main .item2 #tagscloud a.tagc1{color:#00EDE5;}
.main .item2 #tagscloud a.tagc2{color:#30BFEC;}
.main .item2 #tagscloud a.tagc3{color:#8F64F9;}
.main .item2 #tagscloud a.tagc4{color:#BCFF36;}
.main .item2 #tagscloud a.tagc5{color:#FF8A36;}
.main .item2 #tagscloud a:hover{color:#00EDE5;font-weight: bold;}

.main .med{width: 52.2%;margin: 0 1.6%;}

.main .item3{padding-bottom: 17.57%;background-image: url(../images/box3.png);border-radius: 15px;}
.main .item3 .bg{position: absolute;left: 0;top: 0;width: 100%;height: 100%;filter: drop-shadow(0px 0px 62px rgba(21, 89, 237, 0.6));}
.main .item3 .title{position: absolute;left: 50%;transform: translateX(-50%);bottom: 100%;line-height: 1;font-variation-settings: "opsz" auto;background: linear-gradient(180deg, #FFFFFF 0%, #97CDFF 100%);-webkit-background-clip: text; -webkit-text-fill-color: transparent;background-clip: text; text-fill-color: transparent;}
.main .item3 .wrap{padding: 0 2rem;height: auto;top: 50%;transform: translateY(-50%);}
.main .item3 dl{width: 45.18%;}
.main .item3 dl dt{color: #fff;line-height: 0.73rem;margin-bottom: 0.4rem;}
.main .item3 dl dd{display: flex;}
.main .item3 .num{width: 12%;margin-right: 2.66%;border-radius: 4px;background: linear-gradient(180deg, rgba(1, 239, 240, 0.8) 0%, rgba(12, 97, 251, 0.8) 100%);/*border: 1px solid;border-image: linear-gradient(180deg, rgba(12, 87, 222, 0.6) 0%, rgba(3, 188, 212, 0.6) 100%) 1;*/
filter: blur(60px);opacity: 0;}
.main .item3 .num:nth-child(7n){margin-right: 0;}
.main .item3 .num span{display: block;padding-bottom: 166.66%;position: relative;}
.main .item3 .num span em{position: absolute;left: 0;top: 50%;transform: translateY(-50%);width: 100%;text-align: center;line-height: 1;background: linear-gradient(180deg, #FFFFFF 50%, #97CDFF 81%);-webkit-background-clip: text; -webkit-text-fill-color: transparent;background-clip: text; text-fill-color: transparent;text-shadow: 0px 4px 10px rgba(0, 0, 0, 0.3);font-family: "Barlow-Bold";}
.main .item3.show .num{transition: transform 1.2s cubic-bezier(0.3, 0.2, 0, 1), opacity 1.2s cubic-bezier(0.3, 0.2, 0, 1), filter 0.8s cubic-bezier(0.3, 0.2, 0, 1);transform: translate3d(0, 0, 0);filter: none;opacity: 1;}

.main .item4{background: none;box-shadow: none;padding-bottom: 71.8%;}
.main .item4 .container{height: 100%;position: absolute;left: 0;top: 0;}

.dp-tooltip{width: 4.87rem;height: 2.77rem;box-sizing:border-box;background: url(../images/map_bg.png) no-repeat center;background-size: cover;padding: 0.4rem;color: #fff;line-height: 1;}
.dp-tooltip .num{font-family: "Barlow-Bold";line-height: 1.33rem;}

.main .right{width: 24.5%;}

.main .item5{padding-bottom: 94.61%;background-image: url(../images/box4.png);margin-bottom: 0.73rem;}

.main .item6{padding-bottom: 90.35%;background-image: url(../images/box5.png);}
.main .item6 .list li{margin-bottom: 0.2rem;color: #FFFFFF;line-height: 0.93rem;}
.main .item6 .list li .contLeft{flex-shrink: 0;}
.main .item6 .list li .num{width: 0.8rem;height: 0.8rem;background: url(../images/num_bg.svg) no-repeat center;background-size: cover;margin-right: 0.27rem;text-align: center;line-height: 0.8rem;color: #051439;font-weight: bold;font-size: 10px;font-weight: bold;flex-shrink: 0;}
.main .item6 .list li .ratio{width: 50%;box-sizing: border-box;border: 1px solid #1067B3;padding: 3px;}
.main .item6 .list li .ratio .bg{width: 0;height: 0.27rem;position: relative;transition: 1s;}
.main .item6 .list li .ratio .bg::before{content: "";position: absolute;left: 0;top: 0;width: 100%;height: 100%;background: linear-gradient(270deg, #00EDE5 0%, #004C93 100%);clip-path: polygon(calc(100% - 12px) 0, 100% 100%, 0 100%, 0 0);}
.main .item6 .list li .ratio .bg::after{content: "";width: 0.2rem;height: 100%;background: #00EDE5;position: absolute;right: -4px;top: 0;transform: skew(54deg);}
.main .item6 .list li:nth-child(1) .num{background-image: url(../images/icon_cup1.svg);line-height: 0.6rem;}
.main .item6 .list li:nth-child(2) .num{background-image: url(../images/icon_cup2.svg);line-height: 0.6rem;}
.main .item6 .list li:nth-child(3) .num{background-image: url(../images/icon_cup3.svg);line-height: 0.6rem;}


@media screen and (max-width: 1540px){
.main .item .titleStyle{margin-bottom: 0.5rem;}
.main .item .titleStyle .icon{height: 0.9rem;}
.main .item .container{height: calc(100% - 1.83rem);}
}


@media screen and (max-width: 1480px){
.main .item .wrap{padding: 0.4rem 0.4rem 0;}  
}