peko-h5/view/peko/home/css/index.scss

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

// body,
// html {
//     width: 100%;
//     height: 100%;
//     font-family: "Heiti SC", "Microsoft Sans Serif";
// }

// pc端
@media screen and (min-width:769px) {

    body,
    html {
        width: 100%;
        height: 100%;
        background: #0E0B24;
        font-family: Avenir, Avenir;

        .pc {
            width: 100%;
            height: 100%;
            background: url(../images/pcBg.png) no-repeat center;
            background-size: px2rem(1920) px2rem(1080);
            position: relative;

            .header {
                width: 100%;
                height: px2rem(108);
                position: absolute;
                left: 0;
                top: 0;

                .logo {
                    width: px2rem(54);
                    height: px2rem(54);
                    position: absolute;
                    top: px2rem(27);
                    left: px2rem(360);
                }

                .name {
                    height: 100%;
                    line-height: px2rem(108);
                    font-size: px2rem(40);
                    color: #FFFFFF;
                    font-weight: 800;
                    position: absolute;
                    top: 0;
                    left: px2rem(430);
                }

                .index {
                    height: 100%;
                    line-height: px2rem(108);
                    font-family: PingFangSC, PingFang SC;
                    color: fff;
                    font-weight: 500;
                    position: absolute;
                    top: 0;
                    left: px2rem(657);
                    font-size: px2rem(28);
                    color: #fff;

                    span {
                        width: px2rem(28);
                        height: px2rem(6);
                        background: #9168FA;
                        border-radius: px2rem(6);
                        position: absolute;
                        left: 50%;
                        transform: translateX(-50%);
                        top: px2rem(76);
                    }
                }

                .diamound {
                    width: px2rem(118);
                    height: px2rem(48);
                    line-height: px2rem(48);
                    color: #FFFFFF;
                    font-size: px2rem(24);
                    text-align: center;
                    background: rgba(255, 255, 255, 0.2);
                    border-radius: px2rem(48);
                    box-sizing: border-box;
                    border: 1px solid #fff;
                    position: absolute;
                    right: px2rem(380);
                    top: px2rem(30);
                    vertical-align: middle;

                    img {
                        display: inline-block;
                        width: px2rem(30);
                        height: px2rem(30);
                        vertical-align: middle;
                    }
                }
            }
        }
    }
}

// 移动端
@media screen and (max-width:768px) {}