@charset "UTF-8";

.modal-box {
	display: block;
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background-color: rgba(0,0,0,0.5);
	z-index: 999;
}
.modal {
	overflow: hidden;
	position: absolute;
	top: 50%;
	left: 50%;
	width:700px;
	padding:20px;
	min-height: 100px;
	border-radius: 5px;
	box-sizing: border-box;
	box-shadow: 0 0 5px 0 rgba(0,0,0,0.2);
	background-color: #fff;
	transform: translate(-50%,-50%);
}
.modal.alert {
	/* background-image: url(../images/basic/modal-line.png); */
	background-repeat: no-repeat;
	background-position: center 100%;
	background-size: 100% auto;
}
.modal.modal-lg {
	width:1200px;
}
.modal.modal-sm {
	width:400px;
}
.modal-header,
.modal-body,
.modal-footer {
	padding:10px 0;
	box-sizing: border-box;
}
.modal-header {
	padding:10px;
	background-color: #156ea2;
}
.modal.alert .modal-header {
	background-color: #fff;
}
.modal-header h1,
.modal-header h2,
.modal-header h3,
.modal-header h4 {
	color:#fff;
}
.modal-header .close {
	cursor: pointer;
	float: right;
	width: 28px;
	height: 28px;
	color:#fff;
	font-size: 28px;
	line-height: 28px;
	opacity: 1 !important;
}
.modal.alert .modal-header .close {
	cursor: pointer;
	float: right;
	width: 18px;
	height: 18px;
	color:#333;
	font-size: 20px;
	line-height: 18px;
	opacity: 1 !important;
}
.modal-body {
	overflow: hidden;
	overflow-y: auto;
	max-height: 800px;
	min-height: 100px;
}

.modal.alert .modal-body {
	min-height: 1px;
}

.item-list {
	overflow: hidden;
	overflow-y: auto;
	width: 100%;
	height:200px;
	margin-top:10px;
	border:1px solid #ccc;
	box-sizing: border-box;
}
.item-list li {
	padding:5px 10px;
}
.item-list li:hover {
	background-color: #f7f7f7;
	cursor: pointer;
}