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

span {
    text-wrap: inherit !important;
}

/* login */
.loginBg {
    width: 100%;
    height: 100vh;
    position: relative;
    background: #F7FAFF;
    margin: 0 auto;
}

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

.login-head {
    width: 100%;
    padding: 0 5%;
    position: relative;
    height: 110px;
    background: url("../images/n_bg.png") no-repeat bottom right 7%;
    background-size: 90px auto;
    overflow: hidden;
}


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

.login-head p {
    width: 100%;
    color: #8585AD;
    font-size: 12px;
}

.login-main {
    width: 100%;
    padding: 15px 5%;
}

.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: #3C386B;
    font-weight: 600;
    position: relative;
    width: 50%;
    text-align: center;
}

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

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

.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: 1px solid #ccc;
    border-radius: 8px;
    overflow: hidden;
    background: #fff;
}

.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: #fff;
    padding: 0 10px;
    border: none;
    outline: none;
    font-size: 12px;
}

.text-inline .bindingyzms {
    width: 70px;
    height: 35px;
    border: none;
    color: #59B779;
    cursor: pointer;
    position: absolute;
    right: 3px;
    background-color: rgba(89, 183, 121, 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: 16px;
    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: 40px;
    border: none;
    background: #59B779;
    color: #ffffff;
    font-size: 16px;
    cursor: pointer;
    border-radius: 8px;
    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: #333;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    border: 1px solid #F2F1F9;
    margin-top: 12px;
    background-color: #F2F1F9;
}

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

.text-flex a {
    color: #999;
    margin-left: auto;
    text-decoration: underline;
}

.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: 16px;
    margin-bottom: 12px;
}


.login-message {
    width: 100%;
    font-size: 16px;
    color: #999;
    margin-bottom: 12px;
    line-height: 20px;
}

.login-body h2 {
    width: 50%;
    margin-bottom: 8px;
    font-weight: 600;
}

.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;
    overflow: hidden;
    margin: 20px auto 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 label {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #F9FAFB;
    border-radius: 5px;
    width: 60px;
    height: 60px;
    margin: 0 auto;
}

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

.navigation li span {
    width: 100%;
    font-size: 14px;
    display: block;
    text-align: center;
    margin-top: 10px;
}

.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: #666;
}

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

.navigationNum dl dd {
    width: auto;
    height: auto;
    display: flex;
    align-items: center;
    border-radius: 5px;
    padding: 8px;
    border: 1px solid #ccc
}

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

.navigationNum dl dd p {
    width: 100%;
    color: #242424;
    font-size: 12px;
    font-weight: 400;
}

.navigationNum dl dd h3 {
    width: 100%;
    position: relative;
    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: -6px;
}

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

.navigationNum dl dd h3 img {
    height: 20px;
}

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

.navigationNumUl p {
    width: 100%;
    color: #fff;
}

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

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

.navigationNumUl ul li {
    width: 100%;
    display: flex;
    align-items: center;
}

.navigationNumUl ul li h3 {
    font-size: 16px;
    color: #fff;
    font-weight: 500;
}

.navigationNumUl ul li span {
    font-size: 12px;
    color: #333;
    background: #F2E56D;
    border-radius: 25px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 110px;
    height: 35px;
    margin-right: 10px;
}

.navigationNumUl a {
    position: absolute;
    top: 0;
    right: 0;
    width: 25%;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 11px;
}

.navigationNumUl a img {
    width: 12px;
    height: auto;
    margin-right: 3px;
}

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

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

.home-dep a {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    padding: 5%;
    color: #ffffff;
    display: block;
}

.home-dep a dl {
    width: 100%;
    height: 100%;
}

.home-dep dl dt {
    width: 100%;
    font-size: 18px;
    font-weight: 600;
    margin-top: 12px;
}

.home-dep dl dd {
    width: 100%;
    margin-top: 2px;
    color: #ccc;
}

.home-news {
    width: 100%;
    margin-top: 15px;
    padding: 0 4%;
}

.home-news-list {
    width: 100%;
    margin-top: 12px;
    height: auto;
    background: #F7FAFF;
    border-radius: 8px;
    padding: 12px;
}

.home-news-list li {
    width: 100%;
    height: auto;
    overflow: hidden;
    border-bottom: 1px solid #eee;
    padding-bottom: 12px;
    margin-bottom: 12px;
}

.home-news-list li:last-child {
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: none;
}

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

.home-news-list li a img {
    width: 70px;
    height: 70px;
    border-radius: 8px;
}

.home-news-list li dl {
    width: calc(100% - 82px);
    height: 100%;
}

.home-news-list li dl dt {
    width: 100%;
    font-size: 15px;
    color: #041733;
}

.home-news-list li dl dd {
    width: 100%;
    font-size: 12px;
    color: #999;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 10px;
}

.home-news-list li dl dd span {
    display: flex;
    align-items: center;
}

