table {
	border-collapse: collapse;
	border-spacing: 0;
}

.calendar-wraper {
	position: fixed;
	top: 50%;
	left: 50%;
	width: 600px;
	height: 500px;
	margin: -250px 0 0 -300px;
	overflow: auto;
	z-index: 1000;
	background: #fff;
	display: none;
	/* transform: translateX(100%);
	-webkit-transform: translateX(100%);
	transition: .4s;
	-webkit-transition: .4s; */
}

.calendar-wraper2 .month-bar {
	width: 100%;
	height: 30px;
	line-height: 30px;
	text-align: center;
	background-color: #fafafa;
}

.calendar-wraper.active {
	/* transform: translateX(0);
	-webkit-transform: translateX(0); */
	display: block;
}

.calendar-top-wraper {
	/* position: fixed;
	top: 0;
	left: 0; */
	z-index: 999;
	width: 100%;
	background-color: #fff;
}

.calendar-top-title-wraper {
	height: 50px;
	border-bottom: 1px solid #ddd;
}

.calendar-top-title-wraper .text {
	float: left;
	padding-left: 10px;
	line-height: 50px;
	font-size: 16px;
	color: #666;
}

.calendar-top-title-wraper .calendar-complete-button {
	float: right;
	padding-right: 10px;
}

.calendar-top-title-wraper .calendar-complete-button a {
	display: inline-block;
	width: 50px;
	height: 30px;
	margin-top: 8px;
	text-align: center;
	line-height: 30px;
	color: #2eb6a8;
	border: 1px solid #2eb6a8;
	border-radius: 7px;
}

.calendar-top-wraper .week-bar {
	height: 30px;
	line-height: 30px;
}

.calendar-top-wraper .week-bar ul {
	display: block;
	width: 99%;
}

.calendar-top-wraper .week-bar ul li {
	display: inline-block;
	width: 14%;
	text-align: center;
	color: #666;
}

.calendar-top-wraper .week-bar ul li.weekend {
	color: #fa967f;
}

.calendar-wraper .month-bar {
	width: 100%;
	height: 30px;
	line-height: 30px;
	text-align: center;
	background-color: #fafafa;
}

.calendar-bottom-wraper {
	/* margin-top: 80px; */
}

.calendar-bottom-wraper .month-panel .month-list ul {
	width: 100%;
}

.calendar-bottom-wraper .month-panel .month-list ul li {
	float: left;
	width: 14%;
	height: 40px;
	border-radius: 10px;
}

.calendar-bottom-wraper .month-panel .month-list ul li span {
	display: block;
	width: 100%;
	height: 40px;
	line-height: 40px;
	text-align: center;
	font-size: 12px;
}

.calendar-bottom-wraper .disabled {
	color: #a2a2a2;
}

.calendar-bottom-wraper .red {
	color: #f00;
	font-size: 12px !important;
	margin-top: -4px;
}

.calendar-bottom-wraper .choose-date {
	background: #2eb6a8;
	color: #fff;
}

.calendar-bottom-wraper .choose-date .red {
	color: #fff;
}

.calendar-bottom-wraper .to-top {
	position: absolute;
	top: 80px;
}

.calendar-bottom-wraper .month-panel {
	padding-bottom: 15px;
}

.calendar-bottom-wraper .month-list {
	padding-top: 15px;
}

.calendar-bottom-wraper .checked-status {
	background-color: #e0f4f2;
}

.calendar-wraper .current-month-bar {
	height: 30px;
	line-height: 30px;
	text-align: center;
	background-color: #fafafa;
}

.active-date {
	cursor: pointer;
}