@charset "utf-8";

/* 背景 */
body {
	/* background: url(./../总背景文件夹/浅绿色背景3.png) center center; */
	/* background: url(./../总背景文件夹/浅绿色背景1.png) center center; */
	/* background: url(./../总背景文件夹/浅绿色背景2.png) center center; */
	/* background: url(./../总背景文件夹/深绿色背景1.png) center center; */
	background: url(./../总背景文件夹/深色背景1.jpg) center center;
	/* background: url(./../总背景文件夹/深色背景2.jpg) center center; */
	/* background: url(./../总背景文件夹/深色背景3.jpg) center center; */
	/* background: url(./../总背景文件夹/深色背景4.jpg) center center; */
	/* background: url(./../总背景文件夹/深色背景5.jpg) center center; */
	/* background: url(./../总背景文件夹/深色背景6.jpg) center center; */
	/* background: url(./../总背景文件夹/深色背景7.jpg) center center; */
	/* background: url(./../总背景文件夹/白色背景1.png) center center; */
	/* background: url(./../总背景文件夹/白色背景2.png) center center; */
	/* background: url(./../总背景文件夹/白色背景3.png) center center; */
	/* background: url(./../总背景文件夹/深蓝色背景1.png) center center; */
	/* background: url(./../总背景文件夹/深蓝色背景2.png) center center; */
	/* background: url(./../总背景文件夹/深蓝色背景3.jpeg) center center; */
	background-size: 100% 100%;
	background-repeat: no-repeat;
	overflow: hidden;
	background-size: cover;
	color: #fff;
	font-size: .1rem;
}

/* 边框 */
.boxall {
	/* background-image: url(./../浅边框/分组8.png); */
	background: rgba(255, 255, 255, .04) url(../images/line.png);
	/* background-image: url(./../浅边框/蓝1.png); */
	border: 1px solid rgba(25, 186, 139, .17);

	background-size: 100% 100%;
	background-repeat: no-repeat;
	background-position: center;
	position: relative;
	margin-bottom: .15rem;
	box-sizing: border-box;
	padding: 0 .2rem .5rem .2rem;
}
/* 边框上的四个角 */
.boxall:before,
.boxall:after {
	position: absolute;
	width: .1rem;
	height: .1rem;
	content: "";
	border-top: 2px solid #02a6b5;
	top: 0;
}

.boxall:before,
.boxfoot:before {
	border-left: 2px solid #02a6b5;
	left: 0;
}

.boxall:after,
.boxfoot:after {
	border-right: 2px solid #02a6b5;
	right: 0;
}
.boxfoot {
	position: absolute;
	bottom: 0;
	width: 100%;
	left: 0;
}

.boxfoot:before,
.boxfoot:after {
	position: absolute;
	width: .1rem;
	height: .1rem;
	content: "";
	border-bottom: 2px solid #02a6b5;
	bottom: 0;
}
/* 头部 */
.head {
	height: 1.2rem;
	/* 浅色 */
	/* background-image: url(../浅边框/酷炫风-大指标卡_d40886c3-cd8d-4ec9-ac42-42a5268a6e5d.png); */
	/* background-image: url(/浅边框/编组\ 65.png); */
	/* 第一种 */
	/* background-image: url(./头部样式/header14.png); */
	/* 第二种 */
	background-image: url(./头部样式/header15.png); 
	/* 绿色 */
	/* background-image: url(../绿色背景/f0abc2a71353e04d438289f65763774b.png); */
	background-repeat: no-repeat;
	text-shadow: 1px 1px 1px #000, -1px -1px 1px #fff;
	background-size: 100% 70%;
	/* background-size: 110% 100%; */
	/* background-position: -.1rem -.05rem; */
	/* background-position: -1rem -.1rem; */
	position: relative;
	display: flex;
	justify-content: center;
}

/* 标题动图 */
.head .active-line {
	top: 5%;
	left: 50%;
	transform: translate(-50%, 20%);
	display: block;
	position: absolute;
	width: 32%;
	height: 100%;
	background: url(../images/header.gif) no-repeat center center;
	background-size: 100%;
}

/* 标题 */
.head h1 {
	color: #fff;
	text-align: center;
	font-size: 0.42rem;
	font-family: "阿里妈妈数黑体 Bold";
	line-height: .8rem;
}

.alltitle {
	padding: 5px 0 5px 3px;
	position: relative;
	color: #fff;
	font-size: .18rem;
	font-weight: bold;
	text-align: center;
	margin-bottom: 8px;
	font-family: "阿里妈妈数黑体 Bold";
	z-index: 1;
	margin-top: .2rem;
}

.alltitle::after {
	content: '';
	position: absolute;
    width: 35%;
	height: 140%;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	background-image: url(/浅边框/按钮背景_尖角选中_e4809856-dd2a-480e-9b6a-3e87f2c9c5e7.png);
	background-repeat: no-repeat;
	/* background-size: 100% 90%; */
	background-position: center;
	z-index: -1;
	transition: 0.2s;
}

@font-face {
	font-family: "阿里妈妈数黑体 Bold";
	font-weight: 700;
	src: url(/font/AlimamaShuHeiTi-Bold.ttf);
}

.shadow {
	border-bottom: 1px solid rgba(4, 164, 4, 0.661);
	box-shadow: 0px 2px 5px 0px #0a8723a3;
}


.chartLabel {
	width: 100px;
	height: 100px;
	background-color: #fff;
	background-color: #fff;
}


/* CSS Document */
* {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	/* 鼠标特效 */
	cursor: url(../images/pointer.png) 10 10, auto !important;
}

*,
body {
	padding: 0px;
	margin: 0px;
	/* color: #222; */
	font-family: "微软雅黑";
}

.main-content {
	width: 100vw;
	height: 100vh;
	position: relative;
}

#animations {
	position: absolute;
	width: 100vw;
	height: 100vh;
	overflow: hidden;
}

.animation {
	position: absolute;
}

.animation1 {
	left: 2rem;
	top: 2rem;
	transform: scale(0.3);
}

.animation3 {
	left: 17rem;
	top: 3rem;
	transform: scale(0.3);
}

.animation4 {
	left: 15rem;
	top: 6.2rem;
	transform: scale(.6);
}

.animation5 {
	left: .5rem;
	top: 5rem;
	transform: scale(.3);
}