.home-news-list li dl dd span i {
    margin-right: 6px;
}

.home-service {
    width: 50px;
    height: 50px;
    position: fixed;
    z-index: 99;
    right: 4%;
    bottom: 20%;
}

.home-service a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
}

.home-service img {
    width: 100%;
    height: 100%;
    border-radius: 50%;
}

.home-product {
    width: 100%;
    margin-top: 15px;
    background: #fff;
    border-top-right-radius: 12px;
    border-top-left-radius: 12px;
    padding: 15px 4%;
    position: relative;
    z-index: 1;
}

.home-product-tit {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 18px;
}

.home-product-tit a {
    font-size: 14px;
    color: #999;
    display: flex;
    align-items: center;
}

.home-product-list {
    width: 100%;
    overflow: hidden;
}

.home-product-list ul {
    width: 100%;
}

.home-product-list li {
    width: 100%;
    height: auto;
    margin-top: 12px;
    padding: 15px;
    border-radius: 12px;
    position: relative;
    border: 1px solid #ddd
}

.home-product-list-top {
    width: 100%;
    border-bottom: 1px solid #E9ECEF;
    padding-bottom: 12px;
    margin-bottom: 12px;
    position: relative;
}

.home-product-list-top h3 {
    width: 100%;
    display: flex;
    align-items: center;
    color: #000;
    font-size: 16px;
    margin-bottom: 8px;
}

.home-product-list-top h3 img {
    height: 15px;
    width: auto;
    margin-left: 6px;
    background: #F0F2FC;
    border-radius: 25px;
    padding: 3px;
}

.home-product-list-top p {
    width: 100%;
    font-size: 12px;
    color: #999;
}

.home-product-list-top p span {
    color: rgba(0, 0, 0, 0.85);
    font-size: 14px;
}

.home-product-list-top p span label {
    margin: 0 2px;
}

.home-product-list li .vipLv {
    position: absolute;
    right: 0;
    top: 0;
    width: 35px;
    height: auto;
}

.home-product-list li a {
    position: absolute;
    top: 0;
    right: 0;
    background: #59B779;
    color: #fff;
    font-size: 15px;
    border-radius: 25px;
    padding: 6px 15px;
}

.home-product-list li a img {
    width: 12px;
    height: auto;
    margin-left: 10px;
}

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

.home-product-list-btm p {
    width: 32%;
    text-align: center;
    color: #999;
    font-size: 12px;
}

.home-product-list-btm p span {
    display: block;
    width: 100%;
    margin-top: 8px;
    font-size: 18px;
    color: #000;
}

.advertisement {
    width: 90%;
    margin: 20px auto 0;
    position: relative;
    border-radius: 8px;
    overflow: hidden;
}

.advertisement img {
    width: 100%;
    height: 120px;
    border-radius: 8px;
}

.advertisement .swiper-pagination {
    position: absolute;
    left: 0;
    text-align: center;
    bottom: 5px;
    width: 100%;
    z-index: 1;
}

.advertisement .swiper-pagination-bullet {
    display: inline-block;
    width: 6px;
    height: 6px;
    opacity: 1;
    border-radius: 10px;
    background: white;
    margin: 0 3px;
    cursor: pointer;
    transition: width 0.3s ease-in-out;

}

.advertisement .swiper-pagination-bullet-active {
    background: #3F6CDF;
    width: 12px;
}

.advertisement .advertisementTxt {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    text-align: center;
    padding: 10px 0;
}

.advertisement .advertisementTxt p {
    color: #fff;
    font-size: 18px;
}

.dailyIndex {
    width: 92%;
    margin: 20px auto 0;
}

.dailyIndex dl {
    width: 100%;
    height: auto;
    text-align: center;
    margin-bottom: 12px;
}

.dailyIndex dl:last-child {
    margin-bottom: 0;
}

.dailyIndex dt {
    width: 100%;
    height: auto;
    color: #fff;
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 6px;
}

.dailyIndex dd {
    width: 100%;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    font-weight: 600;
    background: #ffffff;
    border: 1px solid #3F6CDF;
    border-radius: 8px;
    position: relative;
    cursor: pointer;
}

.dailyIndex dd small {
    font-size: 12px;
    font-weight: 600;
    color: #ff6e7c;
    z-index: 99;
}

.dailyIndex dd small i {
    font-size: 12px;
    margin-left: 5px;
}

.dailyIndex dd span {
    height: 32px;
    border-radius: 8px;
    position: absolute;
    left: 0;
    background: #3F6CDF;
}

