@charset "utf-8";
/*日历*/
.calendarWatch{ min-width:350px; min-height:350px; height:100%; padding-top:100px; box-sizing:border-box; -moz-box-sizing:border-box; ms-box-sizing:border-box;}
.calendarWatch .calendar-hd{ margin-top:-100px;}
.calendarWatch .calendar-year{ height:50px; padding:0 10px; color:#333333; text-align:center; background-color:#C00; border-radius:10px 10px 0 0;}
.calendarWatch .calendar-year b{ display:inline-block; margin-top:10px; text-align:center; min-width:8em; font-size:22px; line-height:30px; vertical-align:top; color:#FFF; }
/*月份上下翻页*/
.calendarWatch .calendar-year span{ display:inline-block; text-align:left; cursor:pointer; width:30px; height:30px; margin:10px; background:#D33; border-radius:5px; }
.calendarWatch .calendar-year span::after{ content:""; display:inline-block; width:10px; height:10px; line-height:20px; border:solid #fbb; border-width:2px 0 0 2px; transform:rotate(-45deg); margin:9px 0 0 11px;}
.calendarWatch .calendar-year span.calendar-btn-r::after{ margin:9px 0 0 6px; transform:rotate(-225deg)}
.calendarWatch .calendar-year span:hover{ background-color:#ee3333;}
.calendarWatch .calendar-year span:hover::before,
.calendarWatch .calendar-year span:hover::after{ border-color:#FFF}
.calendarWatch .calendar-year span.calendar_btn_close{ display:none}
/*月份*/
.calendarWatch .calendar-day{ height:100%; background-color:#FFF; border:1px solid #f0f0f0; border-radius:0 0 10px 10px;}
.calendarWatch .calendar_month{ height:100%; padding-top:40px; box-sizing:border-box; -moz-box-sizing:border-box; ms-box-sizing:border-box;}
.calendarWatch .calendar_month>div{ height:40px; margin-top:-40px; background-color:#eee; text-align:center; font-size:20px; line-height:40px; color:#666}
/*星期一到日*/
.calendarWatch .week{ text-align:left; margin:0; padding:0; list-style:none; font-size:0; overflow:hidden; width:100%; box-sizing:border-box; -moz-box-sizing:border-box; ms-box-sizing:border-box; }
.calendarWatch .week li{ display:inline-block; width:14.28571428571429%; font-size:16px; text-align:center; color:#333; box-sizing:border-box; -moz-box-sizing:border-box; ms-box-sizing:border-box; }
.calendarWatch .week li span{ display:inline-block; line-height:40px; width:40px; height:40px; border-radius:40px; border:0px solid #ddd;}
.calendarWatch .week-hd{ background-color:#f0f0f0 }
.calendarWatch .week-hd li{ line-height:50px;}
/*每一天的样式*/
.calendarWatch .week-day{ min-height:240px; height:100%; background-color:#f9f9f9;}
.calendarWatch .week-day li{ height:16.6666666667%; display:inline-table}
.calendarWatch .week-day li:nth-child(0) span,
.calendarWatch .week-day li:nth-child(7n+0) span,
.calendarWatch .week-day li:nth-child(7n+1) span{ color:#F00}
.calendarWatch .week-day li.duty-prev span,
.calendarWatch .week-day li.duty-next span{ color:#eee; border-color:#f0f0f0; }
.calendarWatch .week-day li.duty-prev,
.calendarWatch .week-day li.duty-next,
.calendarWatch .week-day li.duty-ran{ background-color:#f9f9f9; }
.calendarWatch .week-day li.duty-ran span{ color:#ccc; border-color:#ff0000;}
.calendarWatch .week-day li.duty-now span{ color:#f00; background-color:#ffeeee; border-color:#ff9999; }
.calendarWatch .week-day li.duty-cur span{ color:#fff; background-color:#CC0000; border-color:#CC0000; }
.calendarWatch .week-day li.onclick{ cursor:pointer; background-color:#FFF}
.calendarWatch .week-day li>div{ display:table-cell; vertical-align:middle;}
/*显示多月*/
.manyMoons .calendar-year{ background-color:#f0f0f0; text-align:left;}
.manyMoons .calendar-year b{ display:none}
.manyMoons .calendar-year span.calendar_btn_close{ display:block; float:right;}
.manyMoons .calendar-year span.calendar_btn_close::after{ margin:8px 0 0 2px;}
.manyMoons .calendar-year span.calendar_btn_close::before{ content:""; display:inline-block; width:10px; height:10px; margin:9px 0 0 2px; line-height:20px; border:solid #AAA; border-width:2px 0 0 2px; transform:rotate(-225deg)}
.manyMoons .calendar-year span{ background-color:#e6e6e6}
.manyMoons .calendar-year span::after,
.manyMoons .calendar-year span::before{ border-color:#AAA}
.manyMoons .calendar-year span:hover::before{ border-color:#FFF}
.manyMoons .week-hd{ background-color:#C00;}
.manyMoons .week-hd li{ color:#FFF;}
.manyMoons .calendar-year,
.manyMoons .calendar-day{ border-radius:0}
.manyMoons li.duty-prev span,
.manyMoons li.duty-next span{ text-indent:-9999em;}
.manyMoons li.duty-next{ display:none}