.swiper-container { height: 120px;overflow:hidden;width:100%;background:#f8f9fa;}
.swiper-pagination-bullet-active{background:#07c160;}
.blocklist{position:relative;background:#f8f9fa;}
.kswrapper{position:relative;height:100px;}
.kswlefter{width:100%;padding-top:10px;padding-left:10px;}
.kstag{display:inline-block;padding:8px 10px;background:#d2f4df;border-radius:10px;color:#aa5e26;margin-top:10px;}
.kswrigher{position:absolute;right:20px;margin-top:-50px;font-size:18px;}
.kswrigher font{color:#aa5e26;}
.ksloading{width:100%;height:130px;position:relative;}
.ksloading a{display:block;width:100%;height:160px;position:absolute;background:url(../image/ksloading.png) no-repeat right center;background-size:contain;top:-30px;}
.ksdlefter{width:70%;}
.ksbg-red{background:#ed6464}
a.ksbutton,a.ksbutton:hover,a.ksbutton:active{display:inline-block;padding:5px 10px;font-size:16px;background:#d2f4df;border-radius:10px;color:#aa5e26;position:absolute;right:10px;top:50%;margin-top:-19px;font-weight:bold;}
/*发票管理*/
/*搜索框*/
.sowrapper{width:100%;height:32px;}
.sow-select{width:70px;height:30px;border:1px #ccc solid;overflow:hidden;float:left;border-bottom-left-radius:5px;border-top-left-radius:5px;}
.sow-select select{border:0;width:70px;height:30px;}
.sow-keyword{width:calc(100% - 122px);height:30px;overflow:hidden;float:left;background:#fff;border-top:1px #ccc solid;border-bottom:1px #ccc solid;padding:0 5px;}
.sow-keyword input{width:100%;height:30px;background:none;border:0;line-height:30px;padding:0;}
.sow-sub{width:40px;height:32px;overflow:hidden;float:left;}
.sow-sub a{width:40px;height:32px;background:#aa5e26;border-bottom-right-radius:5px;border-top-right-radius:5px;display:block;text-align:center;line-height:32px;}
.sow-sub a font{color:#fff; font-size:18px;}
/*筛选栏*/
.filterwrapper{width:100%;height:24px;margin:10px 0;position:relative;}
.filterwrapper input{border:0;background:none;height:24px;line-height:24px;padding:0 5px;width:80px;font-size:14px;}
.filterwrapper input::-webkit-input-placeholder{color:#000;}
.filterwrapper input::-moz-placeholder{color:#000;}
.filterwrapper input:-ms-input-placeholder{color:#000;}
.filterwrapper .date-picker{position:absolute;left:78px;top:9px;}
.filterwrapper select{background:none;border:0;width:80px;height:24px;margin-left:10px;font-size:14px;}
.filterwrapper .sendbill{position:absolute;right:0;top:2px;color:#000;font-size:14px;}
/*发票列表*/
.billlist{width:calc(100% - 20px);margin-bottom:10px;background:#f8f9fa;padding:0 10px;}
.bl-title{height:34px;line-height:34px;border-bottom:1px #aa5e26 solid;font-size:18px;position:relative;}
.bl-title .dot{margin-right:5px;color:#aa5e26;}
.bl-title .dateshow{position:absolute;right:0;font-size:14px;top:2px;}
.bl-content{position:relative;padding:10px 10px 15px 15px;}
.bl-content-fee{position:absolute;right:0;top:28px;}
.bl-content-btn,.bl-content-btn:active{display:inline-block;width:90px;height:32px;line-height:32px;text-align:center;border-radius:10px;position:absolute;right:5px;top:70px;background:#cdfddb;color:#000;}
.bl-content-btn.otherstatus,.bl-content-btn.otherstatus:active{color:#cb594d;}
.bl-content-canceltag{width:132px;height:56px;background:url(../image/canceltag.png) no-repeat 0 0;position:absolute;display:inline-block;right:0;top:30px;}
/*加载更多*/
.billloadmore{margin:15px auto;height:30px;text-align:center;}
.billloadmore a{width:70%;height:30px;line-height:30px;text-align:center;background:#cdfddb;display:inline-block;color:#aa5e26;border-radius:10px;}
.billloadmore a font{margin-left:10px;}


/*签到队列*/
.bg {
    background-color: cadetblue;
}

.main {
    width: 95%;
    height: 230px;
    float: left;
    margin-left: 10px;
    text-align: center;
}

.main_top {
    width: 99%;
    height: 65px;
    float: left;
    text-align: left;
}

.main_top_dept {
    width: 100%;
    height: 20px;
    scroll-margin-top: 10px;
    font-size: 15px;
    line-height: 20px;
    color: #000000;
    margin-top: 5px;
    margin-left: 3px;
    text-align: left;
    font-weight: bold;
}

.main_top_room {
    width: 100%;
    height: 35px;
    scroll-margin-top: 10px;
    font-size: 18px;
    line-height: 35px;
    color: #FFFFFF;
    text-align: left;
    margin-top: 5px;
    font-weight: bold;
    background-color: #4682B4;
    border-radius: 10px 10px 0 0;
}

.main_center_1 {
    width: 99%;
    height: 50px;
    float: left;
    border-bottom: 1px solid #ab7034;
}

.main_center_left_1 {
    width: 25%;
    height: 50px;
    float: left;
    font-size: 18px;
    background-color: #00868B;
    color: #FFFFFF;
    line-height: 50px;
}

.main_center_right_1 {
    width: 75%;
    height: 50px;
    font-size: 20px;
    float: left;
    color: #4682B4;
    font-weight: bold;
    background-color: #ADD8E6;
    line-height: 50px;
}

.main_center_2 {
    width: 99%;
    height: 55px;
    float: left;
    border-bottom: 1px solid #ab7034;
}

.main_center_left_2 {
    width: 25%;
    height: 55px;
    float: left;
    font-size: 18px;
    background-color: #00868B;
    color: #FFFFFF;
    line-height: 55px;
}

.main_center_right_2 {
    width: 75%;
    height: 55px;
    font-size: 30px;
    float: left;
    color: #4682B4;
    font-weight: bold;
    background-color: #ADD8E6;
    line-height: 27px;
}

.main_center_right_num {
    width: 55%;
    height: 55px;
    float: left;
    line-height: 55px;
}

.main_center_3 {
    width: 99%;
    height: 50px;
    float: left;
    border-bottom: 1px solid #ab7034;
}

.main_center_left_3 {
    width: 25%;
    height: 50px;
    float: left;
    font-size: 18px;
    background-color: #00868B;
    color: #FFFFFF;
    line-height: 50px;
}

.main_center_right_3 {
    width: 75%;
    height: 50px;
    font-size: 17px;
    float: left;
    color: #3a3939;
    background-color: #ADD8E6;
    line-height: 50px;
}

.main_down {
    width: 97%;
    height: 25px;
    float: left;
    margin-left: 12px;
    color: #ffff66;
    font-size: 18px;
}

.switch-box {
    width: 100px;
    height: 26px;
    line-height: 26px;
    float: left;
    margin-top: 14px;
}

.switch-box .switch {
    /* 隐藏checkbox默认样式 */
    display: none;
}

.switch-box label {
    /* 通过label扩大点击热区 */
    position: relative;
    display: block;
    margin: 1px;
    height: 30px;
    cursor: pointer;
}

.switchClassBefore::before {
    /* before设置前滚动小圆球 */
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -14px;
    margin-left: -14px;
    width: 26px;
    height: 26px;
    border-radius: 100%;
    background-color: #fff;
    box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, 0.06);
    /* 通过transform、transition属性控制元素过渡进而形成css3动画 */
    -webkit-transform: translateX(-33px);
    -moz-transform: translateX(-33px);
    transform: translateX(-33px);
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    transition: all 0.3s ease;
}


.switchClassBegin::before {
    /* before设置前滚动小圆球 */
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -14px;
    margin-left: -14px;
    width: 26px;
    height: 26px;
    border-radius: 100%;
    background-color: #fff;
    box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, 0.06);
    /* 通过transform、transition属性控制元素过渡进而形成css3动画 */
    -webkit-transform: translateX(-33px);
    -moz-transform: translateX(-33px);
    transform: translateX(-33px);
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.switchClassAfter::before {
    /* before设置前滚动小圆球 */
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -14px;
    margin-left: 55px;
    width: 26px;
    height: 26px;
    border-radius: 100%;
    background-color: #fff;
    box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, 0.06);
    -webkit-transform: translateX(-33px);
    -moz-transform: translateX(-33px);
    transform: translateX(-33px);
}

.switch-box .switch:checked ~ label::before {
    /* 语义：被选中的类名为"switch"元素后面的label元素里的伪类元素，进行更改css样式 */
    /* 形成伪类结构选择器：":"冒号加布尔值"checked" */
    /* " Ele1 ~ Ele2 "波浪号在css的作用：连接的元素必须有相同的父元素，选择出现在Ele1后的Ele2（但不必跟在Ele1，也就是说可以并列）  */
    -webkit-transform: translateX(-33px);
    -moz-transform: translateX(-33px);
    transform: translateX(-33px);
}

.switchClassBefore::after {
    /* after设置滚动前背景色 */
    content: "未签到";
    text-align: right;
    padding: 0 10px 0 0;
    color: #fff;
    font-size: 18px;
    display: block;
    border-radius: 30px;
    height: 28px;
    background-color: #4682B4;
}


.switchClassBegin::after {
    /* after设置滚动前背景色 */
    content: "重签";
    text-align: right;
    padding: 0 10px 0 0;
    color: #fff;
    font-size: 18px;
    display: block;
    border-radius: 30px;
    height: 28px;
    background-color: #4682B4;
}

.switchClassAfter::after {
    /* after设置滚动前背景色 */
    content: "已签到";
    text-align: left;
    padding: 0 0 0 10px;
    color: #fff;
    font-size: 18px;
    display: block;
    border-radius: 30px;
    height: 28px;
    background-color: #C2C2C2;
}

.switch-box .switch:checked ~ label::after {
    background-color: #4682B4;
}