/**
 * cxCalendar Style
 * ------------------------------ */
.cxcalendar{position:absolute;z-index:10000;top:-999px;left:-999px;width:262px;border:1px solid #ccd1d9;border-radius:3px;background-color:#fff;box-shadow:1px 2px 3px rgba(0,0,0,0.2);color:#434a54;font-size:14px;opacity:0;
-webkit-user-select:none;
-moz-user-select:none;
user-select:none;
transform:translate(0,5%);
transition-property:opacity,transform;
transition-duration:0.3s;
transition-delay:0.1s;
}
.cxcalendar.show{opacity:1;
transform:translate(0,0);
}

/* 背景遮罩层 */
.cxcalendar_lock{display:none;position:fixed;z-index:9999;top:0;left:0;right:0;bottom:0;background-color:rgba(0,0,0,0);}
.cxcalendar_lock.show{display:block;}

.cxcalendar_hd{position:relative;height:30px;padding:8px 50px 0;font-weight:bold;font-size:16px;line-height:30px;text-align:center;
}

/* 上、下月切换按钮 */
.cxcalendar_hd .prev,
.cxcalendar_hd .next{position:absolute;top:50%;width:28px;height:28px;padding:0;margin-top:-12px;border:1px solid transparent;border-radius:2px;color:#434a54;font:0/0 Arial;text-decoration:none;outline:0;}
.cxcalendar_hd .prev{left:20px;margin-left:-12px;}
.cxcalendar_hd .next{right:20px;margin-right:-12px;}
.cxcalendar_hd .prev:before,
.cxcalendar_hd .next:before{content:'';position:absolute;top:50%;left:50%;width:0;height:0;margin:-6px 0 0 -5px;border-top:6px solid transparent;border-bottom:6px solid transparent;font:0/0 Arial;}
.cxcalendar_hd .prev:before{border-right:10px solid currentColor;}
.cxcalendar_hd .next:before{border-left:10px solid currentColor;}

/* 年、月选框 */
.cxcalendar_hd select{display:inline-block;box-sizing:border-box;height:30px;margin:0;padding:0 6px;border:1px solid transparent;border-radius:3px;background:#fff;color:#434a54;font-weight:bold;font-size:16px;line-height:30px;text-align:center;vertical-align:top;outline:none;cursor:pointer;
-webkit-appearance:none;
-moz-appearance:none;
appearance:none;
}
.cxcalendar_hd em{display:inline-block;font-style:normal;}
.cxcalendar_hd .year + em:after{content:'年';}
.cxcalendar_hd .month + em:after{content:'月';}

.cxcalendar_hd .prev:hover,
.cxcalendar_hd .next:hover,
.cxcalendar_hd select:hover{border:1px solid #aab2bd;background:#e6e9ed;}

/* 日期 */
.cxcalendar_bd{position:relative;padding:0 5px;line-height:30px;z-index:1;}
.cxcalendar_bd ul{overflow:hidden;margin:0;padding:0 0 6px;list-style:none;color:#656d78;text-align:center;
display:flex;
flex-wrap:wrap;
}
.cxcalendar_bd ul li{box-sizing:border-box;height:34px;margin:0;padding:0;border:2px solid #fff;border-radius:5px;cursor:pointer;
flex-grow:0;
}
.cxcalendar_bd ul li:hover{background-color:#e6e9ed;}
.cxcalendar_bd ul li.week,
.cxcalendar_bd ul li.del{cursor:default;}
.cxcalendar_bd ul li.del.sat,
.cxcalendar_bd ul li.del.sun,
.cxcalendar_bd ul li.del.now,
.cxcalendar_bd ul li.del.holiday,
.cxcalendar_bd ul li.del{color:#ccd1d9;text-decoration:line-through;}
.cxcalendar_bd ul li.del:after{color:#ccd1d9;}
.cxcalendar_bd ul li.now{background-color:#f3f3f3;}
.cxcalendar_bd ul li.now.del,
.cxcalendar_bd ul li.week:hover,
.cxcalendar_bd ul li.del:hover{background:none;}
.cxcalendar_bd ul li.selected,
.cxcalendar_bd ul li.selected.sat,
.cxcalendar_bd ul li.selected.sun,
.cxcalendar_bd ul li.selected.holiday,
.cxcalendar_bd ul li.selected:hover{background-color:#8cc152;color:#fff;}
.cxcalendar_bd ul li.selected:after{color:#fff;}

/* 日期列表 */
.cxcalendar_bd .days{text-align:center;}
.cxcalendar_bd .days li{
flex-basis:14%;
}
.cxcalendar_bd .days .sat{color:#4a89dc}
.cxcalendar_bd .days .sun{color:#da4453;}
.cxcalendar_bd .days .holiday{color:#da4453;}
.cxcalendar_bd .days .other{color:#ccd1d9;}

/* 星期标题 */
.cxcalendar_bd .days li.week.sat,
.cxcalendar_bd .days li.week.sun{color:#656d78;}
.cxcalendar_bd .days li.week{padding:0;}

/* 月份、年份列表 */
.cxcalendar_bd .months,
.cxcalendar_bd .years{text-align:center;}
.cxcalendar_bd .months li{
flex-basis:33.3%;
}
.cxcalendar_bd .years li{
flex-basis:25%;
}
.cxcalendar_bd .months li:after,
.cxcalendar_bd .years li:after{content:'月';margin-left:2px;color:#acb2bb;font-size:10px;vertical-align:top;}
.cxcalendar_bd .years li:after{content:'年';}

/* 时间 */
.cxcalendar_bd .times{overflow:hidden;position:relative;padding:6px 2px;border-top:1px solid #ddd;color:#aab2bd;line-height:30px;}
.cxcalendar_bd .times:before{content:'选择时间';display:inline-block;margin-right:6px;}
.cxcalendar_bd .times:only-child{border-top:none;}

.cxcalendar_bd .times select{display:inline-block;box-sizing:border-box;height:30px;margin:0;padding:0 6px;border:1px solid transparent;border-radius:3px;background:#fff;color:#434a54;font-size:14px;line-height:30px;text-align:center;vertical-align:top;outline:none;cursor:pointer;
-webkit-appearance:none;
-moz-appearance:none;
appearance:none;
}
.cxcalendar_bd .times i{padding:0 2px;font-style:normal;}
.cxcalendar_bd .times i:after{content:':';display:inline-block;}

.cxcalendar_bd .times .confirm{position:absolute;top:50%;right:5px;height:28px;margin-top:-14px;padding:0 10px;border-radius:3px;background-color:#4a89dc;color:#fff;line-height:28px;text-decoration:none;}
.cxcalendar_bd .times .confirm:before{content:'确定';}
.cxcalendar_bd .times .confirm:hover{background-color:#3d7aca;}

/* 其他操作，若不需要可以设为 display:none; */
.cxcalendar_acts{position:absolute;top:40px;left:100%;width:2em;font-size:12px;line-height:1.2;}
.cxcalendar_acts a{display:block;width:1em;padding:5px 0.5em;border-radius:0 3px 3px 0;background-color:#ccd1d9;box-shadow:1px 1px 2px rgba(0,0,0,0.2);color:#fff;text-decoration:none;text-align:center;}
.cxcalendar_acts a + a{margin-top:10px;}
.cxcalendar_acts a:hover{color:#fff;background-color:#aab2bd;}
.cxcalendar_acts .today:before{content:'今天';}
.cxcalendar_acts .clear:before{content:'清除';}

/* 固定屏幕底部 */
.cxcalendar.fixed{position:fixed;top:auto;bottom:-500px;left:0;right:0;width:auto;border:none;border-radius:0;box-shadow:none;opacity:1;
transform:none;
transition-property:bottom;
transition-delay:0;
}
.cxcalendar.fixed.show{bottom:0;}

.cxcalendar.fixed + .cxcalendar_lock{display:block;background-color:rgba(0,0,0,0);
transform:translate(0,-100%);
transition-property:background-color,transform;
transition-duration:0.3s,0s;
transition-delay:0s,0.3s;
}
.cxcalendar.fixed + .cxcalendar_lock.show{background-color:rgba(0,0,0,0.4);
transform:translate(0,0);
transition-delay:0s;
}

.cxcalendar.fixed .cxcalendar_hd .prev{left:30px;}
.cxcalendar.fixed .cxcalendar_hd .next{right:30px;}

.cxcalendar.fixed .cxcalendar_bd{padding:0 10px 15px;line-height:36px;}
.cxcalendar.fixed .cxcalendar_bd ul li{height:40px;}
.cxcalendar.fixed .cxcalendar_bd .times{padding-top:10px;padding-bottom:10px;}
.cxcalendar.fixed .cxcalendar_bd .times .confirm{height:32px;margin-top:-15px;line-height:30px;}

.cxcalendar.fixed .cxcalendar_acts{top:auto;left:auto;bottom:100%;right:10px;width:auto;line-height:30px;}
.cxcalendar.fixed .cxcalendar_acts a{float:left;width:auto;padding:0 10px;border-radius:3px 3px 0 0;box-shadow:none;}
.cxcalendar.fixed .cxcalendar_acts a + a{margin:0 0 0 10px;}

/* 不显示秒输入框 */
.cxcalendar.notsecs .times .mint + i,
.cxcalendar.notsecs .times .secs{display:none;}

/* 英文 */
.cxcalendar.en .cxcalendar_hd .year + em:after,
.cxcalendar.en .cxcalendar_hd .month + em:after,
.cxcalendar.en .cxcalendar_bd .months li:after,
.cxcalendar.en .cxcalendar_bd .years li:after{content:'';}

/* 节假日 */
.cxcalendar.holyday{width:400px;}
.cxcalendar.holyday .cxcalendar_bd{font-size:18px;line-height:30px;}
.cxcalendar.holyday .cxcalendar_bd ul li{height:50px;}
.cxcalendar.holyday .cxcalendar_bd ul li.week{height:30px;font-size:14px;}
.cxcalendar.holyday .cxcalendar_bd .days .holiday{position:relative;}
.cxcalendar.holyday .cxcalendar_bd .days .holiday:before{content:attr(data-title);position:absolute;top:30px;left:0;right:0;overflow:hidden;font-size:10px;line-height:1;text-align:center;white-space:nowrap;text-overflow:ellipsis;}