.adIndex {
    width: 100%;
    height: auto;
    padding: 0 4%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.adIndex a {
    width: 100%;
    height: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
    overflow: hidden;
}

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

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

.taskIndexList {
    width: 100%;
}

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

.taskIndexList ul li {
    width: 49%;
    margin-left: 2%;
    margin-bottom: 15px;
    background-color: #fff;
    border-radius: 8px;
    overflow: hidden;
}

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

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

.taskIndexList ul li a {
    width: 100%;
    padding: 6px;
    display: block;
    text-align: center;
}

.taskIndexList ul li img {
    width: 100%;
    height: auto;
    margin-bottom: 5px;
    border-radius: 5px;
}

.taskIndexList ul li p {
    width: 100%;
    height: auto;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.notify {
    width: 90%;
    margin: 0 auto 60px;
}

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

.notifyBd {
    width: 100%;
}

.notifyHd {
    width: 100%;
    margin-bottom: 15px;
}

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

.notifyHdTop .notifyHdTopNum {
    font-size: 14px;
    font-weight: 600;
    display: flex;
    align-items: center;
}

.notifyHdTop .notifyHdTopNum i {
    display: block;
    width: 5px;
    height: 5px;
    background-color: #BBBBBB;
    margin-right: 15px;
}

.notifyHd.now .notifyHdTopNum {
    color: #3F6CDF;
}

.notifyHd.now .notifyHdTopNum i {
    width: 10px;
    height: 10px;
    background-color: #fff;
    border-radius: 50%;
    border: 3px solid #333;
    margin-left: -2px;
}

.notifyHdBom {
    border-left: 1px dashed #BBBBBB;
    padding-left: 15px;
    color: #BBBBBB;
    margin-left: 2px;
}

.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: #59B779;
    color: #333;
    font-size: 13px;
    border-radius: 16px;
    text-align: left;
    position: relative;
}

.app-top {
    width: 100%;
    display: flex;
    align-items: center;
    font-size: 22px;
    font-weight: 600;
    color: #333;
    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 {
    color: #333;
    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: #333333;
    font-size: 18px;
    font-weight: 600;
    text-align: center;
}

.app-txt p {
    width: 100%;
    color: #333;
    font-size: 14px;
    margin-top: 12px;
    line-height: 22px;
    text-align: left;
}

.app-btn {
    width: 92%;
    height: auto;
    padding: 12px;
    margin: 12px auto;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    background-color: #1D212F;
    border-radius: 10px;
}

.app-btn a {
    color: #ffffff;
    font-size: 12px;
    margin-top: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.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;
}

.message-txt {
    color: #333;
    padding: 10px;
    max-height: 50vh;
    overflow-y: scroll;
}

.message-txt p,
.message-txt img {
    width: 100%;
}

.message-btn {
    width: 100%;
    padding: 10px;
}

.message-tags {
    width: 100%;
    padding: 10px 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.message-tags-img {
    width: 50px;
}

.message-tags a {
    display: flex;
    width: 100%;
    height: 44px;
    align-items: center;
    border: 3px solid #C1531B;
    border-radius: 25px;
    padding: 0 10px;
    position: relative;
}

.message-tags a span {
    display: flex;
    align-items: center;
    background-image: linear-gradient(to bottom, #FB6C43, #C1531B);
    color: #fff;
    position: absolute;
    right: -3px;
    top: -3px;
    height: 44px;
    width: 70px;
    border-radius: 25px;
    justify-content: center;
    font-size: 26px;
    font-weight: 600;
}

.message-btn .message-close {
    width: 100%;
    margin-top: 8px;
    background: none;
    border: 1px solid #C1531B;
    border-radius: 8px;
    color: #C1531B;
    font-size: 16px;
    height: auto;
    display: inline-block;
    text-align: center;
    padding: 12px;
}

.message-btn a {
    width: 100%;
    height: auto;
    margin-top: 8px;
    background-image: linear-gradient(to bottom, #FB6C43, #C1531B);
    border-radius: 8px;
    color: #ffffff;
    font-size: 14px;
    font-weight: 600;
    display: inline-block;
    text-align: center;
    padding: 12px;
}

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

/* product */
.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;
    background-color: #fff;
    padding: 15px;
    border-radius: 10px;
}

.productList-name {
    width: 100%;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    position: relative;
}

.productList-name .productList-name-img {
    width: 50px;
    height: 50px;
    border-radius: 6px;
}

.productList-name dl {
    margin-left: 10px;
    width: auto;
    height: auto;
}

.productList-name dl dt {
    font-size: 16px;
    color: #041733;
    font-weight: 600;
}

.productList-name dl dd {
    font-size: 12px;
    color: rgba(0, 0, 0, 0.65);
    font-weight: 400;
    margin-top: 6px;
}

.productList-name dl dd span {
    font-size: 12px;
    padding: 0 10px;
    color: #F1574C;
}

.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-hot {
    margin-left: auto;
    width: auto;
}

.productList-hot span {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #ECEFF3;
    border-radius: 25px;
    padding: 5px 8px;
    margin-bottom: 3px;
}

.productList-hot span img {
    height: 10px;
    width: auto;
}

.productList-hot img {
    height: 20px;
    width: auto;
}

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

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

.productList-item p span {
    font-size: 14px;
    color: #041733;
}

.productList-link {
    width: 100%;
}

.productList-link a {
    width: 100%;
    height: 40px;
    background: #59B779;
    color: #fff;
    font-size: 15px;
    border-radius: 25px;
    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: 100%;
    align-items: center;
    justify-content: space-between;
    margin-top: 15px;
}

.productList-link a .proNull {
    height: 16px;
    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;
}

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

.productDetail-img {
    width: 90px;
    height: 90px;
    border-radius: 100%;
    margin: -60px auto 0;
    position: relative;
    z-index: 1;
}

.productDetailHead h3 {
    width: 100%;
    color: #041733;
    font-size: 18px;
    margin-top: 12px;
    text-align: center;
}

.productDetailHead div {
    background: #F2F2F2;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 15px;
    border-radius: 12px;
    margin-top: 12px;
}

.productDetailHead div img {
    height: 22px;
    width: auto;
    margin-right: 6px;
}

.productDetailHead dl {
    width: 50%;
    font-size: 12px;
    color: #999;
    text-align: center;
}

.productDetailHead dl dt {
    width: 100%;
    font-size: 18px;
    color: #041733;
}

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

.productDetailTop dl {
    width: 100%;
}

.productDetailTop dl dt {
    width: 100%;
    font-size: 22px;
    color: #041733;
}

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

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

.productDetailTop ul li h5 {
    color: #041733;
    font-size: 18px;
    margin-bottom: 3px;
}

.productDetailTop ul li span {
    color: #999;
    font-size: 12px;
}

.productDetailTop p {
    width: 100%;
    font-size: 12px;
}

.productDetailTop-item {
    width: 100%;
    border-top: 1px solid #eee;
    padding-top: 12px;
    margin-top: 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.productDetailTop-block {
    display: flex;
    align-items: center;
}

.productDetailTop-block input {
    width: 40px;
    text-align: center;
    padding-left: 0;
    border: none;
}

.productDetailTop-block button {
    background: none;
    color: #59B779;
    border: 1px solid #041733;
    border-radius: 3px;
    font-size: 15px;
    width: 30px;
    height: 30px;
}

.productDetailTop h3 {
    width: 100%;
    margin-top: 15px;
    font-size: 12px;
    color: #999;
}

.productDetailTop h3 span {
    font-size: 16px;
    color: #59B779;
}

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

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

.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;
}

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

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

.productDetailTxtPro p {
    width: 100%;
}

.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: #59B779;
    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: #fff;
    font-size: 16px;
    line-height: 40px;
}

.productDetailCancel div.cancelRight {
    background: #59B779;
    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: 12px;
    border-radius: 8px;
    margin-top: 15px;
    background: #fff;
    box-shadow: 0 0 5px rgba(54, 41, 183, 0.07);
    position: relative;
}

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

.order-list-top span {
    font-size: 12px;
    font-weight: 500;
    position: absolute;
    right: 0;
    top: 15px;
    background: #ECEFF3;
    color: #041733;
    border-top-left-radius: 25px;
    border-bottom-left-radius: 25px;
    padding: 3px 8px;
}

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

.order-list-img img {
    width: 50px;
    height: 50px;
    border-radius: 8px;
    margin-right: 10px;
}

.order-list-img dt {
    font-size: 16px;
    font-weight: 400;
}

.order-list-img dd {
    margin-top: 6px;
    font-size: 12px;
    font-weight: 400;
    color: rgba(0, 0, 0, 0.65);
}

.order-list-img dd label {
    color: #f00;
}

.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: #999;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

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

.order-list-btm p span.bigG {
    font-size: 20px;
    color: #59B779;
    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;
}

.team-head {
    width: 96%;
    height: auto;
    margin: 5px auto 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.team-head a {
    background-color: #2B5569;
    color: #fff;
    font-size: 12px;
    border-radius: 5px;
    padding: 2px 8px;
}

.team-head dl {
    display: flex;
    align-items: center;
}

.team-head dl dt {
    width: 45px;
    height: 45px;
    margin-right: 6px;
}

.team-head dl img {
    width: 45px;
    height: 45px;
    border-radius: 50%;
}

.team-head dl dd {
    font-size: 18px;
    color: #000;
}

.inviteBox {
    width: 100%;
    background: #fff;
    padding: 12px;
    border-radius: 8px;
    margin-top: 46%;
}

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

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

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

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

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

.team-link {
    width: 100%;
    height: 40px;
    margin-top: 15px;
    background: #EFEFEF;
    border: 1px solid #DFE2E4;
    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: #6C757D;
}

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

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

.team-mask-div {
    width: 80%;
    background: #59B779;
    padding: 12px;
}

.team-mask-divs {
    width: 100%;
    background: #fff;
    padding: 5%;
    position: relative;
}

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

.team-mask-divs h2 {
    width: 80%;
    background: #F0F0F0;
    margin: 5px auto 12px;
    color: #333;
    height: 36px;
    line-height: 36px;
    font-size: 16px;
}

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

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

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

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

.team-lvs {
    width: 100%;
    height: auto;
    margin: 25px auto 0;
    background: #E1F6E7;
    border-radius: 8px;
}

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

.team-lvs-top a {
    width: 33%;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #1D212F;
    font-size: 16px;
    position: relative;
}

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

.team-lvs-top a i {
    position: absolute;
    bottom: 6px;
    left: 50%;
    margin-left: -15px;
    width: 30px;
    height: 3px;
    background: #59B779;
    border-radius: 3px;
    display: none;
}

.team-lvs-top a span {
    position: relative;
    z-index: 1;
}

.team-lvs-top a.cur {
    color: #000;
    font-weight: 600;
}

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

.team-lvs-top a.cur:first-child {

}

.team-lvs-top a.cur img {
    display: block;
    width: 105%;
    height: 60px;
    position: absolute;
    left: 0;
    top: -10px
}

.team-lvs-btm {
    width: 100%;
    height: auto;
    padding: 12px;
    background: #fff;
    border-radius: 8px;
}

.team-lvs-btm ul {
    width: 100%;
    border-radius: 8px;
    padding: 12px;
    background: #F2E56D;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

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

.team-lvs-btm ul li img {
    width: 40px;
    height: 40px;
    margin-right: 8px;
}

.team-lvs-btm ul li dl {
    font-size: 12px;
    color: rgba(0, 0, 0, 0.65);
}

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

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

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

.team-lv-top .swiper-slide {
    width: 60% !important;
}

.team-lv-top .swiper-slide-div {
    position: absolute;
    left: 0;
    top: 0;
    padding: 15px;
    width: 100%;
    height: 100%;
    display: flex;
    flex-wrap: wrap;
}

.team-lv-top .swiper-slide-div .swiper-slide-div-dl {
    width: 70%;
    text-align: center;
    color: #947641;
    font-weight: 500;
    font-size: 14px;
}

.team-lv-top .swiper-slide-div .swiper-slide-div-dl h3 {
    color: #3C2913;
    font-weight: 600;
    font-size: 16px;
}

.team-lv-top .swiper-slide-div dl {
    margin-right: 15px;
    font-size: 12px;
    margin-top: 5px;
    color: #947641;
}

.team-lv-top .swiper-slide-div dl dd {
    font-size: 14px;
    color: #3C2913;
    font-weight: 600;
}

.team-lv-list {
    width: 100%;
    height: auto;
    padding: 10px;
    margin-top: 15px;
    background: #ffffff;
    border-radius: 10px;
}

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

.team-lv-list ul li {
    width: 100%;
    margin-bottom: 12px;
    padding-bottom: 12px;
    border-bottom: 1px solid #eee;
    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 #59B779;
    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: #59B779;
    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: 100%;
    height: auto;
    margin: 15px auto 0;
    position: relative;
    z-index: 1;
}

.taskName {
    width: 70%;
    padding: 0 6%;
    color: #fff;
    font-size: 22px;
    font-weight: 600;
    margin-top: 13%;
}

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

.task ul li {
    width: 100%;
    padding: 12px;
    margin-bottom: 15px;
    border-radius: 12px;
    position: relative;
    border: 1px solid #ddd;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    background-color: #fff;
}

.task-img {
    width: 50px;
    height: 50px;
    background: #E1F6E7;
    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: 100%;
    display: flex;
    align-items: center;
    font-size: 10px;
    margin-top: 8px;
}

.task-top {
    width: 100%;
    margin-top: 5px;
    color: #ddd;
    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: 16px;
    font-weight: 400;
    color: #000;
}

.task ul li h5 {
    font-size: 10px;
    font-weight: 400;
    color: #FBA64B;
    display: flex;
    align-items: center;
    margin-left: 5px;
}

.task-bar {
    width: 30%;
    height: 5px;
    border-radius: 15px;
    background-color: #E4E4E4;
    position: relative;
    margin-right: 5px;
}

.task-bar span {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    border-radius: 15px;
    height: 5px;
    background: #59B779;
    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: 32px;
    border-radius: 25px;
    background-color: #59B779;
    color: #fff;
    font-size: 12px;
}

.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%;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    position: relative;
    margin: 20px auto 0;
    background: #fff;
    border-radius: 10px;
    padding: 12px 4%;
    box-shadow: 0px 1px 40px 0px rgba(0, 0, 0, 0.1);
}

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

.mineLogo {
    width: 70px;
    height: 70px;
    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% - 80px);
    height: auto;
    margin-left: 6px;
    position: relative;
}

.mineMain h3 {
    width: 100%;
    font-size: 20px;
    color: #1D212F;
}

.mineMain p {
    width: 100%;
    font-size: 12px;
    margin-top: 3px;
    color: #999;
}

.mineMain img {
    position: absolute;
    right: 0;
    top: 2px;
    height: 20px;
    width: auto;
}

.mineWallet {
    width: 92%;
    margin: 15px auto 0;
    border-radius: 8px;
    padding: 12px;
    background: #fff;
    box-shadow: 0px 1px 40px 0px rgba(0, 0, 0, 0.1);
}

.mineWallet h2 {
    font-size: 16px;
    border-bottom: 1px solid #eee;
    margin-bottom: 12px;
    padding-bottom: 12px;
}

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

.mineWallet ul li {
    width: 31%;
    text-align: center;
}

.mineWallet ul li:last-child {
    border-right: 0;
}

.mineWallet ul li h3 {
    font-size: 16px;
    color: #333
}

.mineWallet ul li h3.bGr {
    font-weight: 600;
    color: #333;
}

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

.mineBouns {
    width: 92%;
    margin: 15px auto 0;
    border-radius: 8px;
}

.mineBouns a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    position: relative;
}

.mineBouns a img {
    width: 100%;
    height: auto;
}

.mineBouns a p {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    font-size: 18px;
    padding: 7% 4%;
    color: #fff;
}

.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 label {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 60px;
    height: 60px;
    border-radius: 8px;
    background: #F9FAFB;
    margin-bottom: 6px;
}

.mineFlex a:first-child img {
    width: 36px;
}

.mineFlex a:last-child img {
    width: 25px;
}

.mineFlex a img {
    width: 32px;
    height: auto;
}

.mineFlex dl {
    width: 100%;
}

.mineFlex dl dt {
    font-size: 16px;
    color: #B6E8F7;
    text-align: center;
}

.mineFlex dl dd {
    font-size: 12px;
    color: #B6E8F7;
    margin-top: 5px;
    text-align: center;
}

.mineNav {
    width: 92%;
    background: #F7F9FC;
    margin: 12px auto 0;
    padding: 12px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
}

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

.mineNav a {
    display: block;
    text-align: center;
    color: rgba(0, 0, 0, 0.65);
    font-size: 12px;
}

.mineNav a img {
    height: 25px;
    width: auto;
    margin-bottom: 8px;
}

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

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

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

.minePro ul li {
    width: 33%;
    height: auto;
    margin-bottom: 12px;
}

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

.minePro ul li img {
    height: auto;
    width: 40px;
    margin: 0 auto;
}

.minePro ul li p {
    width: 100%;
    margin-top: 5px;
}

.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: #ECEFF3;
    color: #333;
    font-size: 16px;
}

.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;
}

