html, body {
	            width: 100%;
	            height: auto;
	            padding: 0;
	            margin: 0;
	        }
	
	        ul, li {
	            padding: 0;
	            margin: 0;
	            list-style: none;
	        }
	

.open {
    z-index: 1050;
    position: relative;
}

	        #calendar {
		width: 100%;
		background: #fff;
		margin-left: auto;
		margin-right: auto;
		padding: 20px;
		box-shadow:0px 0px 9px rgba(38, 52, 65, 0.21);
	        }
			.main{
				width: 100%;
				height: auto;
			/*  background: #f4f4f4; */
				padding: 20px 0;
			}
.conyear {
    display: none;
}
.conmonth{
	display: none;
}
	        .calendar {
	            position: relative;
	            font-family: "Chinese Quote", "Microsoft YaHei";
	            font-size: 14px;
	        }
	
	
	        .calendar-header {
	            padding: 11px 16px 22px 0;
	            text-align: right;
	        }
			.calendar-tit{
				width: 245px;
				float: left;
				font-size: 24px;
				color: #717171;
				 
				padding-top: 6px;
				margin-right: 5px;
				position: relative;
			}
			.calendar-tit::after{
				content: "";
				width: 83px;
				height: 2px;
				background: #ccc;
				position: absolute;
				bottom: -7px;
				right: -10px;
				}
	        .calendar-select {
	            line-height: 1.5;
	            color: rgba(0, 0, 0, 0.65);
	            -webkit-box-sizing: border-box;
	            box-sizing: border-box;
	            margin: 0;
	            padding: 0;
	            list-style: none;
	            display: inline-block;
	            position: relative;
	            outline: 0;
	        }
	
	        .calendar-table {
	            width: 100%;
	            height: 100%;
	        }
	
	        .calendar-column-header,
	        .calendar-cell {
	            width: 14%
	        }
	
	        .calendar-column-header {
	            text-align: center;
	            padding-right: 12px;
				height: 40px;
				color: #000;
				line-height: 40px ;
				font-size: 14px;
				
				background: #f4f4f4;
	        }
	
	        .calendar-table {
	            table-layout: fixed;
	        }
			.active-today{
				display: block;
				width: 30px;
				height: 30px;
				line-height: 30px;
				border-radius: 30px;
				margin: 3px auto;
			}
			.calendar-tbody{
				border-top: 1px solid #eee;
				border-left: 1px solid #eee;
			}
	        .calendar-cell {
	            color: rgba(0, 0, 0, 0.65);
	        }
	
	
	
	            .calendar-cell.calendar-last-month-cell,
	            .calendar-cell.calendar-next-month-cell {
	                color: rgba(0, 0, 0, 0.25);
	            }
	
	        .calendar-date { 
	            border-right: 1px solid #eee;
				border-bottom: 1px solid #eee;
	        }
	
	        .calendar-cell.calendar-thisMonth .calendar-date,
	        .calendar-cell.calendar-today .calendar-date .active-today{
	            border-top-color: #1890ff;
	            color: #fff;
				background: #067cc4;
	        }
	
	        .calendar-date:hover .active-today{
	            color: #fff;
	            background: #a0d4f5;
	        }
	
	
	        .calendar-value {
	            text-align: center;
  							position: relative;
	        }
