@charset "utf-8";
body {
    /*background-color: #1c232d;*/
    background-color: rgb(247,247,249);
    overflow: hidden;
}

/*新版中台样式*/
.main {
    width:100vw;
    height: 100%;
}

/*左边菜单样式*/
.left-menu {
    position: absolute;
    top:0;
    left: 0;
    width: 60px;
    height: 100vh;
    background-color: #292e36;
    float: left;
    z-index: 30;
}
.logo {
    height: 75px;
    display: flex;
    justify-content: center;
    cursor: pointer;
}
.logo img {
    align-self: center;
    width: 80%;
    height: 90%;
    object-fit: contain;
}

.left-menu ul{
}
.left-menu ul li {
    width: 100%;
    height: 60px;
    text-align: center;
    position: relative;
    background-color: #292e36;
}
.more-list-box{
    padding: 5px;
}
.left-menu ul li.nshowfont{
    line-height: 60px;
}

.left-menu ul li.showfont{
    display: flex;
    align-items:center;
    justify-content:center;
}

.left-menu ul li.showfont .li-div{
    display: inline-block;
}
.icon-menu {
    font-size: 24px;
    color: #767ea3;
}
.left-menu ul li:hover {
    background-color: #0075ff;
}
.left-menu ul li:hover .icon-menu {
    color:#fff;
}
.left-menu ul li.left-menu-hover {
    background-color: #0075ff;
}
.left-menu ul li.left-menu-hover .icon-menu {
    color:#fff;
}
.left-menu-img {
    max-height: 28px;
    max-width: 28px;
}
.left-menu-tips {
    display: none;
    background-color: #0075ff;
    width: 100px;
    height: 36px;
    text-align: center;
    line-height: 36px;
    border-radius: 4px;
    color:#fff;
    font-size: 16px;
    position: absolute;
    left:70px;
    top:22px;
    z-index: 30;
}
.left-menu ul li:hover .left-menu-tips {
    display: block;
}
.left-menu-tips:after, .left-menu-tips:before {
    border: solid transparent;
    content: ' ';
    height: 0;
    right: 100%;
    position: absolute;
    width: 0;
}
.left-menu-tips:after {
    border-width: 7px;
    border-right-color: #0075ff;
    top: 10px;
}
.left-menu-tips:before {
    border-width: 7px;
    border-right-color: #0075ff;
    top: 10px;
}
.dot-update {
    width:10px;
    height: 10px;
    border-radius: 5px;
    background-color: #0075ff;
    display: block;
    border:#292e36 2px solid;
    position: absolute;
    left:38px;
}

.nshowfont .dot-update{
    top:14px;
}
.showfont .dot-update{
    top:3px;
}
.left-menu ul li:hover .dot-update {
    background-color: #fff;
    border:#0075ff 2px solid;
}

.left-menu ul li.left-menu-hover .dot-update {
    background-color: #fff;
    border:#0075ff 2px solid;
}

/*顶部样式*/
.top {
    position: absolute;
    top:0;
    left: 60px;
    right: 0;
    height: 75px;
    line-height: 75px;
    /*background: #141a22 url('../../resources/new_era/topbg.png') no-repeat center left;*/
    background: #141a22 url(../images/top_bg.png) no-repeat center left;
    z-index: 30;
}
.title {
    font-size: 28px;
    color:#fff;
    padding-left: 20px;
    font-weight: lighter;
    letter-spacing: 1px;
    float: left;
}

