/* reset */

@font-face {
    font-family: "mama";
    src: url('https://oss.cytds.com/indexstatic/css/font/阿里妈妈数黑体.woff2');
}
@font-face {
    font-family: "Bold";
    src: url('https://oss.cytds.com/indexstatic/css/font/HarmonyOS_Sans_SC_Bold.woff2');
}
@font-face {
    font-family: "Light";
    src: url('https://oss.cytds.com/indexstatic/css/font/HarmonyOS_Sans_SC_Light.woff2');
}
@font-face {
    font-family: "OPPOSans-M";
    src: url('https://oss.cytds.com/indexstatic/css/font/OPPOSans-M.woff2');
}

@font-face {
    font-family: "OPPOSans-L";
    src: url('https://oss.cytds.com/indexstatic/css/font/OPPOSans-L.ttf');
}

@font-face {
    font-family: "OPPOSans-B";
    src: url('https://oss.cytds.com/indexstatic/css/font/OPPOSans-B.ttf');
}

@font-face {
    font-family: "OPPOSans";
    src: url('https://oss.cytds.com/indexstatic/css/font/OPPOSans-R.woff2');
}
@font-face {
    font-family: "rubik";
    src: url('https://oss.cytds.com/indexstatic/css/font/RUBIK-MEDIUM.TTF');
}
@font-face {
    font-family: "douyin";
    src: url('https://cyt-img.oss-cn-beijing.aliyuncs.com/indexstatic/css/font/DouyinSansBold.woff2');
}

html,
body,
h1,
h2,
h3,
h4,
h5,
h6,
div,
dl,
dt,
dd,
ul,
ol,
li,
p,
blockquote,
pre,
hr,
figure,
table,
caption,
th,
td,
form,
fieldset,
legend,
input,
button,
textarea,
menu {
    margin: 0;
    padding: 0;
}

header,
footer,
section,
article,
aside,
nav,
hgroup,
address,
figure,
figcaption,
menu,
details {
    display: block;
}

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

caption,
th {
    text-align: left;
    font-weight: normal;
}

html,
body,
fieldset,
img,
iframe,
abbr {
    border: 0;
}

i,
cite,
em,
var,
address,
dfn {
    font-style: normal;
}

[hidefocus],
summary {
    outline: 0;
}

li {
    list-style: none;
}

h1,
h2,
h3,
h4,
h5,
h6,
small {
    font-size: 100%;
}

sup,
sub {
    font-size: 83%;
}

pre,
code,
kbd,
samp {
    font-family: inherit;
}

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

textarea {
    overflow: auto;
    resize: none;
}

label,
summary {
    cursor: default;
}

a,
button {
    cursor: pointer;
}

h1,
h2,
h3,
h4,
h5,
h6,
em,
strong,
b {
    font-weight: bold;
}

del,
ins,
u,
s,
a,
a:hover {
    text-decoration: none;
}

body,
textarea,
input,
button,
select,
keygen,
legend {
    font: 12px/1.14 arial, \5b8b\4f53;
    color: #333;
    outline: 0;
}

a,
a:hover {
    color: #333;
}

html,
body {
    height: 100%;
    font-size: 14px;
    font-family: Light, OPPOSans-M;

    /*font-family: "OPPOSans-B","OPPOSans-M","OPPOSans-L","OPPOSans";*/
}

body {
    position: relative;
    min-height: 500px;
    line-height: 1.5;
    color: #666;
    background: #fff;
    /*font-family: Tahoma, '微软雅黑';*/
    -webkit-font-smoothing: antialiased;
    -webkit-text-size-adjust: none;
}


/* 滚动条样式 */

::-webkit-scrollbar {
    width: 6px;
    background-color: transparent;
}

::-webkit-scrollbar-thumb {
    background-color: #8899a7;
    border-radius: 4px;
}

::-moz-scrollbar {
    width: 6px;
    background-color: transparent;
}

::-moz-scrollbar-thumb {
    background-color: #8899a7;
    border-radius: 4px;
}


/* util */

.tc {
    text-align: center;
}

.tl {
    text-align: left;
}

.tr {
    text-align: right;
}

.hide {
    display: none !important;
}

.radius4px {
    border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
}

.radius5px {
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
}

.radius10px {
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
}

.radius20px {
    border-radius: 20px;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
}

.radius-circle {
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
}

.box-sizing {
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
}

.clr {
    clear: both;
    height: 1px;
    overflow: hidden;
    display: block;
}


/** buttons */

.btn {
    border: 0;
    font-size: 1.0625rem;
    color: #fff;
}

.btn-ok {
    background-color: #0888ff;
    width: 100px;
    line-height: 34px;
    border: 1px solid #0070d9
}

.btn-ok.disabled {
    background-color: #bdd0fd;
    border: 1px solid #bdd0fd;
}

.btn-cancel,
.btn-del {
    border: 1px solid #ccc;
    background-color: #eee;
    color: #666;
    width: 100px;
    line-height: 34px;
    margin-right: 14px;
}

.btn-del {
    background-color: #eb493d;
    color: #fff;
    border-color: #c23227;
}


/** 普通对话框 */

.dialog {
    background-color: #fff;
    position: fixed;
    top: 50%;
    left: 50%;
    width: 380px;
    height: 120px;
    margin-left: -190px;
    margin-top: -80px;
    padding: 20px 0;
    z-index: 10;
}

.dialog .content {
    margin: 29px 0 35px;
}

.dialog .buttons {
    position: relative
}


/** 从下往上对话框 */

.dialog-slideUp {
    position: fixed;
    width: 100%;
    left: 0;
    bottom: 0;
    height: 150px;
    z-index: 10;
    background-color: #fff;
    padding: 20px 5%
}

.dialog-slideUp .content {
    margin: 10px 0
}

.dialog-slideUp .buttons {
    margin-top: 30px;
    position: relative
}


/** 遮罩层 */

.mask {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    background-color: rgba(0, 0, 0, .65);
    z-index: 8
}


/** toast提示 */

.toast {
    position: fixed;
    top: 50%;
    left: 50%;
    line-height: 1.5rem;
    background-color: rgba(0, 0, 0, .5);
    width: 50%;
    height: 1.5rem;
    color: #fff;
    margin: -0.75rem 0 0 -25%;
    font-size: 0.875rem;
}


/** datalist */

.arrow-right:after {
    content: ' ';
    width: 0;
    height: 0;
    display: inline-block;
    border-left: 6px solid #00d3a9;
    border-top: 6px solid transparent;
    border-bottom: 6px solid transparent;
    position: absolute;
    right: 5%;
    top: 50%;
    margin-top: -3px
}

.arrow-top:after {
    content: ' ';
    width: 0;
    height: 0;
    display: inline-block;
    border-top: 6px solid #00d3a9;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    position: absolute;
    right: 5%;
    top: 50%;
    margin-top: -3px
}

.arrow-left:after {
    content: ' ';
    width: 0;
    height: 0;
    display: inline-block;
    border-right: 6px solid #00d3a9;
    border-top: 6px solid transparent;
    border-bottom: 6px solid transparent;
    position: absolute;
    right: 5%;
    top: 50%;
    margin-top: -3px
}

.arrow-bottom:after {
    content: ' ';
    width: 0;
    height: 0;
    display: inline-block;
    border-bottom: 6px solid #00d3a9;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    position: absolute;
    right: 5%;
    top: 50%;
    margin-top: -3px
}

.icon {
    display: inline-block;
    width: 16px;
    height: 16px;
    background-image: url(../image/icons.png);
    background-repeat: no-repeat;
    vertical-align: middle;
}

.effect-in {
    animation-name: effect;
    -webkit-animation-name: effect;
    -moz-animation-name: effect;
    animation-duration: 2s;
    -webkit-animation-duration: 2s;
    -moz-animation-duration: 2s;
}

.slideUp {
    animation-name: slideUp;
    -webkit-animation-name: slideUp;
    -moz-animation-name: slideUp;
    animation-duration: .5s;
    -webkit-animation-duration: .5s;
    -moz-animation-duration: .5s;
}

.slideDown {
    animation-name: slideDown;
    -webkit-animation-name: slideDown;
    -moz-animation-name: slideDown;
    animation-duration: .5s;
    -webkit-animation-duration: .5s;
    -moz-animation-duration: .5s;
}

@keyframes effect {
    from {
        opacity: 0
    }
    to {
        opacity: 1;
    }
}

@-webkit-keyframes effect {
    from {
        opacity: 0
    }
    to {
        opacity: 1;
    }
}

@-moz-keyframes effect {
    from {
        opacity: 0
    }
    to {
        opacity: 1;
    }
}


/** 渐渐弹出 */

@keyframes slideUp {
    from {
        bottom: -150px
    }
    to {
        bottom: 0
    }
}

@-webkit-keyframes slideUp {
    from {
        bottom: -150px
    }
    to {
        bottom: 0
    }
}

@-moz-keyframes slideUp {
    from {
        bottom: -150px
    }
    to {
        bottom: 0
    }
}


/** 渐渐隐藏 */

@keyframes slideDown {
    from {
        bottom: 0
    }
    to {
        bottom: -150px
    }
}

@-webkit-keyframes slideDown {
    from {
        bottom: 0
    }
    to {
        bottom: -150px
    }
}

@-moz-keyframes slideDown {
    from {
        bottom: 0
    }
    to {
        bottom: -150px
    }
}

@keyframes slideDown {
    from {
        bottom: 0
    }
    to {
        bottom: -150px
    }
}

@-webkit-keyframes slideDown {
    from {
        bottom: 0
    }
    to {
        bottom: -150px
    }
}

@-moz-keyframes slideDown {
    from {
        bottom: 0
    }
    to {
        bottom: -150px
    }
}


/** 公共头部 底部 123123 */

section {
    min-height: 1080px;
}