.customerList li {
    width: 100%;
    background: #fff;
    border-radius: 8px;
    padding: 12px;
    margin-top: 12px;
}

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

.customerList li p {
    width: 100%;
    font-size: 12px;
    color: #999;
    margin-top: 6px;
}

.customerHtml {
    width: 92%;
    height: 145px;
    margin: 15px auto;
    background: url("../images/n_bg7.png") no-repeat;
    background-size: contain;
    padding: 12px;
}

.customerHtml h2 {
    width: 100%;
    color: #fff;
    font-size: 18px;
}

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

.customerLi a {
    display: flex;
    align-items: center;
    width: 100%;
    height: 100%;
    color: #fff;
}

.customerLi a span {
    margin-left: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    width: 25px;
    height: 25px;
    border-radius: 50%;
}

.customerLi a span i {
    color: #59B779;
}

.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;
    background: #fff;
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
}

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

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

.news-change a {
    width: 48%;
    height: 35px;
    line-height: 35px;
    font-size: 14px;
    cursor: pointer;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #F2F1F9;
    border-radius: 25px;
}

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

.news-change a.cur {
    background: #59B779;
    color: #fff;
    border-radius: 25px;
    box-shadow: 0px 4px 10px 0px rgba(42, 87, 104, 0.3);
}

