body {
    width: 100%;
    height: auto;
    max-width: 750px;
    display: block;
    margin: 0 auto;
}

span {
    text-wrap: inherit !important;
}

/* login */
.loginBg {
    width: 100%;
    height: 100vh;
    margin: 0 auto;
    position: relative;
    background: #0C0C26 url("../images/b_8.png") no-repeat;
    background-size: 100% 100%;
}

.engChange {
    width: 100%;
    padding: 0 4%;
    height: 35px;
    position: relative;
}

.engChange span {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 26px;
    width: auto;
    position: absolute;
    right: 3%;
    top: 10px;
    z-index: 11;
    background: #fff;
    border-radius: 5px;
    padding: 2px;
}

.engChange img {
    height: 20px;
    width: auto;
    margin-right: 5px;
}

.login-warp {
    width: 100%;
    height: auto;
}

.login-head {
    width: 100%;
    padding: 0 8%;
    position: relative;
    height: 152px;
    overflow: hidden;
}


.login-tit {
    width: 100%;
    color: #000;
    font-size: 28px;
    margin-bottom: 10px;
    margin-top: 25px;
}

.login-head p {
    width: 100%;
    color: rgba(0, 0, 0, 0.65);
    font-size: 12px;
}

.login-head img {
    width: auto;
    height: 150px;
    position: absolute;
    right: 5%;
    bottom: 0;
    z-index: 1;
}

.login-main {
    width: 92%;
    padding: 15px 5%;
    background: #fff;
    border: 1px solid #F3CA62;
    border-radius: 20px;
    margin: 0 auto;
}

.login-body {
    width: 100%;
}

.login-change {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    height: 45px;
}

.login-change a {
    font-size: 16px;
    color: rgba(0, 0, 0, 0.65);
    font-weight: 600;
    position: relative;
    width: 50%;
    text-align: center;
}

.login-change a i {
    width: 40%;
    height: 3px;
    background-color: #000;
    position: absolute;
    left: 30%;
    bottom: -6px;
    display: none;
    border-radius: 3px;
}

.login-change a.cur {
    color: #000;
}

.login-change a.cur i {
    display: block;
}

.text-inline {
    width: 100%;
    margin-bottom: 15px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
    border-radius: 8px;
    overflow: hidden;
    border: 1px solid rgba(0, 0, 0, 0.15)
}

.text-inline:last-child {
    margin-bottom: 0;
}

.text-inline .text-icon {
    width: 50px;
    height: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #F2F1F9;
    border-radius: 8px;
}

.text-inline input {
    width: 100%;
    height: 40px;
    background: none;
    padding: 0 10px;
    border: none;
    outline: none;
    font-size: 12px;
    color: #000;
}

.text-inline .bindingyzms {
    width: 70px;
    height: 35px;
    border: none;
    color: #F4C11A;
    cursor: pointer;
    position: absolute;
    right: 3px;
    background-color: rgba(244, 193, 26, 0.15);
    border-radius: 5px;
}

.text-inline .captcha {
    width: auto;
    height: 40px;
    border-radius: 8px;
    position: absolute;
    right: 0;
}

.text-inline input::-webkit-input-placeholder {
    color: #cbcbcb;
}

.text-inline img {
    width: 12px;
    height: auto;
    margin-left: 10px;
}

.text-btm {
    width: 100%;
    margin-top: 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
}