.calendar-event-dot {
    display: block;
    width: 5px;
    height: 5px;
    background: #007cc0;
    border-radius: 50%;
    position: absolute;
    left: 50%;
    margin-left: -2px;
    bottom: 0;
}
	
	        .calendar-content {
	            height: 120px;
	            overflow-x: hidden;
	            overflow-y: auto;
	            position: static;
	            width: auto;
	            left: auto;
	            bottom: auto;
	        }
	
	
	
	
	        .calendar-select {
	            font-size: 13px;
	            vertical-align: middle;
	        }
	
	        .btn.calendar-select-active {
	            border-color: #40a9ff;
	            z-index: 2;
	        }
	
	        .calendar-select:first-child {
	            margin-right: 10px;
	        }
	
	        .calendar-year-select,
			.goto-today,
			.calendar-day-select{
				height: 36px;
				line-height: 36px;
	            border-radius: 6px;
	            border: 1px solid #dddddd;
				float: left;
				background: #fafafa;
				margin-top: 10px;
				margin-left: 29px;
	        }
			.calendar-year-select,
			.calendar-day-select{
				width: 98px;
			}
			.calendar-day-select{
				display: none;
			}
	            .calendar-year-select:hover,
	            .calendar-month-select:hover {
	                border-color: #40a9ff;
	            }
	
	        .calendar-year-text,
	        .calendar-month-text,
			.calendar-day-text{
	            margin: 0 10px;
	            line-height: 34px;
	        }
			.calendar-year-text,
			.calendar-day-text{
				margin: 0 23px;
			}
			.arrow-group{
				width: 140px;
				height: 36px;
				float: left;
				margin-left: 29px;
				border-radius: 6px;
				overflow: hidden;
				border: 1px solid #ddd;
				margin-top: 10px;
			}
	        .calendar-icon {
	            margin: 0 10px 0 0;
				color: #333;
	        }
			.arrow-left,.arrow-right{
				float: left;
				width: 36px;
				height: 36px;
				text-align: center;
                /*
				line-height: 36px;
                    */
				background: #fafafa;
				margin-top: 10px;
  padding-top: 8px;
			}
			.calendar-month-select{
				width: 66px;
				height: 36px;
				line-height: 36px;
				float: left;
				background: #fafafa;
				margin-top: 10px;
				border: 1px solid #ddd;
				padding-right: 4px;
			}
			.arrow-left{
				margin-left: 29px;
				border: 1px solid #ddd;
				border-right: none;
				border-top-left-radius: 6px;
				border-bottom-left-radius: 6px;
			}
			.arrow-right{
				border: 1px solid #ddd;
				border-left: none;
				border-top-right-radius: 6px;
				border-bottom-right-radius: 6px;
			}
			.goto-today{
				width: 120px;
				height: 36px;
				cursor: pointer;
				float: left;
				color: #fff;
				background: #067cc4;
				border: 1px solid #dddddd;
				border-radius: 6px;
				text-align: center;
			}
	
	            .calendar-icon * {
	                color: #333;
	            }
	
	        .btn {
	            float: left;
	            padding: 5px 10px;
	            border: 1px solid #d9d9d9;
	            border-radius: 4px;
	        }
	
	        .btn-group {
	            float:left;
	            display: inline;
	            padding: 0 8px;
				display: none;
	        }
	
	            .btn-group > .btn {
	                position: relative;
	                float: left;
	            }
	
	                .btn-group > .btn:hover {
	                    z-index: 2;
	                    border-color: #40a9ff;
	                }
	
	            .btn-group .btn + .btn {
	                margin-left: -1px;
	            }
	
	            .btn-group > .btn:first-child {
	                border-top-right-radius: 0;
	                border-bottom-right-radius: 0;
	            }
	
	            .btn-group > .btn:last-child:not(:first-child) {
	                border-top-left-radius: 0;
	                border-bottom-left-radius: 0;
	            }
	
	
	        /*dropdown-menu*/
	        ul.dropdown-month, .dropdown-month li,
	        ul.dropdown-year, .dropdown-year li,
			ul.dropdown-day, .dropdown-day li{
	            list-style: none;
	            text-align: center;
	            padding: 0;
	            margin: 0;

                z-index: 1050;
	        }
	
	        .dropdown-month.open,
	        .dropdown-year.open,
			.dropdown-day.open{
	            display: inline-block;
	            margin-top: 1px;
	            width: 100%;
	        }
	
	        .dropdown-month,
	        .dropdown-year,
			.dropdown-day{
	            height: 250px;
	            overflow-y: auto;
	            overflow-x: hidden;
	            display: none;
	            position: absolute;
	            left: 0;
	            top: 100%;
	            background: #fff;
	            width: 50px;
	            border: 1px solid #eee;
	            box-shadow: 0px 6px 12px rgba(0,0,0,0.175);
	            -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175)
	        }
	
	            .dropdown-month .month-item,
	            .dropdown-year .year-item,
				.dropdown-day .day-item{
	                font-size: 12px;
	                position: relative;
	                display: block;
	                padding: 5px 2px;
	                line-height: 20px;
	                font-weight: normal;
	                color: rgba(0, 0, 0, 0.65);
	                white-space: nowrap;
	                cursor: pointer;
	                overflow: hidden;
	                text-overflow: ellipsis;
	                -webkit-transition: background 0.3s ease;
	                transition: background 0.3s ease;
	            }
	
	        .month-item:hover,
	        .year-item:hover {
	            background: #e6f7ff;
	        }
	
	        .year-item.active {
	            background-color: #fafafa;
	            font-weight: 600;
	            color: rgba(0, 0, 0, 0.65);
	        }
			.day-item.active {
				background-color: #fafafa;
				font-weight: 600;
				color: rgba(0, 0, 0, 0.65);
			}
	        /*自定义事件样式*/
	        ul.events li {
	            font-size: 13px;
	            padding: 2px 2px;
	        }
	
	        ul.events .total {
	            font-size: 14px;
	            font-weight: 600;
	        }
	
	        ul.events li span {
	            margin-left: 5px;
	        }
			ul.events li .licontit{
				display: block;
				width: 100%;
				height: 30px;
				position: relative;
				background: #f4f4f4;
				line-height: 30px;
				font-size: 12px;
				color: #333;
				padding-left: 9px;
				padding-right: 14px;
				white-space: nowrap;
				overflow: hidden;
				text-overflow: ellipsis;
				cursor: pointer;
				background-image: url(tit-plus.png);
				background-repeat: no-repeat;
				background-position: right 7px top 12px;
			}
			ul.events li .bg1{background-image: url(tit-plus.png);
				background-repeat: no-repeat;
				background-position: right 7px top 12px;}
			ul.events li .bg2{background-image: url(tit-minus.png);
				background-repeat: no-repeat;
				background-position: right 7px top 16px;}
			ul.events li .licon{
				display: none;
				width: 100%;
				height: auto;
				color: #333;
				line-height: 22px;
				padding: 5px;
				font-size: 12px;
			}
	        /*scrollbar*/
	        *::-webkit-scrollbar {
	            width: 8px;
	            background-color: #fff;
	        }
	
	        *::-webkit-scrollbar-thumb {
	            background-color: #e5e5e5;
	            border-radius: 8px;
	            -webkit-box-shadow: inset 0 0 6px rgba(255, 255, 255, .3);
	        }
			.calendar-column-header2{
				position: absolute;
				left: 0;
				z-index: -99;
			}
			 .condate{
				 display: none;
			 }
			 .calenar-share{
			 	display: inline-block;
			 	width: 13px;
			 	height: 12px;
			 	background: url(calenar-share-bg.png)no-repeat;
			 	cursor: pointer;
			 	margin-left: 8px;
			 }
			@media only screen and (max-width: 767px) {
				.calendar-tbody{
					border: none;
				}
				.calendar-tbody tr:nth-child(2n){
					background: #f4f4f4;
				}
				.calendar-date {
					border: none;
			}
				.calendar-day-select{
					display: block;
				}
				ul.events li span {
					margin-left: 0px;
				}
				ul.events li .licontit{
					background-image: none;
				}
				ul.events li .licon{
					display: block;
				}
				ul.events li .bg1{background-image: none;}
				ul.events li .bg2{background-image: none;}
				.condate{
					position: relative;
					display: block;
					width: 24px;
					height: 24px;
					line-height: 24px;
					font-size: 14px;
					color: #fff;
					text-align: center;
					background: #067cc4;
					border-radius: 24px;
					margin: 20px 0 10px;
				}
				.condate::before{
					content: "";
					width: 1200%;
					height: 1px;
					background: #eef2f7;
					position: absolute;
					left: 0;
					top:-10px;
				}
				#calendar {
					background: #fff;
					box-shadow: none;
					padding: 0;
				}
				.main{
					background: #fff;
					padding-bottom: 360px;
				}
			.calendar-content{
				width: 100%;
				height: 350px;
				position: absolute;
				left: 0;
				bottom: -350px;
				display: none;}
				.active-today {
				   font-size: 11px;
				}
				.calendar-cell.calendar-today .calendar-date .active-today {
					border-top-color: #1890ff;
                    color: #007cc0;
                    background: #eef2f7;
                    font-size: 14px;
                    cursor: pointer;
					position: relative;
				}
				/*.calendar-cell.calendar-today .calendar-date .active-today::after{
					content: "";
					width: 4px;
					height: 4px;
					background: #007cc0;
					border-radius: 2px;
					position: absolute;
					bottom: 0;
					left: 14px;
				}*/
  .clickday{
      color: #fff;
    text-align: center;
    background: #067cc4;
    border-radius: 24px;
  }
			.calendar-tit{float: none;}
			.act{
				display: block;
			}
			.calendar-column-header {
				color: #fff;
				background: #134795;
				padding-right: 0;
			}
			.calendar-column-header1{
				display: none;
			}
			.calendar-column-header2{
				position: static;
				left: 0;
				z-index: 99;
			}
			.calendar-column-header:nth-child(8){
				border-top-left-radius: 6px;
				border-bottom-left-radius: 6px;
			}
			.calendar-column-header:last-child{
				border-top-right-radius: 6px;
				border-bottom-right-radius: 6px;
			}
			.calendar-date:hover .active-today {
				color: #fff;
    text-align: center;
    background: #067cc4;
    border-radius: 24px;
			}
			.active-today{
				position: relative;
			}
			.calendar-year-select, .goto-today {
				margin-top: 30px;
				margin-left: 0;
			}
			/*.calendar-date:hover .active-today::after {
				content: "";
				width: 4px;
				height: 4px;
				background: #007cc0;
				border-radius: 2px;
				position: absolute;
				bottom: 0;
				left: 13px;
			}*/
			.calendar-header {
				padding: 11px 0px 22px 0;
				text-align: right;
			}
			.calendar-year-select,.calendar-month-select,.calendar-day-select {
				width: 22%;
			}
			.calendar-month-select{
				margin-top: 30px;
				margin-left: 5px;
				border-radius: 6px;
			}
			.calendar-day-select{
				float: left;
				margin-top: 30px;
				margin-left: 5px;
				border-radius: 6px;
			}
			.calendar-year-text{
				margin: 0 12px 0 10px;
			}
			.calendar-month-text {
				margin: 0 18px 0 10px;
			}
			.calendar-day-text {
				margin: 0 18px 0 10px;
			}
			.goto-today{float: right;width: 96px;height: 34px;line-height: 34px;margin-top: 31px;}
			.arrow-left{display: none;}
			.arrow-right{display: none;}
  .calendar-table{height: 44%}
				}
			@media only screen and (max-width: 320px) {
			.calendar-year-select, .calendar-month-select, .calendar-day-select {
					width: 22%;
				}
				.calendar-month-select {
					margin-left: 5px;
				}
				.calendar-year-text{
					margin: 0 3px 0 10px;
				}
				.calendar-month-text {
					margin: 0 10px 0 10px;
				}
				.calendar-day-text {
					margin: 0 10px 0 10px;
				}
				.goto-today{width: 80px;}
			}