.animation div {
	position: absolute;
	top: 0;
	left: 0;
	width: 618px;
	height: 618px;
	border-radius: 50%;
	animation: move linear infinite;
}

.animation .animate1 {
	background: url("../images/1.png") no-repeat;
	background-size: 100%;
	animation-duration: 30s;
}

.animation .animate2 {
	background: url("../images/2.png") no-repeat;
	background-size: 100%;
	animation-duration: 20s;
	animation-direction: reverse;
}

.animation .animate3 {
	background: url("../images/3.png") no-repeat;
	background-size: 100%;
	animation-duration: 15s;
}

.fanzhuan .animate1 {
	animation-direction: reverse;
	animation-duration: 25s;
}

.fanzhuan .animate2 {
	animation-direction: normal;
	animation-duration: 15s;
}

.fanzhuan .animate3 {
	animation-direction: reverse;
	animation-duration: 10s;
}

@keyframes move {
	0% {
		transform: rotate(0deg)
	}

	100% {
		transform: rotate(360deg)
	}
}








li {
	list-style-type: none;
}

@font-face {
	font-family: electronicFont;
	src: url(../font/DS-DIGIT.TTF)
}

/* 水波图 */
.execution {
	width: 100%;
	height: 80%;
	display: flex;
	position: relative;
}

/* .execution .title {
	position: absolute;
	top: .8rem;
	left: .38rem;
	width: .1rem;
	color: #75f1f5;
	font-size: .12rem;
}

.execution img {
	position: absolute;
	left: .03rem;
	top: .25rem;
	width: 5rem;
	height: 2.5rem;
} */
.liquidFill-box {
	flex: 1;
	padding-top: .1rem;
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	/* background-color: red; */
}

.execution .cicle1,
.execution .cicle2,
.execution .cicle3 {
	position: absolute;
	width: 1.2rem;
	height: 1.2rem;
	top: 0.75rem;
	left: -0.03rem;
	background: url(/images/ana03.png) no-repeat center;
	background-size: 80%;
	transform-style: preserve-3d;
	transform: rotateX(75deg);
	animation: rotate2 1s linear infinite;
	z-index: -1;
	/* background-color: red; */
}


.liquidFill-box .liquidFill {
	width: 1.1rem;
	height: 1.1rem;
}

.liquidFill-box .chart-title {
	/* color: #fff; */
	color: #000;
	text-align: center;
	font-size: .18rem;
	padding-bottom: .1rem;
}

@keyframes rotate2 {
	0% {
		transform: rotateX(75deg) rotateZ(0);
	}

	100% {
		transform: rotateX(75deg) rotateZ(360deg);
	}
}



i {
	margin: 0px;
	padding: 0px;
	text-indent: 0px;
}

img {
	border: none;
	max-width: 100%;
}

a {
	text-decoration: none;
	color: #399bff;
}

a.active,
a:focus {
	outline: none !important;
	text-decoration: none;
}

ol,
ul,
p,
h1,
h2,
h3,
h4,
h5,
h6 {
	padding: 0;
	margin: 0
}

a:hover {
	color: #06c;
	text-decoration: none !important
}


html,
body {
	height: 100%;
}

.clearfix:after,
.clearfix:before {
	display: table;
	content: " ";
}

.clearfix:after {
	clear: both;
}

.ylfw {
	height: 100%;
	margin-left: -5px;
	margin-right: -5px;
}

.ylfw li {
	width: 50%;
	height: 33.33333%;
	float: left;
	padding: 0 5px;
}

.ylfwbox {
	height: 85%;
	border: 1px solid #1070aa;
	padding: 10px 15px;
	position: relative;
}

.fora {
	position: relative;
}

.forb {
	position: absolute;
	width: 100%;
	left: 0;
	bottom: 0;
}


.fora:before,
.fora:after,
.forb:before,
.forb:after {
	position: absolute;
	content: "";
	width: 2px;
	height: 2px;
	border: 1px solid #00deff;
	opacity: .8;
	box-shadow: 0 0 5px #00deff;
}

.fora:before,
.forb:before {
	left: -2px;
	top: -2px;
}

.fora:after,
.forb:after {
	right: -2px;
	top: -2px;
}

.pulll_left {
	float: left;
	position: relative;
}

/* 顶部圈圈 */
/* .pulll_left:after {
	content: "";
	position: absolute;
	width: 50%;
	background: url(/绿色环形素材/分组\ 1\ \(1\).png) center center;
	background-repeat: no-repeat;
	background-size: contain;
	opacity: 1;
	height: 90%;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	z-index: -1;
	animation: pulllRound1 3s infinite linear;
} */

@keyframes pulllRound1 {
	100% {
		transform: translate(-50%, -50%) rotate(-360deg);
	}
}

@keyframes pulllRound2 {
	100% {
		transform: translate(-50%, -50%) rotate(-360deg);

	}
}

.pulll_left span,
.title {
	font-size: .22rem;
	color: #ffffff;
	text-shadow: 0 0 5px rgba(255, 255, 255, 0.8);
}

.pulll_right {
	float: right;
}



/*谷哥滚动条样式*/

::-webkit-scrollbar {
	width: 5px;
	height: 5px;
	position: absolute
}

::-webkit-scrollbar-thumb {
	background-color: #5bc0de
}

::-webkit-scrollbar-track {
	background-color: #ddd
}

/***/

.loading {
	position: fixed;
	left: 0;
	top: 0;
	font-size: .3rem;
	z-index: 100000000;
	width: 100%;
	height: 100%;
	background: #1a1a1c;
	text-align: center;
}

.loadbox {
	position: absolute;
	width: 160px;
	height: 150px;
	color: #324e93;
	left: 50%;
	top: 50%;
	margin-top: -100px;
	margin-left: -75px;
}

.loadbox img {
	margin: 10px auto;
	display: block;
	width: 40px;
}

.copyright {
	line-height: .5rem;
	text-align: center;
	padding-right: 15px;
	bottom: 0;
	color: rgba(255, 255, 255, .5);
	font-size: .12rem;
	position: absolute;
	left: 0;
	width: 100%;
}



.head h1 img {
	width: 1.5rem;
	display: inline-block;
	vertical-align: middle;
}

/* 天气 */
.weather {
	position: absolute;
	left: 1.15rem;
	top: .33rem;
	line-height: .75rem;
	color: rgba(255, 255, 255, .7);
	font-size: .24rem;
	padding-right: .1rem;
	font-family: electronicFont;
}