.withdrawWallet {
    width: 92%;
    height: 125px;
    margin: 15px auto 0;
    background: url("../images/new_5.png") no-repeat;
    background-size: 100% 100%;
    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%;
    margin: 15px auto 0;
    border-radius: 8px;
    padding: 12px 5%;
    color: #fff;
    background: #1D212F url("../images/d_bg.png") no-repeat;
    background-size: 100%;
}

.rechargeWallet p {
    width: 100%;
    color: #999;
    display: flex;
    align-items: center;
}

.recharge-p {
    padding: 0 4%;
    width: 100% !important;
    color: #999 !important;
}

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

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

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

.rechargeWallet small {
    width: 100%;
    color: #fff;
}

.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: #999;
    border: 1px solid #F3F4F6;
    background: #F3F4F6;
}

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

.recharge-click ul li.cur {
    color: #59B779;
    background: #E1F6E7;
    border: 1px solid #E1F6E7;
}

.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 #ddd;
    background-color: #fff;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

.recharge-input i {
    width: 24px;
    height: 32px;
    color: #59B779;
    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;
}

.recharge-input textarea {
    width: 100%;
    height: 72px;
    padding: 8px;
}

.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-bottom: 1px solid #ddd;
    background-color: #fff;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

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

}

.recharge-input-new i {
    height: 32px;
    color: #59B779;
    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;
}

