html, body, div, span, applet, object, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    font-weight: normal;
    vertical-align: baseline;
}

* {
    margin: 0;
    padding: 0;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
    display: block;
}

ol, ul, li {
    list-style: none;
}

blockquote, q {
    quotes: none;
}

blockquote:before, blockquote:after, q:before, q:after {
    content: '';
    content: none;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

th, td {
    vertical-align: middle;
}

/* custom */
html, body, #app {
    height: 100%;
}

#app {
    background-color: #ffffff;
}
#app >img{
    width: 100%;
    height: 2.1rem;
    display: block;
}
#app .main > p{
    font-size: .2rem;
    display: flex;
    align-items: center;
    padding-top: 0.2rem;
}
#app .main{
    padding: 0 .1rem .3rem;
}
#app .main > p::before{
    display: block;
    content: '';
    width: .04rem;
    height: .2rem;
    background-color: #de332c;
    margin-right: .08rem;
}
#app .main .video-box{
    padding-bottom: .1rem;
    overflow: hidden;
    position: relative;
}
#app .main .video-box > span{
    font-size: .14rem;
    position: absolute;
    right: .26rem;
    bottom: .14rem;
}
#app .main .video-box > p{
    font-size: .18rem;
    margin: .12rem 0;
}
#app .main .video-box .video-content{
    width: 100%;
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    margin-bottom: -.2rem;
    height: .7rem;
    padding-bottom: .22rem;
}
#app .main .video-box .video-content a{
    min-width: 1.05rem;
    height: 100%;
    display: flex;
    margin: 0 .04rem;
    align-items: center;
}
#app .main .video-box .video-content a >img{
    width: 100%;
    height: 100%;
}
#app .main .picture-box > div{
    display: flex;
    /*gap: .08rem;*/
    position: relative;
}
#app .main .picture-box > div > a:nth-child(2) {
    margin: 0 .08rem;
}
#app .main .picture-box > p{
    font-size: .18rem;
    margin: .16rem 0;
}
#app .main .picture-box > div > a{
    width: 1.16rem;
    height: .7rem;
    flex: 1;
    display: flex;
}
#app .main .picture-box > div a > img{
    width: 100%;
    height: 100%;
}
#app .main .picture-box > div > span{
    font-size: .14rem;
    position: absolute;
    right: .04rem;
    bottom: .02rem;
    color: white;
}
#app .m-footer{
        background-color: #F7F7F7;
        color: black;
        font-size: .12rem;
        padding: .05rem 0 .05rem;
        line-height: .18rem;
        text-align: center;
    }
#app .m-footer div{
         transform: scale(0.8);
        -webkit-transform: scale(0.8);
    }