/* 无效 */
#mobile280 .box .wtline {
	font-family: electronicFont;
}

/* 时间 */
.time {
	position: absolute;
	/* right: 2.3rem; */
	right: 1.3rem;
	top: .4rem;
	line-height: .75rem;
	color: #dcff18;
	font-size: .3rem;
	padding-right: .1rem;
	font-family: electronicFont;
}

.mainbox {
	padding: 0 .1rem 0rem .1rem;
	height: calc(100% - 1.5rem);
}

.mainbox>ul {
	margin-left: -.1rem;
	margin-right: -.1rem;
	height: 100%;
	display: flex;
}

.mainbox>ul>li {
	padding: 0 .1rem;
	height: 100%;
}

.mainbox>ul>li:nth-child(1) {
	flex: 3;
}

.mainbox>ul>li:nth-child(2) {
	flex: 4;
}

.mainbox>ul>li:nth-child(3) {
	flex: 3;
}

.mainbox2 {
	padding: 0 .1rem .1rem .1rem;
	height: calc(28% - .1rem)
}

.mainbox2>ul {
	display: flex;
	margin-left: -.1rem;
	margin-right: -.1rem;
	height: 100%
}

.mainbox2>ul>li {
	padding: 0 .1rem;
	height: 100%;
	width: 40%;
}

/* 左下 */
.mainbox2 .data-label {
	display: flex;
	font-size: .18rem;
	padding: 8px 0;
	cursor: pointer;
	color: #fff;
}

.data-label li {
	flex: 1;
	padding: 5px 0;
	text-align: center;
	font-size: .13rem;
}

.data-label li:hover,
.data-label .active {
	color: #00E2E6;
	background: url("../images/choose-item.png") center no-repeat;
	background-size: contain;
}








/*左下角表格*/
.biaoge {
	/* min-height: 130px; */
}

.biaoge_list {
	overflow: hidden;
	position: relative;
}

.biaoge_list .biaoge_listIn .ul_list {
	overflow: hidden;
	position: relative;
}

.biaoge_list .biaoge_listIn .ul_listIn {
	-webkit-animation: 14s gundong linear infinite normal;
	animation: 14s gundong linear infinite normal;
	position: relative;
}

@keyframes gundong {
	0% {
		-webkit-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0);
	}

	100% {
		-webkit-transform: translate3d(0, -30vh, 0);
		transform: translate3d(0, -17vh, 0);
	}
}

.biaoge_list ul {
	display: flex;
	display: -webkit-flex;
	width: 100%;
	height: 23px;
	align-items: center;
}

.biaoge_list .ul_title {
	background: linear-gradient(left, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0.1));
	background: -ms-linear-gradient(left, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0.1));
	background: -webkit-linear-gradient(left, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0.1));
	background: -moz-linear-gradient(left, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0.1));
}

.biaoge_list .ul_con {
	border-bottom: 0.008rem solid rgba(14, 253, 255, 0.5);
}

.biaoge_list ul li {
	width: 20%;
	text-align: center;
	/* color: #fff; */
	font-size: 0.15rem;
	height: 0.2rem;
	line-height: 0.2rem;
}

.biaoge_list ul li:first-child {
	text-align: left;
}

/* 转圈圈 */
.yqlist li {
	float: left;
	width: 50% !important;
	padding: 10px 0;
	text-align: center;
}

.yq {
	width: 80px;
	height: 80px;
	margin: 0 auto 5px auto;
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 24px;
	font-family: electronicFont;
	color: #fff32b;
}

.yqlist li span {
	opacity: .6;
	font-size: 18px;
}

.yq:before {
	position: absolute;
	width: 100%;
	height: 100%;
	content: "";
	background: url(../images/img1.png) center center;
	border-radius: 100px;
	background-size: 100% 100%;
	opacity: .3;
	left: 0;
	top: 0;
	animation: myfirst2 15s infinite linear;
}

.yq:after {
	position: absolute;
	width: 86%;
	background: url(../images/img2.png) center center;
	border-radius: 100px;
	background-size: 100% 100%;
	opacity: .3;
	height: 86%;
	content: "";
	left: 7%;
	top: 7%;
	animation: myfirst 15s infinite linear;
}


@keyframes myfirst {
	to {
		transform: rotate(-360deg)
	}
}

@keyframes myfirst2 {
	to {
		transform: rotate(360deg)
	}
}

/* 园区概况 */
.sycm.center-intro ul {
	justify-content: space-between;
}

.sycm.center-intro li {
	width: 30% !important;
}

.ylfw {
	height: 100%;
	margin-left: -5px;
	margin-right: -5px;
}

.ylfw li {
	width: 50%;
	height: 33.33333%;
	float: left;
	padding: 0 5px;
}

.ylfwbox {
	height: 85%;
	border: 1px solid #1070aa;
	padding: 10px 15px;
	position: relative;
}

.fora {
	position: relative;
}

.forb {
	position: absolute;
	width: 100%;
	left: 0;
	bottom: 0;
}

.fora:before,
.fora:after,
.forb:before,
.forb:after {
	position: absolute;
	content: "";
	width: 2px;
	height: 2px;
	border: 1px solid #00deff;
	opacity: .8;
	box-shadow: 0 0 5px #00deff;
}

.fora:before,
.forb:before {
	left: -2px;
	top: -2px;
}

.fora:after,
.forb:after {
	right: -2px;
	top: -2px;
}


.ylfwbox p {
	font-size: 13px;
	/* color: #fff; */
}

.ylfwbox ol {}

.ylfwbox ol i {
	font-size: 12px;
}

.ylfwbox ol em {
	/* color: #fff; */
	font-size: 14px;
	font-style: normal;
	padding: 0 5px;
}

.ylfwbox ol span {
	font-size: 24px !important;
	color: #00deff !important;
	text-shadow: 0 0 5px #00deff;
	font-family: electronicFont;
	opacity: 1 !important;
}

.tit {
	margin: 0 3%;
	color: #00E2E6;
	display: flex;
	font-size: .18rem;
	padding-bottom: 8px;
	position: relative;
}

.tit::after {
	content: '';
	position: absolute;
	left: 0;
	bottom: -1px;
	width: 100%;
	height: .1rem;
	background-image: url(/浅边框/底线.png);
	background-repeat: no-repeat;
	background-size: contain;
}

