peko-h5/view/peko/modules/h5Income/css/index.scss

@function px2rem($px, $rem:75) {
    @return $px / $rem+rem;
}

html,
body {
    width: 100%;
}

.back {
    position: fixed;
    z-index: 9;
    width: px2rem(56, );
    height: px2rem(56, );
    left: px2rem(40, );
    top: 0.2rem;
    // display: none;
}

.myInfo {
    width: px2rem(690, );
    height: px2rem(136, );
    margin: px2rem(60, ) auto px2rem(32, );

    img {
        display: block;
        width: px2rem(136, );
        height: px2rem(136, );
        border-radius: 50%;
        float: left;
    }

    div {
        float: left;
        margin-left: px2rem(22, );
        overflow: hidden;

        p {
            color: #1F1B4F;
            font-size: px2rem(36, );
            font-weight: bold;
            margin-bottom: px2rem(12, );
            margin-top: px2rem(30, );
        }

        b {
            color: #8A8CAB;
            font-size: px2rem(24, );
        }
    }
}

.diamond {
    width: px2rem(690, );
    height: px2rem(288, );
    background: url(../images/index/diamondBg.png) no-repeat;
    background-size: 100% 100%;
    margin: 0 auto px2rem(32, );
    position: relative;

    .diamondIcon {
        width: px2rem(48, );
        height: px2rem(48, );
        position: absolute;
        left: px2rem(40, );
        top: px2rem(30, );
    }

    .moreD {
        width: px2rem(24, );
        height: px2rem(24, );
        position: absolute;
        right: px2rem(40, );
        top: px2rem(42, );
    }

    span {
        font-size: px2rem(40, );
        font-weight: bold;
        color: #1F1B4F;
        position: absolute;
        left: px2rem(96, );
        top: px2rem(36, );
    }

    b {
        font-size: px2rem(28, );
        color: #1F1B4F;
        position: absolute;
        right: px2rem(68, );
        top: px2rem(40, );
    }

    p {
        font-weight: bold;
        color: #1F1B4F;
        font-size: px2rem(36, );
        left: px2rem(40, );
        top: px2rem(110, );
        position: absolute;
    }
}
.gold {
    width: px2rem(690, );
    height: px2rem(288, );
    background: url(../images/index/goldBg.png) no-repeat;
    background-size: 100% 100%;
    margin: 0 auto px2rem(32, );
    position: relative;

    .goldIcon {
        width: px2rem(48, );
        height: px2rem(48, );
        position: absolute;
        left: px2rem(40, );
        top: px2rem(30, );
    }

    .moreG {
        width: px2rem(24, );
        height: px2rem(24, );
        position: absolute;
        right: px2rem(40, );
        top: px2rem(42, );
    }

    span {
        font-size: px2rem(40, );
        font-weight: bold;
        color: #1F1B4F;
        position: absolute;
        left: px2rem(96, );
        top: px2rem(36, );
    }

    b {
        font-size: px2rem(28, );
        color: #1F1B4F;
        position: absolute;
        right: px2rem(68, );
        top: px2rem(40, );
    }

    p {
        font-weight: bold;
        color: #1F1B4F;
        font-size: px2rem(36, );
        left: px2rem(40, );
        top: px2rem(110, );
        position: absolute;
    }
    .exchangeGold{
        width: px2rem(292, );
        height: px2rem(80, );
        line-height: px2rem(80, );
        border-radius: px2rem(80, );
        text-align: center;
        color: #93570B;
        font-size: px2rem(32, );
        position: absolute;
        left: px2rem(40, );
        bottom: px2rem(36, );
        border: px2rem(2, ) solid #93570B;
        box-sizing: border-box;
    }
    .withdrawal{
        width: px2rem(292, );
        height: px2rem(80, );
        line-height: px2rem(80, );
        border-radius: px2rem(80, );
        text-align: center;
        color: #582815;
        font-size: px2rem(32, );
        position: absolute;
        right: px2rem(40, );
        bottom: px2rem(36, );
        background: #EDC36B;
    }
}