.recharge-amount p {
    width: 100%;
    color: #59B779;
    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;
}

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

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

.recharge-li {
    width: 100%;
    border-radius: 10px;
    padding: 15px 12px;
    background: #fff;
    border: 1px solid #ddd;
    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;
}

.recharge-li p {
    width: 100%;
    color: #2B5569;
    margin-top: 5px;
    font-size: 14px;
}

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

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

.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;
}

.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;
    margin-bottom: 15px;
    font-size: 14px;
}

.recharge-amount-bg input {
    width: 90%;
    font-size: 16px;
}

.recharge-amount-bg-bd {
    width: 100%;
    margin-top: 70px;
    font-size: 20px;
}

.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;
    background: #F3F3F3;
    border-radius: 25px;
    margin-bottom: 15px;
    font-size: 14px;
}

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

.gift-btn {
    width: 100%;
    height: 43px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 24px;
    background: #59B779;
    border-radius: 8px;
    font-size: 16px;
    color: #fff;
    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;
}

.recharge-rul {
    width: 100%;
    height: auto;
    margin-top: 16px;
}

.recharge-rul p {
    width: 100%;
    text-wrap: initial !important;
}

.recharge-rul p span {
    text-wrap: initial !important;
}

.recharge-dt {
    width: 100%;
}

