body, html {
	max-width: 100%;
	font-family: Switzer,Arial,sans-serif !important;
	background-color: white;
}
html {
	font-size: 7.3px;
}
.mb-20 {
	margin-bottom: 2rem;
}
.color-main {
	color: var(--main-color);
}
.text-primaryText {
    color: var(--color-primary-text);
}
.inputBackground {
	background-color: rgb(244, 245, 247);
}
.inputRadius {
	border-radius: .8rem;
}

.DrawerPage {
	position: fixed;
	width: 100vw;
	height: 100vh;
	left: 0vw;
	transition: all 0.4s;
}

.DrawerPage.show {
	transform: scale(0.9, 0.9);
	left: 85vw;
	box-shadow: 0 0 60upx rgba(0, 0, 0, 0.2);
	transform-origin: 0;
}

.DrawerWindow {
	position: absolute;
	width: 85vw;
	height: 100vh;
	left: 0;
	top: 0;
	transform: scale(0.9, 0.9) translateX(-100%);
	opacity: 0;
	pointer-events: none;
	transition: all 0.4s;
	padding: 100upx 0;
}
.p-30 {
	padding: 2rem;
}
.p-20 {
	padding: 1rem;
}
div {
	box-sizing: border-box;
}
.DrawerWindow.show {
	transform: scale(1, 1) translateX(0%);
	opacity: 1;
	pointer-events: all;
}
.bbg {
	border-bottom: 1px solid #dfdede
}
.font-10 {
	font-size: .6rem !important;
}
.font-20 {
	font-size: 2.6rem !important;
}
.font-25 {
	font-size: 3rem !important;
}
.font-30 {
	font-size: 3.6rem !important;
}
.mr-20 {
	margin-right: 2rem;
}
.bg-color-main {
	background-color: var(--main-color);
}
.overflow-hidden {
	overflow: hidden;
}
/* HTML: <div class="loader"></div> */
.selfloader {
	margin: 0 auto;
	--c:no-repeat linear-gradient(var(--main-color) 0 0);
	background: 
	  var(--c),var(--c),var(--c),
	  var(--c),var(--c),var(--c),
	  var(--c),var(--c),var(--c);
	background-size: 0.6rem 0.6rem;
	animation: 
	  l32-1 1s infinite,
	  l32-2 1s infinite;
  }
  @keyframes l32-1 {
	0%,100% {width:1.8rem;height: 1.8rem}
	35%,65% {width:3rem;height: 3rem}
  }
  @keyframes l32-2 {
	0%,40%  {background-position: 0 0,0 50%, 0 100%,50% 100%,100% 100%,100% 50%,100% 0,50% 0,  50% 50% }
	60%,100%{background-position: 0 50%, 0 100%,50% 100%,100% 100%,100% 50%,100% 0,50% 0,0 0,  50% 50% }
  }
.DrawerClose {
	position: absolute;
	width: 40vw;
	height: 100vh;
	right: 0;
	top: 0;
	color: transparent;
	padding-bottom: 30upx;
	display: flex;
	align-items: flex-end;
	justify-content: center;
	background-image: linear-gradient(90deg, rgba(0, 0, 0, 0.01), rgba(0, 0, 0, 0.6));
	letter-spacing: 5px;
	font-size: 50upx;
	opacity: 0;
	pointer-events: none;
	transition: all 0.4s;
}

.DrawerClose.show {
	opacity: 1;
	pointer-events: all;
	width: 15vw;
	color: #fff;
}

.DrawerPage .cu-bar.tabbar .action button.cuIcon {
	width: 64upx;
	height: 64upx;
	line-height: 64upx;
	margin: 0;
	display: inline-block;
}

.DrawerPage .cu-bar.tabbar .action .cu-avatar {
	margin: 0;
}

.DrawerPage .nav {
	flex: 1;
}

.DrawerPage .nav .cu-item.cur {
	border-bottom: 0;
	position: relative;
}

.DrawerPage .nav .cu-item.cur::after {
	content: "";
	width: 10upx;
	height: 10upx;
	background-color: currentColor;
	position: absolute;
	bottom: 10upx;
	border-radius: 10upx;
	left: 0;
	right: 0;
	margin: auto;
}

.DrawerPage .cu-bar.tabbar .action {
	flex: initial;
}