@import 'style';
@import 'base';
$height: 50px;
.header {
	background: $color;
	color: #fff;
	height: 50px !important;
	padding: 0 24px;
	.logo{
		height: 50px;
		margin-top: 5px;
	}
	h1{
		font-size: 18px;
		line-height: 50px;
		display: inline-block;
	}
	.settings{
		float: right;
		line-height: 50px;
		img{
			position: relative;
			top: 3px;
		}
		span{
			color: #fff;
			font-size: 14px;
			padding: 0 10px;
			cursor: pointer;
		}
	}
}
.main {
	position: relative;
	height: calc(100vh - 50px);
	background: #ECF0F5;
	padding-top: 15px;
}
.left-aside {
	height: 100%;
	overflow-y: auto;
	overflow-x: hidden;
	background: #fff;
	.left-menue {
		border: none;
		& > .is-active {
			background-color: #1F315D !important;
			position: relative;
			.iconfont{
				color: $mainColor;
			}	
			&>.el-submenu__title{
				color: #fff !important;
			}
			.is-active {
				background-color: #1F315D !important;
				position: relative;
				.iconfont{
					color: $mainColor;
				}		
			}	
		}
		.is-opened{
			background-color: #fff !important;
			&>.el-submenu__title{
				color: #303133 !important;
			}
		}
		.el-menu-item-group__title{
			padding: 0;
		}
		// .el-menu-item{
		// 	height: 44px;
		// 	line-height: 44px;
		// }
	}
}
.el-main {
	// border: 1px solid red;
	padding:10px 20px;
	position: relative;
	.content{
		background: #fff;
		padding: 32px;
		margin-top: 12px;
		min-height: calc(100vh - 130px);
		box-shadow:0px 4px 12px 0px rgba(0,0,0,0.12);
	}
	.title_top{
		
		.add_btn{
			width:90px;
			height:32px;
			background:$mainColor;
			border:1px solid rgba(237,237,237,1);
			border-radius:4px;
			float: right;
			text-align: center;
			line-height: 32px;
			color: #FFF;
		}
	}

    .table_div{
        background: #fff;
        border: 1px solid #EDEDED;
        min-height: calc(100vh - 430px);
    }
    .edit_btn{
        color: #25486A;
	}
	.info_btn{
		background: #ECF0F5;
		color: #1F2328;
		border-color: #ECF0F5;
	}
	// 分页
	.el-pagination {
		// position: absolute;
		// left: 0;
		// bottom: 15px;
		text-align: center;
		width: 100%;
		margin-top: 20px;
	}
}
.el-dialog{
	.el-select{display: block;}
}
.main_btn{
	background: $mainColor;
	border-color: $mainColor;
	width: 120px;
	font-size: 14px;
}
.cancel_btn{
	width: 170px;
	font-size: 14px;
	color: #6A737B;
}
@media (max-width: 750px) {
	.left-aside {
		position: absolute;
		z-index: 9;
		height: calc(100vh - 50px);
		overflow: auto;
		transition: all 0.3s linear;
		// left: -220px;
	}
	.el-main {
		padding: 10px;
	}
	.el-dialog {
		width: 98% !important;
	}
	.header .fa-navicon,
	.header .fa-close {
		width: 16px;
		display: inline-block;
	}
	.main .mask {
		opacity: 0;
		transition: opacity 0.3s;
	}
	.main.show .mask {
		opacity: 1;
		position: absolute;
		z-index: 8;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		background-color: rgba(0, 0, 0, 0.5);
	}
}