.recharge-dt span {
    display: flex;
    width: 100%;
    height: 38px;
    border: 1px solid #ddd;
    border-radius: 10px;
    margin-top: 5px;
    align-items: center;
    padding: 0 10px;
    background-color: #f5f5f5;
}

.recharge-amounts {
    width: 100%;
}

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

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

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

.bindCon .bindingyzms {
    position: absolute;
    right: 8px;
    bottom: 10px;
    font-size: 14px;
    background: none;
    padding: 3px 10px;
    border: none;
    color: #59B779;
    border-radius: 3px;
}

.bindCon .captcha {
    width: auto;
    height: 40px;
    position: absolute;
    right: 1px;
    border: none;
    border-radius: 8px;
}

.bindCon h3 {
    width: 100%;
    font-size: 18px;
    margin-bottom: 10px;
}

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

.recordHtml {
    width: 100%;
    background: #fff;
    border-top-right-radius: 20px;
    border-top-left-radius: 20px;
    overflow: hidden;
    margin-top: 12px;
}

.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;
    background: #fff;
    border-radius: 25px;
}

.recordsTop ul li.cur {
    background-color: #59B779;
}

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

.recordsTop ul li a {
    display: flex;
    width: 100%;
    height: 100%;
    color: #333;
    align-items: center;
    justify-content: center;
}

.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: 42px;
    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: 42px;
    text-align: center;
}

.recordsTopa {
    width: 100%;
    height: 35px;
}

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

.recordsTopa ul li {
    width: 30%;
    height: 100%;
    margin-right: 10px;
    background: #fff;
    border-radius: 25px;
}

.recordsTopa ul li a {
    display: flex;
    width: 100%;
    height: 100%;
    color: #333;
    align-items: center;
    justify-content: center;
}

.recordsTopa ul li a img {
    width: 20px;
    height: auto;
    margin-right: 3px;
}

.recordsTopa ul li.cur {
    background-color: #59B779;
}

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

.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;
    padding: 12px;
    background-color: #F8F9FD;
    border-radius: 8px;
    min-height: 70px;
    margin-top: 12px;
}

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

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

.recordLiTop label {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    margin-right: 8px;
    padding: 10px;
    background: #59B779;
    border-radius: 6px;
}

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

.recordLiSpan span:last-child {
    color: #999999;
    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: #59B779;
    font-size: 18px;
}

.recordTxt .recordErr {
    color: #E84335;
}

.detail-warp {
    width: 100%;
    padding: 10px 4%;
    background: #fff;
    z-index: 1;
    position: relative;
}

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

.detail-warp p {
    margin-bottom: 10px;
}

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

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

.rechargeCon {
    width: 100%;
    padding: 0 15px;
    display: none;
}

.rechargeCon .recharge-amount {
    border-top: 1px dashed #ccc;
    padding: 5px 0 0;
}

.rechargeCon h3 {
    width: 100%;
    height: auto;
    display: inline-block;
    font-size: 14px;
    font-weight: 600;
    color: #3F6CDF;
}

.rechargeCon span {
    width: 100%;
    height: auto;
    display: inline-block;
    font-size: 12px;
    color: #999;
}

.cur .rechargeCon {
    display: block;
}

.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: -16px;
    width: 72px;
    /*top: -32px;*/
    /*width: 136px;*/
    height: auto;
}