.title span{
    font-size: 20px;
}
.tools {
    float: right;
    padding-right: 5px;
}
.userhead {
    font-size: 16px;
    color:#fff;;
    margin-right: 20px;
    float: left;
}
.userhead img {
    width:24px;
    height:24px;
    border-radius: 12px;
    margin-right: 8px;
}
.tools .iconfont{
    font-size: 20px;
}
.btn-refresh {
    float: left;
    width:42px;
    height: 42px;
    line-height: 42px;
    color:#e8e9ea;
    background-color: #6cb5cf;
    border-radius: 2px;
    border:none;
    margin-left:10px;
    margin-top:16px;
}
.btn-refresh:hover {
    color:#fff;
    background-color: #84c9e1;
}
.btn-exit {
    float: left;
    width:42px;
    height: 42px;
    line-height: 42px;
    color:#e8e9ea;
    background-color: #25a09c;
    border-radius: 2px;
    border:none;
    margin-left:10px;
    margin-top:16px;
}
.btn-exit:hover {
    color:#fff;
    background-color: #35b3af;
}
.btn-help {
    float: left;
    width:42px;
    height: 42px;
    line-height: 42px;
    color:#e8e9ea;
    background-color: #4c93e7;
    border-radius: 2px;
    border:none;
    margin-left:10px;
    margin-top:16px;
}
.btn-help:hover {
    color:#fff;
    background-color: #4274e7;
}
.btn-home {
    float: left;
    width:42px;
    height: 42px;
    line-height: 42px;
    color:#fff;
    background-color: #d4a555;
    border-radius: 2px;
    border:none;
    margin-left:10px;
    margin-top:16px;
}
.btn-home:hover {
    color:#fff;
    background-color: #e5a738;
}
/*主要内容样式*/
.search {
    position: absolute;
    top: 0px;
    right: 32px;
    left: 1.65%;
    height: 75px;
    line-height: 42px;
    clear: both;
    color: #fff;
    font-size: 16px;
    padding-top: 13px;
    z-index: 22;
    background-color: #1c232d;
}
.input-search {
    width:240px;
    height: 36px;
    line-height: 36px;
    background-color: #2b323c;
    border:none;
    border-radius: 2px;
    float: left;
    color:#999;
    font-size: 16px;
    padding-left:12px;
    margin-top:5px;
}
.icon-search {
    color: #fff;
    font-size: 14px;
    margin-left:-27px;
    float: left;
}
.total {
    margin-left:8px;
    margin-right: 8px;
    color:#0075ff;
    font-size: 20px;
    font-family: Arial, Helvetica, sans-serif;
}
.ml30 {
    margin-left:30px;
}
.icon-import {
    color:#0075ff;
    margin-right: 10px;
}
.edit-sort, .label-sort {
    padding-right: 22px;
    background: url(../images/arrow_down.png) no-repeat center right;
    position: relative;
    z-index: 60;
}
.edit-sort:hover, .label-sort:hover {
    padding-right: 22px;
    background: url(../images/arrow_up.png) no-repeat center right;
    color:#0075ff;
    cursor: pointer;
}
.time-sort, .label-list {
    display: none;
}
.time-sort-box {
    position: absolute;
    left:-5px;
    top:0;
    z-index: 60;
}
.time-sort {
    padding-top:30px;
}
.time-sort ul li {
    width: 120px;
    text-align: left;
    height: 34px;
    line-height: 34px;
    background-color: #292e36;
    border-bottom:#1c232d 1px solid;
    font-size: 14px;
    padding-left:10px;
    box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.3);
}
.time-sort ul li:hover {
    background-color: #0075ff;
    color:#fff;
}
.time-sort ul li:hover a {
    color:#fff;
    text-decoration: none;
}
.edit-sort:hover .time-sort {
    display: block;
}
.label-sort:hover .label-list,.label-sort:hover .label-list .industry-tips  {
    color:#fff;
    display: block;
}
.label-sort .industry-tips {
    left: -60px;
}

.label-list-box {
    position: absolute;
    left:-20px;
    top:0;
    z-index: 60;
}
.label-list {
    padding-top:30px;
}
.label-list ul li {
    width: 80px;
    text-align: left;
    height: 34px;
    line-height: 34px;
    background-color: #292e36;
    border-bottom:#1c232d 1px solid;
    font-size: 14px;
    padding-left:10px;
    box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.3);
}
.label-list ul li:hover {
    background-color: #0075ff;
    color:#fff;
}
.label-list ul li:hover a {
    color:#fff;
    text-decoration: none;
}

/*列表样式*/
.list {
    clear: both;
    margin-top:77px;
    margin-left:1.65%;
    z-index: 10;
    height: calc(100vh - 152px);
    overflow-y: scroll;
}
.list-main {
    width:18.3%;
    margin-right:1.65%;
    margin-bottom:2.77vh;
    float: left;
    background-color: #292e36;
    position: relative;
    z-index: 10;
}