.text-btm .form-button {
    width: 100%;
    height: 45px;
    border: none;
    background: #F4C11A;
    color: #000;
    font-size: 16px;
    cursor: pointer;
    border-radius: 25px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.text-btm .form-button img {
    height: 12px;
    width: auto;
    margin-left: 20px;
}

.text-btm a {
    width: 100%;
    height: 40px;
    color: #F4C11A;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 25px;
    border: 1px solid #F4C11A;
    margin-top: 12px;
    background-color: rgba(255, 255, 255, 0.1);
}

.text-flex {
    width: 100%;
    font-size: 14px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 12px;
}

.text-flex a {
    color: rgba(0, 0, 0, 0.65);
    margin-left: auto;
    text-decoration: underline;
    font-size: 12px;
}

.text-flex p {
    color: #59B779;
    width: 100%;
    text-align: center;
    font-size: 14px;
    font-weight: 600;
}

.text-tags {
    width: 100%;
    margin: 20px 0 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.text-item {
    width: 45%;
    text-align: center;
}

.text-item img {
    width: 45px;
    height: 45px;
    border-radius: 50%;
}

.text-name {
    width: 100%;
    font-size: 14px;
    margin-bottom: 5px;
    color: rgba(0, 0, 0, 0.85);
}

.login-headTxt {
    width: 100%;
    padding: 15px 8%;
}

.login-message {
    width: 100%;
    font-size: 16px;
    color: rgba(0, 0, 0, 0.65);
    margin-bottom: 12px;
    line-height: 20px;
}

.login-headTxt h2 {
    width: 50%;
    margin-bottom: 8px;
    font-weight: 600;
    color: #000;
}

.language {
    width: 100%;
    margin-top: 12px;
    color: rgba(0, 0, 0, 0.65);
    font-size: 14px;
}

.language a {
    color: #59B779;
}

/* index */
.content {
    width: 100%;
    position: relative;
    z-index: 1;
}

.top {
    width: 100%;
    max-width: 750px;
    padding: 0 15px;
    height: 50px;
    background-color: #fff;
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: fixed;
    top: 0;
    z-index: 99;
}

.top .back img {
    width: 82px;
    height: auto;
}

.top .ware img {
    width: 30px;
    height: auto;
}

.home-top {
    width: 92%;
    margin: 12px auto 0;
    position: relative;
    z-index: 1;
}

.navigation {
    width: 100%;
    height: auto;
    font-size: 14px;
    margin-top: 12px;
    overflow: hidden;
    background: #fff;
    border-radius: 8px;
    padding: 15px 0;
}

.navigation ul {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
}

.navigation li {
    width: 23%;
    height: auto;
}

.navigation li a {
    width: 100%;
    height: 100%;
    display: block;
    text-align: center;
    color: #333;
}

.navigation li img {
    width: auto;
    height: 32px;
}


.navigation li span {
    width: 100%;
    font-size: 14px;
    display: block;
    text-align: center;
    margin-top: 6px;
    color: rgba(0, 0, 0, 0.5);
}

.navigationNum {
    width: 100%;
    height: auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.navigationNum dl {
    width: 100%;
    height: auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.navigationNum dl dt img {
    width: auto;
    height: 45px;
    margin-right: 10px;
}

.navigationNum dl dt a {
    display: flex;
    align-items: center;
}

.navigationNum dl dt p {
    font-size: 12px;
    color: rgba(0, 0, 0, 0.45);
}

.navigationNum dl dt h3 {
    font-size: 15px;
    color: #000;
}

.navigationNum dl dd {
    width: auto;
    height: auto;
    display: flex;
    align-items: center;
    border-radius: 50%;
    background: #fff;
}

.navigationNum dl dd a {
    display: flex;
    align-items: center;
}

.navigationNum dl dd i {
    display: block;
    width: 6px;
    height: 6px;
    background-color: #E25C5C;
    border-radius: 50%;
    margin-left: -5px;
    position: relative;
    z-index: 99;
    margin-top: -20px;
}

.navigationNum dl dd img {
    width: auto;
    height: 32px;
}

.notice {
    width: 100%;
    height: 40px;
    display: flex;
    overflow: hidden;
    margin-top: 12px;
    position: relative;
    align-items: center;
    justify-content: center;
}

.notice img {
    height: 40px;
    width: auto;
}

.notice .swiper {
    width: 100%;
    text-align: left;
    padding-left: 6px;
}

.notice .swiper-wrapper {
    width: 100%;
    height: 40px;
    display: block;
}

.notice .swiper-slide {
    width: 100%;
    height: 40px;
    display: block;
    color: rgba(0, 0, 0, 0.65);
    font-size: 13px;
    line-height: 20px;
}

.navigationNumUl {
    width: 100%;
    height: 160px;
    margin-top: 20px;
    position: relative;
    background: url("../images/banner.png") no-repeat;
    background-size: 100% 100%;
    padding: 10% 5%;
}

.navigationNumUl p {
    width: 100%;
    color: rgba(255, 255, 255, 0.65);
}

.navigationNumUl h2 {
    width: 100%;
    color: #fff;
    font-size: 28px;
    margin-top: 10px;
    font-weight: 600;
}

.home-dep {
    width: 92%;
    margin: 15px auto 0;
    position: relative;
    z-index: 1;
}

.home-dep .home-dep-bg {
    width: 100%;
    height: auto;
}

.home-dep .home-dep-div {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    padding: 15px 12px;
    color: #000;
    display: block;
}

.home-dep-div img {
    width: auto;
    height: 25px;
}

.home-dep-div p {
    width: 100%;
    font-size: 14px;
    margin-top: 8px;
}

.home-dep-div a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 120px;
    height: 35px;
    background: #F4C11A;
    border-radius: 8px;
    color: #000;
    margin-top: 8px;
}

.z-app {
    width: 100%;
    height: 100%;
    z-index: 10001;
    padding: 12px;
    max-width: 750px;
    text-align: center;
    position: fixed;
    top: 0;
    background-color: rgba(0, 0, 0, .7);
    display: flex;
    align-items: center;
    justify-content: center;
}

.mask-app {
    display: inline-block;
    width: 88%;
    height: auto;
    background: #fff;
    background-size: contain;
    color: #000;
    font-size: 13px;
    border-radius: 16px;
    text-align: left;
    position: relative;
    border: 1px solid rgba(255, 255, 255, 0.2);
}

.mask-app-bImg {
    position: absolute;
    bottom: -1px;
    right: 0;
    z-index: 111;
    height: 150px;
    width: auto;
}

.app-top {
    width: 100%;
    display: flex;
    align-items: center;
    font-size: 22px;
    font-weight: 600;
    color: #000;
    padding: 12px 12px 0;
}

.mask-app-clear {
    width: auto;
    height: 20px;
    position: absolute;
    right: 15px;
    top: 15px;
    z-index: 11;
}

.app-top img {
    width: auto;
    height: 95px;
}

.app-txt {
    padding: 12px;
    max-height: 50vh;
    overflow-y: scroll;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
}

.app-txt h3 {
    width: 100%;
    color: #000;
    font-size: 18px;
    font-weight: 600;
    text-align: center;
}

.app-txt p {
    width: 100%;
    color: rgba(0, 0, 0, 0.85);
    font-size: 14px;
    margin-top: 12px;
    line-height: 22px;
    text-align: left;
}

.app-btn {
    width: 55%;
    height: auto;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin: 12px 4% 12px;
}

.app-btn a {
    color: #ffffff;
    font-size: 12px;
    margin-top: 12px;
    display: flex;
    align-items: center;
    background-color: #1D212F;
    border-radius: 10px;
    padding: 10px;
}

.app-btn a:first-child {
    margin-top: 0;
}

.app-btn .app-down {
    width: 100%;
    height: auto;
}

.app-btn .app-down img {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    margin-right: 6px;
}

.app-btn .app-down span {
    width: auto;
    height: 40px;
    display: flex;
    align-items: center;
    margin-left: auto;
}

.app-btn dt {
    font-size: 14px;
    font-weight: 600;
}

.app-btn dd {
    margin-top: 3px;
    color: #999;
}

.app-close {
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    right: 15px;
    z-index: 9999;
    top: 15px;
}

.app-close img {
    width: 100%;
    height: 100%;
}

.app-tops {
    width: 65px;
    height: 65px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    margin: 15px auto 0;
}

.app-tops img {
    width: 100%;
    height: 100%;
}

.z-mask {
    width: 100%;
    height: 100%;
    z-index: 10001;
    padding: 12px;
    max-width: 750px;
    text-align: center;
    position: fixed;
    top: 0;
    background-color: rgba(0, 0, 0, .7);
    display: flex;
    align-items: center;
    justify-content: center;
}

.z-team {
    width: 100%;
    height: 100%;
    z-index: 10001;
    padding: 12px;
    max-width: 750px;
    text-align: center;
    position: fixed;
    top: 0;
    background-color: rgba(0, 0, 0, .7);
    display: flex;
    align-items: center;
    justify-content: center;
}

.mask-message {
    display: inline-block;
    width: 100%;
    height: auto;
    background: #fff;
    color: #ffffff;
    font-size: 13px;
    border-radius: 16px;
    text-align: left;
    overflow: hidden;
    position: relative;
}

.mask-top {
    width: 100%;
    height: 72px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    font-weight: 600;
    color: #fff;
}

.mask-top img {
    width: auto;
    height: 64px;
}

.close-img {
    position: absolute;
    top: 6px;
    right: 6px;
    cursor: pointer;
    color: #fff;
}

.home-level {
    width: 92%;
    margin: 15px auto 0;
    height: auto;
}

.home-level-tit {
    width: 100%;
    height: auto;
    display: flex;
    align-items: center;
    color: #000;
    font-size: 18px;
    font-weight: 600;
}

.home-level-tit img {
    width: auto;
    height: 30px;
    margin-right: 6px;
}

.home-level-nav {
    width: 100%;
    display: flex;
    margin-top: 15px;
    align-items: center;
    justify-content: space-between;
}

.home-level-nav a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32%;
    height: 40px;
    border-radius: 25px;
    background: #fff;
    color: #000;
    font-size: 16px;
}

.home-level-nav a.cur {
    background: #000;
    color: #fff;
}

.home-level-hd {
    width: 100%;
    height: 290px;
    margin-top: 15px;
    background: url("../images/q_2.png") no-repeat center bottom;
    background-size: contain;
    display: flex;
    justify-content: space-between;
}

.home-level-hd div {
    width: 33%;
    height: auto;
    text-align: center;
    overflow: hidden;
}

.home-level-hd dl {
    width: 100%;
    height: auto;
}

.home-level-hd dl dt {
    width: 100%;
    text-align: center;
    position: relative;
}

.home-level-hd dl dd {
    width: 100%;
    font-size: 18px;
    color: #000;
    margin-top: 25px;
    font-weight: 600;
    margin-bottom: 6px;
}

.home-level-hd p {
    background: #000;
    color: #F4C11A;
    font-size: 14px;
    border-radius: 25px;
    padding: 3px 8px;
    display: inline;
}

.home-level-img {
    height: 60px;
    width: auto;
    border-radius: 50%;
}

.home-level-lv {
    position: absolute;
    left: 50%;
    margin-left: -15px;
    bottom: -20px;
    height: auto;
    width: 30px;
}

.home-level-hd-two dl {
    margin-top: 20px;
}

.home-level-hd-three dl {
    margin-top: 40px;
}

.home-level-bd {
    width: 100%;
    background: #fff;
    padding: 12px;
}

.home-level-bd-head {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.home-level-bd-head span {
    display: block;
    font-size: 16px;
}

.home-level-bd-head span:first-child {
    width: 25%;
}

.home-level-bd-head span:nth-child(2) {
    width: 43%;
}

.home-level-bd-head span:last-child {
    width: 32%;
    text-align: right;
}

.home-level-bd-btm {
    width: 100%;
    height: auto;
    margin-top: 10px;
}

.home-level-bd-btm li {
    width: 100%;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 15px;
    color: #000;
}

.home-level-bd-btm li img {
    height: 40px;
    width: auto;
    margin-left: 8px;
}

.home-level-bd-btm li dl {
    width: 25%;
    display: flex;
    align-items: center;
    font-size: 16px;
}

.home-level-bd-btm li span {
    font-size: 18px;
}

.home-level-bd-btm li .home-level-bd-num {
    display: block;
    width: 43%;
}

.home-level-bd-btm li span:last-child {
    width: 32%;
    text-align: right;
}

/* product */
.product-head {
    width: 100%;
    height: 50px;
    padding: 0 4%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-weight: 600;
    color: #000;
}

.product-head-right {
    display: flex;
    align-items: center;
}

.product-head-right a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 35px;
    height: 35px;
    position: relative;
    margin-left: 8px;
}

.product-head-right a i {
    display: block;
    width: 6px;
    height: 6px;
    background-color: #E25C5C;
    border-radius: 50%;
    margin-left: -5px;
    position: relative;
    z-index: 99;
    margin-top: -20px;
}

.product-head-right img {
    width: 35px;
    height: 35px;
    border-radius: 50%;
}

.product {
    width: 100%;
    height: 100%;
    display: inline-block;
    position: relative;
    z-index: 1;
}

.productList {
    width: 92%;
    margin: 0 auto;
}

.productList li {
    width: 100%;
    margin-top: 15px;
    overflow: hidden;
    position: relative;
    border-radius: 10px;
    background-color: #fff;
}

.productList-title {
    width: 100%;
    height: 46px;
    background: url("../images/p_bg.png") no-repeat;
    background-size: 100% 100%;
    padding: 0 12px;
    color: #000;
    font-size: 16px;
    font-weight: 600;
    line-height: 46px;
}

.productList-name {
    width: 94%;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    position: relative;
    margin: 12px auto 0;
    background-color: rgba(190, 190, 190, 0.15);
    border-radius: 12px;
    padding: 12px;
}

.productList-name dl {
    width: 100%;
    height: auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    position: relative;
}

.productList-name dl dt {
    position: absolute;
    right: 0;
    top: 0;
    width: 45px;
    height: 60px;
    background: url("../images/p_1.png") no-repeat;
    background-size: contain;
    color: #fff;
    line-height: 55px;
    text-align: center;
    font-weight: 600;
}

.productList-name dl dd {
    font-size: 12px;
    color: rgba(0, 0, 0, 0.65);
    font-weight: 500;
    width: 70%;
    display: flex;
    align-items: center;
    margin-top: 12px;
}

.productList-name dl dd:first-child {
    margin-top: 0;
}

.productList-name dl dd span {
    font-size: 18px;
    color: #FF8711;
    font-weight: 600;
    margin-left: 6px;
    margin-right: 6px;
}

.productList-name dl dd label {
    color: #999;
    font-size: 14px;
    text-decoration: line-through;
}

.productList-Lv {
    display: flex;
    align-items: center;
    color: #59B779;
    font-size: 12px;
}

.productList-Lv img {
    height: 18px;
    width: auto;
    margin-left: 8px;
    margin-right: 3px;
}

.productList-name .proHot {
    width: auto;
    height: 15px;
    margin-left: 6px;
    background: #F0F2FC;
    border-radius: 25px;
    padding: 3px;
}

.productList li .proLv {
    width: auto;
    height: 20px;
    position: absolute;
    right: 0;
    top: 0;
}

.productList-item {
    width: 100%;
    height: auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    padding: 12px;
    position: relative;
}

.productList-item p {
    width: 100%;
    text-align: center;
    color: rgba(0, 0, 0, 0.65);
    font-size: 12px;
    display: flex;
    align-items: center;
    margin-bottom: 5px;
}

.productList-item p span {
    font-size: 16px;
    color: #000;
    margin-left: 10px;
}

.productList-item img {
    height: 26px;
    width: auto;
    position: absolute;
    bottom: 16px;
    right: 12px;
}

.productList-link {
    width: 100%;
}

.productList-link a {
    width: 100%;
    height: 40px;
    background: #F4C11A;
    color: #000;
    font-size: 15px;
    border-radius: 5px;
    font-weight: 500;
    display: flex;
    justify-content: center;
    align-items: center;
}

.productList-link a span {
    padding: 0 6px;
}

.productList-link a.productList-link-null {
    background: #E2EBF8;
}

.productList-btm {
    display: flex;
    width: 92%;
    align-items: center;
    justify-content: space-between;
    margin: 0 auto 12px;
}

.productList-link a .proNull {
    height: 28px;
    width: auto;
    margin-left: 5px;
}

.productList-item-null {
    width: 90px;
    height: 90px;
    position: absolute;
    top: 0;
    right: 12%;
    z-index: 1;
}

.productDetail {
    width: 100%;
    position: relative;
    z-index: 1;
}

.productDetailTitle {
    width: 100%;
    color: #000;
    font-size: 18px;
    font-weight: 600;
    text-align: center;
}

.productDetailCon {
    width: 92%;
    height: auto;
    background: url("../images/p_bg1.png") no-repeat;
    background-size: 100% 100%;
    margin: 10px auto 0;
    padding: 15px 8%;
}

.productDetailCon p {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 10px;
    color: rgba(0, 0, 0, 0.65);
}

.productDetailCon p span {
    color: #000;
    font-size: 18px;
    font-weight: 600;
}

.productDetailTop {
    width: 100%;
    overflow: hidden;
    margin-top: 15px;
}

.productDetailTop-item {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    margin-bottom: 15px;
}

.productDetailTop-label {
    width: 100%;
    color: #000;
    margin-bottom: 12px;
    font-size: 16px;
}

.productDetailTop h3 {
    width: 100%;
    font-size: 22px;
    color: #000;
    font-weight: 600;
    margin-bottom: 10px;
}

.productDetailTop .productDetailInput {
    width: 100%;
    height: auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    color: #000;
}

.productDetailTop .productDetailInput p {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
    margin-top: 0;
}

.productDetailTop .productDetailInput p span {
    font-size: 12px;
    font-weight: 500;
    color: #999;
}

.productDetailTop .productDetailInput input[type="range"] {
    -webkit-appearance: none;
    appearance: none;
}

.productDetailTop .productDetailInput input[type="range"] {
    width: 100%;
    /* 根据需要调整宽度 */
    height: 6px;
    /* 滑块的高度 */
    background-color: #000;
    /* 滑块的背景颜色 */
    border-radius: 6px;
    /* 滑块边缘的圆角 */
    border: none;
}

.productDetailTop .productDetailInput input[type="range"]::-webkit-slider-thumb {
    -webkit-appearance: none;
    width: 15px;
    /* 滑块的宽度 */
    height: 15px;
    /* 滑块的高度 */
    border-radius: 50%;
    /* 圆形滑块 */
    background: #F4C11A;
    /* 滑块的颜色 */
}

.productDetailHead {
    width: 88%;
    margin: 20px auto 0;
    background: #fff;
    padding: 12px;
    border-radius: 10px;
    display: flex;
    align-items: center;
}

.productDetailHeadImg {
    width: 50px;
    height: 50px;
    margin-right: 8px;
}

.productDetailHead dt {
    color: rgba(0, 0, 0, 0.45);
}

.productDetailHead dd {
    color: #000;
    font-size: 16px;
    margin-top: 5px;
    font-weight: 600;
}

.productDetailHead a {
    margin-left: auto;
    display: flex;
    align-items: center;
    color: rgba(0, 0, 0, 0.65);
}

.productDetailHead a img {
    height: 15px;
    width: auto;
    margin-left: 6px;
}

.productList-links {
    width: 92%;
    height: 45px;
    margin: 20px auto;
}

.productList-links a {
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 25px;
    width: 100%;
    height: 100%;
    color: #000;
    font-size: 15px;
    background: #F4C11A;
}

.productList-links a span {
    margin-left: 5px;
}

.productList-links a img {
    width: 16px;
    height: auto;
    display: block;
    margin-left: 5px;
}

.productDetailTxt {
    width: 100%;
    padding: 15px 5%;
    margin-top: 12px;
}

.productDetailTxtPro {
    width: 100%;
    margin-top: 12px;
    background-color: rgba(255, 255, 255, 0.64);
    padding: 12px;
    border-radius: 10px;
}

.productDetailTxtPro p {
    width: 100%;
    color: rgba(0, 0, 0, 0.45);
}

.productDetailTxtPro img {
    width: 100%;
}

.productDetailMask {
    width: 100%;
    padding: 15px;
    background-color: #fff;
    position: absolute;
    left: 0;
    bottom: 0;
    border-top-right-radius: 20px;
    border-top-left-radius: 20px;
}

.productDetailMask h3 {
    width: 100%;
    font-size: 18px;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: center;
}

.productDetailMask h5 {
    width: 100%;
    font-size: 20px;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 15px;
}

.productDetailMask h5 span {
    font-size: 12px;
    margin-right: 5px;
}

.productDetailMask ul {
    width: 100%;
    margin-top: 16px;
}

.productDetailMask ul li {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: #333333;
    font-size: 14px;
    margin-bottom: 15px;
}

.productDetailMask ul li span {
    color: #F4C11A;
    font-size: 16px;
    font-weight: 600;
}

.productDetailCancel {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 12px;
}

.cancelLeft {
    position: absolute;
    top: 12px;
    right: 12px;
    width: auto;
}

.productDetailCancel div {
    border-radius: 25px;
    height: 40px;
    color: #000;
    font-size: 16px;
    line-height: 40px;
}

.productDetailCancel div.cancelRight {
    background: #F4C11A;
    width: 100%;
}

.order {
    width: 100%;
    padding-top: 50px;
    position: relative;
    z-index: 1;
}

.orderHtml {
    width: 92%;
    margin: 10px auto;
}

.order-nav {
    width: 92%;
    height: 152px;
    margin: 10px auto 0;
    overflow: hidden;
    padding: 20px;
    background: url("../images/img_7.png") no-repeat;
    background-size: 100% 100%;
    border-radius: 8px;
}

.order-nav ul {
    width: 100%;
    height: 100%;
}

.order-nav ul li {
    width: 100%;
    height: auto;
    position: relative;
    margin-top: 12px;
}

.order-nav ul li a {
    width: 100%;
    display: block;
}

.order-nav ul li h3 {
    width: 100%;
    font-size: 22px;
    margin-bottom: 6px;
}

.order-nav ul li span {
    display: flex;
    align-items: center;
}

.order-list {
    width: 100%;
}

.order-list li {
    width: 100%;
    padding: 15px 10%;
    border-radius: 8px;
    margin-top: 15px;
    background: url("../images/order_bg.png") no-repeat;
    background-size: 100% 100%;
    position: relative;
}

.order-list-top {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 16px;
    font-weight: 600;
    margin-top: 15px;
}

.order-list-top span {
    font-size: 13px;
    font-weight: 500;
    position: absolute;
    right: 13px;
    top: 32px;
    background: #F4C11A;
    color: #000;
    border-top-left-radius: 25px;
    border-bottom-left-radius: 25px;
    padding: 3px 8px;
}

.order-list-img {
    display: flex;
    align-items: center;
    width: 100%;
}

.order-list-img dl {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
}

.order-list-img dt {
    font-size: 16px;
    font-weight: 400;
    color: #000;
    width: 100%;
}

.order-list-img dd {
    margin-top: 15px;
    font-size: 12px;
    color: rgba(255, 255, 255, 0.65);
    width: 49%;
    background-color: #000;
    border-radius: 8px;
    text-align: center;
    padding: 15px 0;
}

.order-list-img dd label {
    color: #fff;
    display: block;
    width: 100%;
    font-size: 18px;
    text-align: center;
}

.order-lv {
    height: 16px;
    width: auto;
    position: absolute;
    right: 5px;
    top: 40px;
}

.order-list-btm {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
}

.order-list-btm p {
    width: 100%;
    margin-top: 10px;
    font-size: 14px;
    color: rgba(0, 0, 0, 0.65);
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.order-list-btm p span {
    color: #000;
    font-size: 16px;
}

.order-list-btm p span.bigG {
    font-size: 20px;
    color: #F4C11A;
    font-weight: 600;
}

.order-list-btm p span.bigR {
    color: #FF0000;
}

.order-list-btm p img {
    height: 22px;
    width: auto;
}

.investList {
    width: 100%;
    margin-top: 16px;
}

.investList li {
    width: 100%;
    background-color: #fff;
    margin-bottom: 16px;
    border-radius: 8px;
    padding: 10px;
    overflow: hidden;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.investList li .productListImg {
    width: 108px;
    height: 108px;
    display: contents;
}

.investList li .productListImg img {
    width: 108px;
    height: 108px;
    display: inline-block;
    border-radius: 6px;
}

.investList li .productListBody {
    width: 100%;
    height: auto;
    display: inline-block;
    padding-left: 10px;
}

.investList li .productListBody .productListTitle {
    width: 100%;
    font-size: 14px;
    color: #000;
    font-weight: 600;
}

.investList li .productListBody .productListPrice {
    width: 100%;
    font-size: 14px;
    color: #000;
    font-weight: 600;
}

.investList li .productListBody .productListTxts {
    width: 100%;
}

.investList li .productListBody .productListTxts span {
    background-color: #59B779;
    color: #fff;
    padding: 3px 12px;
    border-radius: 4px;
}

.investList li .productListBody .productListTxt span {
    color: #59B779;
}

/* team */
.team {
    width: 100%;
    height: auto;
    padding: 0 12px 50px;
    position: relative;
    z-index: 1;
    margin-top: -10px;
}

.team-head {
    width: 100%;
    height: 200px;
    background: url("../images/n_bg3.png") no-repeat;
    background-size: 100% 100%;
    padding: 5%;
    position: relative;
}

.team-head p {
    position: absolute;
    left: 5%;
    bottom: 4vh;
    color: #000;
    font-size: 20px;
    width: 60%;
}

.team-head p span {
    padding: 2px 8px;
    background: #000;
    color: #F4C11A;
    border-radius: 25px;
}

.inviteBox {
    width: 100%;
    height: 235px;
    padding: 30px 15px 15px;
    background: url("../images/team_1.png") no-repeat;
    background-size: 100% 100%;
}

.cancelTx {
    position: absolute;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    border: 1px solid #eee;
    left: 50%;
    margin-left: -25px;
    top: 30px;
    z-index: 11;
}

.team-people {
    width: 100%;
    height: auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    overflow: hidden;
    margin-top: 25px;
}

.team-people dl {
    width: 33%;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    font-size: 12px;
    text-align: center;
}

.team-people dl dt {
    width: 100%;
    height: auto;
    color: rgba(0, 0, 0, 0.45);
}

.team-people dl dd {
    width: 100%;
    font-size: 16px;
    margin-bottom: 5px;
    color: #000;
    font-weight: 600;
}

.team-people dl dd span {
    display: block;
    width: 100%;
}

.team-link {
    width: 100%;
    height: 40px;
    margin-top: 15px;
    background-color: rgba(0, 0, 0, 0.1);
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 5px;
    font-size: 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 6px;
}

.team-link p {
    width: 78%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: rgba(0, 0, 0, 0.45);
}

.team-link span {
    color: #000;
    font-size: 14px;
}

.team-mask {
    width: 100%;
    border-radius: 25px;
    background: #F4C11A;
    height: 40px;
    margin-top: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #000;
}

.team-mask-div {
    width: 92%;
    height: 90vh;
    padding: 12px;
    border-radius: 8px;
    background: #FFFBE8 url("../images/team_3.png") no-repeat center bottom;
    background-size: 100%;
    position: relative;
}

.team-mask-divs {
    width: 100%;
    padding: 5%;
    position: relative;
    background: url("../images/team_2.png") no-repeat;
    background-size: 100% 100%;
    margin-top: 50px;
    height: 56vh;
}

.team-mask-divs h5 {
    width: 100%;
    font-size: 14px;
    margin-top: 20px;
}

.team-mask-divs h2 {
    width: 80%;
    background-color: rgba(0, 0, 0, 0.2);
    margin: 5px auto 12px;
    color: #fff;
    height: 36px;
    line-height: 36px;
    font-size: 16px;
}

.team-mask-divs .team-mask-divs-code {
    color: #F4C11A;
    text-decoration: underline;
    display: flex;
    align-items: center;
    justify-content: center;
}

.team-mask-divs img {
    width: 110px;
    height: 110px;
    margin-top: 30px;
}

.team-mask-divs p {
    width: 100%;
    font-size: 11px;
    margin-top: 12px;
    color: #000;
}

.team-mask-divs .team-mask-divs-link {
    width: 80%;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #F4C11A;
    color: #000;
    border-radius: 6px;
    margin: 12px auto 0;
}

.team-all-level {
    width: 100%;
    height: auto;
    margin-top: 15px;
}

.team-all-level li {
    width: 100%;
    height: auto;
    background: #fff;
    border-radius: 8px;
    margin-bottom: 12px;
    padding: 12px 0;
    position: relative;
    display: flex;
}

.team-all-level li img {
    width: 30px;
    height: auto;
    position: absolute;
    top: 0;
    left: 12px;
}

.team-all-level .team-all-level-con {
    width: calc(100% - 50px);
    height: auto;
    margin-left: auto;
}

.team-all-level-con-hd {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-right: 10px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.09);
    padding-bottom: 10px;
}

.team-all-level-con-hd h3 {
    font-size: 16px;
    font-weight: 600;
    color: #000;
}

.team-all-level-con-hd a {
    display: flex;
    align-items: center;
    color: #F1574C;
}

.team-all-level-con-hd a span {
    font-weight: 600;
    font-size: 16px;
    margin: 0 6px;
}

.team-all-level-con-bd {
    width: 100%;
    margin-top: 10px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-right: 12px;
}

.team-all-level-con-bd dd {
    font-size: 12px;
    color: rgba(0, 0, 0, 0.45);
}

.team-all-level-con-bd dt {
    font-size: 15px;
    color: rgba(0, 0, 0, 0.85);
    font-weight: 600;
}

.inviteBoxDetail {
    width: 100%;
    height: 120px;
    padding: 30px 15px 15px;
    background: url('../images/team_7.png') no-repeat;
    background-size: 100% 100%;
}

.team-lvs {
    width: 100%;
    height: auto;
    margin: 12px auto 0;
}

.team-lvs-top {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
}

.team-lvs-top a {
    width: 32%;
    padding: 12px 0;
    display: block;
    color: rgba(0, 0, 0, 0.85);
    font-size: 16px;
    position: relative;
    background-color: #fff;
    border-radius: 8px;
    border: 1px solid rgba(0, 0, 0, 0.15);
    text-align: center;
}

.team-lvs-top a label {
    display: block;
    width: 100%;
    font-size: 10px;
    color: rgba(0, 0, 0, 0.65);
    margin-top: 5px;
}

.team-lvs-top a span {
    display: block;
    width: 100%;
    margin-top: 5px;
}

.team-lvs-top a.cur {
    background: #F4C11A;
}

.team-lvs-top a i {
    display: none;
}

.team-lvs-top a.cur i {
    display: block;
}

.triangle {
    width: 0;
    height: 0;
    border-left: 5px solid transparent; /* 左侧边框透明 */
    border-right: 5px solid transparent; /* 右侧边框透明 */
    border-top: 10px solid #F4C11A; /* 上侧边框为三角形的高度和颜色 */
    position: absolute;
    bottom: -10px;
    left: 50%;
    margin-left: -2.5px;
}

.team-lvs-btm {
    width: 100%;
    height: auto;
    padding: 12px;
    border-radius: 8px;
    background-color: #fff;
    margin-top: 12px;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

.team-lvs-btm ul {
    width: 92%;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.team-lvs-btm ul li {
    width: 49%;
    background-color: #000;
    padding: 6px 12px;
    display: flex;
    align-items: center;
    border-radius: 50px;
}

.team-lvs-btm ul li dl {
    width: 100%;
    font-size: 12px;
    color: #fff;
    text-align: center;
}

.team-lvs-btm ul li dl dt {
    color: #F4C11A;
    font-size: 15px;
}

.team-lv {
    width: 100%;
    height: auto;
    margin: 15px auto 0;
    overflow: hidden;
}

.team-lv-list {
    width: 100%;
    height: auto;
    padding: 10px;
    background-color: #fff;
    border-radius: 8px;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

.team-lv-list ul {
    width: 100%;
}

.team-lv-list ul li {
    width: 100%;
    margin-bottom: 12px;
    padding-bottom: 12px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.2);
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.team-lv-list ul li:last-child {
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: 0;
}

.team-lv-list ul li img {
    width: 40px;
    height: 40px;
    border: 1px solid #F4C11A;
    border-radius: 50%;
}

.team-lv-list .team-lv-lists {
    width: calc(100% - 55px);
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.team-lv-list .team-lv-lists span {
    font-size: 14px;
    color: rgba(0, 0, 0, 0.45);
}

.team-lv-list .team-lv-lists dt {
    font-size: 18px;
    color: #000;
    display: flex;
    align-items: center;
}

.team-lv-list .team-lv-lists dt i {
    display: flex;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: #F4C11A;
    margin-left: 8px;
}

.team-lv-list .team-lv-lists dd {
    font-size: 14px;
    color: rgba(0, 0, 0, 0.45);
    margin-top: 8px;
}

.task {
    width: 92%;
    height: auto;
    margin: 0 auto;
}

.taskName {
    width: 100%;
    height: 210px;
    padding: 15px 6%;
    color: #000;
    font-size: 22px;
    font-weight: 600;
    background: url("../images/n_bg5.png") no-repeat;
    background-size: contain;
    position: relative;
    margin-top: -90px;
    z-index: 1;
}

.taskName p {
    width: 55%;
    position: absolute;
    left: 6%;
    bottom: 28px;
}

.task ul {
    width: 100%;
    height: auto;
}

.task ul li {
    width: 100%;
    margin-bottom: 15px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    background: #fff url("../images/task_bg.png") no-repeat top right 12px;
    background-size: 10%;
    border-radius: 8px;
    padding: 12px;
}

.task ul li h2 {
    width: 100%;
    font-size: 16px;
    display: flex;
    align-items: center;
    color: rgba(0, 0, 0, 0.65);
}

.task ul li h2 span {
    font-size: 20px;
    color: #F4C11A;
    margin-left: 6px;
}

.task-img {
    width: 50px;
    height: 50px;
    background-color: rgba(0, 0, 0, 0.1);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.task-img img {
    width: 22px;
    height: auto;
}

.task .task-left {
    width: calc(100% - 60px);
}

.task-left img {
    width: 18px;
    height: auto;
    margin-right: 2px;
}

.task-left-bd {
    width: 46%;
    display: flex;
    align-items: center;
    font-size: 10px;
    margin-top: 8px;
    justify-content: space-between;
    color: rgba(0, 0, 0, 0.65);
}

.task-top {
    width: 100%;
    margin-top: 5px;
    color: #000;
    font-size: 12px;
}

.task-top h3 {
    color: #2B5569 !important;
    font-size: 18px;
    font-weight: 600;
    margin-top: 5px;
}

.task ul li h3 {
    width: 100%;
    font-size: 14px;
    font-weight: 400;
    color: #000;
}

.task-left-hd p {
    width: 100%;
    font-size: 12px;
    color: rgba(0, 0, 0, 0.45);
    margin-top: 2px;
}

.task-bar {
    width: 70%;
    height: 3px;
    border-radius: 3px;
    background-color: #000;
    position: relative;
}

.task-bar span {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    border-radius: 3px;
    height: 3px;
    background: #F4C11A;
    background-size: contain;
}

.task-link {
    width: 75px;
    height: auto;
    position: absolute;
    right: 10px;
    bottom: 22px;
}

.task-link a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 30px;
    border-radius: 25px;
    background-color: #F4C11A;
    color: #fff;
    font-size: 12px;
    margin-top: 3px;
}

.task-link a.taskNone {
    background-color: #F2F1F9;
    color: rgba(0, 0, 0, 0.45);
}

.vipList {
    width: 100%;
    padding: 0 2%;
    margin-top: 20px;
    margin-bottom: 20px;
}

.vipList-li {
    display: flex;
    flex-wrap: wrap;
    width: 70%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    padding: 5%;
}

.vipList-li h3 {
    width: 100%;
    display: flex;
    align-items: center;
    color: #333;
    font-size: 16px;
    margin-top: 10px;
}

.vipList-li h3 span {
    font-size: 18px;
    color: #333;
    margin-left: 12px;
}

.vipList-li dl {
    width: 49%;
    color: #666;
    font-size: 14px;
    margin-top: 10px;
}

.vipList-li dl dt {
    width: 100%;
    color: #333;
    font-size: 18px;
}

.vipList-li dl dd {
    width: 100%;
    margin-top: 6px;
}

.team-level {
    width: 100%;
    background: #fff;
    padding: 15px;
    border-top-left-radius: 30px;
}

.team-level-tit {
    width: 100%;
    display: flex;
    align-items: center;
    font-size: 18px;
}

.team-level-list {
    width: 100%;
}

.team-level-list li {
    width: 100%;
    margin-top: 15px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom-left-radius: 40px;
    box-shadow: 0 8px 8px 0px #F3F5F7;
    padding: 15px;
}

.team-level-img {
    display: flex;
    align-items: center;
    font-size: 16px;
}

.team-level-img img {
    height: 50px;
    width: 50px;
    border-radius: 10px;
    margin-left: 10px;
}

.team-level-rg {
    width: calc(100% - 95px);
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.team-level-rg dt {
    width: 100%;
    font-size: 16px;
    display: flex;
    align-items: center;
}

.team-level-rg dt i {
    width: 10px;
    height: 10px;
    display: block;
    margin-left: 8px;
    border-radius: 50%;
    background: #FB6B43;
}

.team-level-rg dd {
    width: 100%;
    color: #999999;
    font-size: 13px;
    margin-top: 8px;
}

.team-level-rg p {
    color: #999;
}

.circle {
    width: 100%;
    margin-top: 20px;
}

.circleLi {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
}

.circleLeft {
    width: 60px;
    height: auto;
    display: inline-block;
    padding-right: 72px;
}

.circleBg {
    width: 60px;
    height: 60px;
    position: relative;
}

.g-progress {
    width: 60px;
    height: 60px;
    text-align: center;
    line-height: 60px;
    position: absolute;
    left: 0;
    top: 0;
    border-radius: 50%;
    -webkit-mask: radial-gradient(transparent, transparent 50%, #000 60%, #000 0);
}

.circleNum {
    width: 50px;
    height: 50px;
    text-align: center;
    line-height: 50px;
    color: #59B779;
    position: absolute;
    left: 5px;
    top: 5px;
    z-index: 11;
    font-size: 14px;
    font-weight: 600;
}

.circleRight {
    width: 100%;
    height: auto;
    display: inline-block;
    background-color: #fff;
    border-radius: 8px;
    padding: 10px 0;
}

.circleNav {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.circleNavLi {
    width: 33.333333%;
    text-align: center;
    border-left: 1px dashed #ccc;
}

.circleNavLi:first-child {
    border: none;
    width: 33.333333%;
}

.circleNavLi h3 {
    color: #59B779;
    font-weight: 600;
}

/* mine */
.mine {
    width: 100%;
    min-height: 100vh;
    height: auto;
    position: relative;
    z-index: 1;
}

.mineTop {
    width: 92%;
    height: 202px;
    padding: 15px 5%;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    position: relative;
    margin: 10px auto 0;
    background: url("../images/vip_top.png") no-repeat;
    background-size: 100% 100%;
}

.mineTop .level {
    width: 72px;
    height: auto;
    position: absolute;
    right: 15px;
}

.mineLogo {
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    position: relative;
}

.mineLogo .logoAvater {
    width: 100%;
    height: 100%;
    border-radius: 50%;
}

.mineLogo .logoLv {
    position: absolute;
    height: auto;
    width: 30px;
    bottom: 0;
    z-index: 11;
    left: 50%;
    margin-left: -15px;
}

.mineMain {
    width: calc(100% - 60px);
    height: auto;
    margin-left: 6px;
    position: relative;
}

.mineMain h3 {
    width: 100%;
    font-size: 18px;
    color: #000;
    display: flex;
    align-items: center;
}

.mineMain p {
    width: 100%;
    font-size: 12px;
    margin-top: 3px;
    color: rgba(0, 0, 0, 0.65);
}

.mineMain a {
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    right: 0;
    top: 6px;
}

.mineMain a img {
    width: 32px;
    height: 32px;
}

.mineMain a i {
    display: block;
    width: 6px;
    height: 6px;
    background-color: #E25C5C;
    border-radius: 50%;
    margin-left: -5px;
    position: relative;
    z-index: 99;
    margin-top: -20px;
}

.lvImg {
    height: 20px;
    width: auto;
    margin-left: 5px;
}

.mineWallet {
    width: 100%;
    margin: 15px auto 0;
    background: #fff;
    padding: 12px;
    border-radius: 8px;
}

.mineWallet ul {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    position: relative;
}

.mineWallet ul li {
    width: 33%;
}

.mineWallet ul li h3 {
    font-size: 18px;
    color: #000;
    font-weight: 600;
    margin-top: 5px;
}

.mineWallet ul li span {
    width: 100%;
    display: block;
    font-size: 12px;
    color: rgba(0, 0, 0, 0.65);
}

.mineWallet ul li img {
    height: 55px;
    width: auto;
    position: absolute;
    top: 0;
    right: 0;
}

.mineFlex {
    width: 100%;
    height: auto;
    overflow: hidden;
    margin: 15px auto 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.mineFlex a {
    width: 23%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    font-size: 12px;
}

.mineFlex a img {
    width: auto;
    height: 30px;
    margin-bottom: 5px;
}

.mineFlex a p {
    width: 100%;
    color: rgba(0, 0, 0, 0.65);
    text-align: center;
}

.mineFlexA {
    width: 92%;
    height: auto;
    margin: 15px auto 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.mineFlexA a {
    width: 49%;
    background: #fff;
    border-radius: 8px;
    display: block;
    padding: 12px;
    color: #000;
}

.mineFlexA a dl {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.mineFlexA a dl dt img {
    height: 26px;
    width: auto;
}

.mineFlex dl dd {

}

.userAd {
    width: 92%;
    margin: 15px auto 0;
    height: 70px;
    background: url("../images/m_bg.png") no-repeat;
    background-size: 100% 100%;
}

.userAd a {
    display: flex;
    align-items: center;
    width: 100%;
    height: 100%;
    padding: 12px;
}

.userAd a dl {
    margin-left: auto;
    font-size: 16px;
    color: rgba(0, 0, 0, 0.65);
}

.userAd a dl dd {
    color: rgba(0, 0, 0, 0.85);
    font-size: 16px;
    margin-top: 5px;
    text-align: right;
    font-weight: 600;
}

.minePro {
    width: 92%;
    padding: 0 12px;
    border-radius: 8px;
    margin: 15px auto;
    background-color: #fff;
}

.minePro ul {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    padding-bottom: 15px;
}

.minePro ul li {
    width: 33%;
    height: auto;
}

.minePro ul li a {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    width: 100%;
    height: 100%;
    font-size: 12px;
    color: rgba(0, 0, 0, 0.65);
    text-align: center;
    margin-top: 15px;
}

.minePro ul li img {
    height: auto;
    width: 25px;
    margin-bottom: 6px;
}

.minePro ul li p {
    width: 100%;
    color: rgba(0, 0, 0, 0.65);
}

.minePro ul li a i {
    margin-left: auto;
}

.logout {
    width: 92%;
    height: 45px;
    margin: 20px auto;
}

.logout a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    border-radius: 8px;
    background: #000;
    color: #F4C11A;
    font-size: 16px;
    border: 1px solid #000;
}

.mineProName {
    width: 92%;
    margin: 15px auto 0;
    font-size: 18px;
    font-weight: 600;
}

/* customer */
.customer {
    width: 100%;
    height: auto;
    position: relative;
    z-index: 1;
}

.customerTop {
    width: 92%;
    height: 206px;
    border-radius: 20px;
    position: relative;
    padding: 15px;
    color: #333;
    margin: 10px auto 0;
    background: #fff url("../images/n_bg8.png") no-repeat;
    background-size: 100% 100%;
}

.customerTop h3 {
    width: 40%;
    color: #333;
    margin-top: 10px;
    font-size: 26px;
    font-weight: 600;
}

.customerTop p {
    width: 40%;
    margin-top: 6px;
    font-size: 14px;
    color: #818384;
}

.customerTop img {
    position: absolute;
    right: 0;
    top: 15px;
    height: 150px;
    width: auto;
}

.customerList {
    width: 92%;
    margin: 12px auto 0;
}

.customerName {
    width: 100%;
    font-size: 18px;
    font-weight: 600;
    color: #000;
}

.customerList li {
    width: 100%;
    background-color: #fff;
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 8px;
    padding: 12px;
    margin-top: 12px;
}

.customerList li h2 {
    width: 100%;
    font-size: 16px;
    color: #000;
}

.customerList li p {
    width: 100%;
    font-size: 12px;
    color: rgba(0, 0, 0, 0.65);
    margin-top: 6px;
}

.customerHtml {
    width: 92%;
    margin: 15px auto;
    background-color: #fff;
    border-radius: 8px;
    padding: 15px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.customerLi {
    width: 50%;
    height: auto;
}

.customerLi a {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    width: 100%;
    height: 100%;
    color: #000;
}

.customerLi a p {
    width: 100%;
    margin-top: 6px;
    text-align: center;
}

.customerLi img {
    width: 25px;
    height: auto;
    margin-right: 6px;
}

.customerLi div {
    width: calc(100% - 35px);
}

.customerLi div h3 {
    width: 100%;
    font-size: 18px;
    font-weight: 600;
    line-height: 20px;
}

.customerLi div p {
    width: 100%;
    font-size: 14px;
    line-height: 18px;
    margin-top: 5px;
}

.customerLi div span {
    width: 100%;
    font-size: 12px;
    line-height: 18px;
    margin-top: 5px;
    color: #999;
}

/* recharge */
.recharge {
    width: 100%;
    height: auto;
    position: relative;
    z-index: 1;
}

.recharge-all {
    width: 92%;
    margin: 15px auto;
    background: #fff;
    padding: 12px;
    border-radius: 8px;
}

.news-change {
    width: 92%;
    margin: 15px auto 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.news-change a {
    width: 49%;
    height: 40px;
    background: #fff;
    border-radius: 25px;
    font-size: 14px;
    cursor: pointer;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    color: #000;
}

.news-change a img {
    width: 20px;
    height: auto;
    margin-right: 5px;
}

.news-change a.cur {
    background: #000;
    color: #fff;
}

.news-change a.cur i {
    display: block;
}

.withdrawWallet {
    width: 92%;
    height: 125px;
    margin: 15px auto 0;
    background-color: rgba(0, 0, 0, 0.5);
    border-radius: 8px;
    padding: 30px 5%;
}

.withdrawWallet p {
    width: 100%;
}

.withdrawWallet h3 {
    width: 100%;
    margin-top: 10px;
    font-size: 16px;
    margin-bottom: 5px;
}

.withdrawWallet h3 span {
    font-size: 26px;
    font-weight: 600;
}

.withdrawWallet small {
    width: 100%;
}

.rechargeWallet {
    width: 92%;
    height: 127px;
    margin: 15px auto 0;
    border-radius: 8px;
    padding: 30px 5% 10px;
    color: #fff;
    background: url("../images/team_7.png") no-repeat;
    background-size: 100% 100%;
}

.rechargeWallet p {
    width: 100%;
    color: rgba(0, 0, 0, 0.65);
    display: flex;
    align-items: center;
}

.recharge-p {
    padding: 0 4%;
    width: 100% !important;
    color: rgba(0, 0, 0, 0.65) !important;
}

.rechargeWallet p img {
    width: 25px;
    height: auto;
    margin-right: 5px;
}

.rechargeWallet h3 {
    width: 100%;
    margin-top: 5px;
    font-size: 16px;
    margin-bottom: 5px;
    color: #000;
    font-weight: 600;
}

.rechargeWallet h3 span {
    font-size: 26px;
    font-weight: 600;
}

.rechargeWallet small {
    width: 100%;
    color: rgba(0, 0, 0, 0.45);
}

.recharge-click {
    width: 100%;
}

.recharge-click .recharge-tit {
    margin-top: 0;
}

.recharge-click ul {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
}

.recharge-click ul li {
    width: 31%;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 25px;
    margin-top: 12px;
    font-size: 13px;
    color: #9CA3AF;
    border: 1px solid rgba(0, 0, 0, 0.03);
    background-color: rgba(0, 0, 0, 0.03);
}

.recharge-click ul li span {
    font-size: 14px;
    margin-left: 5px;
}

.recharge-click ul li.cur {
    color: #000;
    background: #F4C11A;
    border: 1px solid #F4C11A;
}

.recharge-li.cur i {
    display: block;
    width: 20px;
    height: 20px;
    background: url("../images/icon_2.png") no-repeat;
    background-size: contain;
}

.recharge-li i {
    display: block;
    width: 20px;
    height: 20px;
    background: url("../images/icon_2g.png") no-repeat;
    background-size: contain;
}

.rechargeTop {
    width: 100%;
    margin-top: 20px;
}

.rechargeTop ul {
    width: 100%;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

.rechargeTop ul li {
    width: 22%;
    text-align: center;
    padding: 15px 6px;
    border: 1px solid #ccc;
    border-radius: 10px;
    margin-bottom: 15px;
    background-color: #fff;
    margin-left: 4%;
    cursor: pointer;
}

.rechargeTop ul li:first-child {
    margin-left: 0;
}

.rechargeTop ul li:nth-child(4n+1) {
    margin-left: 0;
}

.rechargeTop ul li span {
    color: #ADADAD;
}

.rechargeTop ul li h3 {
    font-size: 16px;
    font-weight: 600;
}

.rechargeTop ul li.cur {
    color: #ffffff;
    background-color: #59B779;
    border: 1px solid #59B779;
    padding: 20px 6px;
}

.rechargeTop ul li.cur span {
    color: #ffffff;
}

.recharge-amount {
    width: 100%;
    margin-top: 10px;
}

.recharge-input {
    width: 100%;
    height: auto;
    min-height: 40px;
    overflow: hidden;
    border-radius: 8px;
    border: 1px solid rgba(0, 0, 0, 0.1);
    background-color: #fff;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

.recharge-input i {
    width: 24px;
    height: 32px;
    color: #F4C11A;
    font-size: 16px;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: center;
}

.recharge-input input {
    width: calc(100% - 110px);
    height: 40px;
    background: none;
    padding-left: 12px;
    color: rgba(0, 0, 0, 0.65);
}

.recharge-input textarea {
    width: 100%;
    height: 72px;
    padding: 8px;
    background-color: #fff;
    border: 1px solid rgba(0, 0, 0, 0.1);
    color: #000;
}

.recharge-input span {
    width: 100%;
    height: 40px;
    color: #aaaaaa;
    padding: 0 6px;
    display: flex;
    align-items: center;
}

.recharge-input label {
    margin-left: auto;
    display: flex;
    align-items: center;
    font-size: 14px;
    margin-right: 12px;
}

.recharge-input label img {
    width: 20px;
    margin-right: 5px;
}

.recharge-amount input::-webkit-input-placeholder {
    color: #999999;
}

.recharge-input-new {
    width: 100%;
    height: auto;
    min-height: 40px;
    overflow: hidden;
    border: 1px solid #000;
    background: none;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    border-radius: 8px;
    padding: 0 6px;
}

.recharge-input-new p {
    width: 100%;
    font-size: 14px;
    color: #999;
    padding: 8px 12px 0;

}

.recharge-input-new i {
    height: 32px;
    color: #000;
    font-size: 16px;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 5px;
}

.recharge-input-new input {
    width: calc(100% - 32px);
    height: 40px;
    font-size: 16px;
    background: none;
    color: #000;
}

.recharge-amount p {
    width: 100%;
    color: #E84335;
    margin-top: 6px;
}

.recharge-change {
    width: 100%;
    margin-top: 15px;
}

.recharge-tit {
    width: 100%;
    font-size: 16px;
    margin-top: 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: #000;
}

.recharge-tit a {
    font-size: 12px;
    color: #F4C11A;
}

.recharge-list {
    width: 100%;
    margin-top: 12px;
}

.recharge-li {
    width: 100%;
    border-radius: 10px;
    padding: 15px 12px;
    border: 1px solid rgba(0, 0, 0, 0.1);
    margin-bottom: 15px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.recharge-li img {
    width: 30px;
    height: auto;
    margin-right: 8px;
}

.recharge-li h3 {
    width: 100%;
    font-size: 16px;
    color: #000;
}

.recharge-li p {
    width: 100%;
    color: rgba(0, 0, 0, 0.65);
    margin-top: 5px;
    font-size: 14px;
}

.recharge-li.cur {
    border: 1px solid #F4C11A
}

.recharge-amount-bg {
    width: 100%;
    height: 196px;
    margin-top: 15px;
    background: url("../images/r_lines.png") no-repeat;
    background-size: 100% 100%;
}

.recharge-amount-bg img {
    width: 22px;
    height: auto;
    margin-right: 5px;
}

.recharge-amount-bg .recharge-amount-bg-hd {
    width: 100%;
    height: auto;
    font-size: 20px;
    padding: 9px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.recharge-amount-bg .recharge-amount-bg-hd label {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100px;
    height: 38px;
    background: #F3F3F3;
    border-radius: 25px;
    font-size: 14px;
}

.recharge-amount-bg input {
    width: 100%;
    font-size: 12px;
    background: none;
    color: #000;
}

.recharge-amount-bg-bd {
    width: 100%;
    margin-top: 85px;
    font-size: 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 9px;
}

.recharge-amount-bg-bd input {
    background: none;
}

.recharge-amount-bg .recharge-amount-bg-bd label {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100px;
    height: 38px;
    font-size: 14px;
}

.recharge-btn {
    width: 100%;
    height: 43px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 24px;
    background: #F4C11A;
    border-radius: 25px;
    font-size: 16px;
    color: #000;
    cursor: pointer;
    border: none;
}

.gift-btn {
    width: 100%;
    height: 43px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 24px;
    background: #F4C11A;
    border-radius: 25px;
    font-size: 16px;
    color: #000;
    cursor: pointer;
    border: none;
}

.recharge-btn img {
    height: 10px;
    width: auto;
    margin-left: 12px;
}

.recharge-rultit {
    width: 100%;
    margin-top: 25px;
    display: flex;
    align-items: center;
    font-weight: 600;
    font-size: 18px;
    color: #000;
}

.recharge-rul {
    width: 100%;
    height: auto;
    margin-top: 16px;
    padding: 12px;
    border-radius: 8px;
}

.recharge-rul p {
    width: 100%;
    text-wrap: initial !important;
    color: rgba(0, 0, 0, 0.65);
}

.recharge-rul p span {
    text-wrap: initial !important;
    color: rgba(0, 0, 0, 0.65);
}

.recharge-dt {
    width: 100%;
}

.recharge-dt span {
    display: flex;
    width: 100%;
    height: 38px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 10px;
    margin-top: 5px;
    align-items: center;
    padding: 0 10px;
    background-color: rgba(255, 255, 255, 0.1);
    color: rgba(255, 255, 255, 0.65);
}

.recharge-amounts {
    width: 100%;
}

.recharge-amounts .recharge-tit {
    margin-top: 0;
    margin-bottom: 10px;
}

.bindCon {
    width: 92%;
    height: auto;
    margin: 15px auto;
    background: #fff;
    padding: 12px;
    border-radius: 8px;
}

.bindCon .recharge-amount {
    margin-bottom: 20px;
    position: relative;
}

.bindCon .bindingyzms {
    position: absolute;
    right: 6px;
    bottom: 6px;
    font-size: 14px;
    padding: 5px 10px;
    border: none;
    color: #F4C11A;
    border-radius: 6px;
    background-color: rgba(244, 193, 26, 0.15);
}

.bindCon h3 {
    width: 100%;
    font-size: 15px;
    margin-bottom: 10px;
    color: #000;
}

/* record */
.record {
    width: 100%;
    height: auto;
    display: inline-block;
    position: relative;
    z-index: 1;
}

.recordHtml {
    width: 92%;
    background-color: #fff;
    overflow: hidden;
    margin: 12px auto;
    border-radius: 8px;
}

.recordsTop {
    width: 92%;
    margin: 12px auto 0;
}

.recordsTop ul {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 0 auto;
}

.recordsTop ul li {
    width: 49%;
    height: 40px;
    font-size: 16px;
    cursor: pointer;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.recordsTop ul li.cur a {
    color: #000;
    font-size: 16px;
}

.recordsTop ul li.cur i {
    display: block;
}

.recordsTop ul li a {
    display: flex;
    width: 100%;
    height: 100%;
    color: rgba(0, 0, 0, 0.65);
    align-items: center;
    justify-content: center;
    position: relative;
}

.recordsTop ul li a i {
    display: none;
    background: #000;
    width: 80px;
    height: 3px;
    border-radius: 3px;
    position: absolute;
    left: 50%;
    margin-left: -40px;
    bottom: 0;
}

.orderNum {
    width: 92%;
    margin: 12px auto 0;
    padding: 12px;
    background: #59B779;
    border-radius: 10px;
}

.orderNum ul {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.orderNum ul li {
    width: 50%;
    color: #fff;
}

.orderNum ul li h2 {
    font-size: 18px;
}

.orderNum ul li p {
    width: 100%;
    display: flex;
    align-items: center;
    margin-top: 8px;
    font-size: 12px;
}

.orderNum ul li img {
    width: 25px;
    height: auto;
    margin-right: 6px;
}

.recordTop {
    width: 92%;
    height: 35px;
    margin: 15px auto 0;
    position: relative;
    z-index: 1;
    background: #ECEFF3;
    border-radius: 35px;
}

.recordTop ul {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.recordTop ul li {
    width: 23%;
    height: 100%;
    font-size: 14px;
    cursor: pointer;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

.recordTop ul li.cur {
    background: #1D212F;
    color: #fff;
    border-radius: 25px;
}

.recordTop ul li.cur a {
    color: #fff;
}

.recordTop ul li a {
    width: 100%;
    height: 100%;
    display: block;
    font-size: 14px;
    color: #1D212F;
}

.recordTop ul li span {
    display: block;
    width: 100%;
    height: 100%;
    line-height: 35px;
    text-align: center;
}

.recordsTopa {
    width: 100%;
    height: 45px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.recordsTopa ul {
    width: 92%;
    height: 100%;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.recordsTopa ul li {
    width: 26%;
    height: 100%;
    margin-right: 10px;
}

.recordsTopa ul li a {
    display: flex;
    width: 100%;
    height: 100%;
    color: rgba(0, 0, 0, 0.65);
    align-items: center;
    justify-content: center;
}

.recordsTopa ul li.cur a {
    color: #000;
    font-size: 16px;
    border-bottom: 2px solid #000;
}

.recordImgTop {
    width: 92%;
    height: auto;
    margin: 12px auto 0;
    position: relative;
    z-index: 1;
    background: #fff;
    border-radius: 20px;
    padding: 5px;
}

.recordImgTop ul {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.recordImgTop ul li {
    width: 25%;
    height: 100%;
    font-size: 14px;
    cursor: pointer;
    overflow: hidden;
    text-align: center;
    padding: 6px 0;
}

.recordImgTop ul li a {
    display: block;
    width: 100%;
    height: auto;
    color: #000;
}

.recordImgTop ul li.cur {
    background: #000;
    border-radius: 20px;
}

.recordImgTop ul li.cur a {
    color: #fff;
}

.recordList {
    width: 92%;
    height: auto;
    margin: 16px auto;
}

.recordLi {
    width: 100%;
    position: relative;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    min-height: 55px;
    margin-top: 12px;
}

.recordLiTop {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 16px;
}

.recordLiTop span {
    display: flex;
    align-items: center;
    color: #000;
}

.recordLiTop label {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    margin-right: 8px;
    padding: 10px;
    background-color: rgba(0, 0, 0, 0.1);
    border-radius: 50%;
}

.recordLiTop label img {
    width: 100%;
    height: 100%;
}

.recordLiSpan span:last-child {
    color: rgba(0, 0, 0, 0.45);
    font-size: 12px;
    margin-top: 5px;
}

.recordTxt {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

.recordTxt span {
    display: block;
    font-size: 12px;
    width: 100%;
    text-align: right;
    height: 30px;
    line-height: 30px;
    color: #666;
}

.recordTxt span:first-child {
    color: #000;
    font-size: 16px;
}

.recordTxt .recordErr {
    color: #E84335;
}

.detail-warp {
    width: 100%;
    padding: 10px 4%;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1;
    position: relative;
}

.detail-warp h3 {
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 15px;
    color: #000;
}

.detail-warp p {
    margin-bottom: 10px;
    color: rgba(0, 0, 0, 0.65);
}

.detail-warp img {
    width: 100%;
    height: auto;
    margin-bottom: 10px;
}

.detail-warp video {
    width: 100%;
    height: auto;
    margin-bottom: 10px;
}

.detail-tit {
    width: 100%;
    font-size: 16px;
    font-weight: 600;
    text-align: center;
}

.detail-center {
    width: 100%;
    font-size: 16px;
    font-weight: 600;
    text-align: center;
    margin-top: 15px;
    color: #fff;
}

.detail-txt {
    width: 100%;
    height: auto;
    display: inline-block;
}

.detail-txt p {
    width: 100%;
    height: auto;
    display: inline-block;
}


.detail-txt img {
    width: 100%;
    height: auto;
    display: inline-block;
}

.detail-txt video {
    width: 100%;
    height: auto;
    display: inline-block;
}

.detail-pro {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: #999;
    margin-top: 10px;
}

.detail-content {
    width: 100%;
    margin-top: 15px;
}

.layui-upload-file {
    display: none;
}

.protocolMain {
    width: 100%;
    margin-top: 50px;
    background-color: #fff;
    padding: 6px 0;
}

@media screen and (min-width: 480px) {
    .protocolHead {
        height: 16px;
    }

    .protocolFoot {
        height: 16px;
    }
}

@media screen and (min-width: 640px) {
    .protocolHead {
        height: 20px;
    }

    .protocolFoot {
        height: 20px;
    }
}

@media screen and (min-width: 768px) {
    .protocolHead {
        height: 24px;
    }

    .protocolFoot {
        height: 24px;
    }
}

@media screen and (min-width: 960px) {
    .protocolHead {
        height: 24px;
    }

    .protocolFoot {
        height: 24px;
    }
}

@media screen and (min-width: 1200px) {
    .protocolHead {
        height: 24px;
    }

    .protocolFoot {
        height: 24px;
    }
}

.protocolMain input {
    border-bottom: 1px solid #333;
    width: 100px;
    padding: 0 5px;
}

.protocolMain h1 {
    width: 100%;
    font-size: 18px;
    font-weight: 600;
    text-align: center;
    padding: 0 0 12px;
}

.pro-top {
    width: 100%;
    font-size: 14px;
    font-weight: 600;
}

.protocol-text {
    width: 100%;
    margin-top: 10px;
}

.protocol-text h3 {
    font-weight: 600;
    margin: 10px 0;
}

.protocol-btm {
    width: 100%;
    font-weight: 600;
}

.btn-box {
    width: 100%;
    margin-top: 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.btn-box div {
    width: 45%;
    line-height: 40px;
    height: 40px;
    font-size: 15px;
    text-align: center;
    cursor: pointer;
    border-radius: 8px;
}

.btn-box div.btn-confrim {
    background: #3F6CDF;
    color: #ffffff;
}

.btn-box div.btn-cancle {
    background: #ccc;
}

.protocol-img {
    width: 100%;
    margin-top: 20px;
}

.protocol-img ul {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.protocol-img ul li {
    width: 50%;
    text-align: center;
}

.protocol-img ul li img {
    height: 120px;
    width: auto;
}

.protocol-text-img {
    height: 220px;
    width: auto;
    opacity: 0.3;
    position: fixed;
    left: 50%;
    margin-left: -110px;
    top: calc(50% - 110px);
}

.pointsIndex {
    width: 90%;
    margin: 0 auto 50px;
}

.pointsTitle {
    width: 100%;
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 10px;
    color: #fff;
}

.pointsIndexList {
    width: 100%;
}

.pointsIndexList li {
    width: 100%;
    background-color: #fff;
    margin-bottom: 20px;
    border-radius: 8px;
    padding: 10px;
    overflow: hidden;
    position: relative;
}

.pointsIndexList li a {
    width: 100%;
    height: auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.pointsIndexList li .productListImg {
    width: 120px;
    height: 120px;
    display: contents;
}

.pointsIndexList li .productListImg img {
    width: 120px;
    height: 120px;
    display: inline-block;
    border-radius: 12px;
}

.pointsIndexList li .productListBody {
    width: 100%;
    height: auto;
    display: inline-block;
    padding-left: 10px;
}

.pointsIndexList li .productListBody .productListTitle {
    width: 100%;
    font-size: 14px;
    color: #000;
    font-weight: 600;
}

.pointsIndexList li .productListBody .productListPrice {
    width: 100%;
    font-size: 14px;
    color: #000;
    font-weight: 600;
}

.pointsIndexList li .productListBody .productListPrice span {
    color: #3F6CDF;
}

.pointsIndexList li .productListBody .productListTxt span {
    color: #3F6CDF;
}

.pointsIndexList li .productListBody .productListBtn {
    position: absolute;
    right: 10px;
    bottom: 56px;
    padding: 0 10px;
    background-color: #3F6CDF;
    color: #fff;
    border-radius: 8px;
    cursor: pointer;
}

.pointsIndexList li .productListBody .productListBtn.disabled {
    background-color: #999999;
}

.tabIndex {
    width: 92%;
    margin: 0 auto;
}

.tabTitle {
    width: 100%;
    font-size: 16px;
    margin-bottom: 16px;
}

.tabTitle a {
    color: #fff;
    margin-right: 16px;
    padding-bottom: 6px;
}

.tabTitle a.cur {
    font-weight: 600;
    border-bottom: 2px solid #ffffff;
}

.tabIndexList {
    width: 100%;
    height: auto;
    display: inline-block;
}

.tabIndexItem {
    width: 100%;
    height: auto;
    display: block;
}

.tabIndexItem a {
    width: 100%;
    height: auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background-color: #fff;
    margin-bottom: 20px;
    border-radius: 8px;
    padding: 10px;
    overflow: hidden;
    position: relative;
}

.tabIndexItem a .productListImg {
    width: 120px;
    height: 120px;
    display: contents;
}

.tabIndexItem a .productListImg img {
    width: 120px;
    height: 120px;
    display: inline-block;
    border-radius: 12px;
}

.tabIndexItem a .productListBody {
    width: 100%;
    height: auto;
    display: inline-block;
    padding-left: 10px;
}

.tabIndexItem a .productListBody .productListTitle {
    width: 100%;
    font-size: 14px;
    color: #000;
    font-weight: 600;
}

.tabIndexItem a .productListBody .productListPrice {
    width: 100%;
    font-size: 14px;
    color: #000;
    font-weight: 600;
}

.tabIndexItem a .productListBody .productListPrice span {
    color: #3F6CDF;
}

.tabIndexItem a .productListBody .productListTxt span {
    color: #3F6CDF;
}

.tabIndexItem a .productListBody .productListBtn {
    position: absolute;
    right: 10px;
    bottom: 56px;
    padding: 0 10px;
    background-color: #3F6CDF;
    color: #fff;
    border-radius: 8px;
    cursor: pointer;
}

.tabIndexItem a .productListBody .productListBtn.disabled {
    background-color: #999999;
}

.tabIndexNews {
    width: 100%;
    height: auto;
    display: inline-block;
}

.tabIndexNews li {
    width: 100%;
    height: auto;
    border-radius: 8px;
    margin-top: 12px;
    overflow: hidden;
    background-color: #fff;
}

.tabIndexNews li:first-child {
    margin-top: 0;
}

.tabIndexNews li a {
    width: 100%;
    padding: 12px 8px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
}

.tabIndexNews li a img {
    width: 120px;
    height: 90px;
    border-radius: 4px;
}

.tabIndexNews dl {
    width: calc(100% - 120px);
    padding-left: 6px;
}

.tabIndexNews dl dt {
    width: 100%;
    color: #0b0b0b;
    font-size: 14px;
    font-weight: 600;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.tabIndexNews dl dd {
    width: 100%;
    font-size: 12px;
    color: #666666;
}

.tabIndexNews dl dd.desc {
    line-height: 24px;
    overflow: hidden;
    -webkit-line-clamp: 2;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
}


.tabIndexWeek {
    background-color: #fff;
    padding: 10px 5%;
    border-radius: 8px;
    margin-bottom: 15px;
}

.tabIndexWeek .weekListTop {
    width: 100%;
    border-bottom: 2px dashed #808080;
    padding-bottom: 5px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.tabIndexWeek .weekListTop dl {
    width: 50%;
    border-left: 2px dashed #7d7d7d;
    text-align: center;
}

.tabIndexWeek .weekListTop dl:first-child {
    border-left: 0;
}

.tabIndexWeek .weekListTop dl dt {
    font-size: 18px;
    color: #3F6CDF;
    width: 100%;
}

.tabIndexWeek .weekListTop dl dd {
    font-size: 14px;
    width: 100%;
}

.tabIndexWeek .weekListBtm {
    width: 100%;
    margin-top: 5px;
    text-align: center;
}

.tabIndexWeek .weekListBtm p {
    width: 100%;
    color: #0b0b0b;
    font-weight: 600;
    line-height: 20px;
    margin-bottom: 6px;
}

.tabIndexWeek .weekListBtm button {
    width: 100%;
    height: 35px;
    background-color: #3F6CDF;
    color: #fff;
    font-size: 16px;
    border-radius: 8px;
    border: 0;
}

.tabIndexWeek .weekListBtm button.disabled {
    background-color: #CCCCCC;
}

.level {
    width: 100%;
    height: auto;
}

.mineTopBg {
    position: absolute;
    right: 1%;
    top: -32px;
    width: 136px;
    height: auto;
}

.levelDetailHead {
    width: 100%;
    padding: 0 4%;
    position: relative;
    margin-top: 15px;
}

.levelDetailHead h3 {
    width: 100%;
    font-size: 20px;
    color: #000;
}

.vipHead {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
}

.vipHead .vip-slide {
    width: 49%;
    margin-top: 12px;
    padding: 15px;
    border-radius: 8px;
    position: relative;
    text-align: center;
    background: #fff url("../images/vip_lvBg.png") no-repeat bottom right;
    background-size: 36%;
    border: 1px solid #F4C11A
}

.vipBgTxt {
    width: 100%;
    height: auto;
    margin-top: 5px;
}

.vipBgImg {
    width: auto;
    height: 30px;
}

.vipBgTxt h2 {
    width: 100%;
    text-align: center;
    font-size: 20px;
    color: #000;
    font-weight: 600;
}

.vipBgTxt p {
    width: 100%;
    font-size: 12px;
    margin-top: 3px;
    color: rgba(0, 0, 0, 0.65);
    text-decoration: line-through;
}

.official {
    width: 100%;
    padding: 0 0 50px;
}

.officialHead {
    width: 100%;
    height: 50px;
    line-height: 50px;
    padding: 0 4%;
    text-align: center;
    position: relative;
}

.officialHead h2 {
    font-size: 18px;
    color: #000;
    font-weight: 400;
}

.officialHead a {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    position: absolute;
    right: 4%;
    top: 7px;
}

.officialHead-img {
    width: auto;
    height: 32px;
    padding: 0 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    right: 12px;
    top: 7px;
}

.officialHead img {
    width: 22px;
    height: auto;
    margin-right: 5px;
}

.official-list {
    width: 92%;
    margin: 15px auto;
}

.official-list li {
    width: 100%;
    border-radius: 8px;
    padding: 12px;
    margin-bottom: 15px;
    position: relative;
    background-color: #fff;
}

.official-top {
    width: 100%;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.official-top .official-top-left {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 8px;
}

.official-top .official-top-left img {
    width: 50px;
    height: 50px;
    border-radius: 50%;
}

.official-top .official-top-left dl {
    width: calc(100% - 50px);
    height: 50px;
    padding: 5px 0;
    padding-left: 8px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

.official-top .official-top-left dl dt {
    width: 100%;
    font-size: 14px;
    color: #000;
}

.official-top .official-top-left dl dd {
    width: 100%;
    color: rgba(0, 0, 0, 0.45);
    font-size: 12px;
    margin-top: 5px;
}

.official-top .official-top-left dl dd:last-child {
    color: rgba(0, 0, 0, 0.45);
    font-size: 12px;
    margin-top: 5px;
}

.official-top .official-top-right {
    height: 65px;
    width: auto;
    position: absolute;
    top: -10px;
    right: 0;
}

.official-txt {
    width: 100%;
    font-size: 14px;
    margin-top: 12px;
    margin-bottom: 12px;
    color: #000;
}

.official-img {
    width: 100%;
    margin-bottom: 12px;
}

.official-img img {
    width: 32%;
    margin-left: 2%;
    border-radius: 5px;
}

.official-img img:first-child {
    margin-left: 0;
}

.official-img img:nth-child(3n + 1) {
    margin-left: 0;
}

.official-bottom {
    width: 100%;
    font-size: 12px;
    margin-top: 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.official-bottom-left {
    width: auto;
    font-size: 12px;
    float: right;
}

.official-bottom-left img {
    height: 12px;
    width: auto;
    margin-left: 3px;
    margin-bottom: 5px;
    margin-top: 5px;
}

.official-bottom p {
    color: rgba(0, 0, 0, 0.45);
    clear: both;
    display: flex;
    align-items: center;
}

.official-wx {
    position: fixed;
    right: 0;
    bottom: 32%;
    height: 32px;
    width: 90px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-top-left-radius: 25px;
    border-bottom-left-radius: 25px;
    color: #fff;
    font-size: 16px;
    background-image: linear-gradient(to bottom, #FB6B43, #C1531B);
}

.official-wx a {
    display: block;
    color: #ffffff;
    font-weight: 500;
}

.official-wx img {
    height: 20px;
    width: auto;
}

.official-fiexd {
    position: fixed;
    right: 6px;
    bottom: 10%;
    height: 50px;
    width: 50px;
    text-align: center;
    border-radius: 50%;
}

.official-fiexd img {
    height: 50px;
    width: auto;
    display: block;
}

.official-mask {
    width: 94%;
    border-radius: 20px;
    padding: 15px 3%;
    position: relative;
    border: 1px solid rgba(255, 255, 255, 0.2);
    background-color: #F4C11A;
}

.official-mask-icon {
    width: 50px;
    height: auto;
    margin-bottom: 10px;
}

.official-mask-tit {
    width: 100%;
    position: relative;
    text-align: center;
}

.official-mask-tit img {
    width: 50%;
}

.official-mask-txt {
    width: 100%;
    text-align: left;
    font-size: 15px;
    color: rgba(0, 0, 0, 0.65);
    padding: 20px 12px;
    background: url("../images/rule_2.png") no-repeat;
    background-size: 100% 100%;
}

.official-mask-bg {
    width: 30px;
    height: 30px;
    position: absolute;
    left: 50%;
    margin-left: -10px;
    bottom: -50px;
}

.message-list {
    width: 100%;
    margin: 0 auto;
    background: #fff;
    border-radius: 8px;
    padding: 12px;
}

.message-list ul {
    margin-top: 12px;
}

.message-list li {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 12px;
}

.message-list li:first-child {
    margin-top: 0;
}

.message-list li img {
    width: 50px;
    height: 50px;
    border-radius: 50%;
}

.message-list li dl {
    width: calc(100% - 65px);
    height: auto;
}

.message-list li dl dt {
    line-height: 20px;
    width: 100%;
    font-size: 18px;
    color: #000;
}

.message-list li dl dd {
    width: 100%;
    color: rgba(0, 0, 0, 0.65);
    font-size: 12px;
    margin-top: 8px;
    line-height: 15px;
}

.info-top {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    margin-bottom: -50px;
    position: relative;
    z-index: 1;
}

.infoLogo {
    width: 90px;
    height: 90px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 0;
    border-radius: 50%;
    border: 1px solid #999;
    position: relative;
}

.infoLogo img {
    width: 90px;
    height: 90px;
    border-radius: 8px;
}

.infoLogo span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: #000;
    position: absolute;
    right: 0;
    bottom: 0;
}

.infoLogo span img {
    width: 20px;
    height: 20px;
    border-radius: 0;
}

.info-top dl {
    width: 100%;
    margin: 10px auto 0;
}

.info-top dl dt {
    width: 100%;
    font-size: 18px;
    line-height: 22px;
    text-align: center;
    color: #fff;
}

.info-top dl dd {
    width: 60%;
    font-size: 13px;
    line-height: 18px;
    color: rgba(255, 255, 255, 0.65);
    margin: 5px auto 0;
    text-align: center;
}

.official-form {
    width: 100%;
    position: relative;
    z-index: 1;
}

.official-detail {
    width: 100%;
    padding: 15px;
}

.official-tabel {
    width: 100%;
}

.official-tabel-tit {
    width: 100%;
    font-size: 18px;
    margin-bottom: 10px;
    color: #000;
    text-align: center;
}

.official-tabel-txt {
    width: 100%;
    margin-bottom: 12px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    border-radius: 8px;
    color: #000;
}

.official-tabel-txt textarea {
    width: 100%;
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 10px;
    padding: 12px;
    height: 150px;
    background: none;
    color: #000;
}

.official-tabel-up {
    width: 80px;
    height: 80px;
    overflow: hidden;
    border-radius: 10px;
    background: none;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #ccc
}

.official-tabel-up img {
    width: 20px;
    height: 20px;
}

.official-tabel-img {
    width: 80px;
    height: 80px;
    overflow: hidden;
    margin-left: 12px;
    position: relative;
    border-radius: 10px;
    border: 1px solid #ccc;
}

.official-tabel-img img {
    width: 100%;
    height: 100%;
    background: #F5F8FA;
}

.official-tabel-img i {
    color: #C4C4C4;
    font-size: 24px;
    position: absolute;
    top: 0;
    right: 0;
}

.official-image {
    width: 100%;
    max-width: 750px;
    height: auto;
    min-height: 100vh;
    background-color: rgba(0, 0, 0, 0.8);
    z-index: 999;
    position: fixed;
    top: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.official-image-img {
    width: auto;
    height: auto;
    max-width: 100vw;
    max-height: 80vh;
    overflow-y: scroll;
}

.official-image-img img {
    width: 100%;
    height: auto;
}

.mask-image-close {
    width: 48px;
    height: auto;
    padding: 12px;
    position: absolute;
    top: 0;
    right: 0;
    cursor: pointer;
}

.gift {
    width: 100%;
    height: 210px;
    background: url("../images/drop_top.png") no-repeat;
    background-size: 100% 100%;
    padding: 15px 4%;
    position: relative;
}

.gift p {
    width: 55%;
    height: auto;
    font-size: 16px;
    color: #000;
    position: absolute;
    left: 5%;
    bottom: 20px;
}

.giftCon {
    width: 92%;
    height: 145px;
    margin: 0 auto 15px;
    background: url("../images/drop_bg.png") no-repeat;
    background-size: cover;
    padding: 15px;
    position: relative;
    z-index: 1;
}

.giftCon input {
    width: 100%;
    font-size: 14px;
    border: 1px solid rgba(0, 0, 0, 0.1);
    background-color: rgba(0, 0, 0, 0.1);
    height: 45px;
    border-radius: 8px;
    padding: 3px 6px;
    color: #6C757D;
}

.giftMask {
    width: 95%;
    height: 252px;
    padding: 12px 4%;
    position: relative;
    background: url("../images/drop_j.png") no-repeat;
    background-size: contain;
}

.giftMaskImg {
    width: 100px;
    height: auto;
    margin-top: 20px;
}

.giftMaskBg {
    width: 100px;
    height: auto;
}

.giftMask .giftMaskTit {
    width: 100%;
    height: auto;
    display: flex;
    flex-wrap: wrap;
    margin-top: 5px;
    align-items: center;
    justify-content: center;
}

.giftMask .giftMaskTit p {
    width: 100%;
    height: auto;
    font-size: 12px;
    color: #000;
    line-height: 20px;
    text-align: center;
    font-style: normal;
    text-transform: none;
}

.giftMask .giftMaskTxt {
    width: 100%;
    height: 45px;
    color: #F4C11A;
    font-size: 32px;
    font-weight: 600;
    margin-top: 95px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.giftMaskCo {
    width: 22px;
    height: auto;
    position: absolute;
    top: 12px;
    right: 12px;
}

.giftMaskC {
    width: 100%;
    height: 50px;
    font-size: 16px;
    line-height: 50px;
    text-align: center;
    margin-top: 16px;
}


.lines-list {
    width: 100%;
}

.lines-item {
    width: 100%;
    display: flex;
    padding: 10px;
    margin-top: 15px;
    flex-wrap: wrap;
    position: relative;
    align-items: center;
    border-radius: 8px;
    overflow: hidden;
    background-color: rgba(0, 0, 0, 0.5);
    border: 1px solid rgba(255, 255, 255, 0.2);
}

.lines-name {
    width: 100%;
    font-size: 16px;
    margin-bottom: 6px;
    color: #fff;
}

.lines-item a {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    font-size: 13px;
    align-items: center;
    justify-content: center;
}

.lines-inline {
    width: calc(100% - 50px);
    height: auto;
}

.lines-item a span {
    width: 50px;
    display: flex;
    color: #ffffff;
    align-items: center;
    border-radius: 8px;
    background: #F4C11A;
    justify-content: center;
}

.mineMainTar {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.mineMainTarHd {
    width: calc(100% - 110px);
    color: #fff;
    font-size: 12px;
}

.mineMainTarHdTop {
    width: 100%;
}

.mineMainTarHdTop span {
    font-size: 20px;
    font-weight: 600;
}

.mineMainTarHdBar {
    width: 100%;
    height: 5px;
    border-radius: 5px;
    background-color: rgba(64, 140, 255, 0.3);
    margin-top: 8px;
    position: relative;
}

.mineMainTarHdBar span {
    display: block;
    background-color: #fff;
    position: absolute;
    left: 0;
    top: 0;
    height: 5px;
    z-index: 1;
}

.mineMainTarBd {
    width: 100px;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background: #F4C11A;
    color: #000;
}

.cardMessage {
    width: 92%;
    margin: 15px auto;
}

.loginPsw {
    position: absolute;
    right: 20px;
    top: -26px;
    width: 60px;
    height: auto;
}

.sign-main {
    width: 100%;
    padding: 50px 0 12px;
}

.sign-list {
    width: 92%;
    height: auto;
    display: flex;
    flex-wrap: wrap;
    margin: 15px auto 0;
    border-radius: 8px;
    align-items: center;
    background: #ffffff;
}

.sign-item {
    width: 100%;
    height: auto;
    display: flex;
    color: rgba(0, 0, 0, 0.65);
    padding: 0 12px;
    line-height: 50px;
    justify-content: space-between;
    border-bottom: 0.5px solid rgba(0, 0, 0, 0.65);
}

.sign-item:last-child {
    border-bottom: none;
}

.sign-item span {
    color: #000000;
    font-weight: 600;
}

.sign-btn {
    width: 92%;
    height: 43px;
    display: flex;
    align-items: center;
    margin: 15px auto 0;
    justify-content: center;
    margin-top: 24px;
    background: #F4C11A;
    border-radius: 25px;
    font-size: 16px;
    color: #000;
    cursor: pointer;
    border: none;
}