.tit span {
	text-align: center;
	font-weight: bold;
}

.tit span:nth-child(1) {
	flex: 0.8;
}
.tit span:nth-child(2) {
	flex: 2.2;
}
.tit span:nth-child(3) {
	flex: 1;
}

.trainInfoBox {
	overflow-y: auto;
	height: 100%;
	position: relative;
	scrollbar-width: none;
	-ms-overflow-style: none;
}

.trainInfoBox::-webkit-scrollbar {
	display: none;
}

.trainInfo {
	position: relative;
	width: 100%;
}

/* 培训信息汇总 */
.videoBox {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	overflow: hidden;
	display: none;
	z-index: 9;
}

.videoBox video {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	/* animation: videoBox 3s linear; */
	/* animation: PackUp 3s linear; */
}

@keyframes videoBox {
	0% {
		display: none;
		transform: translateX(50%);
	}


	100% {
		display: block;
		opacity: 1;
		transform: translateX(-50%);
	}
}

@keyframes PackUp {
	0% {
		transform: translateX(-50%);
	}

	100% {
		transform: translateX(50%);
		display: none;
	}
}

.con {
	display: flex;
	flex-direction: column;
	/* color: #000; */
	margin: 0 15px;
}

.con li {
	height: .26rem;
	line-height: .26rem;
}

.con .hot {
	color: #fff;
	text-align: center;
	padding-left: .2rem;
}

.con li .book-rank {
	display: flex;
	justify-content: space-between;
	font-size: .14rem;
	padding: 0 .2rem;
}

.book-rank .short {
	/* padding-left: .2rem; */
}

.book-rank .short {
	padding-left: 30px;
	flex: 1;
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;
}

.pressRotate {
	animation: mymove .5s ease-in;
}

@keyframes mymove {
	0% {
		transform: rotateX(0deg)
	}

	100% {
		transform: rotateX(360deg)
	}
}




.boxall ul p {
	font-size: .18rem;
}

.boxall {
	font-size: .18rem !important;
}


.introduce .alltitle {
	background: initial;
	/* background-color: red; */
	background-image: url(/浅边框/animate.gif);
	background-repeat: no-repeat;
	background-size: 45% 120%;
	background-position: 3.5rem -.05rem;
	z-index: 0;
	padding: 5px 0;
	display: flex;
	justify-content: center;
}

.introduce .title-content {
	width: 3.8rem;
	height: .4rem;
	margin: auto;
	background-image: url(../浅边框/按钮背景_尖角未选中_452223eb-2a54-4569-bf59-6aa28b4b2a09.png);
	background-repeat: no-repeat;
	background-size: 100% 90%;
	background-position: center;
	display: flex;
	position: relative;
	top: .3rem;
}

.develop-content {
	height: 1.9rem;
	overflow: auto;
	margin: .35rem .1rem .05rem;
}

.develop-text {
	color: #fff;
	/* text-shadow: 3px 4px 3px #0a47066b; */
	/* padding: .3rem .1rem .05rem; */
	font-size: .18rem;
	/* font-family: "阿里妈妈数黑体 Bold"; */

}

.infoData {
	display: flex;
	justify-content: space-between;
	padding: 0 .3rem;
	font-size: .18rem;
	color: #00ffec;
	font-weight: 700;
	font-family: "阿里妈妈数黑体 Bold" !important;
}

.introduce .bg-active {
	position: absolute;
	left: 0;
	top: 0;
	width: 50%;
	height: 100%;
	background-image: url(/浅边框/按钮背景_尖角选中_e4809856-dd2a-480e-9b6a-3e87f2c9c5e7.png);
	background-repeat: no-repeat;
	background-size: 100% 90%;
	background-position: center;
	z-index: -1;
	transition: 0.2s;
}

.introduce .title-content .intro-tit {
	flex: 1;
	font-size: .18rem;
	line-height: .4rem;
	text-align: center;
	z-index: 9;
	color: #fff;
	font-family: "阿里妈妈数黑体 Bold";
}

.boxall .remark {
	font-size: 11px;
	font-family: 'electronicFont';
	padding: 5px 5px;
	background-image: url('./../images/main_middle.png');
	background-size: 100% 100%;
	background-repeat: no-repeat;
}

.boxall .remark .number {
	color: #00FEE9;
	font-family: 'electronicFont';
	font-size: .3rem;
	font-weight: 600;
}

.boxall .remark .unit {
	color: #00FEE9;
}

.boxnav {
	height: calc(100% - .3rem);
}


@keyframes scrollText1 {
	0% {
		transform: translateY(0px);
	}

	20% {
		transform: translateY(-20%);
	}

	40% {
		transform: translateY(-40%);
	}

	60% {
		transform: translateY(-60%);
	}

	80% {
		transform: translateY(-80%);
	}

	100% {
		transform: translateY(-100%);
	}
}

/* 左下获奖信息css */
/* .outlineBorder ul li:nth-child(2n) {
	color: #13d3e4;
}

.outlineBorder ul li:nth-child(2n+1) {
	color: #970dd2;
} */

.outlineBorder ul {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.outlineBorder ul li {
	width: 3.2rem;
	height: .2rem;
	/* font-size: .15rem !important; */
	white-space: nowrap;
	/* 强制文本不换行 */
	overflow: hidden;
	/* 超出部分隐藏 */
	text-overflow: ellipsis;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 16px 0;
	margin-bottom: 5px;
	box-sizing: border-box;
	color: #00E2E6;
}

/* 
.outlineBorder ul li .title{
	color: #0026ff;

} */


.outlineBorder {
	position: relative;
	width: 100%;
	overflow: hidden;
	/* height: 400px; */
	/* font-size: 14px; */
}

.window-scroll {
	height: 1.7rem;
	overflow: hidden;
}

.window-scroll {
	height: 1.7rem;
	overflow: hidden;
}

.barnav {
	position: absolute;
	width: 100%;
	z-index: 100;
}

.bar {
	/* background: rgba(101, 132, 226, .2); */
	border-radius: 10px;
	padding: .15rem;
	display: flex;
	flex-direction: column;
	gap: 15px;
}

.barbox {
	height: .9rem;
}

.pulll_left {
	background-size: 100% 100%;
	z-index: 1;
}

#clearfix1,
#clearfix2 {
	height: 100%;
	display: flex;
	gap: 10px;
	position: relative;
}

