html, body {
    background: #F3F3F3;
    margin: 0;
    padding: 0;
    width: 100%;
    overflow-x: hidden;
}

em {
    font-style: normal;
    font-size: .32rem;
    color: #01589b;
    font-weight: 700;
}

a {
    text-decoration: none
}

/*头部开始*/
.head {
    margin: 0 auto;
    height: auto;
}

.logo {
    background: url("/image/web/seniors/logo-68f480db49d033471bc0d4e1e7a85521.png") center no-repeat;
    background-size: 100%;
    width: 5.41rem;
    height: 1.56rem;
}

.banner-content {
    width: 12rem;
    margin: 0 auto;
    height: 100%;
    padding-top: .6rem
}

.elder-model {
    height: .58rem;
    width: 2.21rem;
    margin-top: .34rem;
    background: #FFFFFF;
    border-radius: .29rem;
    border: .02rem solid #054FAC;
    font-size: .27rem;
    font-weight: 600;
    color: #054FAC;
    text-align: center;
    line-height: .58rem;
}

.elder-model a {
    color: #054FAC;
}

.top {
    width: 19.2rem;
    height: .85rem;
    background: #4E6599;
}

.banner {
    width: 19.2rem;
    height: 3.36rem;
    background: url("/image/web/seniors/banner_pc-58cf7ffbe9f528e8663252be1d1179ce.png") center no-repeat;
    background-size: 100%;
}


.top-content {
    max-width: 12rem;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    color: white;
}

.top-date {
    font-size: .18rem;
    line-height: .85rem
}

.top-func {
    display: flex;
    font-size: .18rem;
    height: 100%;
}

.top-func a {
    padding: 0.5rem 0.25rem 0;
    height: 0.85rem;
    border-left: 1px solid #365a82;
    border-right: 1px solid #5679a0;
    box-sizing: border-box;
    color: white;
}

.top-func a:hover {
    cursor: pointer;
    opacity: .8;
}

.top-func a:nth-child(1) {
    border-left: none;
    background: url('/image/web/seniors/top_index-0406e1e8874595a4549f0a9cdd2c0abd.png') no-repeat center .13rem/ .28rem .24rem
}

.top-func a:nth-child(2) {
    background: url('/image/web/seniors/top_enlarge-10033c6049985aa1079a5f77df2ebb01.png') no-repeat center .13rem/ .28rem .24rem
}

.top-func a:nth-child(3) {
    background: url('/image/web/seniors/top_shrink-72a76736066001f7bffe888b7970c576.png') no-repeat center .13rem/ .28rem .24rem
}

.top-func a:nth-child(4) {
    background: url('/image/web/seniors/play-638cc0d1828c725d8c9a887926bef8bf.png') no-repeat center .13rem/ .28rem .24rem
}

.top-func a:nth-child(5) {
    background: url('/image/web/seniors/read-76cbdcbfd924e3b4c240c17c6e456552.png') no-repeat center .13rem/ .28rem .24rem
}

.top-func a:nth-child(6) {
    background: url('/image/web/seniors/mouse-5a963a2ddd9690c12c4cdded63a4cb21.png') no-repeat center .13rem/ .28rem .24rem
}

.read-always-on {
    background: url('/image/web/seniors/play_off-ffdea6f1f37b0de34b204120f2a086f5.png') no-repeat center .13rem/ .28rem .24rem !important;
}

.read-mouse-on {
    background: url('/image/web/seniors/read_on-b0a798fa20bd48332563cac621cf2182.png') no-repeat center .13rem/ .28rem .24rem !important;
}

#mask {
    position: fixed;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, .4);
    z-index: 99998;
    top: 0;
    left: 0;
}

.page-img1 {
    height: 0.85rem;
    position: absolute;
    top: 0;
    left: 10rem;
}

.page-img2 {
    position: absolute;
    top: 0.9rem;
    left: 9.9rem;
}

.page-img3 {
    position: absolute;
    top: 1.8rem;
    left: 5.9rem;
    background: url(/image/web/seniors/page5-e33f67940f23c381f0893e25db4e27a8.png) no-repeat center;
    background-size: 100%;
    font-size: .3rem;
    padding-top: 1.5rem;
    box-sizing: border-box;
    height: 5rem;
}

.page-img3 p, .second-page-img3 p {
    padding: 0 .4rem;
    text-align: center;
}


.button {
    display: flex;
    width: 5rem;
    justify-content: space-between;
    position: absolute;
    top: 7.4rem;
    left: 6.6rem;
}

.button div:hover {
    cursor: pointer;
}

.second-page {
    display: none;
}

.second-page-img1 {
    height: 0.85rem;
    position: absolute;
    top: 0;
    left: 12.4rem;
}

.second-page-img2 {
    position: absolute;
    top: 0.9rem;
    left: 12.4rem;
}

