:root{
	/*显示块的宽度*/
	--block-width:calc(25% - 20px);
	/*显示块的高度*/
	--block-height:230px;
	/*块内模块名的左padding*/
	--module-left:10px;
	/*模块下菜单的左padding*/
	--item-left:30px;
	/*模块下菜单的宽度*/
	/*--item-width:100px;*/
	/*--item-width:calc(25% - 20px);*/
	--item-width:25%;
	/*模块下菜单的top高度*/
	--item-base-top:32px;
}

#popmenu{
	width: calc(95% - 20px);
	height: auto !important;
	padding: 0 10px 10px 10px;
	display: none; /*none block*/
	position: absolute;
	top: 0px;
	left: 64px;
	color: #ffffff;
	background-color: #151822;
	opacity:0.98;
	z-index:10;
}

@keyframes popmenu_expand
{
	from {
		opacity: 0.6;
	}
	to {
		opacity: 0.9;
	}
}

@-webkit-keyframes popmenu_expand /*Safari and Chrome*/
{
	from {
		opacity: 0.6;
	}
	to {
		opacity: 0.9;
	}
}

.popmenu_expand{
	/*position: absolute;*/
	/* animation:popmenu_expand 1s;
	-webkit-animation:popmenu_expand 1s; */ /*Safari and Chrome*/
}

.popMenuTitle{
	height: 30px;
	color: #8a7fe0;
	font-size: 20px;
	font-weight: bolder;
	border-bottom:thin solid #636477;
}

.menu-list-block{
	width: var(--block-width);
	height: var(--block-height);
	margin-top: 20px;
	padding-left: 15px;
	display: inline-block;
	position: relative;
	border-radius:10px;
}

.list-module{
	position: absolute;
	left: var(--module-left);
	top: 0px;
	font-size: 20px;
	font-family: PingFangSC-Semibold, PingFang SC;
	font-weight: 600;
	color: #B9BFC9;
	line-height: 20px;
}

.menu-font{
	font-size: 16px;
	font-family: PingFangSC-Semibold, PingFang SC;
	font-weight: 600;
	color: #969FAF !important;
	line-height: 16px;
	margin-top: 16px;
}

.menu-font a{
	text-decoration: none;
	color: #969FAF !important;
}

.menu-font a:hover{
	color: #2C64FF !important;
}

/* the first column */
.list-item-1-1{
	position: absolute;
	left: calc(var(--item-left) * 1);
	top: calc(var(--item-base-top) * 1);
}

.list-item-1-2{
	position: absolute;
	left: calc(var(--item-left) * 1);
	top: calc(var(--item-base-top) * 2);
}

.list-item-1-3{
	position: absolute;
	left: calc(var(--item-left) * 1);
	top: calc(var(--item-base-top) * 3);
}

.list-item-1-4{
	position: absolute;
	left: calc(var(--item-left) * 1);
	top: calc(var(--item-base-top) * 4);
}

.list-item-1-5{
	position: absolute;
	left: calc(var(--item-left) * 1);
	top: calc(var(--item-base-top) * 5);
}

.list-item-1-6{
	position: absolute;
	left: calc(var(--item-left) * 1);
	top: calc(var(--item-base-top) * 6);
}

/* the second column */
.list-item-2-1{
	position: absolute;
	left: calc(var(--item-left) * 2 + var(--item-width) * 1);
	top: calc(var(--item-base-top) * 1);
}

.list-item-2-2{
	position: absolute;
	left: calc(var(--item-left) * 2 + var(--item-width) * 1);
	top: calc(var(--item-base-top) * 2);
}

.list-item-2-3{
	position: absolute;
	left: calc(var(--item-left) * 2 + var(--item-width) * 1);
	top: calc(var(--item-base-top) * 3);
}

.list-item-2-4{
	position: absolute;
	left: calc(var(--item-left) * 2 + var(--item-width) * 1);
	top: calc(var(--item-base-top) * 4);
}

.list-item-2-5{
	position: absolute;
	left: calc(var(--item-left) * 2 + var(--item-width) * 1);
	top: calc(var(--item-base-top) * 5);
}

.list-item-2-6{
	position: absolute;
	left: calc(var(--item-left) * 2 + var(--item-width) * 1);
	top: calc(var(--item-base-top) * 6);
}

/* the thrid column */
.list-item-3-1{
	position: absolute;
	left: calc(var(--item-left) * 3 + var(--item-width) * 2);
	top: calc(var(--item-base-top) * 1);
}

.list-item-3-2{
	position: absolute;
	left: calc(var(--item-left) * 3 + var(--item-width) * 2);
	top: calc(var(--item-base-top) * 2);
}

.list-item-3-3{
	position: absolute;
	left: calc(var(--item-left) * 3 + var(--item-width) * 2);
	top: calc(var(--item-base-top) * 3);
}

.list-item-3-4{
	position: absolute;
	left: calc(var(--item-left) * 3 + var(--item-width) * 2);
	top: calc(var(--item-base-top) * 4);
}

.list-item-3-5{
	position: absolute;
	left: calc(var(--item-left) * 3 + var(--item-width) * 2);
	top: calc(var(--item-base-top) * 5);
}

.list-item-3-6{
	position: absolute;
	left: calc(var(--item-left) * 3 + var(--item-width) * 2);
	top: calc(var(--item-base-top) * 6);
}

/* the forth column */
.list-item-4-1{
	position: absolute;
	left: calc(var(--item-left) * 4 + var(--item-width) * 3);
	top: calc(var(--item-base-top) * 1);
}

.list-item-4-2{
	position: absolute;
	left: calc(var(--item-left) * 4 + var(--item-width) * 3);
	top: calc(var(--item-base-top) * 2);
}

.list-item-4-3{
	position: absolute;
	left: calc(var(--item-left) * 4 + var(--item-width) * 3);
	top: calc(var(--item-base-top) * 3);
}

.list-item-4-4{
	position: absolute;
	left: calc(var(--item-left) * 4 + var(--item-width) * 3);
	top: calc(var(--item-base-top) * 4);
}

.list-item-4-5{
	position: absolute;
	left: calc(var(--item-left) * 4 + var(--item-width) * 3);
	top: calc(var(--item-base-top) * 5);
}

.list-item-4-6{
	position: absolute;
	left: calc(var(--item-left) * 4 + var(--item-width) * 3);
	top: calc(var(--item-base-top) * 6);
}