.barbox li {
	flex: 1;
	text-align: center;
	position: relative;
	font-size: .5rem;
	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
	font-weight: bold;
	font-family: electronicFont;
	/* color: #167d30; */
	/* color: #00E2E6; */
	color: #ffdb5c;
	text-shadow: 0 0 5px rgba(255, 219, 92, 0.8);
	/* background-image: url(/浅边框/Group1.png);*/
}

.boxall.b1 .number {
	font-size: .2rem;
	padding: .05rem 0;
	font-weight: bold;
	font-family: electronicFont;
}

.barbox2 {
	display: flex;
	flex-wrap: wrap;

}

.barbox2 li {
	width: 33.33333%;
	text-align: center;
	position: relative;
	font-size: .19rem;
}

.mapbox {
	height: calc(100%);
	overflow: hidden;
}

.map {
	position: relative;
	height: 100%;
	z-index: 9;
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	padding-top: 0.8rem;
}

.map4 {
	width: 12rem;
	z-index: 9;
	height: 12rem;
	transform: translate(0, -1rem) rotate(0deg); 
	animation: 5s moveMap linear infinite;
}

@keyframes moveMap {
	0% {
		transform: translate(0, -1rem) rotate(0deg);
		/* transform: translateY(-10px); */
	}

	50% {
		transform: translate(0, -0.9rem) rotate(0deg);
		/* transform: translateY(0); */
	}

	100% {
		transform: translate(0, -1rem) rotate(0deg);
		/* transform: translateY(-10px); */
	}
}

.mapTitle {
	width: 2rem;
	height: 2.6rem;
	right: 0rem;
	bottom: 0.05rem;
	z-index: 9;
	border-radius: .2rem;
	padding: .2rem;
	box-sizing: border-box;
	background-image: url(/浅边框/指标卡背景_层叠发光圈_08d2c9d3-2168-421b-a39a-a7143d3c4bc9.png);
	background-repeat: no-repeat;
	background-size: 105% 55%;
	background-position: center 1.2rem;
	/* background-image: url(/浅边框/分组\ 531.png); */
	/* background-size: 150% 65%; */
	background-position: center 1.2rem;
	position: relative;
	animation: suspension 2s infinite ease-in-out;
	animation-direction: alternate;

}

@keyframes suspension {
	0% {
		transform: translateY(10px);

	}

	100% {
		transform: translateY(-10px);

	}
}


.mapTitle .map-phs {
	position: absolute;
	left: .3rem;
	bottom: .9rem;
	color: #fff;
}

.mapTitle p:nth-child(1) {
	font-size: .2rem;
	font-weight: bolder;
}

.mapTitle p:nth-child(n+2) {
	font-size: .18rem;
	line-height: .3rem;
}

.map1 {
	width: 6.43rem;
	z-index: 2;
	/* top: 0.2rem; */
	animation: myfirst2 15s infinite linear;
}

.map2 {
	width: 5.66rem;
	z-index: 3;
	opacity: 0.2;
	animation: myfirst 10s infinite linear;
}

.map3 {
	width: 5.18rem;
	z-index: 1;
	transform: scale(.8);
	opacity: .6
}

.map1,
.map2,
.map3,
.map4,
.mapTitle {
	position: absolute;
}




/*水波纹*/
@-webkit-keyframes opac {
	from {
		opacity: 1;
		width: 0;
		height: 0;
		top: 50%;
		left: 50%;
	}

	to {
		opacity: 0;
		width: 100%;
		height: 50%;
		bottom: 50%;
		left: 0;
	}
}

.animateCirle #q1 {
	-webkit-animation-delay: 0s;
}

.animateCirle #q2 {
	-webkit-animation-delay: 1s;
}

.animateCirle #q3 {
	-webkit-animation-delay: 2s;
}

.animateCirle #q4 {
	-webkit-animation-delay: 3s;
}

.animateCirle #q5 {
	-webkit-animation-delay: 4s;
}

.animateCirle #q6 {
	-webkit-animation-delay: 5s;
}

.wave {
	width: 100%;
	height: 80%;
	position: absolute;
	bottom: 0px;
	left: 0px;
	right: 0;
}

.wave * {
	position: absolute;
	-webkit-animation: opac 5s infinite;
	opacity: 0;
}

















/* 招聘信息 */
.wrap-job {
	overflow-y: auto;
	padding: 0 10px;
	/* color: #000; */
	scrollbar-width: none;
	-ms-overflow-style: none;
}

.wrap-job::-webkit-scrollbar {
	display: none;
}

.wrap-job ul {
	display: flex;
	flex-direction: column;
}

/* 店铺分组项样式 - 科技感 */
.group-item {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 8px 10px;
	margin-bottom: 6px;
	background: linear-gradient(135deg, rgba(0, 150, 255, 0.15) 0%, rgba(0, 200, 255, 0.05) 100%);
	border: 1px solid rgba(0, 180, 255, 0.3);
	border-radius: 8px;
	transition: all 0.3s ease;
	cursor: pointer;
	position: relative;
	overflow: hidden;
	min-height: 38px;
	gap: 6px;
}

.group-item::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 2px;
	background: linear-gradient(90deg, transparent, #00b4ff, #00ffd5, #00b4ff, transparent);
	animation: scanLine 3s linear infinite;
}

@keyframes scanLine {
	0% { opacity: 0; }
	50% { opacity: 1; }
	100% { opacity: 0; }
}

.group-item::after {
	content: '';
	position: absolute;
	inset: 0;
	border-radius: 8px;
	padding: 1px;
	background: linear-gradient(135deg, transparent 40%, rgba(0, 180, 255, 0.5), transparent 60%);
	-webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
	-webkit-mask-composite: xor;
	mask-composite: exclude;
	pointer-events: none;
	opacity: 0;
	transition: opacity 0.3s;
}

.group-item:hover::after {
	opacity: 1;
	animation: borderMove 2s linear infinite;
}

@keyframes borderMove {
	0% { background-position: 0% 0%; }
	100% { background-position: 200% 0%; }
}

.group-item:hover {
	border-color: rgba(0, 180, 255, 0.6);
	box-shadow: 0 0 20px rgba(0, 180, 255, 0.3), inset 0 0 20px rgba(0, 180, 255, 0.1);
	transform: translateY(-3px);
}