.second-page-img3 {
    position: absolute;
    top: 1.8rem;
    left: 6.8rem;
    background: url(/image/web/seniors/page6-7e70c8d5d3fadc292d2c4caa6fa44c11.png) no-repeat center;
    background-size: 100%;
    font-size: .3rem;
    padding-top: 1.5rem;
    box-sizing: border-box;
    height: 5rem;
}

.second-page-button {
    display: flex;
    width: 6.3rem;
    justify-content: center;
    position: absolute;
    top: 7.4rem;
    left: 6.6rem;
}

.second-page-button .button-close {
    width: 1.88rem;
    height: .56rem;
    box-shadow: 0 .06rem 0 0 #014683;
    border-radius: .28rem;
    font-size: .28rem;
    font-weight: 400;
    background: #0F69B9;
    line-height: .56rem;
    text-align: center;
    color: white;
}

.button-close {
    width: 1.88rem;
    height: .56rem;
    background: #FFFFFF;
    box-shadow: 0 .06rem 0 0 #DADADA;
    border-radius: .28rem;
    font-size: .28rem;
    font-weight: 400;
    color: #333333;
    line-height: .56rem;
    text-align: center;
}

.button-close:hover {
    cursor: pointer;
}

.button-next {
    width: 1.88rem;
    height: .56rem;
    box-shadow: 0 .06rem 0 0 #014683;
    border-radius: .28rem;
    font-size: .28rem;
    font-weight: 400;
    background: #0F69B9;
    line-height: .56rem;
    text-align: center;
    color: white;
}

.mobile-page {
    display: none;
}

@media screen and (max-width: 450px) {
    .top {
        width: 100%;
        background: #4E6599;
    }

    .banner {
        width: 100%;
        height: 1.7rem;
        background: url("/image/web/seniors/banner-eea354d60fe5bf89494c484570e6dfac.png") center no-repeat;
        background-size: 100%;
    }

    .logo {
        background: url(/image/web/seniors/logo-68f480db49d033471bc0d4e1e7a85521.png) center no-repeat;
        background-size: 100%;
        width: 3em;
        height: 0.8rem;
        margin-left: .3rem;
    }

    .content-top {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-evenly;
        margin-top: .138rem;
    }

    .banner-content {
        width: 100%;
        margin: 0 auto;
        height: 100%;
        padding-top: .192rem;
    }

    .elder-model {
        height: .286rem;
        width: 1.17rem;
        margin-top: .11rem;
        background: #FFFFFF;
        border-radius: .19rem;
        border: .02rem solid #054FAC;
        font-size: .156rem;
        font-weight: 600;
        color: #054FAC;
        text-align: center;
        line-height: .286rem;
        margin-left: .3rem;
    }

    .top-func {
        width: 100%;
        justify-content: space-between;
        font-size: .18rem;
    }

    .top-func a {
        padding: .45rem 0.25rem 0;
        height: 0.5rem;
    }

    .top-date, .top-func a:nth-child(5), .top-func a:nth-child(6), .top-func a:nth-child(2), .top-func a:nth-child(3) {
        display: none;
    }

    .top-func a:nth-child(1) {
        background: url(/image/web/seniors/top_index-0406e1e8874595a4549f0a9cdd2c0abd.png) no-repeat center;
        border: none;
    }

    .top-func a:nth-child(4) {
        background: url(/image/web/seniors/play-638cc0d1828c725d8c9a887926bef8bf.png) no-repeat center;
        border: none;
    }

    .read-always-on {
        background: url('/image/web/seniors/play_off-ffdea6f1f37b0de34b204120f2a086f5.png') no-repeat center;
    }

    .top-content {
        width: 100%;
    }

    .first-page {
        display: none;
    }

    .mobile-page {
        display: block;
    }

    .second-page-img1 {
        height: 0.5rem;
        position: absolute;
        top: 0;
        left: 2.7rem;
    }

    .second-page-img2 {
        position: absolute;
        top: 0.6rem;
        left: 2rem;
    }

    .second-page-img3 {
        left: 0;
        font-size: .18rem;
        top: 0.3rem;
        width: 100%;
    }

    .page-img3 p, .second-page-img3 p {
        padding: 0.4rem 0;
    }

    .second-page-button {
        width: 100%;
        top: 4.3rem;
        left: 0;
    }

    .second-page-button .button-close {
        width: 1.68rem;
        height: 0.52rem;
        box-shadow: 0 0.06rem 0 0 #014683;
        border-radius: 0.28rem;
        font-size: 0.23rem;
        font-weight: 400;
        background: #0F69B9;
        line-height: .52rem;
        text-align: center;
        color: white;
    }

    em {
        font-size: .18rem;
    }
}

/*头部结束*/