#container{position:absolute;top:0;left:0;right:0;bottom:0;}

.destimage{
    width:100%;
}
.destimage img{
    width:7.5rem;
    /*height:4.22rem;*/
    vertical-align:middle;
    max-width:100%;
}

.page{
    background:url(dest/bg.png);
    background-size:2.38rem 1.37rem;
    overflow:auto;
}

.dest{
    padding:.2rem;
}
.block{
    background-color:#fff;
    border-radius:.1rem;
    box-shadow:0 1px 2px rgba(0,0,0,0.3);
    padding:.2rem;
}
.block-title{
    font-size:.28rem;
    font-weight:bold;
}
.block-content{
    padding:.2rem 0;
}

.block + .block{
    margin-top:.2rem;
}

.block-audio .block-title{padding-left:.4rem;background:url(dest/ico-audio.png) no-repeat 0 center;background-size:.3rem .3rem;}
.block-desc .block-title{padding-left:.4rem;background:url(dest/ico-desc.png) no-repeat 0 center;background-size:.3rem .3rem;}
.block-link .block-title{padding-left:.4rem;background:url(dest/ico-link.png) no-repeat 0 center;background-size:.3rem .3rem;}

.block-desc .block-content,
.block-link .block-content{
    font-size:.28rem;
    line-height:1.8;
    color:#333;
}

.block-desc .block-content img,
.block-link .block-content img{
    max-width:100%;
}
.block-desc .block-content p,
.block-link .block-content p{
    text-indent:2em;
}

.block-audio .audio{
    display:flex;
    box-sizing:border-box;
    justify-content: center;
    align-items: center;
}
.block-audio .audio .audio-btn{
    position:relative;
    width:.8rem;
    height:.8rem;
    background:url(dest/play.png) no-repeat center center;
    background-size:.44rem .44rem;
}

.block-audio .audio.playing .audio-btn{
    background-image:url(dest/pause.png);
}
.block-audio .audio.paused .audio-btn{
    background-image:url(dest/play.png);
}

.block-audio .audio .audio-btn:before{
    content:'';
    display:block;
    position:absolute;
    width:.6rem;height:.6rem;
    top:50%;
    left:50%;
    margin-top:-.34rem;
    margin-left:-.36rem;
    border:0.04rem solid #7D5236;
    border-radius:50%;
}
.block-audio .audio .audio-time{
    color:#7D5236;
    font-size:.28rem;
    font-weight:700;
    margin-left:0.05rem;
}
.block-audio .audio .audio-progress{
    flex:1;
    height:.06rem;
    margin-left:.3rem;
    background-color:#D2C1B6;
    position:relative;
}
.block-audio .audio .audio-progress .c{
    height:.06rem;
    background-color:#7D5236;
}
.block-audio .audio .audio-progress .d{
    position:absolute;
    width:0;
    height:0;
}
.block-audio .audio .audio-progress .d:before{
    position:absolute;
    left:0;
    content:'';
    display:block;
    border-radius:50%;
    transform:translate(-.20rem, -.20rem);
    border:.18rem solid rgba(194, 148, 114, 0.5);
}
.block-audio .audio .audio-progress .d:after{
    position:absolute;
    left:0;
    content:'';
    display:block;
    border-radius:50%;
    transform:translate(-.14rem,-.14rem);
    border:.12rem solid rgba(125,82,54, 1);
}
.block-audio .audio .audio-duration{
    color:#7D5236;
    font-size:.28rem;
    font-weight:700;
    margin-left:.2rem;
}