.group-item.expanded {
	border-color: rgba(0, 180, 255, 0.8);
	background: linear-gradient(135deg, rgba(0, 150, 255, 0.2) 0%, rgba(0, 200, 255, 0.1) 100%);
	box-shadow: 0 0 25px rgba(0, 180, 255, 0.4), inset 0 0 30px rgba(0, 180, 255, 0.15);
}

.group-name {
	flex: 1.5;
	font-weight: bold;
	font-size: 13px;
	color: #fff;
	text-shadow: 0 0 10px rgba(0, 180, 255, 0.5);
	letter-spacing: 1px;
	display: flex;
	align-items: center;
	min-width: 0;
}

.group-sales {
	flex: 1;
	text-align: center;
	font-size: 12px;
	color: #00ffd5;
	font-weight: bold;
	font-family: 'Courier New', monospace;
	text-shadow: 0 0 8px rgba(0, 255, 213, 0.5);
	display: flex;
	align-items: center;
	justify-content: center;
	min-width: 0;
}

.group-stores {
	flex: 0.8;
	text-align: center;
	font-size: 11px;
	color: #00b4ff;
	font-weight: 500;
	display: flex;
	align-items: center;
	justify-content: center;
	min-width: 0;
}

.group-toggle {
	flex: 0 0 auto;
	width: 40px;
	display: flex;
	justify-content: center;
	align-items: center;
}

.toggle-icon {
	width: 20px;
	height: 20px;
	fill: #0ac1c7;
	transition: transform 0.3s ease;
	filter: drop-shadow(0 0 4px rgba(10, 193, 199, 0.5));
	transform: translateY(5px);
}

.group-item.expanded .toggle-icon {
	transform: translateY(5px) rotate(180deg);
}

.group-item:hover .toggle-icon {
	fill: #00ffd5;
	filter: drop-shadow(0 0 8px rgba(0, 255, 213, 0.8));
	transform: translateY(5px);
}

/* 店铺分组店铺项样式 - 科技感 */
.group-store-item {
	display: flex;
	align-items: center;
	padding: 6px 10px;
	background: rgba(0, 50, 100, 0.3);
	border-bottom: 1px solid rgba(0, 180, 255, 0.2);
	transition: all 0.3s ease;
	position: relative;
	min-height: 32px;
}

.group-store-item:hover {
	background: rgba(0, 100, 150, 0.35);
}

.store-rank-tech {
	width: 50px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 11px;
	font-weight: bold;
	color: #0ac1c7;
	margin-right: 8px;
	text-align: center;
	letter-spacing: 1px;
	text-shadow: 0 0 5px rgba(10, 193, 199, 0.5);
	flex-shrink: 0;
}

/* 前三名统一金色高亮 - 字体颜色变金色 */
.highlight-gold .book-rank {
    color: #ffd700;
}

.highlight-gold .book-rank .short,
.highlight-gold .book-rank .hot {
    color: #ffd700;
}