header {
    width: 100%;
    min-width: 1920px;
    text-align: center;
    .header-top {
        width: 100%;
        min-width: 1920px;
        background: #fff;
        height: 40px;
        line-height: 40px;
        border-bottom: 1px solid rgba(204, 204, 204, 0.22);
        /* box-shadow: 0px 5px 10px #ccc; */
        box-shadow: 0px 2px 6px 0px rgba(153, 153, 153, 0.1);
        margin-bottom: 24px;
        .header-top-content {
            width: 85.7143rem;
            margin: 0 auto;
            display: flex;
            align-items: center;
            justify-content: space-between;
            .header-top-left {
                a {
                    font-weight: 500;
                    font-size: 14px;
                    color: #666666;
                    line-height: 14px;
                    text-align: left;
                }
            }
            .header-top-right {
                display: flex;
                align-items: center;
                justify-content: space-around;
                a {
                    width: 7.1429rem;
                    text-align: center;
                    font-weight: 500;
                    font-size: 14px;
                    font-family: OPPOSans-M, OPPOSans;
                    font-weight: 500;
                    color: #666666;
                    line-height: 14px;
                }
                .minfo {
                    width: 8.5714rem;
                    display: flex;
                    align-items: center;
                    justify-content: flex-start;
                    margin-right: 10px;
                    img {
                        margin-right: .3571rem;
                        border-radius: 50%;
                    }
                }
            }
        }
    }
    .search {
        width: 100%;
        min-width: 1920px;
        height: 95px;
        display: flex;
        justify-content: space-around;
        background-color: #fff;
        .search-content {
            width: 1200px;
            margin: 0 auto;
            height: 100%;
            display: flex;
            justify-content: space-between;
            .search-logo {
                margin-left: 1.25rem;
                img {
                    width: 200px;
                    height: 70px;
                }
            }
            .input {
                width: 600px;
                height: 45px;
                line-height: 45px;
                /*margin-left: 8rem;*/
                box-sizing: border-box;
                border-radius: .5rem;
                /* border: 1px solid #65D1FF; */
                display: flex;
                justify-content: flex-start;
                .chaxun {
                    width: 600px;
                    background: linear-gradient( to top, rgba(255,255,255,1) 0%, rgba(255,255,255,0.6) 100%);
                    border-radius: 50px;
                    .games {
                        width: 100%;
                        height: 100%;
                        background: rgba(255, 255, 255, 0);
                        border-radius: 50px;
                        /*border: 2px solid #666666;*/
                        display: flex;
                        align-items: center;
                        justify-content: flex-start;
                        dd {
                            text-align: left;
                        }
                        .layui-form-select {
                            width: 11.25rem;
                            height: 2rem;
                            .layui-select-title {
                                height: 2rem;
                                .layui-input {
                                    height: 2rem;
                                    text-align: center;
                                    border: none;
                                    outline: none;
                                    font-weight: bold;
                                    font-family: Bold, OPPOSans-B, OPPOSans;
                                    font-size: 14px;
                                    color: #666666;
                                    background: rgba(255, 255, 255, 0);
                                }
                                .layui-input::placeholder {
                                    font-weight: bold;
                                    font-family: Bold, OPPOSans-B, OPPOSans;
                                    font-size: 14px;
                                    color: #666666;
                                    line-height: 14px;
                                }
                            }
                        }
                        .select-div {
                            width: 180px;
                            select {
                                border: none;
                                outline: none;
                            }
                        }
                        .kwds {
                            width: 28.125rem;
                            input {
                                border: none;
                                outline: none;
                                font-size: 14px;
                                font-family: Light, OPPOSans-B, OPPOSans;
                                background: rgba(255, 255, 255, 0);
                            }
                            input::placeholder {
                                color: #999;
                                font-family: Light, OPPOSans-B, OPPOSans;
                                font-size: 14px;
                            }
                        }
                        .btns {
                            width: 72px;
                            height: 45px;
                            display: flex;
                            flex-direction: column;
                            justify-content: center;
                            align-items: center;
                            margin-right: 5px;
                            img{
                                width: 100%;
                                height: 36px;
                            }
                            /*width: 100px;*/
                            /*height: 45px;*/
                            /*line-height: 45px;*/
                            /*text-align: center;*/
                            /*font-weight: 500;*/
                            /*font-size: 16px;*/
                            /*color: #FFFFFF;*/
                            /*background: #FF8D3B;*/
                            /*border-radius: 8px 8px 8px 8px;*/
                            /*margin-left: 50px;*/
                        }
                    }
                    .xia {
                        width: 100%;
                        display: flex;
                        justify-content: space-around;
                        margin-top: 15px;
                        .item {
                            line-height: 14px;
                            font-family: OPPOSans-M, OPPOSans;
                            font-weight: 500;
                            font-size: 14px;
                            color: #666666;
                            display: flex;
                            align-items: center;
                            justify-content: flex-start;
                            img{
                                width: 20px;
                                height: 20px;
                                margin-right: 5px;
                            }
                            a {
                                color: #666666;
                            }
                            a:hover {
                                color: #FF8D3C;
                            }
                        }
                    }
                }

            }
            .app-down{
                width: 178px;
                height: 48px;
                img{
                    width: 100%;
                    height: 100%;

                }
            }
        }

    }
    .nav {
        width: 100%;
        min-width: 1920px;
        height: 45px;
        line-height: 45px;
        display: flex;
        justify-content: space-around;
        background-color: #fff;
        background: #FFFFFF;
        box-shadow: 0px 8px 8px 0px rgba(204, 204, 204, 0.25);
        .nav-content {
            /*width: 1200px;*/
            /*height: 100%;*/
            width: 1200px;
            margin: 0 auto;
            height: 100%;
            background: linear-gradient( to bottom, rgba(255,255,255,0.6) 0%, #FFFFFF 100%);
            border-radius: 12px 12px 12px 12px;
            /*border: 2px solid #FFFFFF;*/
            .layui-nav {
                width: 100%;
                height: 100%;
                display: flex;
                justify-content: space-between;
                color: #333;
                background: linear-gradient( to bottom, rgba(255,255,255,0.6) 0%, #FFFFFF 100%);
                border-radius: 12px;

                .layui-this:after {
                    background-color: #fff;
                }

                .layui-nav-item {
                    height: 100%;
                    a {
                        height: 100%;
                        line-height: 45px;
                        font-weight: 500;
                        font-size: 16px;
                        font-family: OPPOSans-M, OPPOSans;
                        font-weight: 500;
                        color: #333333;
                    }
                    .nav-child {
                        top: 45px;
                        a {
                            color: #666 !important;
                        }
                        a:hover {
                            /*background: #FF8D3C;*/
                            border-radius: 0px !important;
                                font-weight: 500;
                                font-size: 16px;
                                color: #FF8D3C !important;

                        }

                        .layui-this {
                            /*background: #FF8D3C;*/
                            border-radius: 0px !important;
                            a {
                                font-weight: 500;
                                font-size: 16px;
                                color: #FF8D3C !important;
                            }
                        }
                        .layui-this:after {
                            background-color: #fff;
                        }
                    }
                }
                .layui-nav-bar {
                    background-color: #FF8D3C;
                }
                .layui-this {
                    /*background: #FF8D3C;*/
                    border-radius: 12px 12px 0px 0px;
                    a {
                        font-weight: 500;
                        font-size: 16px;
                        color: #FF8D3C;
                    }
                }
                .layui-this1 {
                    /*background: #FF8D3C;*/
                    border-radius: 12px 12px 0px 0px;
                    a {
                        font-weight: 500;
                        font-size: 16px;
                        color: #FF8D3C
                    }
                }

            }
        }
    }
}

footer {
    width: 100%;
    min-width: 1920px;
    height: 14.2857rem;
    margin-top: 1.4286rem;
    background: #fff;
    .footer {
        width: 1200px;
        height: 14.2857rem;
        padding: 1.4286rem 0;
        margin: 0 auto;
        display: flex;
        justify-content: space-between;
        .footer-left {
            width: 55%;
            display: flex;
            align-items: baseline;
            justify-content: space-around;
            dl {
                margin-top: 15px;
                img {
                    position: relative;
                    top: 35px;
                    left: 0px;
                }
                dt {
                    margin-bottom: 12px;
                    font-weight: 500;
                    font-size: 14px;
                    color: #999999;
                }
                a {
                    font-weight: 500;
                    font-size: 14px;
                    color: #999999;
                }
                a:hover {
                    /* #3D91FF  7EA7FF*/
                    color: #3D91FF;
                }
            }
        }
        .footer-right {
            width: 45%;
            height: 100%;
            padding-right: 2.1429rem;
            display: flex;
            justify-content: space-around;
            font-size: .8571rem;
            align-items: center;
            a {
                font-weight: 500;
                font-size: 14px;
                color: #999999;
            }
        }
    }
}

.ad {
    width: 85.7143rem;
    height: 140px;
    margin: .7143rem auto;
}

.index {
    width: 100%;
    min-width: 1920px;
    /* background-image: linear-gradient(to bottom, #B40D15, #fff);  */
    /* background-image: linear-gradient(to bottom, #E78C9C, #fff); */
    /*background: url("/indexstatic/imgs/banner_bg.png") no-repeat top;*/
    background-size: 100% auto;
    .banner {
        width: 100%;
        max-width: 1920px;
        height: auto;
        padding-top: 1.4286rem;
        /* background: linear-gradient( to bottom, #FFD59E, #F9F9F9); */
        margin: 0 auto;

        .item1 {
            width: 85.7143rem;
            height: 28.4286rem;
            margin: 0 auto;
            display: flex;
            justify-content: space-around;
            .item-left {
                width: 228px;
                height: 100%;
                background: url(/indexstatic/imgs/banner_left_bg.png) no-repeat center;
                background-size: 100% 100%;
                box-sizing: border-box;
                padding-top: 115px;
                padding-left: 24px;
                .left-item {
                    width: 100%;
                    margin-bottom: 32px;
                    .left-item-title {
                        font-weight: 500;
                        font-size: 16px;
                        color: #666666;
                        display: flex;
                        align-items: center;
                        justify-content: flex-start;
                        img {
                            margin-right: 5px;
                        }
                    }
                    .nums {
                        margin-top: 8px;
                        margin-left: 28px;
                        span {
                            font-weight: 800;
                            font-size: 18px;
                            color: #FF4B4B;
                        }
                    }
                }
            }
            .item-center {
                width: 720px;
                height: 100%;
                /* border: .1429rem solid #333; */
                box-sizing: border-box;
                border-radius: 8px;
                overflow: hidden;
                .banner-item {
                    img {
                        width: 100%;
                    }
                }
            }
            .item-right {
                width: 228px;
                height: 100%;
                box-sizing: border-box;
                text-align: center;
                border-radius: 8px;
                overflow: hidden;
                .top {
                    width: 100%;
                    height: 276px;
                    background-color: #fff;
                    border-radius: 8px;
                    margin-bottom: 10px;
                    box-sizing: border-box;
                    padding-top: 16px;
                    .touxiang {
                        width: 60px;
                        height: 60px;
                        border-radius: 50%;
                    }
                    .hello {
                        margin: 6px 0px;
                        font-size: 14px;
                        color: #333333;
                        font-weight: bold;
                        font-family: Bold, OPPOSans-B, OPPOSans;
                    }
                    .user {
                        font-weight: bold;
                        font-family: Bold, OPPOSans-B, OPPOSans;
                        margin-bottom: 6px;
                        a {
                            box-sizing: border-box;
                            padding: 0px 15px;
                        }
                        .denglu {
                            font-size: 14px;
                            color: #FF4B4B;
                            cursor: pointer;
                        }
                        .zhuce {
                            font-size: 14px;
                            color: #58BAF8;
                            cursor: pointer;
                        }
                    }
                    .btn {
                        cursor: pointer;
                        width: 164px;
                    }
                }
                .bottom {
                    width: 100%;
                    height: 114px;
                    background-color: #fff;
                    border-radius: 8px;
                    box-sizing: border-box;
                    img {
                        width: 100%;
                    }
                }
                .item-right-title {
                    width: 28.1429rem;
                }
                .item-right-title2 {
                    width: 21.9286rem;
                }
                .item-right-anquan {
                    width: 90%;
                    height: 2.8571rem;
                    border-bottom: 1px solid #DEE4ED;
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    margin-top: 10px;
                    font-size: 16px;
                    font-weight: 600;
                    span {
                        font-size: 24px;
                        padding: 0 3px;
                        font-family: PingFangSC-Medium, PingFang SC;
                        font-weight: 600;
                        color: #FCA32F;
                        line-height: 28px;
                    }
                }
                .item-right-chengjiao {
                    width: 90%;
                    height: 80px;
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    div {
                        width: 50%;
                        height: 100%;
                        display: flex;
                        flex-direction: column;
                        justify-content: center;
                        align-items: center;
                        p {
                            margin-top: 5px;
                            font-size: 16px;
                            font-family: PingFangSC-Medium, PingFang SC;
                            font-weight: 600;
                            color: #ED7814;
                        }
                    }
                }
                .btn {
                    img {
                        width: 290px;
                        transition: transform 0.3s ease;
                        /* 平滑变化 */
                        margin-top: 10px 0px;
                    }
                    img:hover {
                        transform: scale(1.2);
                    }
                }
            }
        }
    }
    .index-content {
        width: 85.7143rem;
        height: auto;
        margin: 0 auto;
        padding-top: 1.4286rem;
        .item2 {
            width: 100%;
            height: 3.5714rem;
            margin-top: 1.4286rem;
            display: flex;
            flex-direction: column;
            justify-content: space-between;
            background-image: url(/indexstatic/images/zuixinchengjiao.png);
            background-position: center;
            background-size: cover;
            overflow: hidden;
            .outer-div {
                width: 100%;
                height: 30px;
                margin-top: 10px;
                overflow: hidden;
                display: flex;
                flex-direction: column;
                justify-content: space-between;
                .chengjiao-list {
                    margin-left: 11.4286rem;
                    line-height: 3.5714rem;
                    margin-top: -0.7143rem;
                    li {
                        width: 100%;
                        height: 3.5714rem;
                        display: flex;
                        align-items: center;
                        span {
                            margin-left: 1.4286rem;
                            font-size: 1rem;
                        }
                        label {
                            color: #f7423f;
                            font-size: 1.2857rem;
                            font-weight: 600;
                        }
                    }
                }
            }
        }
        .item3 {
            width: 100%;
            height: 375px;
            display: flex;
            justify-content: space-between;
            .item-left {
                width: 68.5714rem;
                height: 100%;
                .item-left-title {
                    width: 100%;
                    height: 48px;
                    display: flex;
                    align-items: center;
                    justify-content: space-between;
                    position: relative;
                    background-color: #fff;
                    margin-bottom: 2px;
                    border-radius: 8px;
                    padding: 0px 5px;
                    .sel-item {
                        width: 40%;
                        display: flex;
                        align-items: center;
                        justify-content: space-around;
                        .item {
                            font-weight: bold;
                            font-family: Bold, OPPOSans-B, OPPOSans;
                            font-size: 15px;
                            color: #999999;
                            cursor: pointer;
                        }
                        .item-this {
                            color: #FF4B4B;
                        }
                        .gameType:hover {
                            color: #FF4B4B;
                        }
                        .title {
                            font-size: 18px;
                            color: #333333;
                            span {
                                color: #FF4B4B;
                            }
                        }
                    }
                    .more {
                        font-weight: bold;
                        font-family: Bold, OPPOSans-B, OPPOSans;
                        font-size: 14px;
                        color: #333333;
                        margin-right: 10px;
                    }
                    .more:hover {
                        font-size: 16px;
                        color: #FF4B4B;
                    }
                }
                .item-left-zimu {
                    width: 100%;
                    height: 2.1429rem;
                    line-height: 2.1429rem;
                    display: flex;
                    justify-content: space-around;
                    font-size: 1rem;
                    font-family: SourceHanSansCN-Regular, SourceHanSansCN;
                    font-weight: 300;
                    color: #333;
                    background-color: #fff;
                    border-radius: .5rem .5rem 0rem 0rem;
                    padding: 0px 5px;
                    b {
                        cursor: pointer;
                        color: #999999;
                    }
                    .all {
                        font-weight: bold;
                        font-family: Bold, OPPOSans-B, OPPOSans;
                        font-size: 1rem;
                        color: #FF4B4B;
                    }
                    .zimu:hover {
                        transform: scale(1.2);
                        color: #FF4B4B;
                    }
                    .layui-this {
                        color: #FF4B4B;
                        transform: scale(1.2);
                    }
                }
                .item-left-games {
                    width: 100%;
                    height: 300px;
                    background-color: #fff;
                    border-radius: .7143rem;
                    overflow: hidden;
                    .game-list {
                        width: 100%;
                        height: 10rem;
                        display: flex;
                        flex-wrap: wrap;
                        align-items: center;
                        justify-content: flex-start;
                        .game-item {
                            width: 5.3571rem;
                            margin: 4px 10px;
                            height: 6.5rem;
                            display: flex;
                            flex-direction: column;
                            justify-content: space-around;
                            align-items: center;
                            cursor: pointer;
                            span {
                                white-space: nowrap;
                                overflow: hidden;
                                text-overflow: ellipsis;
                            }
                        }
                        img {
                            width: 4.5rem;
                            height: 4.5rem;
                            border-radius: .5714rem;
                        }
                        img::hover {
                            transform: scale(1.2);
                        }
                    }
                }
            }
            .item-right {
                width: 228px;
                /* margin-left: 11.4288px; */
                height: 100%;
                display: flex;
                align-items: center;
                flex-direction: column;
                .top1 {
                    width: 100%;
                    height: 114px;
                    background-color: #fff;
                    border-radius: 8px;
                    box-sizing: border-box;
                    padding: 20px 14px;
                    .title {
                        width: 100%;
                        display: flex;
                        justify-content: space-around;
                        align-items: center;
                        margin-bottom: 16px;
                        .line {
                            border-radius: 8px 8px 8px 8px;
                            border: 1px solid #999;
                            height: 12px;
                        }
                        .item {
                            cursor: pointer;
                            font-weight: bold;
                            font-family: Bold, OPPOSans-B, OPPOSans;
                            font-size: 16px;
                            color: #999999;
                        }
                        .item-this {
                            color: #666666;
                        }
                        .item:hover {
                            color: #666666;
                        }
                    }
                    .input {
                        width: 100%;
                        input {
                            width: 145px;
                            height: 32px;
                            background: #FFFFFF;
                            border-radius: 8px 8px 8px 8px;
                            border: 1px solid #999999;
                            box-sizing: border-box;
                            padding: 5px 10px;
                            font-family: Light, OPPOSans-B, OPPOSans;
                        }
                        input::placeholder {
                            font-family: Light, OPPOSans-B, OPPOSans;
                        }
                        span {
                            cursor: pointer;
                            font-size: 14px;
                            color: #666666;
                        }
                    }
                }
                .top {
                    width: 100%;
                    height: 120px;
                    background-color: #fff;
                    border-radius: 8px;
                    margin-bottom: 14px;
                    margin-top: 14px;
                    padding: 16px;
                }
                .bottom {
                    width: 100%;
                    height: 120px;
                    background-color: #fff;
                    border-radius: 8px;
                    padding: 16px;
                }
                .title {
                    width: 100%;
                    display: flex;
                    align-items: center;
                    justify-content: space-between;
                    margin-bottom: 8px;
                    .bt {
                        width: 50%;
                        display: flex;
                        align-items: center;
                        justify-content: flex-start;
                        img {
                            width: 24px;
                            height: 24px;
                        }
                        span {
                            margin-left: 5px;
                            font-weight: bold;
                            font-family: Bold, OPPOSans-B, OPPOSans;
                            font-size: .875rem;
                            color: #333333;
                        }
                    }
                    span {
                        font-weight: 400;
                        font-size: .75rem;
                        color: #999999;
                    }
                    .more {
                        cursor: pointer;
                    }
                    .more:hover {
                        font-weight: bold;
                        font-family: Bold, OPPOSans-B, OPPOSans;
                        color: #7EA7FF;
                    }
                }
                .list {
                    width: 100%;
                    /* padding-left: 8px; */
                    .list-item {
                        width: 100%;
                        font-weight: 500;
                        font-size: .75rem;
                        line-height: 2.1429rem;
                        color: #666666;
                        white-space: nowrap;
                        overflow: hidden;
                        text-overflow: ellipsis;
                        cursor: pointer;
                    }
                    .list-item:hover {
                        font-weight: bold;
                        font-family: Bold, OPPOSans-B, OPPOSans;
                        color: #7EA7FF;
                    }
                }
            }
        }
        .item3_1 {
            width: 100%;
            height: 60px;
            line-height: 60px;
            background: #fff;
            border-radius: 8px;
            margin-top: 16px;
            display: flex;
            align-items: center;
            justify-content: space-around;
            .item3_1_item {
                cursor: pointer;
                img {
                    width: 30px;
                    height: 30px;
                    margin-right: 5px;
                }
            }
            .item3_1_item:hover {
                color: #FF763B;
                img {
                    transform: scale(1.1);
                }
            }
        }
        .item4 {
            width: 100%;
            height: 170px;
            margin-top: 16px;
            display: flex;
            justify-content: space-around;
            align-items: center;
            background: url(/indexstatic/imgs/index_zb.png) no-repeat center;
            background-size: cover;
            .name {
                width: 160px;
                padding-left: 35px;
                .t1 {
                    font-weight: bold;
                    font-family: Bold, OPPOSans-B, OPPOSans;
                    font-size: 1.375rem;
                    color: #333333;
                    span {
                        color: #FF763B;
                    }
                }
                .t2 {
                    font-weight: 500;
                    font-size: .75rem;
                    color: #999999;
                }
                .more {
                    font-weight: bold;
                    font-family: Bold, OPPOSans-B, OPPOSans;
                    font-size: .75rem;
                    color: #FF8D3C;
                    margin-top: 32px;
                }
            }
            .scrolllist {
                width: calc(100% - 12.5rem);
                display: flex;
                justify-content: space-around;
                align-items: center;
                .abtn {
                    cursor: pointer;
                    img {
                        width: 40px;
                        height: 40px;
                    }
                }
                .imglist_w {
                    width: 936px;
                    overflow: hidden;
                    position: relative;
                    .imglist {
                        position: relative;
                        width: auto;
                        display: flex;
                        align-items: center;
                        justify-content: flex-start;
                        li {
                            width: 324px;
                            height: 140px;
                            position: relative;
                            display: flex;
                            flex-direction: column;
                            align-items: center;
                            .zb_bg {
                                width: 300px;
                                height: 140px;
                                margin-left: 12px;
                            }
                            .zb_name {
                                position: absolute;
                                top: 12px;
                                left: 24px;
                                .t1 {
                                    font-weight: bold;
                                    font-family: Bold, OPPOSans-B, OPPOSans;
                                    font-size: 18px;
                                    color: #FFFFFF;
                                }
                                .t2 {
                                    font-weight: bold;
                                    font-family: Bold, OPPOSans-B, OPPOSans;
                                    font-size: 18px;
                                    color: #FFFFFF;
                                }
                                .info {
                                    display: flex;
                                    justify-content: flex-start;
                                    align-items: center;
                                    margin-top: 24px;
                                    img {
                                        margin-right: 5px;
                                        width: 40px;
                                        height: 40px;
                                    }
                                    .dy_info {
                                        font-weight: 500;
                                        font-size: 10px;
                                        color: #FFFFFF;
                                        /* transform: scale(0.9); */
                                    }
                                }
                            }
                            .zb_go {
                                width: 2.5rem;
                                height: 2.5rem;
                                position: absolute;
                                top: 45px;
                                left: 126px;
                                z-index: 10;
                            }
                            .zb_tx_div {
                                width: 160px;
                                height: 100%;
                                position: absolute;
                                top: 0px;
                                right: 0px;
                                border-radius: 50% 8px 8px 50%;
                                overflow: hidden;
                                .zb_tx {
                                    min-width: 160px;
                                    height: 100%;
                                }
                            }
                        }
                    }
                }
            }
        }
        .item5 {
            width: 100%;
            height: auto;
            min-height: 114.2864px;
            margin-top: 22.8576px;
            .item-top {
                width: 97%;
                height: 60px;
                display: flex;
                align-items: center;
                justify-content: flex-start;
                position: relative;
                ;
                img {
                    width: 243.4288px;
                    height: 3.6875rem;
                    margin-right: 32px;
                }
                div {
                    margin-right: 32px;
                    color: #333;
                    font-size: 14px;
                    cursor: pointer;
                }
                .game_id:hover {
                    color: #FF8D3C;
                }
                .game_this {
                    font-weight: bold;
                    font-family: Bold, OPPOSans-B, OPPOSans;
                    font-size: 16px;
                    color: #FF8D3C;
                }
                .more {
                    position: absolute;
                    right: 22.8576px;
                }
                .itme-this {
                    transform: scale(1.5);
                    color: rgb(79, 170, 214);
                }
            }
        }
        .item-content {
            width: 100%;
            display: flex;
            flex-wrap: wrap;
            justify-content: space-around;
            .account_list:hover {
                box-shadow: 0px 4px 8px 0px rgba(153, 153, 153, 0.8);
            }
            .account_list:hover img {
                transform: scale(1.2);
            }
            .account_list {
                cursor: pointer;
                width: 260px;
                height: 300px;
                margin: 12px;
                background: #FFFFFF;
                box-shadow: 0px 4px 8px 0px rgba(153, 153, 153, 0.25);
                border-radius: 8px 8px 8px 8px;
                position: relative;
                .titleDiv {
                    width: 380px;
                    height: 300px;
                    background-color: rgba(27, 27, 27, .9);
                    border-radius: 8px;
                    box-shadow: 0 0 10px 0 rgba(0, 0, 0, .2);
                    display: none;
                    height: 100%;
                    padding: 10px;
                    position: absolute;
                    top: 0px;
                    left: 265px;
                    z-index: 11;
                    .titleDivNamet {
                        color: #FFA600;
                    }
                    .titleDivContent {
                        color: #fff;
                        width: 100%;
                        height: 250px;
                        overflow: hidden;
                        overflow-y: auto;
                    }
                }
                .img {
                    width: 260px;
                    height: 145px;
                    overflow: hidden;
                    img {
                        width: 260px;
                        height: 145px;
                        border-radius: 8px 8px 0px 0px;
                        transition: transform 2s;
                        -webkit-transition: transform 2s;
                        /* Safari */
                    }
                }
                .show_num {
                    display: flex;
                    align-items: center;
                    justify-content: flex-start;
                    .red_fire {
                        width: 20px;
                        height: 20px;
                        margin-right: 5px;
                    }
                }
                .title {
                    width: 260px;
                    height: 78px;
                    box-sizing: border-box;
                    padding: 12px;
                    font-size: 14px;
                    color: #333333;
                    display: -webkit-box;
                    -webkit-box-orient: vertical;
                    -webkit-line-clamp: 3;
                    overflow: hidden;
                }
                .price {
                    width: 260px;
                    height: 30px;
                    line-height: 30px;
                    box-sizing: border-box;
                    padding: 12px;
                    display: flex;
                    align-items: center;
                    justify-content: space-between;
                }
                .attrs {
                    width: 100%;
                    display: flex;
                    align-items: center;
                    justify-content: flex-start;
                    box-sizing: border-box;
                    padding: 12px;
                    .attrs_item {
                        margin-right: 8px;
                        width: 48px;
                        height: 18px;
                        padding: 0px 12px;
                        text-align: center;
                        line-height: 18px;
                        font-weight: bold;
                        font-family: Bold, OPPOSans-B, OPPOSans;
                        font-size: 10px;
                        color: #FFFFFF;
                        background: #FFA600;
                        border-radius: 50px 50px 50px 50px;
                    }
                }
            }
        }
    }
}

.account-list {
    width: 100%;
    min-width: 1920px;
    .list-content {
        width: 85.7143rem;
        height: auto;
        margin: 0 auto;
        padding-top: 22.8576px;
        .nav {
            margin-bottom: 22.8576px;
        }
        .layuimini-form {
            width: 1200px;
            background: #fff;
            border-radius: 8px;
            box-sizing: border-box;
            padding: 16px 24px;
            font-family: "OPPOSans";
            .layui-form-item {
                margin: 6px 0px;
            }
            .layui-form-item-line {
                width: calc(100% - 110px);
                border-bottom: 1px solid #eee;
                margin: 12px 0px;
                margin-left: 110px;
            }
            .danhang {
                width: 372px;
                height: 36px;
                border-radius: 8px 8px 8px 8px;
                border: 1px solid #eee;
            }
            .qujian {
                width: 100px;
                height: 36px;
                border-radius: 8px 8px 8px 8px;
                border: 1px solid #eee;
            }
            input::placeholder {
                /*font-size: 12px;*/
                color: #ccc;
            }
            i.layui-anim {
                display: none;
            }
            i.layui-icon {
                display: none;
            }
            .layui-form-radio{
                div {
                    /* width: 44px; */
                    padding: 0px 10px;
                    height: 26px;
                    line-height: 26px;
                    text-align: center;
                    font-family: OPPOSans, OPPOSans;
                    border: 1px ;
                    font-weight: 400;
                    font-size: 14px;
                    color: #666666;
                    border: 1px solid rgba(255,255,255,0);
                }
            }
            .layui-form-radioed {
                div {
                    /* width: 44px; */
                    padding: 0px 10px;
                    height: 26px;
                    line-height: 26px;
                    text-align: center;
                    background: rgba(255,141,60,0.1);
                    border-radius: 4px 4px 4px 4px;
                    border: 1px solid #FF8D3C;
                    font-family: OPPOSans, OPPOSans;
                    font-weight: 400;
                    font-size: 14px;
                    color: #FF8D3C;
                }
            }
            .layui-form-checkbox[lay-skin=primary] {
                padding-left: 0px;
                padding-right: 16px;
            }
            .layui-form-checkbox {
                margin-top: 0px;
                span{
                    padding: 0px 10px;
                    height: 26px;
                    line-height: 26px;
                    text-align: center;
                    border-radius: 4px 4px 4px 4px;
                    font-family: OPPOSans, OPPOSans;
                    font-weight: 400;
                    font-size: 14px;
                    border: 1px solid rgba(255,255,255,0);
                }

            }
            .layui-form-checked {
                span {
                    display: block;
                    /* width: 44px; */
                    padding: 0px 10px;
                    height: 26px;
                    line-height: 26px;
                    text-align: center;
                    background: rgba(255,141,60,0.1);
                    border-radius: 4px 4px 4px 4px;
                    border: 1px solid #FF8D3C;
                    font-family: OPPOSans, OPPOSans;
                    font-weight: 400;
                    font-size: 14px;
                    color: #FF8D3C;

                }
            }
            .layui-form-label {
                font-family: "OPPOSans-M";
                font-size: 14px;
                color: #666666;
            }
            .search-kwd {
                input {
                    width: 372px;
                    height: 36px;
                    border-radius: 8px 8px 8px 8px;
                }
                input::placeholder {
                    font-size: 12px;
                    color: #999999;
                }
                input:focus {
                    box-shadow: 0px 0px 8px 0px #FF8D3C;
                    border: 1px solid #FF763B;
                }
            }
            .submitBtn {
                width: 200px;
                height: 36px;
                line-height: 36px;
                background: #FF8D3C;
                border-radius: 8px 8px 8px 8px;
                font-size: 12px;
                color: #FFFFFF;
            }
            .uploadBtn {
                height: 36px;
                line-height: 36px;
                background: #fff;
                border: 1px solid #FF763B;
                border-radius: 8px 8px 8px 8px;
                font-size: 12px;
                color: #FF763B;
            }
        }
        .sort {
            width: 1200px;
            height: 60px;
            line-height: 60px;
            background: #fff;
            border-radius: 8px;
            margin: 12px 0px;
            display: flex;
            align-items: center;
            justify-content: flex-start;
            .sort-item {
                margin-left: 34.2864px;
                font-size: 18.2864px;
                cursor: pointer;
                font-size: 14px;
                color: #666666;
            }
            .sort-item:hover {
                font-weight: bold;
                font-family: Bold, OPPOSans-B, OPPOSans;
                color: #FF8D3C;
            }
            .sort-this {
                font-weight: bold;
                font-family: Bold, OPPOSans-B, OPPOSans;
                color: #FF8D3C;
            }
        }
        .lists {
            width: 100%;
            height: auto;
            background: #fff;
            border-radius: 8px;
            box-sizing: border-box;
            padding: 16px 24px;
            .ad {
                width: 100%;
            }
            .list-item:hover {
                background: linear-gradient(to right, #FFE6C9, #FFFFFF);
            }
            .list-item {
                width: 100%;
                height: 173px;
                padding: 17.1424px 11.4288px 11.4288px;
                /* margin-top: 17.1424px; */
                display: flex;
                justify-content: space-around;
                border-bottom: .0625rem solid #eee;
                border-radius: 8px;
                overflow: hidden;
                img {
                    width: 260px;
                    height: 145px;
                    border-radius: 9.1424px
                }
                .content {
                    width: calc(100% - 434px);
                    height: 145px;
                    display: flex;
                    flex-direction: column;
                    justify-content: space-between;
                    margin-left: 10px;
                    .tips{
                        img {
                            width: 64px;
                            height: 21px;
                            margin-right: 8px;
                        }
                        .zhaohuispan {
                            font-family: OPPOSans, OPPOSans;
                            font-weight: 400;
                            font-size: 14px;
                            color: #999999;
                            margin-left: 5px;
                        }
                        .red_fire {
                            width: 20px;
                            height: 20px;
                        }
                    }
                    .title {
                        width: 100%;
                        line-height: 28.5712px;
                        display: -webkit-box;
                        -webkit-box-orient: vertical;
                        -webkit-line-clamp: 2;
                        overflow: hidden;
                        font-family: OPPOSans-B;
                        font-weight: 500;
                        font-size: 16px;
                        color: #333333;
                    }
                    .attr {
                        display: flex;
                        justify-content: flex-start;
                        span {
                            margin-right: 10px;
                            font-size: 14px;
                            color: #999999;
                        }
                    }
                    .price {
                        width: 100%;
                        display: flex;
                        align-items: center;
                        justify-content: space-between;
                        .zhaohui {
                            /* color: #90CFED; */
                            font-size: 12px;
                            color: #999999;
                            span {
                                margin-left: 48px;
                            }
                            .red_fire {
                                width: 20px;
                                height: 20px;
                            }
                        }
                        .sale-price {
                            font-family: rubik;
                            font-weight: 500;
                            font-size: 22px;
                            color: #E6686B;
                            text-align: center;
                            padding-right: 5.7136px;
                        }
                    }
                }
                .zixun{
                    width: 130px;
                    box-sizing: border-box;
                    /*padding: 15px 0px 0px 5px;*/
                    /*text-align: right;*/
                    display: flex;
                    flex-direction: column;
                    justify-content: center;
                    position: relative;

                    .red_fire {
                        width: 20px;
                        height: 20px;
                    }
                    .kefu_zixun{
                        width: 131px;
                        height: 35px;
                        line-height: 173px;
                    }
                    .zhaohui{
                        position: absolute;
                        bottom: 0px;
                        right: 0px;
                        width: 160px;
                        text-align: right;
                        font-family: OPPOSans, OPPOSans;
                        font-weight: 400;
                        font-size: 14px;
                        color: #999999;
                        margin-left: 5px;
                    }
                }
            }
        }

        #page{
            text-align: right;
            .layui-box{
                a{
                    height: 32px;
                    line-height: 32px;
                    background: #FFFFFF;
                    border-radius: 4px 4px 4px 4px;
                    box-sizing: border-box;
                    margin: 0px 2px;

                    font-family: OPPOSans-B, OPPOSans;
                    font-weight: 500;
                    font-size: 14px;
                    color: #666666;
                }
                .layui-laypage-curr{
                    /*width: 40px;*/
                    height: 32px;
                    top: 2px;
                    .layui-laypage-em {
                        border-radius: 4px 4px 4px 4px;
                        font-family: OPPOSans-B, OPPOSans;
                        font-weight: 800;
                        font-size: 14px;
                        color: #FFFFFF;
                        position: absolute;
                        left: 0px;
                        top: 0px;
                        padding: 0px;
                        width: 100%;
                        height: 100%;
                        background-color: #FF8D3C;
                    }
                    em{
                        top: 0px;
                    }

                }

                .layui-laypage-spr{
                    height: 32px;
                    position: relative;
                    top: 2px;
                }
            }
        }
    }
}

.account-add {
    width: 100%;
    min-width: 1920px;
    .account-add-content {
        width: 1200px;
        height: auto;
        margin: 0 auto;
        padding-top: 22px;
        .nav {
            margin-bottom: 22px;
        }
        .step {
            width: 100%;
            height: 120px;
            img {
                width: 100%;
                height: 100%;
            }
        }
        .layuimini-form {
            width: 1200px;
            /* background: #fff;
            border-radius: 8px; */
            box-sizing: border-box;
            padding: 16px 0px;
            .layui-form-item {
                margin: 6px 0px;
            }
            .danhang {
                width: 372px;
                height: 36px;
                border-radius: 8px 8px 8px 8px;
                border: 1px solid #999999;
            }
            .qujian {
                width: 100px;
                height: 36px;
                border-radius: 8px 8px 8px 8px;
                border: 1px solid #999999;
            }
            i.layui-anim {
                display: none;
            }
            i.layui-icon {
                display: none;
            }
            .layui-form-radioed {
                div {
                    /* width: 44px; */
                    padding: 0px 10px;
                    height: 26px;
                    line-height: 26px;
                    text-align: center;
                    background: #FF8D3C;
                    border-radius: 8px 8px 8px 8px;
                    font-weight: bold;
                    font-family: Bold, OPPOSans-B, OPPOSans;
                    font-size: 12px;
                    color: #FFFFFF;
                }
            }
            .layui-form-checkbox[lay-skin=primary] {
                padding-left: 0px;
                padding-right: 16px;
            }
            .layui-form-checkbox {
                margin-top: 0px;
            }
            .layui-form-checked {
                padding: 0px 16px;
                span {
                    display: block;
                    /* width: 44px; */
                    padding: 0px 10px;
                    height: 26px;
                    line-height: 26px;
                    text-align: center;
                    background: #FF8D3C;
                    border-radius: 8px 8px 8px 8px;
                    font-weight: bold;
                    font-family: Bold, OPPOSans-B, OPPOSans;
                    font-size: 12px;
                    color: #FFFFFF;
                }
            }
            .layui-form-label {
                font-weight: bold;
                font-family: Bold, OPPOSans-B, OPPOSans;
                font-size: 14px;
                color: #666666;
            }
            .search-kwd {
                input {
                    width: 372px;
                    height: 36px;
                    border-radius: 8px 8px 8px 8px;
                }
                input::placeholder {
                    font-size: 12px;
                    color: #999999;
                }
                input:focus {
                    box-shadow: 0px 0px 8px 0px #FF8D3C;
                    border: 1px solid #FF763B;
                }
            }
            .submitBtn {
                width: 320px;
                height: 60px;
                background: #FF8229;
                border-radius: 8px 8px 8px 8px;
                line-height: 60px;
                font-weight: bold;
                font-family: Bold, OPPOSans-B, OPPOSans;
                font-size: 18px;
                color: #FFFFFF;
                margin: 0 auto;
                display: block;
                font-family: "黑体", OPPOSans-B;
            }
            .nextBtn {
                width: 320px;
                height: 60px;
                background: #FF8229;
                border-radius: 8px 8px 8px 8px;
                line-height: 60px;
                font-weight: bold;
                font-family: Bold, OPPOSans-B, OPPOSans;
                font-size: 18px;
                color: #FFFFFF;
                margin: 0 auto;
                display: block;
                font-family: "黑体", OPPOSans-B;
            }
            .uploadBtn {
                height: 36px;
                line-height: 36px;
                background: #fff;
                border: 1px solid #FF763B;
                border-radius: 8px 8px 8px 8px;
                font-size: 12px;
                color: #FF763B;
            }
        }
        .div-item {
            width: 100%;
            margin-top: 10px;
            margin-bottom: 10px;
            background: #FFFFFF;
            border-radius: 0px 0px 8px 8px;
            .title {
                width: 100%;
                height: 60px;
                line-height: 60px;
                background: linear-gradient( 90deg, #4C5169 0%, #8F929F 100%);
                border-radius: 8px 8px 0px 0px;
                font-weight: bold;
                font-family: Bold, OPPOSans-B, OPPOSans;
                font-size: 18px;
                color: #FFFFFF;
                box-sizing: border-box;
                padding-left: 32px;
            }
            .content {
                width: 100%;
                box-sizing: border-box;
                padding: 20px 32px;
                .content-title {
                    font-weight: bold;
                    font-family: Bold, OPPOSans-B, OPPOSans;
                    font-size: 16px;
                    color: #333333;
                    margin-bottom: 20px;
                }
                .show_img_info {
                    width: 400px;
                    height: 38px;
                    padding: 7px 16px;
                    display: flex;
                    line-height: 24px;
                    justify-content: space-between;
                    background: #DBF7FF;
                    border-radius: 8px 8px 8px 8px;
                    margin-left: 115px;
                    font-size: 12px;
                    color: #3D91FF;
                    cursor: pointer;
                    margin-top: 12px;
                    img {
                        width: 24px;
                        height: 24px;
                    }
                }
                .layui-form-label {
                    text-align: right;
                    font-size: 14px;
                    color: #333333;
                }
                .layui-input-inline {
                    width: 400px;
                    .layui-input {
                        background: #F9F9F9;
                        border-radius: 8px 8px 8px 8px;
                    }
                    .layui-input::placeholder {
                        color: #999;
                        font-family: Bold, OPPOSans-B, OPPOSans;
                    }
                }
                .redX {
                    color: red;
                }
                .game-info {
                    .layui-form-radio {
                        div {
                            padding: 0px 10px;
                            height: 40px;
                            text-align: center;
                            line-height: 40px;
                            background: #FFF7ED;
                            border-radius: 8px 8px 8px 8px;
                        }
                    }
                    .layui-form-radioed {
                        div {
                            height: 40px;
                            text-align: center;
                            line-height: 40px;
                            background: #FF8D3C;
                            border-radius: 8px 8px 8px 8px;
                            font-size: 14px;
                            color: #FFFFFF;
                        }
                    }
                }
                .layui-input-block {
                    padding: 0 5px;
                    textarea::placeholder {
                        font-family: Bold, OPPOSans-B, OPPOSans;
                    }
                    .layui-form-radio {
                        div {
                            padding: 0px 10px;
                            height: 40px;
                            text-align: center;
                            line-height: 40px;
                            background: #FFF7ED;
                            border-radius: 8px 8px 8px 8px;
                        }
                    }
                    .layui-form-radioed {
                        div {
                            /* width: 130px; */
                            height: 40px;
                            text-align: center;
                            line-height: 40px;
                            background: #FF8D3C;
                            border-radius: 8px 8px 8px 8px;
                            font-size: 14px;
                            color: #FFFFFF;
                        }
                    }
                    .layui-form-checkbox {
                        height: 40px !important;
                        line-height: 40px !important;
                        text-align: center;
                        line-height: 40px;
                        background: #FFF7ED;
                        border-radius: 8px 8px 8px 8px;
                        padding-right: 0px;
                        margin-right: 16px;
                        margin-bottom: 12px;
                        padding: 0px 10px;
                        span {
                            padding: 0px;
                            font-size: 14px;
                            line-height: 40px;
                        }
                    }
                    .layui-form-checked {
                        /* width: 130px; */
                        height: 40px;
                        text-align: center;
                        line-height: 40px;
                        background: #FF8D3C;
                        border-radius: 8px 8px 8px 8px;
                        /* font-size: 14px; */
                        color: #FFFFFF;
                        padding: 0px 10px;
                        span {
                            font-weight: 500;
                            padding: 0px;
                            height: 40px;
                            font-size: 14px;
                            line-height: 40px;
                        }
                    }
                }
                .game-info {
                    width: 100%;
                    display: flex;
                    align-items: center;
                    justify-content: flex-start;
                    img {
                        width: 72px;
                        height: 72px;
                    }
                    .name {
                        font-weight: 500;
                        font-size: 16px;
                        color: #333333;
                        margin: 0px 16px;
                    }
                    .sel-game {
                        width: 128px;
                        height: 40px;
                        line-height: 38px;
                        text-align: center;
                        background: #FFF7ED;
                        border-radius: 8px 8px 8px 8px;
                        border: 1px solid #FF8D3C;
                        font-size: 16px;
                        color: #FF8D3C;
                        cursor: pointer;
                    }
                }
                .sale_price_list {
                    width: 100%;
                    display: flex;
                    justify-content: flex-start;
                    padding-left: 115px;
                    .sale_price_item {
                        width: 180px;
                        height: 74px;
                        background: #ECF9FF;
                        border-radius: 8px 8px 8px 8px;
                        margin-right: 40px;
                        font-size: 12px;
                        text-align: center;
                        padding-top: 16px;
                    }
                    .sale_price_item01 {
                        .price {
                            color: #333333;
                            span {
                                font-size: 14px;
                            }
                        }
                        .des {
                            color: #999999;
                        }
                    }
                    .sale_price_item02 {
                        .price {
                            color: #FF2424;
                            span {
                                font-size: 14px;
                            }
                        }
                        .des {
                            color: #999999;
                        }
                    }
                }
            }
        }
    }
}


.account-info {
    width: 100%;
    min-width: 1920px;
    .info-content {
        width: 1200px;
        height: auto;
        margin: 0 auto;
        padding-top: 22.8576px;
        .nav {
            margin-bottom: 22.8576px;
        }
    }
    .item1 {
        width: 1200px;
        height: 394px;
        display: flex;
        justify-content: space-between;
        background: #FFFFFF;
        box-sizing: border-box;
        padding: 1.5rem;
        border-radius: .5rem;
        position: relative;
        /*margin-bottom: 4.25rem;*/
        .img {
            width: 480px;
            height: 270px;
            border-radius: 8px;
            img {
                width: 100%;
                height: 100%;
                border-radius: 8px;
            }
        }
        .info {
            width: calc(100% - 35.5rem);
            height: 268px;
            background: linear-gradient( to bottom, #FFF9F4, #FFF0E4);
            position: relative;
            padding: 16px;
            .title {
                display: inline-block;
                width: 100%;
                height: 50px;
                line-height: 27px;
                margin: 0 0 12px 0;
                border-radius: 3.4288px;
                font-family: OPPOSans-B;
                font-weight: 500;
                font-size: 18px;
                color: #333333;
                box-sizing: border-box;
                overflow: hidden;
                text-overflow: ellipsis;
                display: -webkit-box;
                -webkit-box-orient: vertical;
                -webkit-line-clamp: 2;
            }
            .attr {
                width: 100%;
                height: 64px;
                background: linear-gradient( to bottom, rgba(249, 249, 249, 0.3), #FFF);
                padding: 16px;
                border-radius: 8px;
                /*background: url("/indexstatic/imgs/account_attr_bg.png") no-repeat center;*/
                /*background-size: cover;*/
                display: flex;
                align-items: center;
                justify-content: space-between;
                margin-top: .5rem;
                box-shadow: 8px 8px 30px 0px rgba(255, 124, 30, 0.25);
                .price-title {
                    color: #333;
                    height: 3.75rem;
                    line-height: 3.75rem;
                    font-size: 1rem;
                    .price {
                        padding-left: 11.4288px;
                        font-family: rubik;
                        font-weight: 500;
                        font-size: 24px;
                        color: #FF4B4B;
                        span {
                            padding-left: 3px;
                        }
                    }
                }
                .attrs {
                    /* width: 100%; */
                    /* display: flex;
                    justify-content: space-between; */
                    font-size: 1rem;
                    color: #999999;
                    span {
                        color: #333333;
                        margin-left: .5rem;
                    }
                }
            }
            .tips {
                width: 100%;
                height: 54px;
                background: #fff;
                box-sizing: border-box;
                padding: 18px 20px;
                background: linear-gradient( to bottom, rgba(249, 249, 249, 0.5), #FFF);
                padding: 16px;
                border-radius: 8px;
                margin-top: 12px;
                margin-bottom: 20px;
                /*box-shadow: 8px 8px 30px 0px rgba(255, 124, 30, 0.25);*/
                .top {

                    width: 100%;
                    display: flex;
                    align-items: center;
                    justify-content: space-between;
                    margin-bottom: 1rem;

                    span {
                        color: #999999;
                        font-size: 1rem;
                        margin-right: 5.7136px;
                    }
                    .color3{
                        color: #333;
                    }
                    .colorFF9D3C{
                        color: #FF9D3C;
                        margin-left: 5px;
                    }
                    .red_fire {
                        width: 20px;
                        height: 20px;
                        margin-right: 5px;
                    }
                }

            }
            .bottom {
                width: 100%;
                display: flex;
                align-items: center;
                justify-content: space-between;
                span {
                    color: #90CFED;
                    font-size: 18.2864px;
                    margin-right: 5.7136px;
                }
            }
        }
        .btns {
            width: 100%;
            height: 60px;
            position: absolute;
            bottom: 18px;
            left: 0px;
            box-sizing: border-box;
            padding: 0px 1.5625rem;
            display: flex;
            align-items: center;
            justify-content: flex-end;
            .addCollect {
                position: absolute;
                left: 24px;
                top: 12px;
                border: none;
            }
            .kanjia {
                width: 100px;
                height: 50px;
                text-align: center;
                line-height: 50px;
                background: #3D91FF;
                border-radius: 8px;
                font-weight: bold;
                font-family: Bold, OPPOSans-B, OPPOSans;
                font-size: 16px;
                color: #fff;
            }
            .pay {
                width: 145px;
                height: 50px;
                text-align: center;
                line-height: 50px;
                background: rgba(0, 0, 0, 0);
                border-radius: 8px;
                font-weight: bold;
                font-family: Bold, OPPOSans-B, OPPOSans;
                font-size: 16px;
                color: #FF7F3A;
                border: 1px solid #FF8D3C;
                border-radius: 8px;
            }
            .contact {
                width: 145px;
                height: 50px;
                text-align: center;
                line-height: 50px;
                background: linear-gradient( to right, #FF4B4B, #FFA96B);
                border-radius: 8px;
                font-weight: bold;
                font-family: Bold, OPPOSans-B, OPPOSans;
                font-size: 16px;
                color: #fff;
                border: none;
            }
        }
    }
    .item2 {
        width: 1200px;
        background: #fff;
        border-radius: 8px;
        height: auto;
        margin-top: 20px;
        .layui-tab-title {
            background: linear-gradient( 270deg, #FFFAF3 0%, #FFF4DB 100%);
            border-radius: 8px 8px 8px 8px;
            height: 60px;
            li {
                font-size: 1rem;
            }
            .layui-this {
                background: #FF8D3C;
                border-radius: 8px 8px 0px 0px;
                font-size: 18px;
                color: #FFFFFF;
                height: 60px;
                line-height: 60px;
            }
            .layui-this:after {
                border: none;
            }
        }
        .layui-tab-content {
            .attr-list {
                width: 100%;
                display: flex;
                flex-wrap: wrap;
                justify-content: flex-start;
                .attr-infos{
                    width: 100%;
                    display: flex;
                    justify-content: flex-start;
                    align-items: center;
                    /*margin-top: 28px;*/
                    span{
                        width: 120px;
                        text-align: center;
                        height: 40px;
                        line-height: 40px;
                        background: #FFF8EC;
                        border-radius: 4px 4px 4px 4px;
                        border: 1px solid #FF8D3C;
                        font-family: OPPOSans-B, OPPOSans;
                        font-weight: 500;
                        font-size: 16px;
                        color: #FF7F3A;
                    }
                }

                .attr-div{
                    width: 1120px;
                    margin: 0 auto;
                    border-radius: 8px;
                    margin-top: 28px;
                    border: 2px solid #FFF0DB;
                    .attr-item {
                        width: 100%;
                        display: flex;
                        justify-content: flex-start;
                        border-bottom: 1px solid #FFF0DB;
                        .title {
                            width: 152px;
                            font-family: OPPOSans-B, OPPOSans;
                            font-weight: 400;
                            font-size: 14px;
                            color: #333333;
                            line-height: 14px;
                            background: #FFF8EC;
                            margin-top: 0px;
                            box-sizing: border-box;
                            padding: 16px 24px;

                        }
                        .info {
                            width: calc(100% - 200px);
                            font-family: OPPOSans-B;
                            font-weight: 500;
                            font-size: 14px;
                            line-height: 20px;
                            color: #666666;
                            box-sizing: border-box;
                            padding: 16px 24px;
                        }
                    }
                }

                span {
                    margin: 0rem 11.4288px;
                }
            }
            .account_deal {
                height: 48px;
                margin: 16px auto;
                display: block;
            }
            .title {
                margin-top: 22.8576px;
            }
            .img-list {
                img {
                    margin-top: 11.4288px;
                }
            }
            .layui-tab-item {
                width: 100%;
                box-sizing: border-box;
                padding: 11.4288px 22.8576px;
                .qq_qun {
                    width: 400px;
                    height: 110px;
                    border-radius: 8px;
                    display: flex;
                    align-items: center;
                    justify-content: space-between;
                    background: #F9F9F9;
                    .qq_qun_info {
                        width: 300px;
                        font-weight: bold;
                        font-family: Bold, OPPOSans-B, OPPOSans;
                        font-size: 16px;
                        color: #333333;
                    }
                    .touxiang {
                        border-radius: 50%;
                        border: 1px solid #000000;
                    }
                }
            }
        }
    }
}
/** // #e60f0f; */

.order-info {
    width: 100%;
    min-width: 1920px;
    .info-content {
        width: 85.7143rem;
        height: auto;
        margin: 0 auto;
        padding-top: 22.8576px;
        .nav {
            margin-bottom: 22.8576px;
        }
    }
    .layui-elem-field {
        legend {
            color: #333;
            font-weight: bold;
            font-family: Bold, OPPOSans-B, OPPOSans;
        }
    }
    .item1 {
        width: 1200px;
        height: 226px;
        display: flex;
        justify-content: space-around;
        .img {
            width: 320px;
            height: 178px;
            border-radius: 5px 5px 5px 5px;
            img {
                width: 100%;
                height: 100%;
            }
        }
        .info {
            width: calc(100% - 368px);
            height: 100%;
            position: relative;
            .title {
                display: inline-block;
                width: 100%;
                height: 100.5712px;
                line-height: 30.8576px;
                margin: 0 .3125rem 0 0;
                border-radius: 3.4288px;
                font-size: 17.1424px;
                font-family: SourceHanSansCN-Medium, SourceHanSansCN;
                font-weight: 500;
                color: #333333;
                box-sizing: border-box;
                overflow: hidden;
                text-overflow: ellipsis;
                display: -webkit-box;
                -webkit-box-orient: vertical;
                -webkit-line-clamp: 3;
            }
            .tips {
                width: 100%;
                height: 57.1424px;
                display: flex;
                align-items: center;
                justify-content: space-around;
                div {
                    margin-right: 11.4288px;
                    span {
                        color: #90CFED;
                        font-size: 18.2864px;
                        margin-right: 5.7136px;
                    }
                }
            }
            .attr {
                width: 100%;
                height: auto;
                /*background: #F4F6F9;*/
                /*padding: 12px;*/
                .price-title {
                    color: #333;
                    height: 55px;
                    line-height: 55px;
                    font-family: OPPOSans-M, OPPOSans;
                    font-weight: 400;
                    font-size: 14px;
                    color: #999999;
                    .price {
                        font-size: 16px;
                        color: #FF4B4B;
                        font-weight: bold;
                        font-family: Bold, OPPOSans-B, OPPOSans;
                        padding-left: 12px;
                        span {
                            font-size: 20px;
                            padding-left: 5.7136px;
                        }
                    }
                }
                .attrs {
                    width: 100%;
                    display: flex;
                    justify-content: space-between;
                    font-family: OPPOSans-M, OPPOSans;
                    font-weight: 400;
                    font-size: 14px;
                    color: #999999;
                    .account-code{
                        color: #333;
                    }
                    .attr-val{
                        color: #FF9D3C;
                    }
                }
            }
        }
    }
    .item2 {
        width: 100%;
        background: #fff;
        box-sizing: border-box;
        padding: 24px;
        border-radius: 8px;
        .baopei {
            width: 628.5712px;
            height: 108.5712px;
            box-sizing: border-box;
            padding: 11.4288px 17.1424px;
            border-radius: 11.4288px;
            cursor: pointer;
            border: .0625rem solid #eee;
            .top {
                width: 100%;
                display: flex;
                justify-content: space-between;
                .title {
                    font-size: 18.2864px;
                    font-weight: bold;
                    font-family: Bold, OPPOSans-B, OPPOSans;
                }
                .info {
                    color: #333;
                    span {
                        color: #f7423f;
                    }
                }
            }
            .bottom {
                width: 100%;
                display: flex;
                align-items: center;
                justify-content: space-between;
                margin-top: 17.1424px;
                .layui-form-radio {
                    position: relative;
                    top: -3.4288px;
                }
            }
        }
        .layui-this {
            border: .0625rem solid #4FAAD6;
            background-color: rgba(79, 170, 214, 0.1);
        }
    }
    .item4 {
        width: 100%;
        background: #fff;
        box-sizing: border-box;
        padding: 24px;
        border-radius: 8px;
        display: flex;
        align-items: center;
        justify-content: flex-start;
    }
    .item3 {
        width: 100%;
        height: 68px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-top: 32px;
        position: relative;
        background: #fff;
        border-radius: 8px;
        padding: 0px 24px;
        .agree {
            width: 285px;
            position: relative;
            .title {
                font-family: OPPOSans-M, OPPOSans;
                font-weight: 500;
                font-size: 14px;
                color: #333333;
                /*position: absolute;*/
                /*top: 10.2864px;*/
                /*left: 34.2864px;*/
            }
        }
        .pay-info {
            width: 50rem;
            height: 68px;
            display: flex;
            align-items: center;
            justify-content: flex-end;
            .price {
                font-family: OPPOSans-M, OPPOSans;
                font-weight: 500;
                font-size: 14px;
                color: #999999;
                span {
                    font-family: Bold, OPPOSans-B, OPPOSans;
                    font-weight: bold;
                    font-size: 20px;
                    color: #FF8D3B;
                }
            }
            .layui-btn-group {
                margin-left: 70px;
                button{
                    width: 136px;
                    height: 50px;
                    font-family: OPPOSans-M, OPPOSans;
                    font-weight: 500;
                    font-size: 16px;
                    color: #FFFFFF;
                    background: #FF8D3B;
                    border-radius: 8px;
                    border: none;
                    letter-spacing: 3px;
                }

            }
        }
        .priceInfo {
            width: 297.1424px;
            height: 171.4288px;
            background-color: #fff;
            box-sizing: border-box;
            padding: 11.4288px 22.8576px;
            box-shadow: 0 4.5712px 22.8576px 0 rgba(0, 0, 0, .1);
            border-radius: 11.4288px;
            position: absolute;
            top: -171.4288px;
            right: 108.5712px;
            .title {
                width: 100%;
                height: 34.2864px;
                font-size: 18.2864px;
                font-weight: bold;
                font-family: Bold, OPPOSans-B, OPPOSans;
                display: flex;
                justify-content: space-between;
                margin-bottom: 11.4288px;
            }
            .priceItem {
                width: 100%;
                height: 1.875rem;
                display: flex;
                justify-content: space-between;
                .totalPrice {
                    color: #f75351;
                }
                .title {
                    color: #333;
                    font-weight: bold;
                    font-family: Bold, OPPOSans-B, OPPOSans;
                }
            }
        }
    }
}

.deal-notice {
    width: 100%;
    min-width: 1920px;
    .notice-content {
        width: 85.7143rem;
        height: auto;
        margin: 0 auto;
        padding-top: 22.8576px;
        display: flex;
        justify-content: space-between;
        .item-left {
            width: 250px;
            height: 100%;
            text-align: center;
            background: #fff;
            padding-top: 24px;
            .title {
                height: 60px;
                /* background: linear-gradient(180deg, #89D5ED 0%, #51ABD7 100%); */
                font-size: 17.1424px;
                display: flex;
                align-items: center;
                justify-content: space-around;
                color: #fff;
                img {
                    width: 202px;
                    height: 56px;
                }
            }
            .title-item {
                height: 58px;
                font-size: 16px;
                display: flex;
                align-items: center;
                justify-content: center;
                color: #666666;
                cursor: pointer;
                position: relative;
                img {
                    width: 52px;
                    height: 16px;
                    position: absolute;
                    right: 20px;
                    top: 22px;
                    display: none;
                }
            }
            .select-this {
                color: #FF8D3C;
                img {
                    display: block;
                }
            }
        }
        .item-right {
            width: calc(100% - 270px);
            box-sizing: border-box;
            padding: 24px;
            height: auto;
            background: #FFFFFF;
            border-radius: .5rem .5rem .5rem .5rem;
            .title {
                width: 100%;
                height: 120px;
                position: relative;
                margin-bottom: 36px;
                img {
                    width: 100%;
                }
                .name {
                    position: absolute;
                    top: 0rem;
                    left: 0rem;
                    width: 100%;
                    height: 100%;
                    text-align: center;
                    line-height: 120px;
                    font-weight: bold;
                    font-family: Bold, OPPOSans-B, OPPOSans;
                    font-size: 24px;
                    color: #333333;
                    img {
                        display: none;
                    }
                }
            }
            .content {
                width: 100%;
                .content_list {
                    width: 100%;
                    padding-left: 28px;
                    .ctitle {
                        font-weight: bold;
                        font-family: Bold, OPPOSans-B, OPPOSans;
                        font-size: 18px;
                        color: #333333;
                        margin-bottom: 12px;
                        margin-top: 32px;
                    }
                    .content {
                        font-weight: 400;
                        font-size: .875rem;
                        color: #666666;
                    }
                    img {
                        width: 100%;
                    }
                }
            }
        }
    }
}

.about-info {
    width: 100%;
    max-width: 1920px;
    margin: 0 auto;
    .banner-img {
        width: 100%;
        max-width: 2194.2864px;
        display: block;
        margin: 0 auto;
    }
    .about-content {
        width: 100%;
        max-width: 1920px;
        height: auto;
        margin: 0 auto;
        text-align: center;
        display: flex;
        justify-content: center;
        align-items: center;
        position: relative;
        img {
            width: 100%;
            /* position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%); */
        }
    }
}

.get-account-info {
    width: 100%;
    min-width: 1920px;
    .account-content {
        width: 85.7143rem;
        height: auto;
        margin: 0 auto;
        padding-top: 22.8576px;
        /* .nav {
            margin-bottom: 22.8576px;
        } */
        .kefu-title {
            width: 100%;
            margin-top: 20px;
            position: relative;
            img {
                width: 100%;
                height: 68px;
            }
            .kefu-title-name {
                position: absolute;
                top: 20px;
                left: 32px;
                display: flex;
                justify-content: flex-start;
                align-items: center;
                .t1 {
                    font-weight: bold;
                    font-family: Bold, OPPOSans-B, OPPOSans;
                    font-size: 1.125rem;
                    color: #FFFFFF;
                    margin: 0rem 20px;
                }
                .t2 {
                    font-size: 1.125rem;
                    color: #FFFFFF;
                    margin: 0rem 20px;
                }
                .line {
                    width: .25rem;
                    height: 1rem;
                    background: #FFFFFF;
                    border-radius: 3.125rem 3.125rem 3.125rem 3.125rem;
                }
            }
        }
        .kefu_list {
            width: 100%;
            display: flex;
            justify-content: flex-start;
            align-items: center;
            .kefu-item {
                width: 385px;
                height: 120px;
                border-radius: 8px;
                background-color: #fff;
                display: flex;
                justify-content: space-around;
                align-items: center;
                flex-wrap: wrap;
                margin-top: 1.5rem;
                margin-left: 24px;
                img {
                    width: 5rem;
                    height: 5rem;
                    border-radius: 50%;
                }
                .kefu_name {
                    img {
                        width: 96px;
                        height: 16px;
                        border-radius: 0;
                    }
                    .t1 {
                        font-weight: bold;
                        font-family: Bold, OPPOSans-B, OPPOSans;
                        font-size: 16px;
                        color: #666666;
                        margin-bottom: 6px;
                    }
                    .t2 {
                        font-size: .75rem;
                        color: #999999;
                        margin-top: 16px;
                    }
                }
                .layui-btn {
                    width: 120px;
                    height: 100%;
                    background: linear-gradient(45deg, #FFA25F, #FF6B00);
                    border-radius: 0rem .5rem .5rem 0rem;
                    border: none;
                    font-weight: bold;
                    font-family: Bold, OPPOSans-B, OPPOSans;
                    font-size: 1.125rem;
                    color: #FFFFFF;
                }
            }
        }
        .heihao-content {
            width: 100%;
            position: relative;
            margin-top: 20px;
            .top {
                width: 100%;
            }
            .bg {
                width: 100%;
            }
            .heihao-input {
                width: 500px;
                height: 56px;
                display: flex;
                align-items: center;
                justify-content: space-between;
                position: absolute;
                left: 21.875rem;
                top: 144px;
                input {
                    width: 400px;
                    height: 56px;
                    border-radius: .5rem 0rem 0rem .5rem;
                    border: .0625rem solid #999999;
                    padding-left: 16px;
                    font-size: 18px;
                    font-family: Light, OPPOSans-B, OPPOSans;
                }
                input::placeholder {
                    font-size: 18px;
                    color: #999999;
                    font-family: Light, OPPOSans-B, OPPOSans;
                }
                .search-btn {
                    width: 100px;
                    height: 56px;
                    line-height: 56px;
                    text-align: center;
                    background: #FF8D3C;
                    border-radius: 0rem .5rem .5rem 0rem;
                    font-weight: bold;
                    font-family: Bold, OPPOSans-B, OPPOSans;
                    font-size: 18px;
                    color: #FFFFFF;
                }
            }
            .heihao-article {
                position: absolute;
                bottom: 32px;
                left: 32px;
                .heihao-title {
                    display: flex;
                    justify-content: flex-start;
                    align-items: center;
                    font-weight: bold;
                    font-family: Bold, OPPOSans-B, OPPOSans;
                    font-size: .875rem;
                    color: #333333;
                    img {
                        width: 24px;
                        height: 24px;
                        margin-right: 5px;
                    }
                }
                .heihao-info {
                    font-size: .75rem;
                    color: #666666;
                    margin-top: 12px;
                }
            }
        }
        /* 问卷调查 */
        .question {
            width: 100%;
            margin-top: 20px;
            background: #FFFFFF;
            border-radius: .5rem .5rem .5rem .5rem;
            padding: 60px;
            .question-title {
                text-align: center;
                font-weight: bold;
                font-family: Bold, OPPOSans-B, OPPOSans;
                font-size: 26px;
                color: #666666;
                margin-bottom: 50px;
            }
            .question-des {
                font-size: .875rem;
                color: #666666;
            }
            .question-line {
                width: 67.5rem;
                height: 0rem;
                border-radius: 0rem 0rem 0rem 0rem;
                border: .0625rem solid #CCCCCC;
                margin: 1.25rem auto;
            }
            .question-item {
                margin-top: 50px;
                .question-item-title {
                    width: 100%;
                    display: flex;
                    align-items: center;
                    justify-content: flex-start;
                    .num {
                        width: 28px;
                        height: 28px;
                        text-align: center;
                        line-height: 28px;
                        border-radius: 50%;
                        background: #26AAE2;
                        color: #fff;
                        font-size: 12px;
                        margin-right: 8px;
                    }
                    .name {
                        font-weight: bold;
                        font-family: Bold, OPPOSans-B, OPPOSans;
                        font-size: 18px;
                        color: #666666;
                    }
                }
                .question-item-list {
                    width: 100%;
                    margin-top: 16px;
                    margin-left: 32px;
                }
            }
            .question-item-btn {
                width: 100%;
                text-align: center;
                margin-top: 50px;
                .layui-btn {
                    width: 10rem;
                    height: 3rem;
                    background: #FF8D3C;
                    border-radius: .5rem .5rem .5rem .5rem;
                    font-weight: bold;
                    font-family: Bold, OPPOSans-B, OPPOSans;
                    font-size: 1.25rem;
                    color: #FFFFFF;
                }
            }
        }
        /* 帮助中心 */
        .help-top {
            width: 100%;
            height: 265px;
            position: relative;
            top: -1.25rem;
            img {
                width: 100%;
                height: 100%;
            }
            .help-top-content {
                width: 100%;
                text-align: center;
                position: absolute;
                left: 0rem;
                top: 96px;
                .title {
                    font-weight: bold;
                    font-family: Bold, OPPOSans-B, OPPOSans;
                    font-size: 22px;
                    color: #333333;
                    margin-bottom: 32px;
                }
                .input {
                    width: 500px;
                    height: 56px;
                    margin: 0 auto;
                    background: #FFFFFF;
                    border-radius: 8px;
                    display: flex;
                    align-items: center;
                    justify-content: space-around;
                    input {
                        width: 400px;
                        height: 100%;
                        border-radius: .5rem 0rem 0rem .5rem;
                        border: none;
                        outline: none;
                        margin-left: 16px;
                        font-size: 16px;
                        font-family: light, OPPOSans-L, OPPOSans;
                    }
                    input::placeholder {
                        font-size: 16px;
                        color: #999999;
                        font-family: light, OPPOSans-L, OPPOSans;
                    }
                    .btn {
                        cursor: pointer;
                        width: 100px;
                        height: 30px;
                        border-radius: 0rem .5rem .5rem 0rem;
                        font-weight: bold;
                        font-family: Bold, OPPOSans-B, OPPOSans;
                        font-size: 16px;
                        color: #666666;
                        border-left: .0625rem solid #FF8D3C;
                    }
                }
            }
        }
        .help-list {
            width: 100%;
            .lists {
                width: 100%;
                display: flex;
                align-items: center;
                justify-content: space-around;
                .list-item {
                    width: 24rem;
                    height: 10.8125rem;
                    background: #FFFFFF;
                    border-radius: .5rem .5rem .5rem .5rem;
                    box-sizing: border-box;
                    padding: 32px 20px 0px;
                    .list-item-title {
                        width: 100%;
                        display: flex;
                        align-items: center;
                        justify-content: flex-start;
                        font-weight: 500;
                        font-size: 14px;
                        color: #333333;
                        img {
                            width: 24px;
                            height: 24px;
                            margin-right: 5px;
                        }
                    }
                    .list-item-content {
                        width: 100%;
                        margin-top: 16px;
                        margin-bottom: 12px;
                        display: -webkit-box;
                        -webkit-line-clamp: 2;
                        -webkit-box-orient: vertical;
                        overflow: hidden;
                        text-overflow: ellipsis;
                        font-size: 12px;
                        color: #666666;
                    }
                    .list-item-info {
                        font-weight: bold;
                        font-family: Bold, OPPOSans-B, OPPOSans;
                        font-size: .75rem;
                        color: #333333;
                    }
                }
            }
            .tokefu {
                width: 100%;
                text-align: center;
                font-weight: 500;
                font-size: .875rem;
                color: #999999;
                margin-top: 20px;
                span {
                    color: #3D91FF;
                }
            }
        }
        .zhognjie {
            width: 100%;
            margin-top: 20px;
            .zhongjie_img {
                margin-top: 20px;
            }
            /* height: 470px;

            position: relative;
            .qr {
                width: 88px;
                height: 87px;
                position: absolute;
                right: 172px;
                top: 26px;
            } */
        }
    }
    .game-list {
        width: 85.7143rem;
        height: auto;
        padding-top: 22.8576px;
        .game-type {
            width: 100%;
            height: 57.1424px;
            display: flex;
            align-items: baseline;
            justify-content: flex-start;
            div {
                cursor: pointer;
                margin-right: 28.5712px;
                position: relative;
            }
            div:hover {
                font-weight: bold;
                font-family: Bold, OPPOSans-B, OPPOSans;
                color: #FF4B4B;
            }
            .layui-this {
                color: #FF4B4B;
                font-size: 22.8576px;
                font-weight: bold;
                font-family: Bold, OPPOSans-B, OPPOSans;
            }
            .layui-this::after {
                content: " ";
                width: 68.18182%;
                height: .125rem;
                background: #FF4B4B;
                position: absolute;
                bottom: -0.3125rem;
                left: 50%;
                transform: translateX(-50%);
            }
        }
        .zimu {
            width: 100%;
            height: 40px;
            display: flex;
            align-items: center;
            justify-content: space-around;
            div {
                cursor: pointer;
            }
            .layui-this {
                color: #FF4B4B;
                font-size: 14px;
                /* font-weight: bold; */
                transform: scale(1.2);
            }
            div:hover {
                transform: scale(1.2);
                color: #FF4B4B;
            }
        }
        .list {
            width: 100%;
            /* height: 171.4288px; */
            display: flex;
            flex-wrap: wrap;
            align-items: center;
            .game-item {
                width: 85.7136px;
                margin-top: 11.4288px;
                margin-left: 34.2864px;
                height: 114.2864px;
                display: flex;
                flex-direction: column;
                justify-content: space-around;
                align-items: center;
                cursor: pointer;
                span {
                    white-space: nowrap;
                    overflow: hidden;
                    text-overflow: ellipsis;
                }
            }
            img {
                width: 80px;
                height: 80px;
                border-radius: 9.1424px;
            }
            img::hover {
                transform: scale(1.2);
            }
        }
    }
    .merchant-list {
        width: 100%;
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-start;
        img {
            width: 50%;
            margin: 0 auto;
            display: block;
            margin-top: 22.8576px;
        }
        .marchant-item {
            background: url(https://oss.cytds.com/indexstatic/images/merchant_bg.png) no-repeat center;
            background-size: 100% 100%;
            border-radius: 8px;
            width: 550px;
            height: 226.2864px;
            margin-left: 3%;
            background-position: center;
            margin-bottom: .9375rem;
            .merchant-name {
                width: 74%;
                margin-left: 13%;
                height: 3.4375rem;
                display: flex;
                align-items: center;
                font-size: 1rem;
                color: white;
            }
            .game-naem {
                width: 92%;
                margin-left: 4%;
                height: 6.25rem;
                font-size: 1rem;
                display: flex;
                align-items: center;
            }
        }
    }
    .kefu-list {
        width: 100%;
        display: flex;
        justify-content: flex-start;
        text-align: center;
        .kefu-item {
            width: 205.7136px;
            height: 205.7136px;
            margin-right: 22.8576px;
            background-color: rgba(79, 170, 214, 0.1);
            border-radius: 1.25rem;
            display: flex;
            flex-direction: column;
            justify-content: space-around;
            img {
                width: 91.4288px;
                margin-bottom: .625rem;
                margin: 0 auto;
            }
            button {
                width: 50%;
                margin: 0 auto;
            }
        }
    }
}

.login-top {
    width: 100%;
    min-width: 1920px;
    height: 114.2864px;
    .content {
        width: 85.7143rem;
        height: 100%;
        margin: 0 auto;
        display: flex;
        align-items: center;
        justify-content: flex-start;
        img {
            height: 91.4288px;
        }
    }
}

.login {
    width: 1920px;
    margin: 0 auto;
    height: 100%;
    max-height: 1080px;
    /*  */
    /*background: url(https://demo.cytds.com/indexstatic/imgs/login_bg.png) no-repeat center;*/
    background-size: 100% 100%;
    .login-content {
        width: 1360px;
        height: 100%;
        margin: 0 auto;
        display: flex;
        align-items: center;
        justify-content: flex-end;
        position: relative;
        .form-item {
            position: relative;
            width: 360px;
            height: auto;
            min-height: 400px;
            background-color: #fff;
            border-radius: 12px;
            border: 2px solid #fff;
            box-sizing: border-box;
            padding: 24px;
            background: linear-gradient( 180deg, rgba(255,255,255,0.3) 0%, #FFFFFF 100%);
            border-radius: 12px 12px 12px 12px;
            /* 应用毛玻璃效果 */
            backdrop-filter: blur(10px);
            /* 确保元素有背景可以模糊 */
            -webkit-backdrop-filter: blur(10px); /* 对于旧版Safari浏览器 */
            .login-type {
                width: 100%;
                height: 35px;
                line-height: 35px;
                display: flex;
                align-items: center;
                justify-content: space-around;
                div {
                    cursor: pointer;
                    font-family: Bold;
                    /*font-weight: bold;*/
                    font-size: 18px;
                    color: #999999;
                    letter-spacing: 2px;
                }
                .active {
                    color: #FF8D3B;
                    font-size: 20px;
                    font-weight: bold;
                    font-family: Bold, OPPOSans-B, OPPOSans;
                    /* border-bottom: 3.4288px solid #4FAAD6; */
                }
            }
            .layui-form {
                .sms{
                    display: flex;
                    justify-content: space-between;
                }
                .layui-form-item {
                    /* height: 48px; */
                    margin-top: 16px;
                    margin-bottom: 30px;
                    /* background-color: rgba(0, 0, 0, .1); */
                    .layui-form-label {
                        height: 48px;
                        line-height: 48px;
                    }
                    div {
                        height: 48px;
                        line-height: 48px;
                        display: flex;
                        align-items: center;
                    }
                    .title {
                        height: 20px;
                        /*line-height: 35px;*/
                        font-size: 16px;
                        color: #999999;
                    }
                    .input {
                        width: 310px;
                        height: 48px;
                        border-radius: 8px 8px 8px 8px;
                        border: 1px solid #CCCCCC;
                        background: #FFFFFF;
                        input {
                            border: none;
                            outline: none;
                            padding: 16px;
                            font-size: 14px;
                        }
                        input::placeholder {
                            color: #999;
                            font-family: OPPOSans;
                            font-weight: 100;
                        }
                    }
                    .active {
                        background: #FFFFFF;
                        box-shadow: 0px 0px 8px 0px rgba(255,141,59,0.5);
                        border-radius: 8px 8px 8px 8px;
                        border: 1px solid #FF8D3B;
                    }
                    .layui-input-inline {
                        width: 170px;
                    }
                    .sendSms {
                        height: 48px;
                        line-height: 48px;
                        background: #FF8D3B;
                        border-radius: 10px 10px 10px 10px;
                        font-family: Bold;
                        /*font-weight: bold;*/
                        font-size: 14px;
                        color: #FFFFFF;
                        letter-spacing: 2px;
                        border: none;
                        position: relative;
                        left:6px;
                    }
                }
                .read {
                    width: 100%;
                    height: 32px;
                    /* margin: 0 auto; */
                    display: flex;
                    justify-content: flex-start;
                    margin: 30px 0px;

                    a {
                        font-size: 12px;
                        color: #999999;
                        span {
                            color: #4FAAD6;
                            font-size: 12px;
                        }
                    }
                    .layui-form-radio {
                        margin: 0px;
                        padding: 0px;
                        line-height: 20px;
                        i {
                            margin-right: 4px;
                            font-size: 18px;
                        }
                    }
                    .layui-form-radioed>i {
                        color: #FF8E2C;
                    }
                }
                .form-btn {
                    width: 310px;
                    height: 48px;
                    text-align: center;
                    margin-top: 16px;
                    button {
                        width: 310px;
                        height: 48px;
                        line-height: 48px;
                        font-family: Bold;
                        font-size: 16px;
                        /*font-weight: bold;*/
                        color: #fff;
                        letter-spacing: 2px;
                    }
                    .layui-btn {
                        background: #FF8D3B;
                        border-radius: 8px 8px 8px 8px;
                    }
                }
            }
        }
    }
}

.member-info {
    width: 100%;
    min-width: 1920px;
    .member-content {
        width: 85.7143rem;
        height: auto;
        margin: 0 auto;
        padding-top: 22.8576px;
        .nav {
            margin-bottom: 22.8576px;
        }
        .container {
            width: 100%;
            height: auto;
            display: flex;
            justify-content: space-between;
            .left-menu {
                width: 250px;
                height: auto;
                border-radius: .5rem .5rem 0rem 0rem;
                background-color: #fff;
                .layui-colla-title {
                    height: 3.75rem;
                    line-height: 3.75rem;
                    background: linear-gradient( 90deg, #D8E2EA 0%, #FFFFFF 100%);
                    box-sizing: border-box;
                    padding-left: 2.5rem;
                    font-weight: bold;
                    font-family: Bold, OPPOSans-B, OPPOSans;
                    font-size: 1.25rem;
                    color: #666666;
                }
                .top {
                    height: 68px;
                    background: #FF8D3C;
                    border-radius: .5rem .5rem 0rem 0rem;
                    .layui-colla-title {
                        background: #FF8D3C;
                        font-weight: bold;
                        font-family: Bold, OPPOSans-B, OPPOSans;
                        font-size: 1.25rem;
                        color: #FFFFFF;
                        line-height: 68px;
                        text-align: center;
                        padding-left: .9375rem;
                        border-radius: .5rem .5rem 0rem 0rem;
                    }
                }
                .layui-colla-content {
                    width: 100%;
                    text-align: left;
                    box-sizing: border-box;
                    padding-left: 5rem;
                    .menu_path {
                        cursor: pointer;
                        line-height: 40px;
                    }
                    .layui-this {
                        font-weight: bold;
                        font-family: Bold, OPPOSans-B, OPPOSans;
                        font-size: 1rem;
                        color: #FF763B;
                    }
                }
                .layui-this {
                    color: #65D1FF;
                }
            }
            .rigth-main {
                width: calc(100% - 270px);
                height: auto;
            }
        }
    }
}

.home-container {
    width: 100%;
    height: auto;
    background-color: #fff;
    .top {
        width: 100%;
        box-sizing: border-box;
        border-radius: 5.7136px;
        height: 148.5712px;
        padding: 34.2864px;
        background: linear-gradient(to right, #4C5169, #8F929F);
        display: flex;
        justify-content: space-around;
        .name {
            width: 411.4288px;
            height: 75.4288px;
            display: flex;
            align-items: center;
            justify-content: flex-start;
            .name-item {
                margin-right: 22.8576px;
                color: #fff;
                .nickName {
                    font-weight: bold;
                    font-family: Bold, OPPOSans-B, OPPOSans;
                    font-size: 1.25rem;
                    color: #FFFFFF;
                    span {
                        width: 3.75rem;
                        height: 1.25rem;
                        border-radius: 1.875rem 1.875rem 1.875rem 1.875rem;
                        border: .0625rem solid #FFFFFF;
                        font-weight: bold;
                        font-family: Bold, OPPOSans-B, OPPOSans;
                        font-size: .75rem;
                        color: #FFFFFF;
                        box-sizing: border-box;
                        padding: .125rem .75rem;
                        position: relative;
                        top: -0.1875rem;
                    }
                }
                .code {
                    font-weight: 500;
                    font-size: .875rem;
                    color: #FFFFFF;
                }
            }
            .head-pic {
                border-radius: 50%;
                height: 75.4288px;
                margin-right: 18.2864px;
                overflow: hidden;
                width: 75.4288px;
                img {
                    width: 100%;
                    height: 100%;
                    vertical-align: top;
                }
            }
        }
        .account {
            width: 37.5rem;
            height: 75.4288px;
            display: flex;
            justify-content: space-around;
            align-items: center;
            text-align: center;
            color: #fff;
            .num {
                font-size: 27.4288px;
                font-weight: bold;
                font-family: Bold, OPPOSans-B, OPPOSans;
            }
            .title {
                font-weight: 500;
                font-size: 1rem;
                color: #FFFFFF;
                margin-top: 1rem;
            }
            .line {
                /* background: linear-gradient(#FAFAFA, #333, #FAFAFA); */
                background-color: #fff;
                height: 4.0625rem;
                width: .125rem;
            }
            .chongzhi {
                width: 5.5rem;
                height: 2rem;
                line-height: 2rem;
                background: #FF8D3C;
                border-radius: 1.25rem 1.25rem 1.25rem 1.25rem;
                font-weight: bold;
                font-family: Bold, OPPOSans-B, OPPOSans;
                font-size: 1rem;
                color: #FFFFFF;
            }
            .tixian {
                width: 5.5rem;
                height: 2rem;
                line-height: 2rem;
                border: .0625rem solid #FFFFFF;
                border-radius: 1.25rem 1.25rem 1.25rem 1.25rem;
                font-weight: bold;
                font-family: Bold, OPPOSans-B, OPPOSans;
                font-size: 1rem;
                color: #FFFFFF;
                margin-top: .625rem;
            }
        }
    }
    .account_list {
        width: 100%;
        box-sizing: border-box;
        margin-top: 28.5712px;
        .list-top {
            width: 100%;
            display: flex;
            align-items: center;
            justify-content: space-between;
            .title {
                width: 18.75rem;
                display: flex;
                align-items: center;
                justify-content: space-around;
                div {
                    font-weight: bold;
                    font-family: Bold, OPPOSans-B, OPPOSans;
                    font-size: 1.25rem;
                    color: #666666;
                    cursor: pointer;
                }
                .layui-this {
                    color: #FF763B;
                }
                .layui-this::after {
                    position: absolute;
                    left: 0;
                    top: 0;
                    width: 100%;
                    height: .3125rem;
                    background-color: #FF763B;
                    transition: all .2s;
                    -webkit-transition: all .2s;
                }
            }
            .search {
                margin-right: 32px;
                display: flex;
                align-items: center;
                justify-content: flex-start;
                input {
                    width: 17.5rem;
                    height: 2.25rem;
                    border-radius: .5rem 0rem 0rem .5rem;
                    border: .0625rem solid #999999;
                    box-sizing: border-box;
                    padding-left: 1rem;
                    font-family: Light, OPPOSans-B, OPPOSans;

                }
                input::placeholder {
                    font-weight: 400;
                    font-size: .875rem;
                    color: #999999;
                    font-family: Light, OPPOSans-B, OPPOSans;
                }
                .btn {
                    width: 4.6875rem;
                    height: 2.25rem;
                    line-height: 2.25rem;
                    text-align: center;
                    background: #FF8D3C;
                    border-radius: 0rem .5rem .5rem 0rem;
                }
            }
        }
        .list {
            .layui-nav {
                background-color: #FAFAFA;
                .layui-nav-item {
                    a {
                        color: #aaa;
                    }
                }
                .layui-this {
                    a {
                        color: #FF763B;
                    }
                }
                .layui-this::after {
                    background-color: #fff;
                }
                .layui-nav-bar {
                    display: none;
                }
            }
            .layui-table-page select {
                height: 1.625rem;
            }
        }
    }
}

.member-info-container {
    width: 100%;
    height: auto;
    .top {
        width: 100%;
        height: 4.25rem;
        background: linear-gradient( 90deg, #4C5169 0%, #8F929F 100%);
        border-radius: .5rem .5rem .5rem .5rem;
        box-sizing: border-box;
        padding: 0px 17.1424px;
        display: flex;
        justify-content: flex-start;
        align-items: center;
        margin-bottom: 28.5712px;
        font-weight: bold;
        font-family: Bold, OPPOSans-B, OPPOSans;
        font-size: 1.25rem;
        color: #FFFFFF;
    }
    .layui-elem-field{
        .layui-input{
            font-family: Light,  OPPOSans-B, OPPOSans;
        }
        .layui-input::placeholder{
            font-family: Light,  OPPOSans-B, OPPOSans;
        }
    }
    .touxiang {
        position: relative;
        height: 5rem;
        width: 5rem;
        margin: 0 auto;
        margin-bottom: 2.5rem;
        .upfile {
            position: absolute;
            bottom: 0rem;
            right: 0rem;
        }
    }
    .input-item {
        width: 100%;
        box-sizing: border-box;
        padding: 0rem 2rem;
        display: flex;
        justify-content: space-between;
        .input-item-inline {
            width: 40%;
            .inputTitle {
                font-weight: bold;
                font-family: Bold, OPPOSans-B, OPPOSans;
                font-size: 1rem;
                color: #666666;
                margin-bottom: .75rem;
            }
            .inputDiv {
                background: #F9F9F9;
                border-radius: .5rem .5rem .5rem .5rem;
                border: .0625rem solid rgba(153, 153, 153, 0.6);
                box-sizing: border-box;
                padding: 0rem 1rem;
                display: flex;
                align-items: center;
                justify-content: space-between;
                input {
                    border: none;
                    outline: none;
                    font-size: 1rem;
                    color: #666;
                    background: #F9F9F9;
                }
                .btn {
                    width: 4.5rem;
                    height: 2rem;
                    text-align: center;
                    line-height: 2rem;
                    background: #FF8D3C;
                    border-radius: .5rem .5rem .5rem .5rem;
                    font-weight: bold;
                    font-family: Bold, OPPOSans-B, OPPOSans;
                    font-size: .875rem;
                    color: #FFFFFF;
                }
            }
            .inputDiv:hover {
                border: 1px solid #FF8D3C;
                box-shadow: 0px 0px 8px 0px #FF8D3C;
            }
        }
        .layui-input-block {
            width: 100%;
            text-align: center;
            margin-left: 0rem;
            margin-top: 2.5rem;
            .tijiao {
                width: 10rem;
                height: 3rem;
                background: #FF8D3C;
                border-radius: .5rem .5rem .5rem .5rem;
                font-weight: bold;
                font-family: Bold, OPPOSans-B, OPPOSans;
                font-size: 1.25rem;
                color: #FFFFFF;
                border: none;
            }
        }
    }
    /* 投诉建议内容 */
    .input-jianyi-item {
        width: 100%;
        box-sizing: border-box;
        padding: 0rem 2rem;
        display: flex;
        justify-content: space-around;
        .input-item-inline {
            width: 100%;
            .inputTitle {
                font-weight: bold;
                font-family: Bold, OPPOSans-B, OPPOSans;
                font-size: 1rem;
                color: #666666;
                margin-bottom: .75rem;
            }
            .inputDiv {
                background: #F9F9F9;
                border-radius: .5rem .5rem .5rem .5rem;
                box-sizing: borderrgba(7, 2, 2, 0.6);
                padding: 0rem 1rem;
                display: flex;
                align-items: center;
                justify-content: space-between;
                input {
                    /* border: none;
                    outline: none; */
                    font-size: .875rem;
                    color: #666;
                }
                input::placeholder {
                    font-size: .875rem;
                    color: #ccc;
                }
                .btn {
                    width: 4.5rem;
                    height: 2rem;
                    text-align: center;
                    line-height: 2rem;
                    background: #FF8D3C;
                    border-radius: .5rem .5rem .5rem .5rem;
                    font-weight: bold;
                    font-family: Bold, OPPOSans-B, OPPOSans;
                    font-size: .875rem;
                    color: #FFFFFF;
                }
                .inputDivItem {
                    cursor: pointer;
                    width: 8rem;
                    height: 40px;
                    text-align: center;
                    line-height: 40px;
                    border-radius: .5rem .5rem .5rem .5rem;
                    border: .0625rem solid #CCCCCC;
                    font-size: 1rem;
                    color: #666666;
                }
                .inputDivItem-this {
                    color: #FFFFFF;
                    background: #FF8340;
                }
            }
        }
        .layui-input-block {
            width: 100%;
            text-align: center;
            margin-left: 0rem;
            margin-top: 2.5rem;
            .tijiao {
                width: 10rem;
                height: 3rem;
                background: #FF8D3C;
                border-radius: .5rem .5rem .5rem .5rem;
                font-weight: bold;
                font-family: Bold, OPPOSans-B, OPPOSans;
                font-size: 16px;
                color: #FFFFFF;
                border: none;
            }
        }
    }
    .layui-nav {
        background-color: #FAFAFA;
        .layui-nav-item {
            a {
                color: #aaa;
            }
        }
        .layui-this {
            a {
                color: #333;
            }
        }
    }
    .order-top {
        display: flex;
        justify-content: space-between;
    }
    .order {
        width: 100%;
        height: auto;
        display: flex;
        justify-content: space-around;
        .img {
            width: 171.4288px;
            img {
                width: 100%;
            }
        }
        .info {
            width: 914.2864px;
            .title {
                height: 65px;
                box-sizing: border-box;
                display: -webkit-box;
                text-overflow: ellipsis;
                overflow: hidden;
                -webkit-line-clamp: 3;
                line-clamp: 3;
                -webkit-box-orient: vertical;
            }
        }
    }
    .baopei-item {
        width: 100%;
        .baopei {
            width: 628.5712px;
            height: 108.5712px;
            box-sizing: border-box;
            padding: 11.4288px 17.1424px;
            border-radius: 11.4288px;
            cursor: pointer;
            border: .0625rem solid #eee;
            .baopei-top {
                width: 100%;
                display: flex;
                justify-content: space-between;
                .title {
                    font-size: 18.2864px;
                    font-weight: bold;
                    font-family: Bold, OPPOSans-B, OPPOSans;
                }
                .info {
                    color: #333;
                    span {
                        color: #f7423f;
                    }
                }
            }
            .baopei-bottom {
                width: 100%;
                display: flex;
                align-items: center;
                justify-content: space-between;
                margin-top: 17.1424px;
                .layui-form-radio {
                    position: relative;
                    top: -3.4288px;
                }
            }
        }
        .layui-this {
            border: .0625rem solid #4FAAD6;
            background-color: rgba(79, 170, 214, 0.1);
        }
    }
    .order-info {
        width: 100%;
        min-width: 1200px;
        display: flex;
        justify-content: space-between;
        .order-info-item {
            width: 50%;
            box-sizing: border-box;
            padding: 11.4288px 17.1424px;
            .info-item-list {
                width: 100%;
                box-sizing: border-box;
                padding: 11.4288px 22.8576px;
                .dashed {
                    border-top: .125rem dashed #000;
                    border-bottom: none;
                    margin: .625rem 0;
                }
                .info-item {
                    width: 100%;
                    line-height: 40px;
                    display: flex;
                    justify-content: space-between;
                }
            }
        }
    }
    /* 个人中心商品列表 */
    .member-account-list{

    }

}

#xuzhi{
    width: 100%;
    height:100%;
    min-height:500px;
    line-height: 35px;
    .xuzhi-top{
        text-align: center;
        width: 100%;
        height: 104px;
        box-sizing: border-box;
        padding-top: 24px;
        background: linear-gradient(to bottom,#FFD9A4,#FFFFFF);

        .xuzhi-title{
            font-family: OPPOSans-M, OPPOSans;
            font-weight: 500;
            font-size: 18px;
            color: #333333;
        }
    }
    .xuzhi-content{
        width: calc(100% - 80px);
        height: 400px;
        overflow-y: auto;
        margin: 9px auto 24px;
        font-family: OPPOSans-M, OPPOSans;
        /*font-weight: bold;*/
        font-size: 14px;
    }
    .xuzhi_btn{
        width: 250px;
        height: 35px;
        text-align: center;
        line-height: 35px;
        background: #FF8D3C;
        color:#fff;
        margin: 0 auto;
        cursor: pointer;
        border-radius: 8px;
    }
}