.dateMain{ z-index: 1005; width: 100%; max-width:450px; height: 100%; background: #fff; overflow: hidden; position: fixed; top: 0; left: 0;  -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none; -webkit-backface-visibility: hidden; -webkit-transform-style: preserve-3d; color:#333}
.dateMain .top{ width: 100%; text-align: center; position: fixed; top: 0; left: 0; z-index: 99; background: #c0a46d;}
.dateMain .top .close{ padding: 9px; position: absolute; top: 0; left: 0; cursor:pointer}
.dateMain .top .close span{ width: 25px; height: 25px; line-height: 25px; font-size: 16px; color: #fff; text-align: center; display: block; border: 1px solid #fff; -moz-border-radius: 100%; -webkit-border-radius: 100%; border-radius: 100%;}
.dateMain .top .title{ height: 45px; line-height: 45px; font-size: 14px; font-weight: bold; color: #fff;}
.dateMain .top .decide{ padding: 9px; position: absolute; top: 0; right: 0; cursor:pointer}
.dateMain .top .decide span{ height: 25px; line-height: 27px; padding: 0 10px; font-size: 13px; color: #494438; text-align: center; display: block; background: #fff; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px;}
.dateMain .top .week{ height: 28px; line-height: 26px; font-size: 14px; color: #fff; background: #c0a46d; overflow: hidden;}
.dateMain .top .week span{ width: 14.2587%; float: left;}
.dateMain .middle{ width: 100%; height: 100%; position: relative; padding-top: 73px; box-sizing: border-box; overflow-y: auto; overflow-x:hidden; -webkit-backface-visibility:hidden; -webkit-scrollbar:none; -webkit-overflow-scrolling:touch;}
.dateMain .middle::-moz-scrollbar{ display:none;}
.dateMain .middle::-webkit-scrollbar{ display:none;}
.dateMain .middle .flot{ width: 50px; height: 50px; -webkit-backface-visibility: hidden; -webkit-transform-style: preserve-3d; transition:all 0.3s ease 0s; background: #fc6e51; position: absolute; z-index: 2; -moz-border-radius: 100%; -webkit-border-radius: 100%; border-radius: 100%;}
.dateMain .middle .title{ text-align: center; background: #f2ede2; position: relative; z-index: 1;}
.dateMain .middle .title .prevMiddle,
.dateMain .middle .title .nextMiddle{ font-size: 16px; padding: 6px 16px; font-family: simsun; position: absolute; top: 0; cursor: pointer;}
.dateMain .middle .title .prevMiddle{ left: 0;}
.dateMain .middle .title .nextMiddle{ right: 0;}
.dateMain .middle .title span{ display: block; font-size: 16px; padding: 6px 0; color: #333;}
.dateMain .middle .days{ padding: 10px 0; overflow: hidden;}
.dateMain .middle .days li{ width: 14.2587%; height: 50px; line-height: 50px; border: 1px solid #f8f8f8; box-sizing: border-box; font-size: 16px; float: left; text-align: center; position: relative; z-index: 9;}
.dateMain .middle .days li.click{ background: #fff; cursor: pointer;}
.dateMain .middle .days li.onClick{ color: #999; background-color: #f6f6f6;}
.dateMain .middle .days li.start,.dateMain .middle .days li.end{ color: #fff; background: #c0a46d ;}
.dateMain .middle .days li.and{ color: #c0a46d; background: #f2ede2;}
.dateMain .middle .days li .s-2{ width: 100%; line-height: 1; font-size: 10px; text-align: center; position: absolute; bottom: 4px; left: 0;}
.dateMain .middle .days li .s-3{ width: 100%; color: #494438; line-height: 1; font-size: 10px; text-align: center; position: absolute; top: 4px; left: 0;}
.dateMain .middle .days li.onClick .s-3{ color: #999;}
.dateMain .middle .days li.start .s-3,
.dateMain .middle .days li.and .s-3,
.dateMain .middle .days li.end .s-3{ color: #fff;}
.dateMain .middle .months{ padding: 10px 0; overflow: hidden;}
.dateMain .middle .months li{ width: 25%; height: 80px; line-height: 80px; border: 1px solid #f8f8f8; box-sizing: border-box; background: #fff; font-size: 16px; float: left; text-align: center; position: relative; z-index: 9; cursor: pointer;}
.dateMain .middle .months li.active{ background: #494438; color: #fff;}
.dateMain .middle .years{ padding: 10px 0 80px; overflow: hidden;}
.dateMain .middle .years li{ width: 20%; height: 50px; line-height: 50px;  border: 1px solid #f8f8f8; box-sizing: border-box; background: #fff; font-size: 16px; float: left; text-align: center; position: relative; z-index: 9; cursor: pointer;}
.dateMain .middle .years li.active{ background: #494438; color: #fff;}
.dateMain .bot{ width: 50px; height: 50px; line-height: 52px; font-size: 16px; text-align: center; background: #fff; cursor: pointer; z-index: 9; position: fixed; bottom: 10px; color: #fff; background: #b4b9c7; -moz-border-radius: 100%; -webkit-border-radius: 100%; border-radius: 100%;}
.dateMain .bot.btn01{ right: 10px;}
.dateMain .bot.btn02{ right: 70px;}
.dateMain .bot.btn03{ right: 130px; background: #c0a46d;}
@media (min-width: 450px) {
    .dateMain{
        left:50%;
        margin-left:-225px;}
}