.top-rank.rank-gold {
	font-size: 12px;
	font-weight: 700;
	background: linear-gradient(135deg, #ffd700 0%, #ffb700 50%, #ffd700 100%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text;
	text-shadow: none;
	font-family: "微软雅黑", "Microsoft YaHei", sans-serif;
	letter-spacing: 1px;
	display: flex;
	align-items: baseline;
}

.top-rank.rank-gold .rank-num {
	font-size: 14px;
	font-weight: 900;
	background: linear-gradient(135deg, #ffd700 0%, #ffb700 50%, #ffd700 100%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text;
	filter: drop-shadow(0 0 6px rgba(255, 215, 0, 0.8));
	font-family: "微软雅黑", "Microsoft YaHei", sans-serif;
	letter-spacing: 1px;
	margin-left: 2px;
	line-height: 1;
}

/* TOP3及之后的样式 - 蓝绿色 */
.top-rank:not(.rank-gold) {
	font-size: 11px;
	font-weight: 700;
	background: linear-gradient(135deg, #00b4ff 0%, #0088ff 50%, #00b4ff 100%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text;
	text-shadow: none;
	font-family: "微软雅黑", "Microsoft YaHei", sans-serif;
	letter-spacing: 1px;
	display: flex;
	align-items: baseline;
}

.top-rank:not(.rank-gold) .rank-num {
	font-size: 14px;
	font-weight: 900;
	background: linear-gradient(135deg, #00b4ff 0%, #0088ff 50%, #00b4ff 100%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text;
	filter: drop-shadow(0 0 5px rgba(0, 136, 255, 0.6));
	font-family: "微软雅黑", "Microsoft YaHei", sans-serif;
	letter-spacing: 1px;
	margin-left: 2px;
	line-height: 1;
}

/* 金色脉冲动画 */
@keyframes gold-pulse {
	0%, 100% {
		filter: drop-shadow(0 0 8px rgba(255, 215, 0, 0.7)) 
		          drop-shadow(0 0 15px rgba(255, 183, 0, 0.5));
	}
	50% {
		filter: drop-shadow(0 0 12px rgba(255, 215, 0, 1)) 
		          drop-shadow(0 0 20px rgba(255, 183, 0, 0.8));
	}
}

.store-name-tech {
	flex: 1;
	color: #e0e0e0;
	font-size: 12px;
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;
	font-weight: 500;
	display: flex;
	align-items: center;
}

.store-sales-tech {
	font-size: 12px;
	color: #ffffff;
	white-space: nowrap;
	font-weight: bold;
	font-family: 'Courier New', monospace;
	text-shadow: 0 0 8px rgba(255, 255, 255, 0.4);
	display: flex;
	align-items: center;
}

/* 渠道信息前三名店铺名称和销售额变黄色 */
.top3-name {
	color: #ffd700 !important;
	text-shadow: 0 0 8px rgba(255, 215, 0, 0.6) !important;
}
.top3-sales {
	color: #ffd700 !important;
	text-shadow: 0 0 8px rgba(255, 215, 0, 0.6) !important;
}

/* 渠道列表 */
.wrap-channel {
	overflow-y: auto;
	padding: 0 10px;
	height: calc(100% - .3rem);
	scrollbar-width: none;
	-ms-overflow-style: none;
}

.wrap-channel::-webkit-scrollbar {
	display: none;
}

.wrap-channel ul {
	display: flex;
	flex-direction: column;
}

/* 渠道项样式 */
.channel-item {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 8px 12px;
	margin-bottom: 6px;
	background: linear-gradient(135deg, rgba(10, 193, 199, 0.1) 0%, rgba(10, 193, 199, 0.05) 100%);
	border: 1px solid rgba(10, 193, 199, 0.2);
	border-radius: 6px;
	transition: all 0.3s ease;
	cursor: pointer;
	position: relative;
	overflow: hidden;
}

.channel-item::before {
	content: '';
	position: absolute;
	top: 0;
	left: -100%;
	width: 100%;
	height: 100%;
	background: linear-gradient(90deg, transparent, rgba(10, 193, 199, 0.1), transparent);
	transition: left 0.5s ease;
}

.channel-item:hover::before {
	left: 100%;
}

.channel-item:hover {
	border-color: rgba(10, 193, 199, 0.5);
	box-shadow: 0 0 15px rgba(10, 193, 199, 0.2);
	transform: translateY(-2px);
}

.channel-item.expanded {
	border-color: rgba(10, 193, 199, 0.6);
	background: linear-gradient(135deg, rgba(10, 193, 199, 0.15) 0%, rgba(10, 193, 199, 0.08) 100%);
}

.channel-name {
	flex: 2;
	font-weight: bold;
	font-size: 14px;
	color: #fff;
	text-shadow: 0 0 5px rgba(10, 193, 199, 0.3);
}

.channel-sales {
	flex: 1.5;
	text-align: center;
	font-size: 12px;
	color: #ffdb5c;
	font-weight: bold;
}

.channel-stores {
	flex: 1.2;
	text-align: center;
	font-size: 11px;
	color: #0ac1c7;
}

.channel-toggle {
	flex: 0.8;
	display: flex;
	justify-content: flex-end;
	align-items: center;
}

.channel-toggle-icon {
	width: 20px;
	height: 20px;
	fill: #0ac1c7;
	transition: transform 0.3s ease;
	filter: drop-shadow(0 0 4px rgba(10, 193, 199, 0.5));
}

.channel-item.expanded .channel-toggle-icon {
	transform: rotate(180deg);
}

.channel-item:hover .channel-toggle-icon {
	fill: #00ffd5;
	filter: drop-shadow(0 0 8px rgba(0, 255, 213, 0.8));
}



.wrap-job ul {
	display: flex;
	flex-direction: column;
	/* background: #28dfdf82; */
}


.wrap-job li {
	line-height: .42rem;
	height: .45rem;
	/* font-size: .16rem; */
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	padding: 0 8px;
	box-sizing: border-box;
	font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
	position: relative;
	border: 2px solid transparent;

}




.wrap-job li:nth-child(2n) {
	/* background-image: url('../images/main_middle.png'); */
	background-size: 101% 101%;
	background-position: -2px 0;
	background-repeat: no-repeat;
	background-color: rgba(76, 242, 242, 0.32);
	border: 2px solid rgba(76, 242, 242, 0.48);
	box-shadow: 0 0 10px 0 rgba(102, 188, 241, 0.21);
}

.wrap-job li span:last-child {
	color: #fff;

}

.wrap-job li span:nth-child(2n+1) {
	font-weight: bold;

}
.wrap-job li span:last-child {
	font-weight: normal;

}

.wrap-job li p {
	border: 1px solid rgba(25, 186, 139, .17);
	color: #fff;
}



.wrap {
	height: 89% !important;
	padding: 5px 10px;
	overflow-y: auto;
	scrollbar-width: none;
	-ms-overflow-style: none;
}

.wrap::-webkit-scrollbar {
	display: none;
}

.wrap ul {
	display: flex;
	flex-direction: column;
}

.wrap li {
	width: 100% !important;
	height: .4rem;
	color: #fff;
	font-size: 12px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 8px 10px;
	margin-bottom: .07rem;
}

.wrap li:nth-child(2n) {
	background-color: #05cdff33;
}

.wrap li p {
	display: flex;
	align-items: center;
	/* height: 80%; */
}

.wrap li p span {
	color: rgba(255, 255, 255, .6);
	text-align: center;
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;
	width: 20%;
	font-size: .16rem;
}

.wrap li p span:first-child {
	width: 40%;
	text-align: left;
}

.sycm ul {
	padding: .16rem 0;
	width: 100%;
	display: flex;
	justify-content: space-evenly;
}

.sycm li {
	float: left;
	width: 25%;
	text-align: center;
	position: relative
}


.sycm {
	height: 80%;
	display: flex;
	align-items: center
}

.sycm li:last-child:before,
.sycm2 li:nth-child(3):before {
	width: 0;
}

.sycm li h2 {
	font-size: .3rem;
	color: #46b8ff;
	padding-bottom: .1rem;
}

.sycm li span {
	font-size: 10px;
	color: #fff;
	opacity: .5;
}

.sycm2 {}

.sycm2 li {
	width: 33.3333%;
	padding: 10px 0;
	height: 100%;
}

.sycm2 li h2 {
	color: #2ad08a;
	font-size: 16px;
}

.btbox {
	height: 100%
}

.btbox li {
	height: 100%;
	float: left;
	width: 25%;
	padding-left: 5%;
}

@keyframes myfirst2 {
	from {
		transform: rotate(0deg) scale(.8);
	}

	to {
		transform: rotate(359deg) scale(.8);
	}
}

@keyframes myfirst {
	from {
		transform: rotate(0deg) scale(.8);
	}

	to {
		transform: rotate(-359deg) scale(.8);
	}
}


/*Plugin CSS*/
.str_wrap {
	overflow: hidden;
	width: 100%;
	position: relative;
	-moz-user-select: none;
	-khtml-user-select: none;
	user-select: none;
	white-space: nowrap;
}


.str_move {
	white-space: nowrap;
	position: absolute;
	top: 0;
	left: 0;
	cursor: move;
}

.str_move_clone {
	display: inline-block;
	vertical-align: top;
	position: absolute;
	left: 100%;
	top: 0;
}

.str_vertical .str_move_clone {
	left: 0;
	top: 100%;
}

.str_down .str_move_clone {
	left: 0;
	bottom: 100%;
}

.str_vertical .str_move,
.str_down .str_move {
	white-space: normal;
	width: 100%;
}

.str_static .str_move,
.no_drag .str_move,
.noStop .str_move {
	cursor: inherit;
}

.str_wrap img {
	max-width: none !important;
}


.alltitle .pulll_right a {
	color: #fff;
}

.alltitle .pulll_right a span {
	display: inline-block;
	background: #58c485;
	width: .16rem;
	height: .16rem;
	vertical-align: middle;
	border-radius: 50%;
	margin: 0 .05rem 0 .1rem;
}

.alltitle .pulll_right a:nth-child(2) span {
	background: #ea7231;
}

.alltitle .sebtn a {
	opacity: .6;
	display: inline-block;
	padding: 0 .1rem
}

.alltitle .sebtn a.active {
	opacity: 1
}


/* 政策扶持 */
.policy ul li {
	cursor: pointer;
}

.policy ul li .rank {
	display: inline-block;
	width: auto;
	height: auto;
	line-height: 1;
	text-align: center;
	color: #0ac1c7;
	font-family: 'Orbitron', 'Rajdhani', 'electronicFont', sans-serif;
	font-weight: bold;
	margin-right: 8px;
	font-size: 25px;
	text-shadow: 0 0 10px rgba(10, 193, 199, 0.8);
}

.policy ul li .title {
	color: #fff;
	/* font-weight: bold; */
}

/* --- 赛博切角序号样式 --- */
        .tech-num-1 {
            position: relative;
            width: 50px;
            height: 50px;
            /* 半透明渐变背景 */
            background: linear-gradient(135deg, rgba(0, 210, 255, 0.1), rgba(0, 210, 255, 0));
            /* 左上边框 */
            border-left: 2px solid #00d2ff;
            border-top: 2px solid #00d2ff;
            /* 内容居中 */
            display: flex;
            align-items: center;
            justify-content: center;
            /* 字体样式 */
            font-size: 24px;
            font-weight: bold;
            color: #00d2ff;
            font-family: 'Impact', sans-serif;
            /* 文字发光 */
            text-shadow: 0 0 10px rgba(0, 210, 255, 0.5);
        }

        /* 右下角装饰角 */
        .tech-num-1::after {
            content: '';
            position: absolute;
            bottom: 0;
            right: 0;
            width: 15px;
            height: 15px;
            border-bottom: 2px solid #00d2ff;
            border-right: 2px solid #00d2ff;
            transition: all 0.3s ease; /* 增加过渡动画 */
        }

        /* 悬停效果：右下角填满 */
        .tech-num-1:hover::after {
            width: 100%;
            height: 100%;
            background: rgba(0, 210, 255, 0.2);
        }

/* 中间栏位整体自然衔接样式 */
.boxall-center {
    background: rgba(255, 255, 255, .04) url(../images/line.png);
    background-size: 100% 100%;
    background-repeat: no-repeat;
    background-position: center;
    position: relative;
    margin-bottom: .15rem;
    box-sizing: border-box;
    padding: 0 .2rem .5rem .2rem;
}

/* 汇总金额+曲线图区域 */
.center-summary {
    height: auto;
    position: relative;
}

.center-barnav {
    position: relative;
    width: 100%;
    z-index: 100;
}

.center-barnav .bar {
    border-radius: 10px;
    padding: .15rem;
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.center-barnav .barbox {
    height: .9rem;
}

.center-chart {
    width: 100%;
    height: calc(100% - 2rem);
    min-height: 120px;
}

/* 运营排名区域 */
.center-tit {
    margin: 0 3%;
    color: #00E2E6;
    display: flex;
    font-size: .16rem;
    padding-bottom: 8px;
    position: relative;
}

.center-tit span {
    text-align: center;
    font-weight: bold;
}

.center-tit span:nth-child(1) {
    flex: 0.8;
}
.center-tit span:nth-child(2) {
    flex: 1.5;
}
.center-tit span:nth-child(3) {
    flex: 1.5;
}
.center-tit span:nth-child(4) {
    flex: 1.5;
}

.center-rank-box {
    overflow-y: auto;
    height: calc(100% - .5rem);
    position: relative;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.center-rank-box::-webkit-scrollbar {
    display: none;
}

.center-rank-list {
    display: flex;
    flex-direction: column;
    margin: 0 15px;
}

.center-rank-list li {
    height: .3rem;
    line-height: .3rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 6px 10px;
    margin-bottom: 4px;
    background: rgba(0, 50, 100, 0.3);
    border: 1px solid rgba(0, 180, 255, 0.2);
    border-radius: 6px;
    transition: all 0.3s ease;
    cursor: pointer;
}

.center-rank-list li:hover {
    background: rgba(0, 100, 150, 0.35);
    border-color: rgba(0, 180, 255, 0.5);
    box-shadow: 0 0 15px rgba(0, 180, 255, 0.2);
}

.center-rank-list .rank-num {
    flex: 0.8;
    text-align: center;
    font-weight: bold;
    font-size: 14px;
}

.center-rank-list .rank-name {
    flex: 1.5;
    text-align: center;
    color: #fff;
    font-size: 13px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.center-rank-list .rank-lastMonth {
    flex: 1.5;
    text-align: center;
    color: #00ffd5;
    font-size: 12px;
    font-weight: bold;
    font-family: 'Courier New', monospace;
}

.center-rank-list .rank-current {
    flex: 1.5;
    text-align: center;
    color: #ffdb5c;
    font-size: 12px;
    font-weight: bold;
    font-family: 'Courier New', monospace;
}

.rank-toggle {
    flex: 0.5;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.toggle-icon.rotated {
    transform: translateY(5px) rotate(180deg);
}

/* 运营排名展开详情样式 */
.rank-detail {
    display: none;
    padding: 10px;
    background: rgba(0, 30, 60, 0.5);
    border-radius: 4px;
    margin-top: 4px;
    height: auto;
    line-height: normal;
    cursor: default;
    align-items: initial;
    justify-content: initial;
}

.rank-detail.show {
    display: block;
}

.rank-detail-item {
    display: flex;
    justify-content: space-between;
    padding: 4px 8px;
    font-size: 11px;
    color: #ccc;
}

.rank-detail-item span:first-child {
    color: #0ac1c7;
}

/* TOP运营金色高亮 */
.center-rank-list li:nth-child(1) .rank-num,
.center-rank-list li:nth-child(2) .rank-num,
.center-rank-list li:nth-child(3) .rank-num {
    color: #ffd700;
    text-shadow: 0 0 8px rgba(255, 215, 0, 0.6);
}

.center-rank-list li:nth-child(1) .rank-name,
.center-rank-list li:nth-child(2) .rank-name,
.center-rank-list li:nth-child(3) .rank-name {
    color: #ffd700;
}