.list-img {
    padding:20px;
    border-bottom:#1c232d 1px solid;
    position: relative;
}
.list-img img {
    width: 100%;
}
.list-img-mask {
    position: absolute;
    left:20px;
    right:20px;
    top:20px;
    bottom: 20px;
    background-color: rgba(0,117,255,0.1);
}
.list-content{
    position: relative;
    /*height: 160px;*/
    height: 125px;
    width: 100%;
}
.list-title {
    display: inline-flex;
    align-items: center;
    font-size: 16px;
    padding:15px 20px 5px;
    color: #fff;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}
.list-title span{
    font-size: 18px;
    color: #fff;
    margin-right: 5px;
}
.list-info {
    line-height: 20px;
    color:rgba(255,255,255,0.5);
    padding:0 40px 0 20px;
    overflow : hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    height: 40px;
    position: absolute;
    z-index: 90;
}
.list-label {
    color:#1166ca;
    padding: 0px 20px;
    position: absolute;
    z-index: 90;
    overflow : hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    margin-top: 40px;
    height: 24px;
    width: 100%;
}

/*.list-label .el-icon-close:before ,.template-list-label .el-icon-close:before{*/
/*    content: none;*/
/*}*/

/*.list-label .el-icon-close ,.template-list-label .el-icon-close {*/
/*    height: 18px !important;*/
/*    line-height: 18px !important;*/
/*    background: url(../images/del.png) no-repeat center center;*/
/*}*/

.list-label .el-tag__close.el-icon-close:hover ,.template-list-label .el-tag__close.el-icon-close:hover,.layui-layer-content .el-tag__close.el-icon-close:hover {
    background-color: #144e93 !important;
}

/*.list-label .el-tag ,.template-list-label .el-tag  {*/
/*    background-color: transparent;*/
/*    border-color: transparent;*/
/*    padding: 0;*/
/*    margin-right: 5px;*/
/*    float: left;*/
/*    height: 18px;*/
/*    line-height: 18px;*/
/*    cursor: pointer;*/
/*}*/

/*.list-label .el-button {*/
/*    background: transparent;*/
/*    border: 1px solid transparent;*/
/*}*/
/*.list-label .el-input__inner {*/
/*    background-color: #313740 !important;*/
/*    border: 1px solid #313740;*/
/*    color: #999;*/
/*}*/

/*.list-label .input-new-tag {*/
/*    width: 90px;*/
/*    vertical-align: bottom;*/
/*}*/

/*.list-label .el-input--small .el-input__inner{*/
/*    height: 18px;*/
/*    line-height: 18px;*/
/*    padding: 0px 5px;*/
/*    border-radius: 0;*/
/*}*/

.list-label .el-tag__close{
    /*right: 0 !important;*/
    /*visibility: hidden;*/
    color: #fff !important;
}

/*.list-label .el-tag:hover .el-tag__close{*/
/*    visibility: visible;*/
/*}*/

.list-label .el-tag, .template-list-label .el-tag, .layui-layer-content .el-tag {
    margin-right: 10px;
    background-color: #3c7ac4;
    border-color: #3c7ac4;
    height: 24px;
    padding: 0 5px;
    line-height: 24px;
    font-size: 12px;
    color: #fff;
    border-radius: 0;
}

.list-label .el-tag, .layui-layer-content .el-tag{
    cursor: pointer;
}

.layui-layer-content .el-tag{
    margin-bottom: 8px;
}

.list-label .button-new-tag{
    /*border-radius: 50%;*/
    /*width: 16px;*/
    /*text-align: center;*/
    /*position: relative;*/
    /*font-weight: 400;*/
    /*font-size: 14px;*/
    /*color:#FFF;*/
    /*height: 18px;*/
    /*line-height: 18px;*/
    /*float: left;*/
    /*top: 1px;*/
    display: none;
    background: url('../images/add.png') no-repeat center center;
    cursor: pointer;
    margin-left: 5px;
    height: 24px;
    width: 24px;
    line-height: 24px;
    padding: 0 7px;
    border-radius: 0;
    border-color: transparent;
    position: absolute;
    right: 20px;
    top: 0;
}

.list-main:hover .button-new-tag{
    display: inline-block;
}

.icon-new {
    position: absolute;
    top:0;
    left:0;
    z-index: 40;
}
.list-main-box {
    display: none;
    position: absolute;
    left:0;
    right:0;
    top:0;
    bottom:0;
    border:#3cafff 1px solid;
}
.list-main:hover .list-main-box {
    display: block;
}
.list-main:hover .list-hover {
    display: block;
}
.list-hover {
    position: absolute;
    left:1px;
    right:1px;
    top:1px;
    bottom:0;
    background-color: rgba(13,36,56,0.8);
    z-index: 30;
    display: none;
}
.list-hover ul {
    padding-left:35px;
    padding-right:30px;
    padding-top:16%;
}
.list-hover ul li {
    margin-left:4.5%;
    margin-right:4.5%;
    float: left;
    color:#fff;
    padding-top:5%;
    position: relative;
}
.icon-list {
    font-size: 18px;
}
.list-icon-tips {
    display: none;
    position: absolute;
    top:45px;
    left:-22px;
    width:60px;
    height:24px;
    line-height: 24px;
    font-size: 13px;
    background-color: #0075ff;
    border-radius: 2px;
    border:none;
    text-align: center;
    z-index: 50;
}
.list-icon-tips:after {
    border: solid transparent;
    content: ' ';
    height: 0;
    bottom: 100%;
    position: absolute;
    width: 0;
}
.list-icon-tips:after {
    border-width: 6px;
    border-bottom-color: #0075ff;
    top: -12px;
    left:24px;
}
.list-hover ul li:hover .list-icon-tips {
    display: block;
}
.icon-edit {
    position: absolute;
    bottom:-40px;
    right: 12px;
    font-size: 18px;
    color:#dbe0ec;
}

/*页码样式*/

.main-pagination {
    clear: both;
    text-align: center;
    margin: 20px 0 50px;
}

.main-pagination .el-pager li {
    background-color: transparent !important;
    border: 1px solid #4b5974 !important;
    color: #fff !important;
}

.main-pagination .el-pagination.is-background .el-pager li:not(.disabled).active {
    background-color: #0382da !important;
    border: 1px solid #0382da !important;
}

.main-pagination .el-pagination.is-background .btn-next, .el-pagination.is-background .btn-prev, .el-pagination.is-background .el-pager li {
    background-color: transparent !important;
    color: #fff !important;
    border: 1px solid #4b5974 !important;
}

.main-pagination .el-pagination.is-background .btn-next.disabled, .el-pagination.is-background .btn-next:disabled, .el-pagination.is-background .btn-prev.disabled, .el-pagination.is-background .btn-prev:disabled, .el-pagination.is-background .el-pager li.disabled {
    background-color: transparent;
    color: #fff !important;
    border: 1px solid #4b5974 !important;
}

/*弹窗提示*/
.mask {
    width: 100%;
    height: 100vh;
    background-color: rgba(2, 6, 13, 0.5);
    position: absolute;
    top: 0px;
    left: 0px;
    display: none;
    z-index: 90;
}

.close-window {
    width: 480px;
    height: 290px;
    background-color: #2b3545;
    border-radius: 12px;
    position: fixed;
    left: 50%;
    margin-left: -240px;
    top: 35vh;
    display: none;
    z-index: 99;
}

.window-menu-title {
    float: left;
    color: #3cafff;
    font-size: 18px;
    margin-top: 20px;
    margin-left: 30px;
}

.icon-close {
    float: right;
    margin-top: 20px;
    margin-right: 30px;
    color: #3cafff;
    font-size: 14px;
}

.close-main {
    clear: both;
    text-align: center;
    color: #fff;
    font-size: 16px;
    padding-top: 10px;
}

.icon-sigh {
    color: #ff5252;
    font-size: 72px;
}

.el-dialog{
    background-color: #3d444e !important;
    border-radius: 12px !important;
}

.el-dialog__header{
    background-color: #3d444e !important;
    border-radius: 12px 12px 0 0 !important;
}

.el-dialog__header .el-icon-close{
    color: #3cafff !important;
}

.el-dialog__body{
    background-color: #3d444e !important;
}

.el-dialog__footer, .dialog-footer{
    text-align: center !important;
    background-color: #3d444e !important;
    border-radius: 0 0 12px 12px !important;
}

.el-dialog__title{
    color: #3cafff !important;
    font-size: 18px !important;
}

.btn {
    cursor: pointer;
}

.btn-cancel {
    width: 104px;
    height: 36px;
    line-height: 36px;
    /*border: #4f545d 1px solid !important;*/
    border-radius: 0px !important;
    background: #4f545d !important;
    border: none !important;
    font-size: 16px;
    color: #dfe5f1 !important;
    padding: 0px;
    margin-right: 16px;
    margin-top: 40px;
}

.btn-cancel:hover {
    color: #fff !important;
    font-weight: bold !important;
}

.btn-ok {
    width: 104px;
    height: 36px;
    line-height: 36px;
    border: none !important;
    border-radius: 0px !important;
    background: #3c7ac4 !important;
    /*background-image: linear-gradient(to right, #23c4f9, #0f8be1) !important;*/
    font-size: 16px;
    color: #dfe5f1 !important;
    padding: 0px;
    margin-top: 40px;
    outline: none;
}

.btn-ok:hover {
    color: #fff !important;
    font-weight: bold !important;
}

.add-window, .edit-window, .etl-window {
    width: 480px;
    height: 238px;
    background-color: #2b3545;
    border-radius: 12px;
    position: absolute;
    left: 50%;
    margin-left: -240px;
    top: 38vh;
    display: none;
    z-index: 99;
}

.add-main {
    clear: both;
    color: #fff;
    font-size: 16px;
    padding: 32px;
}

.input-add {
    width: calc(100% - 18px);
    border: #4b5974 1px solid;
    background-color: #141c2b;
    line-height: 34px;
    padding-left: 16px;
    margin: 10px 0;
    color: #ffffff;
    font-size: 16px;
}

.input-add:hover {
    border: #3cafff 1px solid;
}

.btn-create {
    display: inline-flex;
    border: none;
    border-radius: 0px;
    background-image: linear-gradient(to right, #23c4f9, #0f8be1);
    font-size: 16px;
    color: #dfe5f1;
    float: right;
    margin-top: 0px;
    cursor: pointer;
    padding-left:12px;
    padding-right: 12px;
}

.btn-create:hover {
    color: #fff;
    background-color: #5291db;
    text-decoration: none;
}
.btn-template span {
    font-size: 20px;
    margin-right: 5px;
}
.btn-template {
    display: inline-flex;
    border: none;
    border-radius: 0px;
    background-image: linear-gradient(to right, #84c6dd, #409ebf);
    font-size: 16px;
    color: #dfe5f1;
    float: right;
    margin-top: 0px;
    margin-right: 10px;
    cursor: pointer;
    padding-left:12px;
    padding-right: 12px;

}

.btn-template:hover {
    color: #fff;
    background-color: #5291db;
    text-decoration: none;
}
.btn-create span {
    font-size: 20px;
    margin-right: 5px;
}

.qrcode-window {
    width: 620px;
    height: 500px;
    background-color: #2b3545;
    border-radius: 12px;
    position: absolute;
    left: 45%;
    margin-left: -240px;
    top: 28vh;
    display: none;
    z-index: 99;
}


/*弹窗-创建场景*/
.mask-create {
    width: 100%;
    height: 100vh;
    background-color: rgba(5, 14, 32, 0.5);
    position: absolute;
    top: 0px;
    left: 0px;
}

.create {
    width: 100%;
    height: 674px;
    background-color: #2c333e;
    position: absolute;
    left: 0px;
    right: 0px;
    bottom: 0px;
}

.create-list-box {
    width: 21.5%;
    float: left;
    padding-left: 40px;
    padding-top: 40px;
    height: 674px;
    overflow-y: auto;
    margin-right: 20px;
}

.create-img {
    margin-top: 20px;
    float: left;
}

.create-img img {
    width: 54.94vw;
}

.create-img img {
    border: #3cafff 1px solid;
}

.create-info {
    width: 18.12%;
    float: right;
    margin-right: 40px;
    margin-top: 70px;
    color: #eef3ff;
}

.create-info h4 {
    font-size: 28px;
    height: 78px;
    font-weight: lighter;
}

.create-info p {
    margin-bottom: 14px;
}

.create-info-title {
    font-size: 18px;
    padding-top: 20px;
}

.create-info-lable {
    font-size: 18px;
    border-top: #4b5974 2px dotted;
    padding-top: 60px;
    margin-top: 56px;
}

.create-input input,.create-input textarea {
    border: #4b5974 1px solid !important;
    background-color: #141c2b !important;
    color: #fff !important;
    font-size: 16px;
}

.create-input .el-input__count-inner,.create-input .el-input__count{
    background: transparent !important;
}

.create-input input:hover,.create-input textarea:hover {
    border-color: #3cafff !important;
}

.button-create {
    text-align: center;
    color: #fff;
    font-size: 18px;
    border-radius: 0px;
    padding: 0 12px;
    margin-right: 16px;
    background-image: linear-gradient(to right, #23c4f9, #0f8be1);
    border: none;
}

.button-create:hover {
    color: #fff;
}

.btn.active.focus, .btn.active:focus, .btn.focus, .btn:active.focus, .btn:active:focus, .btn:focus {
    outline: none;
    color: #fff;
}

input.active.focus, input.active:focus, input.focus, input:active.focus, input:active:focus, input:focus {
    outline: none;
}

.btn-del {
    width: 150px;
    height: 38px;
    text-align: center;
    color: #ff5252;
    font-size: 18px;
    border-radius: 0px;
    padding: 0px;
    border: #f74b4b 1px solid;
    background-color: transparent;
}

.btn-del:hover {
    color: #ff5252;
}

.create-list {
    clear: both;
    margin-bottom: 20px;
    font-size: 14px;
    color: #eef3ff;
    cursor: pointer;
}

.creat-list-img {
    float: left;
    border: #4b5974 1px solid;
    margin-right: 12px;
    width: 8.85vw;
}

.create-list-main {
    float: left;
}

.create-list-main h4 {
    font-size: 16px;
    width: 165px;
    line-height: 20px;
    margin-top: 5px;
    padding-right: 20px;
}

.create-list-main p {
    margin-bottom: 4px;
}

.create-list-hover {
    /*margin-left: 10px;*/
    /*color: #3cafff;*/
}

.create-list-hover .creat-list-img {
    border: #3cafff 1px solid;
}

.create-list-hover h4 {
    background: url(../images/arrow_right.png) no-repeat right 5px;
}

.create-list:hover {
    color: #3cafff;
}

.create-list:hover .creat-list-img {
    border: #3cafff 1px solid;
}

.btn-close {
    font-size: 14px;
    color: #3cafff;
    position: absolute;
    top: 10px;
    right: 10px;
}

.create-list-box::-webkit-scrollbar {
    width: 4px; /*高宽分别对应横竖滚动条的尺寸*/
    height: 4px;
    scrollbar-arrow-color: red;
}

.create-list-box::-webkit-scrollbar-thumb { /*滚动条里面小方块*/
    border-radius: 5px;
    -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
    background: #262d38;
    scrollbar-arrow-color: red;
}

.create-list-box::-webkit-scrollbar-track { /*滚动条里面轨道*/
    -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
    border-radius: 0;
    background: #363d49;
}

.el-drawer:focus {
    outline: none;
}

.create-drawer .el-drawer.btt {
    background-color: #2c333e;
}

.red-font:link {
        color: #f00;
}

.red-font span:hover {
        color: #ff3838;
}

.model-attr .el-dialog {
    border-radius: 0 !important;
}

.model-attr .el-dialog__header {
    background-color: #161d27 !important;
    border-radius: 0 !important;
}

.model-attr .el-dialog__title{
    color: #fff !important;
}

.model-attr .el-icon-close{
    color: #fff !important;
}

.model-attr .el-dialog__body {
    padding: 0;
}

.model-attr .el-dialog__body {
    background-color: #2b333d !important;
    height: 400px;
}

.model-attr .el-dialog {
    background-color: #2b333d !important;
}

.model-attr .el-dialog__footer {
    text-align: center;
    background-color: #2b333d !important;
}

/*创建场景样式*/
.create-size .el-drawer{
    background-color: #1c232d;
}

.create-list-hover {
    border-color: #3cafff !important;
}

.el-drawer__body .main{
    height: 92vh;
    overflow-y: scroll;
}

.template-top {
    line-height: 36px;
    clear: both;
    z-index: 100;
    position: absolute;
    top:0;
    left:50px;
    right: 50px;
    padding-top: 40px;
    height: 90px !important;
}
.template-title {
    float: left;
    color:#fff;
    font-size: 28px;
}
.template-info {
    float: left;
    font-size: 18px;
    margin-left:32px;
    color:#fff;
    position: relative;
}
.template-search {
    float: right;
    margin-right: 10px;
}
.input-template-search {
    width:330px;
    height: 36px;
    line-height: 36px;
    background-color: #2b323c;
    border:none;
    border-radius: 2px;
    float: left;
    color:#999;
    padding-left:12px;
}
.icon-template-search {
    color: #fff;
    font-size: 14px;
    margin-left:-27px;
    float: left;
}

.template-list {
    clear: both;
    margin-left:50px;
    margin-top:96px;
    z-index: 10;
}
.template-list-main {
    width:17.8vw;
    margin-right:1.3vw;
    margin-bottom:3.7vh;
    float: left;
    background-color: #292e36;
    position: relative;
    z-index: 10;
    height: 325px;
    border: #292e36 1px solid;
    cursor: pointer;
}
.template-list-img {
    padding:20px;
    border-bottom:#1c232d 1px solid;
    position: relative;
}
.template-list-img img {
    width: 100%;
    height: 9vw;
}
.template-list-title {
    font-size: 16px;
    padding:15px 20px 10px 20px;
    color: #fff;
}
.template-list-label {
    color:#1166ca;
    padding:0 20px 8px;
    height: 24px;
    z-index: 66;
    position: absolute;
    overflow : hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}
.template-list-main-box {
    display: none;
    position: absolute;
    left:0;
    right:0;
    top:0;
    bottom:0;
    border:#3cafff 1px solid;
}
.template-list-main:hover .list-main-box {
    display: block;
}
.template-list-new {
    width:17.8vw;
    margin-right:1.3vw;
    margin-bottom:3.7vh;
    padding:20px;
    float: left;
    background-color: #292e36;
    position: relative;
    height: 325px;
    border: #292e36 1px solid;
}
.template-list-new-main {
    text-align: center;
    color:#fff;
    font-size: 16px;
    background-image: linear-gradient(#175db0, #3f85d9);
    height: 100%;
}
.template-list-new-main a {
    color:#fff;
    text-decoration: none;
}
.template-list-new-main a:hover {
    font-weight: bold;
}
.icon-create {
    font-size: 48px;
    display: block;
    padding-top:72px;
}

.template-form {
    margin:30px 50px 50px;
    border-top:#363c46 1px solid;
    color:#eef3ff;
    font-size: 16px;
    padding-top:20px;
    clear: both;
}
.template-name {
    background-color: #292e36;
    color:#fff;
    font-size: 16px;
    width:704px;
    height: 36px;
    line-height: 36px;
    padding-left:10px;
    border:#292e36 1px solid;
}
.template-name:hover {
    border:#3cafff 1px solid;
}
.btn-delete-template {
    width:115px;
    height: 38px;
    line-height: 38px;
    background-color: #ed4f50;
    text-align: center;
    color:#fff;
    border:none;
    border-radius: 2px;
    margin-top:20px;
    margin-right: 20px;
}
.btn-create-screen {
    width:115px;
    height: 38px;
    line-height: 38px;
    background-color: #3c7ac4;
    text-align: center;
    color:#fff;
    border:none;
    border-radius: 2px;
    margin-top:20px;
    margin-right: 20px;
}
.btn-delete-template:hover, .btn-create-screen:hover {
    font-weight: bold;
}

/*推荐模板弹出窗样式*/
.industry-tips {
    background-color: #292e36;
    border-radius: 6px;
    padding:20px;
    font-size: 14px;
    box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.3);
    width: 520px;
    position: absolute;
    top:35px;
    left:0;
    z-index: 100;
    display: none;
}
.industry-tips .el-checkbox-group {
    margin-top:10px;
}
.industry-tips .el-checkbox {
    width:25%;
    line-height: 30px;
    float: left;
    padding-left: 10px;
    margin-right: 0px;
    color:#fff !important;
    display: flex;
    align-items: center;
    height: 35px;
}
.industry-tips .el-checkbox:hover {
    background-color: #0075ff;
    color:#fff !important;
}

.industry-tips .el-checkbox__label{
    /*display: initial;*/
    /*white-space:nowrap;*/
    /*overflow:hidden;*/
    /*text-overflow:ellipsis;*/
    overflow : hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    margin-left: 0;
    padding-left: 0;
}

.industry-tips .el-checkbox__input{
    margin: 0 10px 0 0;
}

.industry-tips .el-checkbox:hover .el-checkbox__input.is-checked+.el-checkbox__label {
    color:#fff !important;
}
.industry-tips h4 {
    font-size: 14px;
    font-weight: normal;
    color: rgba(255,255,255,0.5);
    margin:0;
}
.industry-tips:after {
    border: solid transparent;
    content: ' ';
    height: 0;
    bottom: 100%;
    position: absolute;
    width: 0;
    border-width: 8px;
    border-bottom-color: #292e36;
    top: -16px;
    left:90px;
}
.industry-tips:before {
    border: solid transparent;
    content: ' ';
    height: 5px;
    bottom: 100%;
    position: absolute;
    width: 100%;
    border-width: 8px;
    border-bottom-color: transparent;
    top: -16px;
    left: 0;
}
.template-info:hover .industry-tips {
    display: block;
}


.more-li{
    position: fixed!important;
    bottom: 0;
    left: 0;
}
.more-li-a{
    display: block;
    width: 100%;
    height: 100%;
}
.more-li:hover .morePop{
    display: block;
}
/*.more-li .icon-menu{*/
/*    color: #fff;*/
/*}*/
.left-menu ul li.more-li:hover{
    background-color: #292e36;
}
.left-menu  ul li:hover .morePop .icon-menu{
    color:#767ea3;
}
.left-menu  ul li:hover .morePop .more-list:hover .icon-menu{
    color:#fff;
}
.left-menu  ul li:hover .morePop .more-list.active .icon-menu{
    color:#0075ff;
}
.morePop{
    display: none;
    background-color: #2c3139;
    width: 280px;
    min-height: 36px;
    text-align: left;
    line-height: 36px;
    border-radius: 4px;
    color: #fff;
    font-size: 16px;
    position: absolute;
    left: 70px;
    bottom: 10px;
    z-index: 30;
}

.morePop .masks{

    right: 100%;
    position: absolute;
    width: 40px;
    background-color: transparent;
    height: 100%;
}
.morePop:after, .morePop:before {
    border: solid transparent;
    content: ' ';
    height: 0;
    right: 100%;
    position: absolute;
    width: 0;
}
.morePop::before {
    border-width: 7px;
    border-right-color: #2c3139;
    bottom: 12px;
}
.morePop::after {
    border-width: 7px;
    border-right-color: #2c3139;
    bottom:12px;
}
.moreBox{
    position: relative;
    padding: 20px 15px;
}
.more-list{
    position: relative;
    display: inline-block;
    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    margin: 0px;
    overflow: hidden;
}
.more-list:hover, .more-list.active{
    background-color: #008efa;
}
.more-list.nshowfont{
    line-height: 40px;
}

.more-list .dot-list-update{
    width: 10px;
    height: 10px;
    border-radius: 5px;
    background-color: #0075ff;
    display: block;
    border: #292e36 2px solid;
    position: absolute;
    right: 6px;
    top: 5px;
    left: auto;
}


/*element 重写*/
.main .el-switch__core {
    background: #353c4d;
}
.el-switch__label{
    color: #eee;
}
.el-tree-node,
.el-tree-node__content{
    width: 100%;
}
.el-tree-node__content{
    padding-right: 38px;
    position: relative;
}
.custom-tree-node {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 14px;
    overflow: hidden;
}
.custom-tree-node .lefticon{
    position: absolute;
    right: 0;
    top: 2px;
    padding-right: 4px;
}
.custom-tree-node .custom-tree-content{
    display: block;
    flex: 1;
    height: 26px;
    line-height: 26px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;

}
.el-popover{
    background: #272f3e;
    border-color: #272f3e;
    color: #fff;
    padding: 5px;
    min-width: 110px;
}
.el-popover .menuMorebox .li{
    display: block;
    width: 100%;
    height: 26px;
    line-height: 26px;
    font-size: 12px;
    cursor: pointer;
    border-radius: 6px;
    padding:0 5px;
}
.el-popover .menuMorebox .li:hover{
    background: #128cff;
}
.el-popper[x-placement^=right] .popper__arrow{
    border-right-color: #272f3e;
}
.el-popper[x-placement^=right] .popper__arrow::after{
    border-right-color: #272f3e;
}
.el-tree-node__content{
    border-radius: 6px;
}
.el-pagination.is-background .btn-next, .el-pagination.is-background .btn-prev, .el-pagination.is-background .el-pager li{
    background-color: rgba(57,63,74,0.98);
    color: #fefefe;
    height: 36px;
    line-height: 36px;
    width: 48px;
}
.el-dialog__body{
    padding: 0;
}
.dialog-body{
    padding: 20px 20px 10px 20px;
}
.el-dialog, .el-pager li,.el-message-box{
    border: 1px solid #2f3e5f;
    background-color: #212731;
    color: #fff;
}
.el-dialog__title,.el-message-box__title{
    color: #fff;
    font-size: 15px;
}
.el-dialog__header{
    position: relative;
}
.el-dialog__header:after{
    content: "";
    display: block;
    height: 1px;
    background-color: #555960;
    position: absolute;
    bottom: 0;
    left: 15px;
    right: 15px;
}
.el-dialog__body,.el-message-box__content{
    color: #fff;
}
.el-dialog__footer,.el-message-box__btns{
    text-align: center;
}
.el-message-box__btns{
    padding: 5px 15px ;
}
.el-button{
    background: rgba(57,63,74,0.98);
    border: 1px solid rgba(57,63,74,0.98);
    color: #fff;
    border-radius: 6px;
}
.el-button--primary {
    color: #FFF;
    background-color: #128cff;
    border-color:#128cff;
}
.el-button:focus, .el-button:hover {
    color: #128cff;
    border-color: rgba(57,63,74,1);
    background-color: rgba(57,63,74,1);
}
.el-button--primary:focus, .el-button--primary:hover {
    background: #128cff;
    border-color: #128cff;
    color: #FFF;
}
.el-tree{
    background-color: transparent;
    color: #fff;
}
.el-tree-node{
    background-color: transparent;
}
.el-tree-node:focus>.el-tree-node__content {
    background-color: transparent;
}
.custom-tree-node.hover,.el-tree-node__content.hover,.custom-tree-node.hover a{
    color: #128cff;
}

/*.el-tree-node__content:hover .custom-tree-node.hover,*/
/*.el-tree-node__content:hover .custom-tree-node.hover .el-tree-node__expand-icon{*/
/*    color: #fff;*/
/*}*/

.el-tree-node__content:hover{
    background-color: transparent;
    background: transparent;
}
.custom-tree-content:hover,
.el-icon-more:hover,
.el-tree-node__expand-icon:hover {
    color: #128cff;
}
.custom-tree-node.hover .el-tree-node__expand-icon{
    color: #128cff;
}
.el-loading-mask{
    background-color: rgba(0,0,0,.3);
}
.fn-loading .el-loading-spinner i{
    color: #fff;
    font-size: 32px;

}
.el-pagination__total,.el-pagination__jump{
    color: #d5d5d5;
}


.el-message{
    border-color: #148eff;
    background-color: #253b55;
    max-width: 80%;
}
.el-message__content,.el-message-box__message p{
    word-wrap:break-word;
}
.el-message .el-icon-info {
    color: #148eff;
}
.el-message--info .el-message__content {
    color: #148eff;
}
.el-message__closeBtn{
    color: #eee;
}
.el-message__closeBtn:hover{
    color: #fff;
}
.el-message--success {
    background-color: #21423a;
    border-color: #67C23A;
}
.el-message--warning {
    background-color: #453433;
    border-color: #E6A23C;
}
.el-message--error {
    background-color: #453139;
    border-color: #F56C6C;
}
.left-menu .menu-name{
    padding-top: 2px;
    font-size: 11px;
    color: #ccc;
    cursor: pointer;
}
.left-menu .el-form-item__label{
    color: #ccc;
}
.moreBox .setBox{
    border-top: 1px solid #383b3f;
}