.flipbook-viewport{
    overflow:hidden;
    width:6.92rem;
    height:10.61rem;
    visibility: hidden;
    position: absolute;
    top: 0.94rem;
    left: 0.21rem;
}

.flipbook-viewport .flipbook{
    width:6.92rem;
    height:10.64rem;
    left:0;
    top:0;
    position: absolute;
}

.flipbook-viewport .page{
    background:#fff;
    background-repeat:no-repeat;
    background-size:100% 100%;
}

.flipbook .page-wrapper[page='1'] > div:last-child{
  background-image: none !important;
}

.flipbook .page{
    -webkit-box-shadow:0 0 0.2rem rgba(0,0,0,0.2);
    -moz-box-shadow:0 0 0.2rem rgba(0,0,0,0.2);
    -ms-box-shadow:0 0 0.2rem rgba(0,0,0,0.2);
    -o-box-shadow:0 0 0.2rem rgba(0,0,0,0.2);
    box-shadow:0 0 0.2rem rgba(0,0,0,0.2);
}

.flipbook .page1-bg{
  width:6.92rem;
  height:10.64rem;
  background: url(https://cdn-daikuan.xjietiao.com/dir_mkteditor/external_jt/5d6789eff26f403488f97e00eda3d944.png?max_age=31536000) no-repeat; 
  background-size: 100% 100%;
}

.flipbook .page2-bg{
  width:6.92rem;
  height:10.64rem;
  background: url(https://cdn-daikuan.xjietiao.com/dir_mkteditor/external_jt/141245d6189e4599bed2ac2a14ad2dee.png?max_age=31536000) no-repeat; 
  background-size: 100% 100%;
}

.flipbook .page3-bg{
  width:6.92rem;
  height:10.64rem;
  background: url(https://cdn-daikuan.xjietiao.com/dir_mkteditor/external_jt/45bc15f56f3c4b559815243e71296da1.png?max_age=31536000) no-repeat; 
  background-size: 100% 100%;
}

.flipbook .right-btn{
    width: 30%;
    height: 100%;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
}
.flipbook .left-btn{
    width: 30%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
}
.flipbook .go-page1{
    width: 30%;
    height: 100%;
    position: absolute;
    right: 0;
}

.flipbook-viewport .shadow{
    -webkit-transition: -webkit-box-shadow 0.5s;
    -moz-transition: -moz-box-shadow 0.5s;
    -o-transition: -webkit-box-shadow 0.5s;
    -ms-transition: -ms-box-shadow 0.5s;
    -webkit-box-shadow:0 0 0.2rem #ccc;
    -moz-box-shadow:0 0 0.2rem #ccc;
    -o-box-shadow:0 0 0.2rem #ccc;
    -ms-box-shadow:0 0 0.2rem #ccc;
    box-shadow:0 0 0.2rem #ccc;
}
.ting-ta-shuo-box{
    position: absolute;
    top: 6.86rem;
    left: 0.45rem;
    display: flex;
    z-index: 1;
}
.ting-ta-shuo{
    width: 1.42rem;
    height: 0.46rem;
    background: linear-gradient(257deg, #03C766, #2BDE59);
    border-radius: 0.23rem;
    display: flex;
    align-items: center;
}
.ting-ta-shuo span{
    font-size: 0.26rem;
    color: #fff;
    font-weight: 500;
}
.ting-ta-shuo .ting-btn{
    width: 0.4rem;
    height: 0.46rem;
    display: block;
}
.ting-ta-shuo .ting-btn.start{
    background: url(https://cdn-daikuan.xjietiao.com/dir_mkteditor/external_jt/f4c858209bdb48eebad4cfe73ec389da.png?max_age=31536000) center no-repeat;
    background-size: 0.14rem 0.18rem;
}
.ting-ta-shuo .ting-btn.stop{
    background: url(https://cdn-daikuan.xjietiao.com/dir_mkteditor/external_jt/57370017164948988c9b44bb938456bf.png?max_age=31536000) center no-repeat;
    background-size: 0.17rem 0.21rem;
}
.time-box{
    display: flex;
    align-items: center;
    padding-left: 0.24rem;
}
.time-box .time{
    font-size: 0.24rem;
    color: #B6B4B2;
    padding-right: 0.15rem;
}
.time-box .time-all{
    font-size: 0.24rem;
    color: #B6B4B2;
    padding-left: 0.15rem;
}
.time-box .jd-box{
    display: inline-block;
    width: 1.3rem;
    height: 0.08rem;
    background: #E3E6EC;
    border-radius: 0.04rem;
    position: relative;
}
.time-box .jd-box span{
    display: inline-block;
    height: 0.08rem;
    background: #09C868;
    border-radius: 0.04rem;
    position: absolute;
    top: 0;
    left: 0;
}