.page-wrap { width: 100%; height: 100%; display: flex; background: url(../images/bg.png) no-repeat; background-size: cover;}

.page-menu { width: 232px; display: flex; flex-direction: column;}
.page-menu li {list-style: none;}
.page-menu .logo { height: 64px; background: rgba(255, 255, 255, 0.5); display: flex; align-items: center; justify-content: center;}
.page-menu .logo img { width: auto; height: 22px;}
.page-menu .el-menu { flex: 1; padding: 24px 14px; background: unset; border-right: none; overflow-y: auto;}
.page-menu .el-menu::-webkit-scrollbar { width: 0;}
.page-menu .el-menu .el-menu-item { cursor: pointer; height: auto; padding: 0 12px !important; border-radius: 6px; font-size: 14px; color: #262626; line-height: 40px;}
.page-menu .el-menu .el-menu-item:hover { background: #fff; color: #409eff;}
.page-menu .el-menu .el-menu-item .icon { line-height: 40px; margin-right: 8px;}
.page-menu .el-menu .el-menu-item:hover { color: #409eff;}
.page-menu .el-menu .el-menu-item.is-active { background: #fff; color: #409eff;}
.page-menu .el-menu .el-sub-menu:hover { background: unset;}
.page-menu .el-menu .el-sub-menu .el-sub-menu__title { height: auto; background: unset; padding-left: 12px !important; border-radius: 6px; font-size: 14px; color: #262626; line-height: 40px;}
/* .page-menu .el-menu .el-sub-menu .el-sub-menu__title:hover { color: #4a90e2;} */
.page-menu .el-menu .el-sub-menu.is-active>.el-sub-menu__title { color: #409eff;}
.page-menu .el-menu:not(.el-menu--collapse) .el-sub-menu__title { padding-right: 10px;}
.page-menu .el-menu .el-sub-menu .el-sub-menu__title .icon { line-height: 40px; margin-right: 8px;}
.page-menu .el-menu .el-sub-menu .el-sub-menu__title span { flex: 1;}
.page-menu .el-menu .el-sub-menu .el-sub-menu__title .arrow-icon { font-size: 22px; transform: scale(0.5) rotate(-90deg); transition: 0.3s;}
.page-menu .el-menu .el-sub-menu.is-opened>.el-sub-menu__title .arrow-icon { transform: scale(0.5);}
.page-menu .el-menu .el-sub-menu .el-sub-menu__icon-arrow { display: none;}
.page-menu .el-menu .el-sub-menu .el-menu-item-group__title { padding: 0;}
.page-menu .el-menu .el-menu { padding: 0;}
.page-menu .el-menu .el-sub-menu .el-menu-item { border-radius: 6px; padding-left: 36px !important; }
.page-menu .el-menu .el-sub-menu .el-menu-item:hover { background-color: #fff; color: #409eff;}
.page-menu .el-menu .el-sub-menu .el-menu-item.is-active { background-color: #fff; color: #409eff;}
.page-menu .el-menu .el-sub-menu>.el-menu .el-sub-menu__title { border-radius: 6px; padding-left: 36px !important; }
.page-menu .el-menu .el-sub-menu>.el-menu .el-sub-menu__title:hover { background-color: #fff; color: #409eff;}


.page-right { flex: 1;}
.page-header { height: 64px; background: rgba(255, 255, 255, 0.5); display: flex; align-items: center; justify-content: space-between;}
.page-header .desc { font-size: 14px; color: #262626; line-height: 1.2;}
.page-header .tool { flex: 1; display: flex; justify-content: flex-end; padding-right: 24px;}
.page-header .tool .item { margin: 0 4px; min-width: 40px; height: 40px; background: #D8EBFF; border-radius: 8px; font-size: 14px; line-height: 40px; color: #262626; display: flex; align-items: center; justify-content: center; cursor: pointer;}
.page-header .tool .item:hover { background-color: #409eff; color: #fff;}
.page-header .tool .item.item-text { padding: 0 16px;}
.page-header .tool .item.item-text .icon { margin-right: 9px;}
.page-header .tool .item.item-text .arrow { font-size: 14px; margin-left: 1px; transform: scale(0.5);}

.page-content { height: calc(100vh - 64px); overflow: hidden;padding-top: 20px;box-sizing: border-box}