/**
 * Slide 1.0
 * User: zxp
 * Date: 2019/9/2
 */


@-webkit-keyframes back2 /* Safari 与 Chrome */
{
    100% {left:10px;}
}
@-webkit-keyframes back1 /* Safari 与 Chrome */
{

    100% {left:0px;}
}
@-webkit-keyframes back3 /* Safari 与 Chrome */
{

    100% {width:0px;}
}
.slide-cell{
    position: relative;
}
.unlock{
    width: 400px;
    height: 150px;
    position: absolute;
    margin:0 auto;
    /*border: 1px solid #ccc;*/
    margin-top: 15px;
    top: -205.5px;
    display: none;
    user-select: none;
    /*background-color: #eee;*/
}
.pic1{
    /*width: 40px;*/
    /*height: 36px;*/
    position: absolute;
    /*top: 138px;*/
    left: 0px;
    border: 1px solid #000;

}
.pic2{
    position: absolute;
    /*width: 350px;*/
    /*height: 200px;*/
    /*top: 40px;*/
    left: 0px;
    border-radius: 3px;
}


.progress{position: relative; width:400px;margin:0px auto;top: 10px;height: 42px}

.progress_bg{height: 40px; border: 1px solid #04d5c2; border-radius: 5px; overflow: hidden;background-color:#d4fff2;
    font:400 17px/40px "黑体";text-align: center;color: #04d5c2;-moz-user-select: none;
    -webkit-user-select: none;
    user-select: none;
}
.progress_bar{background: #d4fff2; width: 30px; height: 40px; border-radius: 5px;}
.progress_btn{width: 60px; height: 42px; border-radius: 5px; position: absolute;background:#fff;font:600 22px/40px "黑体";text-align: center;
    left: 10px; margin-left: -10px; top:0px; cursor: pointer;border:1px #04d5c2 solid;box-sizing:border-box;draggable:true;
    color: #04d5c2;user-select: none;}
.progress_btn:hover{border-color:#F7B824;}

.progress_span {
    position: absolute;
    /*margin: 0 7px 0 2px;*/
    vertical-align: middle;
    color: #999;
    top: 0;
    right: 92px;
    margin: 0 auto;
    font: 15px/42px "黑体";

}