.levelDetailHead {
    width: 100%;
    background-color: #fff;
    padding-top: 20px;
    border-top-right-radius: 25px;
    border-top-left-radius: 25px;
    position: relative;
    margin-top: -30px;
    z-index: 1;
}

.levelDetailHead h3 {
    width: 100%;
    font-size: 20px;
    padding: 0 4%;
}

.vipHead {
    width: 100%;
    padding: 0 4% 0;
}

.vipHead .vip-slide {
    margin-top: 12px;
    padding: 15px;
    border-radius: 8px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    background: #F7F9FC;
}

.vipBgTxt {
    width: calc(100% - 70px);
    height: auto;
}

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

.vipBgTxt h2 {
    width: 100%;
    font-size: 20px;
    color: #333;
    font-weight: 600;
}

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

.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: rgba(0, 0, 0, 0.85);
    font-weight: 400;
}

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

.officialHead-img {
    width: 45px;
    height: 45px;
    border-radius: 50px;
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    right: 12px;
    top: 5px;
}

.officialHead img {
    width: 22px;
    height: auto;
}

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

.official-list li {
    width: 100%;
    border-radius: 8px;
    box-shadow: 0 0 5px rgba(54, 41, 183, 0.07);
    padding: 12px;
    background-color: #fff;
    margin-bottom: 15px;
    position: relative;
}

.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;
}

.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: #999;
    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;
}

.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: auto;
    position: absolute;
    top: 12px;
    right: 12px;
    font-size: 12px;
}

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

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

.official-bottom p {
    color: #999;
    margin-top: 5px;
    margin-bottom: 5px;
}

.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: 24%;
    height: 50px;
    width: 50px;
    text-align: center;
    border-radius: 50%;
}

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

.official-mask {
    width: 92%;
    background: #59B779;
    border-radius: 20px;
    padding: 15px 5%;
    position: relative;
}

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

.official-mask-tit {
    width: 100%;
    font-size: 18px;
    margin-bottom: 15px;
    position: relative;
    color: #fff;
}

.official-mask-txt {
    width: 100%;
    text-align: left;
    font-size: 15px;
    color: #999;
    background: #fff;
    border-radius: 8px;
    padding: 8px;
}

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

.message-list {
    width: 100%;
    margin: 0 auto;
}

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

.message-list li {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 12px;
    padding: 12px;
    background: #fff;
    border-radius: 8px;
}

.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;
}

.message-list li dl dd {
    width: 100%;
    color: #999;
    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: 15px;
    position: relative;
    margin-top: -50px;
}

.infoLogo {
    width: 90px;
    height: 90px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: -40px auto 0;
}

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

.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: #333;
}

.info-top dl dd {
    width: 60%;
    font-size: 13px;
    line-height: 18px;
    color: #999;
    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;
}

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

.official-tabel-txt textarea {
    width: 100%;
    border: 1px solid #E5E5E5;
    border-radius: 10px;
    padding: 12px;
    height: 150px;
    background: #fff;
}

.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: 92%;
    margin: 0 auto;
    text-align: right;
}

.gift img {
    width: 100px;
    height: auto;
}

.giftCon {
    width: 92%;
    margin: 36px auto;
    border-radius: 8px;
    background: #fff;
    padding: 15px;
    position: relative;
}

.giftCon img {
    display: block;
    width: 70px;
    height: 70px;
    margin: -52px auto 0;
}

.giftCon input {
    width: 100%;
    font-size: 14px;
    border: 1px solid #ccc;
    height: 40px;
    border-radius: 8px;
    padding: 3px 6px;
}

.giftMask {
    width: 70%;
    padding: 12px 4%;
    position: relative;
    background: #1D212F;
    border-radius: 8px;
}

.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: 24px;
    align-items: center;
    justify-content: center;
}

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

.giftMask .giftMaskTxt {
    width: 100%;
    height: 45px;
    color: #fff;
    font-size: 36px;
    margin-top: 15px;
    background: #59B779;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.giftMask .giftMaskTxt h3 {
    width: 100%;
    font-size: 18px;
    color: #59B779;
    font-weight: 600;
    margin-top: 12px;
}

.giftMask .giftMaskTxt h3 span {
    font-size: 22px;
    margin-left: 5px;
}

.giftMask .giftMaskTxt p {
    font-size: 14px;
    color: rgba(0, 0, 0, 0.65);
    line-height: 20px;
    width: 70%;
    margin: 0 auto;
}

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


.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: #fff;
    border: 1px solid #ddd;
}

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

.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: #59B779;
    justify-content: center;
}

.mineMainTar {
    width: 100%;
    height: 85px;
    margin-top: 12px;
    padding: 12px;
    background: url("../images/v_bg.png") no-repeat;
    background-size: contain;
    position: relative;
    z-index: 111;
}

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

.mineMainTarBd {
    color: #FFDBB4;
    font-size: 10px;
    margin-top: 5px;
}