body, html {
    background: url(../images/body_bg.png) repeat-y center;
    background-size: 100%;
}

.premium_gift_bag .activity-box, .user-message, .news-message {
    font-family: 'Microsoft JhengHei', Arial, Helvetica, sans-serif !important;
}

.flex {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}

/* poo */

.mask {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    z-index: 1;
    width: 100%;
    height: 100vh;
    background: #000;
    opacity: 0.7;
}

.close-btn {
    position: absolute;
    right: 0rem;
    top: 0;
    width: 0.5rem;
    height: 0.5rem;
    background: url(../images/close-btn.png) no-repeat center;
    transition: transform 0.5s ease;
    cursor: pointer;
}

.close-btn:hover {
    transform: rotate(180deg);
}

.pop {
    display: none;
    position: fixed;
    left: 0;
    top: 0;
    z-index: 99;
    width: 100%;
    height: 100%;
}

.pop-main {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    z-index: 999;
    max-height: 63vh;
    max-width: 8rem;
    overflow: hidden;
    background: #1a0410;
    padding: 0 0 0.2rem 0;
    box-sizing: border-box;
    background-size: contain;
    border: 1px solid #f7cb46;
}

.pop-h3 {
    height: 0.58rem;
    line-height: 0.58rem;
    width: 100%;
    text-align: center;
    font-size: 0.28rem;
    color: #fff;
    padding: 0 0.5rem;
    background: -moz-linear-gradient(top, #c83031, #a32229, #6b0f1d);
    background: -webkit-linear-gradient(top, #c83031, #a32229, #6b0f1d);
    background: -o-linear-gradient(top, #c83031, #a32229, #6b0f1d);
    background: -ms-linear-gradient(top, #c83031, #a32229, #6b0f1d);
    background: linear-gradient(to bottom, #c83031, #a32229, #6b0f1d);
}

.pop-con {
    width: 104%;
    height: 60vh;
    padding: 0.2rem 0.2rem 0.4rem;
    overflow: auto;
}

.pop-img {
    width: 7.56rem;
}

.pop-img img {
    width: 100%;
}

.pop-text {
    color: #fff;
    line-height: 0.34rem;
    margin-top: 0.2rem;
}

/*em  pop */

.floating {
    position: fixed;
    top: 40%;
    left: 0;
    margin-top: -3.3rem;
    background: url(../images/floating.png) no-repeat center;
    width: 3.09rem;
    height: 6.58rem;
    z-index: 999;
    background-size: contain;
    padding: 1rem 0.6rem 0 0.3rem;
}

.floating_con {}

.stored-but {
    width: 100%;
    height: 0.44rem;
    margin-bottom: 0.4rem;
    height: 2.2rem;
}

.dow-box button {
    display: block;
    width: 100%;
    height: 0.44rem;
    margin-bottom: 0.07rem;
    cursor: pointer;
}

.wrapper {
    width: 100%;
    position: relative;
}

.wrapper .wrapper_bg {
    content: '';
    display: block;
    position: absolute;
    width: 11.1rem;
    margin: auto;
    top: 0.06rem;
    left: 0;
    right: 0px;
    height: auto;
    bottom: 0.06rem;
    border-radius: 0 0 20px 20px;
    z-index: 1;
    background: url(../images/con_bg.jpg) repeat-y;
    background-size: contain;
}

.wrapper .wrapper_bg::after {
    content: '';
    display: block;
    position: absolute;
    top: 5.06rem;
    left: 0px;
    right: 0px;
    bottom: 0px;
    margin: auto;
    border-radius: 0 0 20px 20px;
    border: 0.05rem solid darkgoldenrod;
    /* z-index: 1; */
}

.banner {
    width: 100%;
    height: 37vw;
    background: url(../images/banner01.png) no-repeat top center;
    background-size: 100%;
    position: relative;
    z-index: 33;
}

@media (max-width:800px) {
    .banner {
        margin-bottom: 7vw;
    }
}

.loadingpage {
    width: 100%;
    /* height: inherit; */
    top: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    position: fixed;
    z-index: 100;
}

.loadingpage img {
    display: block;
    margin: 0 auto;
}

.con {
    width: 11.1rem;
    margin: -1.1rem auto 1rem;
    left: 0;
    right: 0;
    position: relative;
    z-index: 40;
}

.nav {
    background-image: url(../images/nav_bg.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    margin: auto;
    width: 10.9rem;
    height: 1.59rem;
}

.nav ul {
    padding-top: 0.59rem;
    padding-left: 1.3rem;
}

.nav ul li {
    float: left;
    height: 0.68rem;
    line-height: 0.68rem;
    font-size: 0.38rem;
    width: 1.8rem;
    color: #fff;
    margin: 0 0.01rem;
    background-repeat: no-repeat;
    background-position: center;
    cursor: pointer;
}

.nav ul li.act {
    background-color: #804f1bab;
}

.nav ul li:nth-child(1) {
    width: 1.3rem;
    /* background-image: url(../images/nav01.png); */
}

.nav ul li:nth-child(2) {
    /* background-image: url(../images/nav02.png); */
}

.nav ul li:nth-child(3) {
    width: 1.75rem;
    /* background-image: url(../images/nav03.png); */
}

.nav ul li:nth-child(4) {
    width: 1.68rem;
    /* background-image: url(../images/nav04.png); */
}

.nav ul li:nth-child(5) {
    width: 1.6rem;
    /* background-image: url(../images/nav05.png); */
}

.nav ul li a {
    display: block;
    width: 100%;
    height: 100%;
    text-align: center;
    color: #fff;
    font-weight: bold;
    text-shadow: 0.1em 0.04em 0.1em #000;
    -moz-text-stroke: 0.6px #75340d;
    -webkit-text-stroke: 0.6px #75340d;
    -o-linear-text-stroke: 0.6px #75340d;
    -ms-linear-text-stroke: 0.6px #75340d;
}

.stored_value_title {
    display: block;
    width: 8rem;
    margin: 0 auto;
}

.choose_list {
    width: 100%;
    margin: 0 auto 0.6rem;
    background: url(../images/choose_list_bg.png) no-repeat bottom center;
    padding-bottom: 0.3rem;
    background-size: 91%;
}

.choose_list ul {}

.choose_list ul li {
    width: 2.66rem;
    height: 2.81rem;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    cursor: pointer;
}

.choose_list ul li.choose_list_01 {
    background-image: url(../images/choose_list_01.png);
}

.choose_list ul li.choose_list_02 {
    background-image: url(../images/choose_list_02.png);
}

.choose_list ul li.choose_list_03 {
    background-image: url(../images/choose_list_03.png);
}

.choose_list ul li.choose_list_04 {
    background-image: url(../images/choose_list_04.png);
}

.choose_list ul li.choose_list_01.act {
    background-image: url(../images/choose_list_on_01.png);
}

.choose_list ul li.choose_list_02.act {
    background-image: url(../images/choose_list_on_02.png);
}

.choose_list ul li.choose_list_03.act {
    background-image: url(../images/choose_list_on_03.png);
}

.choose_list ul li.choose_list_04.act {
    background-image: url(../images/choose_list_on_04.png);
}

.choose_list ul li.choose_list_05 {
    background-image: url(../images/choose_list_05.png);
}

.choose_list ul li.choose_list_05.act {
    background-image: url(../images/choose_list_on_05.png);
}

.choose_list ul li.choose_list_06 {
    background-image: url(../images/choose_list_06.png);
}

.choose_list ul li.choose_list_06.act {
    background-image: url(../images/choose_list_on_06.png);
}

.choose_list ul li.choose_list_07 {
    background-image: url(../images/choose_list_07.png);
}

.choose_list ul li.choose_list_07.act {
    background-image: url(../images/choose_list_on_07.png);
}

.choose_list ul li.choose_list_08 {
    background-image: url(../images/choose_list_08.png);
}

.choose_list ul li.choose_list_08.act {
    background-image: url(../images/choose_list_on_08.png);
}

.choose_list ul li.choose_list_09 {
    background-image: url(../images/choose_list_09.png);
}

.choose_list ul li.choose_list_09.act {
    background-image: url(../images/choose_list_on_09.png);
}

.premium_gift_bag {
    width: 80%;
    margin: auto;
    border: 4px solid #7e6b5a;
    border-radius: 14px;
    overflow: hidden;
    background-color: #fff9e2;
    padding-bottom: 0.4rem;
    /* display: none; */
}

.premium_gift_bag .trading_p {
    font-size: 0.2rem;
}

/* p_02 */

.p_g_b_h3 {
    width: 100%;
    background: url(../images/p_g_b_h3.png) no-repeat center;
    height: 0.5rem;
    line-height: 0.5rem;
    padding: 0 0.2rem;
    font-weight: bold;
    font-size: 0.2rem;
    letter-spacing: 2px;
    color: #542011;
}

.p_g_b_p {
    width: 80%;
    margin: 0.2rem auto;
    color: #651a13;
}

.p_g_b_h4 {
    width: 100%;
    text-align: center;
    margin: 0.28rem 0;
}

.p_g_b_h4 h4 {
    height: 0.56rem;
    line-height: 0.56rem;
    position: relative;
    display: inline-block;
    font-size: 0.27rem;
    color: #651a13;
    letter-spacing: 2px;
}

.p_g_b_h4 h4::after {
    content: '';
    display: block;
    position: absolute;
    width: 1.58rem;
    height: 100%;
    top: 0rem;
    left: -1.66rem;
    margin: auto;
    z-index: 1;
    background: url(../images/h4_l.png) no-repeat;
    background-size: contain;
}

.p_g_b_h4 span {
    font-size: 12px;
    color: black;
}

.p_g_b_h4 h4::before {
    content: '';
    display: block;
    position: absolute;
    width: 0.46rem;
    height: 0.2rem;
    right: -0.5rem;
    bottom: 0;
    margin: auto;
    z-index: 1;
    background: url(../images/h4_r.png) no-repeat;
    background-size: contain;
}

.surprise_list {
    width: 7.5rem;
    margin: 0 auto 0.5rem;
    border: 2px solid #b7771c;
    border-radius: 14px;
    overflow: hidden;
    background: #fef8ed;
}

.surprise_list ul {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: center;
    /* align-items: center; */
}

.surprise_list ul li {}

.surprise_list ul li:nth-child(1) {
    width: 70%;
    border-right: 2px solid #b7771c;
}

.surprise_list ul li:nth-child(2) {
    width: 30%;
}

.surprise_list ul li .surprise_list_t {
    width: 100%;
    display: inline-block;
    height: 0.44rem;
    line-height: 0.44rem;
    font-size: 0.2rem;
    text-align: center;
    background-color: #e2c591;
    color: #651a13;
}

.surprise_list ul li .surprise_list_t strong {
    position: relative;
}

.surprise_list ul li .surprise_list_t strong span::after {
    content: '';
    display: block;
    position: absolute;
    width: 0.37rem;
    height: 0.34rem;
    top: -0.04rem;
    left: -0.46rem;
    margin: auto;
    z-index: 1;
    background: url(../images/stars.png) no-repeat;
    background-size: contain;
}

.surprise_list ul li .surprise_list_l {
    padding: 0.2rem 0.44rem;
}

.surprise_list_r {
    padding: 0.2rem 0.1rem;
}

.surprise_list_r img {
    width: 1.48rem;
    height: 1.52rem;
    margin: auto;
    display: block;
}

.gift_list {
    width: 7.5rem;
    margin: 0 auto 0.5rem;
    border: 2px solid #b7771c;
    border-radius: 14px;
    overflow: hidden;
    background: #fef8ed;
}

.gift_list_t {
    background-color: #e2c591;
    color: #651a13;
}

.gift_list_t strong {
    display: inline-block;
    height: 0.44rem;
    line-height: 0.44rem;
    text-align: center;
    width: 35%;
}

.gift_list_t strong:nth-child(1) span {
    position: relative;
}

.gift_list_t strong:nth-child(1) span::after {
    content: '';
    display: block;
    position: absolute;
    width: 0.37rem;
    height: 0.34rem;
    top: -0.08rem;
    left: -0.46rem;
    margin: auto;
    z-index: 1;
    background: url(../images/stars.png) no-repeat;
    background-size: contain;
}

.gift_list ul {}

.gift_list ul li {
    color: #651a13;
    font-size: 0.15rem;
    align-items: inherit;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}

.gift_list ul li .gift_list_l, .gift_list ul li .gift_list_r {
    padding: 0.2rem 0.44rem;
}

.gift_list ul li .gift_list_r {
    width: 35%;
}

.gift_list_t strong:nth-child(1), .gift_list ul li .gift_list_l {
    width: 100%;
    /* border-right: 2px solid #b7771c; */
}

.gift_list_r img {
    width: 1.48rem;
    height: 1.52rem;
    margin: auto;
    display: block;
}

.premium_gift_but {
    margin-top: 0.2rem;
}

.premium_gift_but button {
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}

.but_add, .but_reduction {
    width: 0.3rem;
    height: 0.3rem;
    margin: 0 0.06rem;
}

.but_add {
    background-image: url(../images/but_add.png);
}

.but_input {
    width: 0.58rem;
    height: 0.23rem;
    background-color: #fbe9c8;
    border: 1px solid #b0670f;
    border-radius: 0.08rem;
}

.but_reduction {
    background-image: url(../images/but_reduction.png);
}

.but_buy {
    background-image: url(../images/but_buy.png);
    width: 0.77rem;
    height: 0.34rem;
}

/* em p_02 */

/* p_04 */

.but_details {
    display: block;
    width: 1.28rem;
    height: 0.74rem;
    background: url(../images/but_details.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}

/* em p_04 */

/* p_01 */

.money_list {
    width: 7.65rem;
    margin: auto;
}

.money_list ul {}

.money_list ul li {
    width: 100%;
    height: 0.74rem;
    background: url(../images/money_list_bg.png) no-repeat center;
    background-size: contain;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    color: #fff;
    margin-bottom: 0.2rem;
    position: relative;
}

.money_title_box {
    display: flex;
}

@media screen and (max-width: 800px) {
    .money_list ul li {
        justify-content: space-between;
        padding: 1vw;
    }
}

.money_list ul li img {
    width: 1.04rem;
}

@media screen and (max-width: 359px) {
    .money_list ul li img {
        width: 0.6rem !important;
        height: 0.3rem;
        align-self: center;
    }
}

.money_list ul li p {
    position: relative;
    width: 4.3rem;
    margin: 0 0.2rem;
    font-size: 0.3rem;
    white-space: nowrap;
    overflow-x: hidden;
}

@media screen and (max-width: 320px) {
    .money_list ul li p {
        width: 3.5rem;
    }
}

/* .money_list .money_title_box {
    display: flex;
} */

.money_list ul li button {
    width: 1.6rem;
    height: 0.64rem;
    background: url(../images/money_list_but.png) no-repeat center;
    font-size: 0.3rem;
    background-size: contain;
    font-weight: 100;
}

@media screen and (width: 1024px) {
    .money_list ul li button {
        width: 2.4rem;
    }
}

.money_list ul li button span {
    font-size: 0.1rem;
}

.money_list ul li em.grade {
    content: '';
    display: block;
    position: absolute;
    width: 2rem;
    height: 0.5rem;
    line-height: 0.5rem;
    top: -0.02rem;
    right: 1.6rem;
    padding-left: 0.3rem;
    margin: auto;
    background: url(../images/grade01.png) no-repeat;
    background-size: contain;
    text-align: center;
    font-style: inherit;
    color: #02354e;
}

@media screen and (max-width: 800px) {
    .money_list ul li div.chp, .money_list ul li em.grade {
        right: 22% !important;
        opacity: 0.85;
    }
}

@media screen and (width: 768px) {
    .money_list ul li em.grade {
        right: 13vw !important;
    }
}

@media screen and (max-width: 320px) {
    .money_list ul li div.chp, .money_list ul li em.grade {
        right: 26% !important;
    }

    .money_list ul li p {
        margin: 0 0.05rem;
        font-size: 0.25rem;
    }
}

@media screen and (min-width: 800px) {
    .money_list ul li div.chp, .money_list ul li em.grade {
        opacity: 0.85;
    }
}

.money_list ul li div.chp {
    content: '';
    display: block;
    position: absolute;
    width: 1.553rem;
    height: 0.7rem;
    line-height: 0.5rem;
    /* top: -0.1rem; */
    right: 1.6rem;
    padding-left: 0.3rem;
    margin: auto;
    /* background: url(../images/chp50.png) no-repeat; */
    background-size: cover;
    text-align: center;
    font-style: inherit;
    color: #02354e;
}

.chp span {
    position: absolute;
    top: 0.2rem;
    left: 0.4rem;
    text-align: center;
    right: 0;
    margin: auto;
    font-size: 0.25rem;
    color: #fff4aa;
    /* -webkit-text-stroke: 1px black;  */
    text-shadow: -1px -1px 0 #4e1800, 1px -1px 0 #4e1800, -1px 1px 0#4e1800, 1px 1px 0 #4e1800;
}

.money_list ul li em.dragon {
    content: '';
    display: block;
    position: absolute;
    width: 1.553rem;
    height: 0.7rem;
    line-height: 0.5rem;
    top: -0rem;
    right: 1.6rem;
    padding-left: 0.3rem;
    margin: auto;
    background: url(../images/chp50.png) no-repeat;
    background-size: cover;
    text-align: center;
    font-style: inherit;
    color: #02354e;
}

.money_list ul li em span {
    position: relative;
    font-size: 0.2rem;
}

.money_list ul li em span::after {
    content: '';
    display: block;
    position: absolute;
    top: 0rem;
    left: -0.3rem;
    width: 0.29rem;
    height: 0.24rem;
    background: url(../images/grade01_ico.png) no-repeat;
    background-size: contain;
}

.money_list ul li em.g02 {
    background: url(../images/grade02.png) no-repeat;
    background-size: contain;
    color: #363636;
}

.money_list ul li em.g03 {
    background: url(../images/grade03.png) no-repeat;
    background-size: contain;
    color: #382701;
}

.money_list ul li em.g02 span::after {
    background: url(../images/grade02_ico.png) no-repeat;
    background-size: contain;
}

.money_list ul li em.g03 span::after {
    background: url(../images/grade03_ico.png) no-repeat;
    background-size: contain;
}

.p_01 .gift_list {
    margin: 0 auto;
}

.p_01 .gift_list ul li {
    color: #000;
}

.p_01 .gift_list ul li:nth-child(even) {
    background-color: #fbe9c8;
}

.p_01 .gift_list ul li .gift_list_p {
    font-size: 0.2rem;
    width: 90%;
}

.p_01 .gift_list ul li .gift_list_p span {
    color: #ac0d31;
    font-size: 0.12rem;
}

.p_01 .gift_list ul li .gift_list_p em {
    color: #65b3ef;
    font-size: 0.12rem;
    display: block;
    font-style: initial;
}

.gift_list_rodio {
    width: 0.18rem;
    height: 0.18rem;
    width: 10%;
}

.p_01 .gift_list ul li .gift_list_l {
    padding: 0.1rem 0.1rem;
}

.p_01 .gift_list ul li .gift_list_r {
    font-weight: bold;
    text-align: center;
}

.p_g_b_p2 {
    width: 75%;
    font-size: 0.14rem;
    margin: 0 auto 0.2rem;
    color: #783929;
}

.invoice_list {
    width: 80%;
    margin: auto;
    padding-bottom: 0.4rem;
    font-size: 0.16rem;
    color: #783929;
}

.member-input {}

.invoice_list .textarea_input {
    padding: 0 0.05rem;
}

@media screen and (max-width: 500px) {
    .invoice_list_textarea {
        display: block !important;
    }

    .textarea_input {
        padding: 0;
        width: 100% !important;
        margin: auto;
    }

    .textarea_input textarea {
        width: 100% !important;
    }

    .invoice_list_r input {
        width: 100%;
    }

    .service_but_box {
        margin: auto;
    }
}

.member-input li {
    display: flex;
    /* flex-direction: row; */
    /* justify-content: center; */
}

.member-input li strong, .textarea_title {
    width: 1.8rem;
    display: inline-block;
    font-weight: bold;
    text-align: right;
}

.invoice_list_l {
    width: 6%;
}

.invoice_list_l input {
    width: 0.22rem;
    height: 0.22rem;
}

.invoice_list_r {
    width: 94%;
}

.invoice_list_r input {
    background-color: #fbe9c8;
    border: 1px solid #b0670f;
    border-radius: 0.06rem;
}

.invoice_list_r input.inp01 {
    width: 1.12rem;
}

.invoice_list_r input.inp02 {
    width: 0.6rem;
}

.invoice_list_r input.inp03 {
    width: 3rem;
    /* background-color: #fff; */
}

.invoice_list_r input.inp04 {
    width: 2.6rem;
}

.invoice_list_r p {
    padding-bottom: 0.06rem;
}

.i_l_blue {
    color: #65b3ef;
    font-size: 0.1rem;
}

.i_l_span {
    font-size: 0.1rem;
}

.confirm_list {
    font-size: 0.12rem;
    color: #651a13;
    width: 5.9rem;
    margin: auto;
    border: 2px solid #b0670f;
    border-radius: 14px;
    overflow: hidden;
    background: #fef8ed;
    font-weight: bold;
}

.confirm_list table {
    font-weight: bold;
    font-size: 0.12rem;
    color: #651a13;
    width: 100%;
}

.confirm_list table tr {
    height: 0.8rem;
}

.confirm_list table tr:nth-child(even) {
    background-color: #fbe9c8;
}

.confirm_list table tr td {
    height: 0.4rem;
    line-height: 0.4rem;
    font-size: 0.2rem;
}

.confirm_list table tr td:nth-child(1) {
    text-align: center;
    width: 30%;
    border-right: 2px solid #b0670f;
}

.confirm_list table tr td:nth-child(2) {
    width: 70%;
    padding-left: 0.2rem;
}

.trading_but {
    width: 1.94rem;
    height: 0.63rem;
    background: url(../images/trading_but.png) no-repeat center;
    background-size: cover;
    margin: 0.32rem auto 0.24rem;
    display: block;
}

.trading_p {
    font-size: 0.12rem;
    color: #651a13;
    width: 7.65rem;
    margin: auto;
    text-align: center;
}

/* em p_01 */

/* p_03 */

.serial_number {
    width: 6.46rem;
    margin: 0 auto 0.2rem;
}

.serial_number_show {
    display: none;
}

.serial_number_a {
    width: 6.46rem;
    height: 0.64rem;
    display: block;
    background: url(../images/serial_number01.png) no-repeat;
    background-size: contain;
}

.serial_number_a.s_n02 {
    background: url(../images/serial_number02.png) no-repeat;
    background-size: contain;
}

.serial_number_a.s_n03 {
    background: url(../images/serial_number03.png) no-repeat;
    background-size: contain;
}

.serial_number_a.s_n04 {
    background: url(../images/serial_number04.png) no-repeat;
    background-size: contain;
}

.serial_number_a.s_n05 {
    background: url(../images/serial_number05.png) no-repeat;
    background-size: contain;
}

.serial_number_a.s_n06 {
    background: url(../images/serial_number06.png) no-repeat;
    background-size: contain;
}

.serial_number_a.s_n07 {
    background: url(../images/serial_number07.png) no-repeat;
    background-size: contain;
}

.serial_number_p {
    width: 90%;
    margin: auto;
    height: 0.44rem;
    line-height: 0.44rem;
    background: url(../images/peach.png) no-repeat left center;
    padding-left: 0.3rem;
    color: #651a13;
    font-weight: bold;
    font-size: 0.2rem;
}

.serial_number_box {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}

.serial_n_l {
    width: 54%;
    text-align: right;
}

.serial_n_l p {
    padding: 0.04rem;
    display: flex;
}

.serial_n_l input {
    background-color: #fbe9c8;
    border: 1px solid #b0670f;
    border-radius: 0.04rem;
    padding: 0 0.2rem;
}

.serial_n_r {
    width: 30%;
}

.serial_n_r a {
    width: 1.25rem;
    height: 0.49rem;
    display: block;
    margin: auto;
    background: url(../images/stored_sub.png) no-repeat;
    background-size: contain;
}

.serial_number_p2 {
    color: #651a13;
    text-align: center;
    padding: 0.06rem 0 0;
    font-size: 0.14rem;
}

/* em p_03 */

/* index */

.head-banner {
    z-index: 100;
    position: relative;
    width: 9.9rem;
    height: 3.6rem;
    margin: 0 auto;
    overflow: hidden;
    border: 7px solid #986606;
}

.head-banner .swiper-container {
    width: 100%;
    height: 100%;
}

.head-banner .swiper-slide {
    position: relative;
}

.head-banner .slide-title {
    position: absolute;
    width: 485px;
    padding-top: 220px;
    background-position: center;
    background-repeat: no-repeat;
    bottom: -22px;
    left: -80px;
}

.head-banner img {
    /* opacity: 0; */
    /* display: none; */
    border-radius: 2px;
    width: 100%;
}

.head-banner .swiper-slide-active img {
    display: block;
    opacity: 1;
}

.head-banner i {
    opacity: 0;
    transform: translate(100px, 0);
}

.head-banner .slide2 i, .head-banner .slide4 i {
    transform: translate(-100px, 0);
    left: 236px;
}

.head-banner .swiper-slide-active i {
    transition: all 2s;
    transform: translate(0px, 0);
    opacity: 1;
}

.head-banner .swiper-container-horizontal>.swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction {
    bottom: 18px;
    left: 0;
    text-align: right;
    width: 100%;
    position: relative;
}

.head-banner .swiper-pagination-bullet {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    border: 2px solid #986606;
    opacity: 0.8;
    /* background: none; */
}

.message {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    margin-top: 0.2rem;
}

.user-message, .news-message {
    width: 4.9rem;
    height: 3.85rem;
    border: 7px solid #986606;
}

.user-message {
    margin-right: 0.1rem;
    font-family: 'Microsoft JhengHei', Arial, Helvetica, sans-serif !important;
}

.already-login {
    width: 100%;
    height: 100%;
    display: none;
}

.my-magazine, .cards-magazine {
    width: 50%;
    height: 100%;
    background-position: center;
    padding-top: 0.26rem;
    background-repeat: no-repeat;
    position: relative;
    background-size: contain;
    background-image: url(../images/cards-bg.png);
}

.my-magazine {
    font-size: 0.2rem;
}

.cards-magazine {}

.my-magazine h3, .cards-magazine h3 {
    font-size: 0.32rem;
    text-align: center;
    line-height: normal;
    font-weight: bold;
    background: none;
    background-color: #f79b0d;
    background-image: linear-gradient(277deg, #54062e, #ff478c);
    background-image: -moz-linear-gradient(277deg, #54062e, #ff478c);
    background-image: -webkit-linear-gradient(277deg, #54062e, #ff478c);
    background-image: -o-linear-gradient(277deg, #54062e, #ff478c);
    background-image: -ms-linear-gradient(277deg, #54062e, #ff478c);
    -webkit-background-clip: text;
    color: transparent;
    letter-spacing: 0.03rem;
}

.my-name, .my-num {
    text-align: center;
    margin: 0.08rem auto;
}

.my-name {
    position: relative;
    padding-bottom: 0.08rem;
}

.my-name::after {
    content: '';
    display: block;
    position: absolute;
    bottom: 0px;
    left: 0;
    right: 0;
    margin: auto;
    height: 1px;
    background: #e8aa14;
    width: 80%;
}

.my-name span, .my-num span {
    color: #e72f52;
}

.my-name em, .my-num em {
    color: #3975ef;
    font-style: inherit;
}

.my-time {
    word-break: break-all;
    width: 80%;
    margin: auto;
    /* padding: 0px 0.2rem; */
    color: #fff;
    font-size: 12px;
    background: #351a0a;
    border: 3px solid #986606;
    /* border-radius: 8px;*/
}

.message-but {
    background: url(../images/money_list_but.png) no-repeat center;
    background-size: contain;
    color: #fff;
    width: 1.2rem;
    height: 0.45rem;
    line-height: 0.45rem;
    position: absolute;
    margin: 0 auto;
    left: 0;
    right: 0;
    bottom: 0.16rem;
}

.cards-magazine-list {
    background: #fff;
    border: 1px solid #e7af42;
    border-radius: 8px;
    width: 84%;
    padding: 0 0.06rem;
    margin: 0.177rem auto;
}

.progress h4 {
    position: relative;
}

.progress h4 span {
    position: absolute;
    right: 0;
    top: 0;
    border: 1px solid #cd870e;
    border-radius: 6px;
    width: 22px;
    font-size: 12px;
    height: 20px;
    line-height: 20px;
    background: #fffae2;
    text-align: center;
    display: block;
    cursor: pointer;
}

.progress {
    width: 100%;
    margin: 0.06rem 0;
}

.progress-t {}

.progress-c {
    position: relative;
    width: 1.62rem;
    height: 0.28rem;
    background: url(../images/progress-no.png) no-repeat;
    z-index: 3;
    background-size: contain;
    margin: 0 auto;
    /* top: 52%;*/
}

.progress-in {
    width: 40%;
    height: 100%;
    max-width: 1.62rem;
    position: absolute;
    top: 0;
    background-size: cover;
    z-index: 2;
    overflow: hidden;
}

.progress-in::after {
    content: ' ';
    display: block;
    width: 1.62rem;
    height: 0.28rem;
    background: url(../images/progress-y.png) no-repeat;
    position: absolute;
    top: 0;
    background-size: contain;
    z-index: 2;
    overflow: hidden;
}

.progress-num {
    position: absolute;
    top: 0;
    left: 0.06rem;
    display: block;
    background-size: cover;
    z-index: 4;
    color: #6d2400;
    font-size: 12px;
    height: 0.28rem;
    line-height: 0.28rem;
}

.progress-b {}

.progress-t, .progress-b {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}

.progress-t span, .progress-b span {
    /* width: 30%; */
    text-align: center;
    font-size: 12px;
}

.progress-t span.act, .progress-b span.act {
    color: #f58705;
}

.cards-box {
    width: 0.6rem;
    height: 0.36rem;
    position: absolute;
    top: 0;
    right: 0;
}

.cards-box span {
    position: absolute;
    right: 0;
    top: 0;
    border: 1px solid #cd870e;
    border-radius: 6px;
    width: 0.4rem;
    font-size: 0.2rem;
    height: 0.34rem;
    line-height: 0.34rem;
    background: #fffae2;
    text-align: center;
    display: block;
    cursor: pointer;
}

.not-login {
    width: 100%;
    height: 100%;
    display: block;
    padding: 0.16rem;
    position: relative;
}

.login-prompt {
    position: absolute;
    width: 3.32rem;
    height: 0.99rem;
    background: url(../images/indicate.png) no-repeat center;
    background-size: contain;
    top: 0.7rem;
    right: -2.96rem;
    z-index: 99;
    animation-name: plus;
    animation-duration: 1s;
    animation-timing-function: linear;
}

@keyframes plus {
    from {
        width: 2.822rem;
        height: 0.792rem;
    }

    to {
        width: 3.32rem;
        height: 0.99rem;
    }
}

.login-prompt button {
    display: inline-block;
    position: absolute;
    top: 0;
    right: 0;
    width: 0.4rem;
    height: 0.4rem;
}

.login-title {
    font-size: 0.28rem;
    width: 100%;
    text-align: center;
    padding: 0 0 0.12rem;
    line-height: initial;
    background-color: #fff0bd;
    font-weight: bold;
    background-image: linear-gradient(277deg, #fff0bd, #ffc761);
    background-image: -moz-linear-gradient(277deg, #fff0bd, #ffc761);
    background-image: -webkit-linear-gradient(277deg, #fff0bd, #ffc761);
    background-image: -o-linear-gradient(277deg, #fff0bd, #ffc761);
    background-image: -ms-linear-gradient(277deg, #fff0bd, #ffc761);
    -webkit-background-clip: text;
    color: transparent;
    letter-spacing: 0.03rem;
}

.logo-input {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}

.logo-input-list {}

.logo-input-list p {
    margin-bottom: 0.06rem;
    display: flex;
}

.logo-input-list span {
    font-size: 0.24rem;
    color: #f8efef;
    margin-right: 0.16rem;
}

.logo-input-list input {
    width: 2.3rem;
    height: 0.5rem;
    background: #fff;
    border-radius: 6px;
    padding-left: 0.16rem;
}

.logo-but {
    width: 1.19rem;
    height: 1.22rem;
    background: url(../images/acc-login-but.png) no-repeat center;
    background-size: contain;
    display: block;
    margin-left: 0.18rem;
}

.logo-but1 {
    width: 1.19rem;
    height: 1.22rem;
    background: url(../images/acc-login-but1.png) no-repeat center;
    background-size: contain;
    display: block;
    margin-left: 0.18rem;
}

.login-rules {
    color: #fff0bd;
    font-size: 0.16rem;
    /* width: 66%; */
    padding-left: 0.7rem;
    /* margin: auto; */
}

.login-rules p {
    margin-bottom: 0.06rem;
    display: flex;
    align-items: center;
}

.login-rules p input {}

.login-rules p a {
    display: inline-block;
    color: #ff7f8b;
}

.login-but-list {
    margin-top: 0.18rem;
}

.login-but-list p {
    font-size: 0.2rem;
    color: #fff0bd;
    display: block;
    width: 100%;
    text-align: center;
    padding: 0.08rem;
    border-top: 1px solid #795152;
}

.login-but-list button {
    width: 0.55rem;
    height: 0.55rem;
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    margin: 0 0.1rem;
}

.fb-login-but {
    background-image: url(../images/fb-login-but.png);
}

.app-login-but {
    background: url(../images/app-login-but.png);
}

.line-login-but {
    background-image: url(../images/line-login-but.png);
}

.news-message {
    position: relative;
    background: #190411ba;
}

.news-message .news-m-tab {
    border-bottom: 1px solid #f4a815;
    /* height: 0.5rem; */
    justify-content: space-around;
}

.news-message .news-m-tab button {
    color: #f9e0ab;
    width: 33%;
    height: 0.5rem;
    line-height: 0.5rem;
    text-align: center;
    cursor: pointer;
    font-size: 0.22rem;
}

.news-message .news-m-tab button.act {
    color: #ffb526;
    position: relative;
}

.news-message .news-m-tab button.act::after {
    content: '';
    display: block;
    position: absolute;
    left: 0px;
    right: 0px;
    bottom: 0px;
    margin: auto;
    height: 3px;
    background: #ffb526;
}

.news-message .news-m-tab button:hover {
    color: #ffb526;
    position: relative;
}

.news-message-con {
    display: none;
}

.n-m-1 {
    display: block;
}

.news-message .news-m-list {}

.news-message .news-m-list li {
    padding: 0 0.1rem;
}

.news-message .news-m-list li a {
    color: #d2bf97;
    display: flex;
    justify-content: space-between;
    width: 100%;
    /* padding: 0.04rem 0; */
    height: 0.36rem;
    line-height: 0.36rem;
}

.news-message .news-m-list li span {
    width: 60%;
    /* height: 0.64rem; */
    /* line-height: 0.64rem; */
    overflow: hidden;
    display: inline-block;
}

.news-message .news-m-list li em {
    /* float: right; */
    font-style: normal;
}

.news-message .news-m-page-num {
    /* background: #000; */
    /* display: inline-block; */
    padding: 0 0.6rem;
    position: absolute;
    bottom: 0.2rem;
    left: 0;
    right: 0;
    margin: auto;
}

.news-message .news-m-page-num ul {
    background: #000;
    /* display: inline-block; */
}

.news-message .news-m-page-num ul li {}

.news-message .news-m-list li.act {
    border-bottom: 1px solid #7d5154;
}

.news-message .news-m-list li.act a {
    color: #f4a815;
    /* padding: 0.08rem 0; */
}

/*
.news-message .news-m-list li:hover {
border-bottom: 1px solid #7d5154;
}

.news-message .news-m-list li:hover a {
color: #f4a815;
padding: 0.08rem 0;
} */

.news-message .news-m-page-num ul li button {
    border: none;
    outline: none;
}

.news-message .news-m-page-num ul li:first-child button, .news-message .news-m-page-num ul li:last-child button {
    background: none;
    border: 1px solid #d2bf97;
    color: #d2bf97;
    border-radius: 4px;
    /* line-height: 1; */
}

.news-message .news-m-page-num ul li:nth-child(2) button {
    display: inline-block;
    padding: 0.1rem 0.2rem;
    color: #d2bf97;
    cursor: pointer;
    background: none;
    border-radius: 4px;
    margin: 0 0.04rem;
    background: #501928;
}

.news-message .news-m-page-num ul li:nth-child(2) button.act {
    color: #fff;
    background: #eda416;
}

.news-message .news-m-page-num ul li:nth-child(2) button:hover {
    color: #fff;
    background: #e4bb6987;
}

.within-game {}

.within-game-img {
    width: 4.9rem;
    border: 7px solid #986606;
}

.within-game-img:nth-child(1) {
    margin-right: 0.1rem;
}

.within-game-img img {
    width: 100%;
}

.outside-game {
    position: relative;
    width: 9.9rem;
    height: 1.5rem;
    margin: 0.1rem auto 0;
}

.outside-game .swiper-slide {
    margin: 0rem;
}

.outside-game .swiper-slide img {
    border: 4px solid #986606;
    width: 100%;
    border-image: -webkit-linear-gradient(#986606, #ffefba, #986606, #ffefba, #986606, #ffefba, #986606) 20 20;
    border-image: -moz-linear-gradient(#986606, #ffefba, #986606, #ffefba, #986606, #ffefba, #986606) 20 20;
    border-image: -o-linear-gradient(#986606, #ffefba, #986606, #ffefba, #986606, #ffefba, #986606) 20 20;
    border-image: linear-gradient(#986606, #ffefba, #986606, #ffefba, #986606, #ffefba, #986606) 20 20;
    box-shadow: #292929 0px 0px 6px 1px;
}

.outside-game .swiper-button-next:after, .outside-game .swiper-button-prev:after {
    width: 0.4rem;
    height: 0.62rem;
    content: ' ';
}

.outside-game .swiper-button-next {
    position: absolute;
    right: -0.5rem;
}

.outside-game .swiper-button-next:after {
    background: url(../images/but-r.png) no-repeat center;
    background-size: contain;
}

.outside-game .swiper-button-prev {
    position: absolute;
    left: -0.5rem;
}

.outside-game .swiper-button-prev:after {
    background: url(../images/but-l.png) no-repeat center;
    background-size: contain;
}

.outside-game .swiper-container {
    width: 100%;
}

/* em index */

/* activity */

.activity-box {
    width: 90%;
    margin: auto;
}

.activity-box ul {}

.activity-box li {
    width: 48%;
    margin: 0 1% 3%;
    float: left;
    position: relative;
}

@media screen and (max-width: 800px) {
    .activity-box li {
        margin: 0 1% 12vw;
    }
}

.popularity.activity-box li {
    width: 48%;
    margin: 9% 1% 3%;
    float: left;
    position: relative;
}

@media screen and (max-width: 500px) {
    .activity-box li {
        margin: 0 1% 30vw;
        width: 98% !important;
    }

    .popularity.activity-box li {
        height: 75vw;
        margin: 14vw 1% 3% !important;
    }

    .popularity.activity-box li div {
        height: 76vw !important;
    }

    .popularity.activity-box li p {
        width: 50vw !important;
        height: 15vw !important;
        top: -11vw !important;
        font-size: 3.4vw !important;
    }

    .popularity.activity-box li p>span, .popularity.activity-box li p>marquee {
        position: absolute;
        bottom: 2.7vw;
        left: 0;
        right: 0;
        line-height: 100%;
        margin: auto;
        /* padding: 0; */
        /* margin: 0; */
    }

    .popularity.activity-box li p>marquee {
        width: 66% !important;
    }
}

.activity-box li p {
    position: absolute;
    z-index: 1;
    width: 1.64rem;
    height: 0.6rem;
    background: url(../images/activity-t.png) no-repeat center;
    margin: auto;
    text-align: center;
    color: #fff;
    background-size: contain;
    font-size: 0.12rem;
    padding: 0.31rem 0 0;
    position: absolute;
    left: 0;
    right: 0;
}

.popularity.activity-box li p {
    width: 3.64rem;
    height: 0.85rem;
    top: -0.5rem;
    font-size: 0.19rem;
    line-height: 0.55rem;
}

.popularity.activity-box li div img {
    border: none;
    position: absolute;
    box-shadow: none;
    width: 80%;
    text-align: center;
    left: 0;
    right: 0;
    margin: auto;
}

.popularity.activity-box li div>img:last-of-type {
    width: 100%;
    bottom: 0;
}

.popularity .img-box {
    position: relative;
}

.activity-box li div {
    width: 90%;
    padding-top: 0.4rem;
    height: 2.7rem;
    margin: auto;
}

.popularity.activity-box li div {
    height: 3.7rem;
}

@media screen and (max-width: 800px) {
    .popularity.activity-box li div {
        height: 37vw;
        padding-top: 0.4rem;
    }

    .popularity.activity-box li p {
        width: 25vw;
        height: 9vw;
        top: -6vw;
        font-size: 2vw;
        line-height: 5vw;
    }

    .popularity.activity-box li p>marquee {
        width: 79%;
    }
}

.activity-box li div img {
    width: 100%;
    border: 4px solid #986606;
    border-image: -webkit-linear-gradient(#986606, #ffefba, #986606, #ffefba, #986606, #ffefba, #986606) 20 20;
    border-image: -moz-linear-gradient(#986606, #ffefba, #986606, #ffefba, #986606, #ffefba, #986606) 20 20;
    border-image: -o-linear-gradient(#986606, #ffefba, #986606, #ffefba, #986606, #ffefba, #986606) 20 20;
    border-image: linear-gradient(#986606, #ffefba, #986606, #ffefba, #986606, #ffefba, #986606) 20 20;
    box-shadow: #292929 0px 0px 6px 1px;
}

/*em activity */

/*member*/

.service_banner {
    width: 90%;
    margin: 0.45rem auto;
}

.service_banner img {
    width: 100%;
}

.invoice_list ul li.invoice_list_textarea_li {
    justify-content: left;
}

.invoice_list_textarea textarea {
    background-color: #fbe9c8;
    border: 1px solid #b0670f;
    border-radius: 0.06rem;
    width: 4rem;
    margin-bottom: 0.06rem;
}

.invoice_list_textarea {
    display: flex;
}

.invoice_list_textarea em {
    font-style: normal;
    font-size: 0.13rem;
}

.invoice_list_textarea span {
    display: block;
    color: #65b3ef;
    font-size: 0.13rem;
}

.service_but_box .message-but {
    position: inherit;
    margin: 0.2rem 0.2rem 0;
}

.service_files {
    background: url(../images/service_files.png) no-repeat center;
    background-size: inherit;
    color: #fff;
    width: 1.1rem;
    height: 0.3rem;
    font-size: 0.13rem;
}

.personal_name {
    padding-bottom: 0.08rem;
    text-align: center;
    font-size: 0.2rem;
}

.personal_name span {
    color: #e72f52;
}

.personal_info {}

.personal_info div {
    width: 2.24rem;
    height: 0.98rem;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    margin: 0 0.2rem;
    position: relative;
}

.personal_info div:nth-child(1) {
    background-image: url(../images/personal_info.png);
}

.personal_info div:nth-child(2) {
    background-image: url(../images/personal_info2.png);
}

.personal_info div:nth-child(3) {
    background-image: url(../images/personal_info3.png);
}

.personal_info div strong {
    position: absolute;
    right: 0.1rem;
    top: 0;
    bottom: 0;
    margin: auto;
    display: block;
    height: 0.4rem;
    line-height: 0.4rem;
    width: 1rem;
    text-align: center;
    font-size: 0.16rem;
    color: #fff;
}

.member-statistics {
    width: 3.29rem;
    height: 0.46rem;
    line-height: 0.5rem;
    text-align: center;
    color: #fff;
    margin: 0.2rem auto;
    background: url(../images/member-statistics.png) no-repeat center;
    background-size: contain;
}

.cards-member-list {
    background: #fffbed;
    border: 1px solid #e7af42;
    border-radius: 8px;
    width: 90%;
    padding: 0 0.06rem;
    margin: 0.177rem auto;
}

.member-progress h4 {
    position: relative;
    color: #c14800;
    width: 89%;
    margin: auto;
}

.member-progress {
    width: 100%;
    margin: 0.06rem 0;
}

.member-progress-t {
    margin: 0.6rem auto 0;
}

.member-progress-c-box {
    width: 100%;
    margin: 0.16rem 0;
}

.member-progress-c {
    position: relative;
    width: 6.4rem;
    height: 0.34rem;
    background: url(../images/card/card-n.png) no-repeat;
    z-index: 3;
    background-size: contain;
    top: 0.05rem;
    margin: 0 auto;
    /* top: 52%;*/
}

.member-already {
    position: absolute;
    top: 0;
    left: 0.06rem;
    display: block;
    z-index: 4;
    color: #6d2400;
    font-size: 12px;
    padding: 0 0.1rem;
    height: 0.28rem;
    line-height: 0.28rem;
}

.member-progress-in {
    width: 40%;
    height: 100%;
    max-width: 6.4rem;
    position: absolute;
    top: 0;
    background-size: cover;
    z-index: 2;
    overflow: hidden;
}

.member-progress-in::after {
    content: ' ';
    display: block;
    width: 6.4rem;
    height: 0.34rem;
    background: url(../images/card/card-y.png) no-repeat;
    position: absolute;
    top: 0;
    background-size: contain;
    z-index: 2;
    overflow: hidden;
}

.member-progress-b {
    margin: auto;
}

.member-progress-t, .member-progress-b {
    display: flex;
    /* flex-direction: row; */
    justify-content: space-between;
    align-items: center;
    width: 7rem;
    color: #331303;
}

.member-progress-t span {
    color: #0066ff;
}

.member-progress-t span, .member-progress-b span {
    width: 0.78rem;
    text-align: center;
    font-size: 12px;
    position: relative;
}

.member-progress-t span::after {
    content: '';
    display: block;
    position: absolute;
    top: -0.5rem;
    left: 0;
    right: 0px;
    margin: auto;
    width: 0.78rem;
    height: 0.5rem;
    z-index: 5;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}

.member-progress-t span:nth-child(1)::after {
    background-image: url(../images/card/01.png);
}

.member-progress-t span:nth-child(2)::after {
    background-image: url(../images/card/02.png);
}

.member-progress-t span:nth-child(3)::after {
    background-image: url(../images/card/03.png);
}

.member-progress-t span:nth-child(4)::after {
    background-image: url(../images/card/04.png);
}

.member-progress-t span:nth-child(5)::after {
    background-image: url(../images/card/05.png);
}

.member-progress-t span:nth-child(6)::after {
    background-image: url(../images/card/06.png);
}

.member-progress-t span.act, .member-progress-b span.act {
    color: #f58705;
}

.member-box {
    width: 6.5rem;
    margin: auto;
    border: 1px solid #e8ba72;
}

.member-table {
    width: 100%;
    border: none;
    text-align: center;
}

.member-table tr {
    height: 0.9rem;
}

.member-table tr th {
    background: #fff5d7;
    border: none;
    height: 0.38rem;
    line-height: 00.38rem;
    color: #b13737;
}

.member-table tr td {
    border: none;
    background: #fff;
}

.member-table tr td:nth-child(1) {
    border-right: 1px solid #ddd;
}

.member-table tr td img {
    width: 0.67rem;
    height: 0.47rem;
    margin-right: 0.1rem;
}

.member-matters {
    width: 6.5rem;
    margin: 0.5rem auto 0;
    color: #651a13;
}

.member-matters h3 {
    font-size: 0.4rem;
    font-weight: bold;
    color: #922319;
}

.member-matters p {
    font-size: 0.3rem;
}

.member-matters ul {
    font-size: 0.16rem;
    margin-left: 0.3rem;
}

/*em member*/

/*em discounts*/

.discounts-box {
    width: 90%;
    margin: auto;
}

.discounts-table {
    text-align: center;
    border: none;
    width: 100%;
    font-size: 12px;
}

.discounts-table tr th:nth-child(1), .discounts-table tr td:nth-child(1) {
    width: 11%;
    background: #fff5d7;
    color: #b13737;
}

.discounts-table tr {
    height: 1rem;
}

.discounts-table tr td {
    background: #fff;
}

.discounts-table tr th {
    position: relative;
    border: navajowhite;
    width: 14.4%;
}

.discounts-table tr th:last-child {
    width: 16%;
}

.discounts-table tr th div {
    border: 1px solid #e8ba72;
    height: 0.94rem;
    width: 100%;
    padding: 0.2rem 0;
    border-radius: 6px 6px 0 0;
    position: absolute;
    bottom: 0;
    background: -moz-linear-gradient(top, #fffdf0, #fff2c3, #ffe79e, #fff4d2);
    background: -webkit-linear-gradient(top, #fffdf0, #fff2c3, #ffe79e, #fff4d2);
    background: -o-linear-gradient(top, #fffdf0, #fff2c3, #ffe79e, #fff4d2);
    background: -ms-linear-gradient(top, #fffdf0, #fff2c3, #ffe79e, #fff4d2);
    background: linear-gradient(to bottom, #fffdf0, #fff2c3, #ffe79e, #fff4d2);
}

.discounts-table tr th:first-child div {
    height: 0.82rem;
    font-size: 16px;
    background: #ffefbf;
    border-radius: 0;
    border-top: 1px solid #e8ba72;
    border-left: 1px solid #e8ba72;
    border-bottom: 1px solid #e8ba72;
}

.discounts-table tr th:last-child div {
    height: 0.98rem;
    background: #000;
    background: -moz-linear-gradient(top, #fffbec, #ffc871, #ffb93e, #fff9e8);
    background: -webkit-linear-gradient(top, #fffbec, #ffc871, #ffb93e, #fff9e8);
    background: -o-linear-gradient(top, #fffbec, #ffc871, #ffb93e, #fff9e8);
    background: -ms-linear-gradient(top, #fffbec, #ffc871, #ffb93e, #fff9e8);
    background: linear-gradient(to bottom, #fffbec, #ffc871, #ffb93e, #fff9e8);
}

.discounts-table tr th img {
    width: 0.78rem;
    height: 0.5rem;
}

.discounts-table tr th span {
    display: block;
    font-size: 10px;
    color: #691600;
}

.discounts-table tr td img {
    width: 0.34rem;
    height: 0.36rem;
}

.discounts-table tr td:first-child {
    border-left: 1px solid #e8ba72;
    border-bottom: 1px solid #f3d7a7;
}

.discounts-table tr td:last-child {
    border-right: 1px solid #e8ba72;
}

.discounts-table tr:last-child {
    border-bottom: 1px solid #e8ba72;
}

/*em discounts*/

.bottom {
    height: 1.4rem;
    margin-top: 0.5rem;
}

.bot-con {
    width: 4.35rem;
    font-size: 0.14rem;
    color: #fff;
    margin-right: 0.2rem;
}

.bot-con span {
    font-size: 0.13rem;
    color: #eed1b3;
}

@media (max-width: 1024px) {
    .pop-con {
        width: 100%;
        height: 40vh;
    }

    .bottom {
        height: 2rem;
    }

    .bot-con {
        width: 8rem;
    }
}

@media (max-width: 800px) {
    .floating {
        display: none;
    }

    .banner_floating {
        display: none;
    }

    .choose_list {
        width: 100%;
        margin: 0 auto 0.6rem;
        background: url(../images/choose_list_bg.png) no-repeat top center;
        padding-bottom: 0.3rem;
        background-size: 91%;
        position: fixed;
        bottom: -1rem;
        background-color: #4b0f10e0;
        z-index: 999;
        bottom: -1rem;
    }

    .stored_value_title {
        width: 6.5rem;
    }

    .nav {
        width: 100%;
        background-image: url(../images/mobile/nav_bg.png);
        background-size: cover;
        height: 1.9rem;
    }

    .banner {
        display: none;
    }

    .ind-banner {
        display: block;
    }

    .con {
        width: 100%;
        margin: -0.1rem auto 0.3rem;
        padding-top: 0.2rem;
        top: -17vw;
    }

    .ind-con {}

    .wrapper .wrapper_bg {
        width: 100%;
    }

    .wrapper .wrapper_bg::after {
        display: none;
    }

    .premium_gift_bag {
        width: 94%;
        border: 2px solid #7e6b5a;
        margin-bottom: 2rem;
    }

    .premium_gift_bag.p_03 {
        margin-bottom: 0.2rem;
    }

    .premium_gift_bag.p_07 {
        margin-bottom: 2rem;
    }

    .nav ul {
        padding-top: 0.7rem;
        padding-left: 0;
        /* width: 80%; */
        margin: auto;
    }

    .nav ul li {
        height: 0.8rem;
        line-height: 0.8rem;
        width: 1rem;
        -moz-text-stroke: 0;
        -webkit-text-stroke: 0;
        -o-linear-text-stroke: 0;
        -ms-linear-text-stroke: 0;
    }

    .nav ul li.act {
        background-color: #804f1bab;
    }

    .nav ul li:nth-child(1) {
        width: 13%;
        background-size: 95%;
    }

    .nav ul li:nth-child(2) {
        width: 22%;
        background-size: 95%;
    }

    .nav ul li:nth-child(3) {
        width: 22.5%;
        background-size: 95%;
    }

    .nav ul li:nth-child(4) {
        width: 21%;
        background-size: contain;
    }

    .nav ul li:nth-child(5) {
        width: 20%;
        background-size: contain;
    }

    .nav ul li a {
        font-size: 0.34rem;
    }

    /* p_03 */
    .p_g_b_h3 {
        height: 0.76rem;
        line-height: 0.76rem;
        font-size: 0.4rem;
    }

    .p_g_b_p {
        width: 94%;
        font-size: 0.32rem;
    }

    .p_g_b_h4 h4 {
        height: auto;
        font-size: 0.38rem;
    }

    .p_g_b_h4 span {
        display: flow-root;
    }

    .serial_number_p {
        height: 0.6rem;
        line-height: 0.6rem;
        background: url(../images/peach.png) no-repeat left center;
        padding-left: 0.5rem;
        background-size: 6%;
        font-size: 0.32rem;
    }

    .serial_n_l p {
        text-align: initial;
    }

    .serial_n_r {
        width: 40%;
        margin: auto;
    }

    .serial_n_r a {
        width: 2rem;
        height: 0.8rem;
    }

    .serial_number {
        width: 98%;
    }

    .serial_number_a {
        width: 100%;
        height: 0.9rem;
        border-radius: 16px;
        margin-bottom: 0.1rem;
        background: url(../images/serial_number01.png) no-repeat center;
        background-size: contain;
    }

    .serial_number_a.s_n02 {
        background: url(../images/serial_number02.png) no-repeat center;
        background-size: contain;
    }

    .serial_number_a.s_n03 {
        background: url(../images/mobile/serial_number03.png) no-repeat center;
        background-size: contain;
    }

    .serial_number_a.s_n04 {
        background: url(../images/mobile/serial_number04.png) no-repeat center;
        background-size: contain;
    }

    .serial_number_a.s_n05 {
        background: url(../images/mobile/serial_number05.png) no-repeat center;
        background-size: contain;
    }

    .serial_number_a.s_n06 {
        background: url(../images/mobile/serial_number06.png) no-repeat center;
        background-size: contain;
    }

    .serial_number_a.s_n07 {
        background: url(../images/mobile/serial_number07.png) no-repeat center;
        background-size: contain;
    }

    .serial_number_box {
        display: block;
    }

    .serial_n_l {
        width: 80%;
        margin: auto;
    }

    .serial_n_l input {
        width: 100%;
        height: 0.64rem;
        border-radius: 0.1rem;
    }

    /* em p_03 */
    /* p_01 */
    .money_list {
        width: 100%;
    }

    .gift_list {
        width: 98%;
    }

    .p_g_b_p2 {
        width: 95%;
        font-size: 0.3rem;
    }

    .invoice_list {
        width: 90%;
        font-size: 0.3rem;
    }

    .trading_p {
        width: 98%;
    }

    .money_list ul li {
        width: 98%;
        margin: auto;
        height: 1rem;
        background: url(../images/money_list_bg.png) no-repeat center;
        background-size: auto;
        border-radius: 16px;
        border: 2px solid #ad875e;
        margin-bottom: 0.1rem;
    }

    .money_list ul li button {
        width: 1.9rem;
        height: 0.8rem;
    }

    .money_list ul li.grade::after {
        top: -0.04rem;
    }

    .confirm_list {
        width: 80%;
    }

    .trading_but {
        width: 2.5rem;
        height: 0.8rem;
    }

    .confirm_list ul li span {
        height: 0.8rem;
        line-height: 0.8rem;
    }

    .gift_list_t strong {
        font-size: 0.3rem;
        height: 0.7rem;
        line-height: 0.7rem;
    }

    .money_list ul li em.grade {
        width: 2.5rem;
        height: 0.58rem;
        line-height: 0.58rem;
        top: -0.02rem;
        padding-left: 0.3rem;
    }

    .money_list ul li div.chp {
        width: 2.219rem;
        height: 1rem;
        line-height: 0.58rem;
        /* top: -0.22rem; */
        right: 1.9rem;
        padding-left: 0.3rem;
    }

    .chp span {
        /* left: 1.3rem; */
        top: 0.35rem;
        font-size: 0.4rem;
    }

    .money_list ul li em.dragon {
        width: 2.219rem;
        height: 1rem;
        line-height: 0.58rem;
        top: -0.13rem;
        right: 1.9rem;
        padding-left: 0.3rem;
    }

    .money_list ul li em span::after {
        top: 0.06rem;
    }

    /* em p_01 */
    /* p_02 */
    .surprise_list ul {
        display: block;
    }

    .surprise_list_r img {
        width: 3rem;
        height: 3.6rem;
        margin: auto;
        display: block;
    }

    .but_add, .but_reduction {
        width: 0.6rem;
        height: 0.6rem;
        margin: 0 0.06rem;
    }

    .but_input {
        width: 1.2rem;
        height: 0.56rem;
    }

    .but_buy {
        width: 1.77rem;
        height: 0.8rem;
    }

    .surprise_list ul li .surprise_list_t {
        width: 100%;
        display: inline-block;
        height: 0.7rem;
        line-height: 0.7rem;
        font-size: 0.32rem;
    }

    .surprise_list ul li:nth-child(1) {
        width: 100%;
        border-right: none;
    }

    .surprise_list ul li:nth-child(2) {
        width: 100%;
    }

    .surprise_list ul li .surprise_list_t strong span::after {
        top: -0.01rem;
        width: 0.4rem;
        height: 0.4rem;
    }

    .surprise_list ul li .surprise_list_l {
        padding: 0.2rem 0.44rem;
        font-size: 0.3rem;
    }

    .surprise_list {
        width: 98%;
    }

    /* em p_02 */
    /* p_04 */
    .but_details {
        width: 2.28rem;
        height: 1rem;
    }

    /* em p_04 */
    .head-banner {
        width: 94%;
        border: 5px solid #986606;
    }

    .outside-game {
        width: 90%;
        height: 2rem;
    }

    .message {
        display: block;
        margin: auto;
        width: 94%;
    }

    .user-message, .news-message {
        width: 100%;
        height: 6.7rem;
        margin: 0.2rem 0 0 0;
        border: 5px solid #986606;
    }

    .my-magazine, .cards-magazine {
        padding-top: 0.5rem;
        background-size: 100% 100%;
    }

    .my-magazine h3, .cards-magazine h3 {
        font-size: 0.5rem;
    }

    .within-game-img {
        width: 96%;
        border: 5px solid #986606;
    }

    .within-game-img:nth-child(1) {
        margin: 0 auto;
    }

    .within-game-img:nth-child(2) {
        display: none;
    }

    .message-but {
        width: 2rem;
        height: 0.8rem;
        font-size: 0.4rem;
    }

    .cards-box span {
        width: 0.7rem;
        font-size: 0.3rem;
        height: 0.56rem;
        line-height: 0.56rem;
    }

    .progress-c, .progress-in::after {
        width: 3rem;
        height: 0.6rem;
    }

    .progress-num {
        height: 0.6rem;
        line-height: 0.6rem;
    }

    .progress-in {
        max-width: 3rem;
    }

    .cards-box {
        width: 1.2rem;
        height: 0.7rem;
    }

    .my-name, .my-num {
        font-size: 0.32rem;
    }

    .my-time {
        padding: 0.2rem 0px;
    }

    .news-message .news-m-tab button {
        height: 0.8rem;
        line-height: 0.8rem;
        font-size: 0.4rem;
    }

    .news-message .news-m-list li a {
        /* padding: 0.1rem 0; */
        font-size: 0.34rem;
        height: 0.64rem;
        line-height: 0.64rem;
    }

    .news-message .news-m-page-num ul li span {
        padding: 0.2rem 0.4rem;
    }

    .head-banner img {
        width: auto;
        height: 100%;
        margin: auto;
    }

    /* .outside-game .swiper-slide {
        border: 2px solid #986606;
    } */
    .outside-game .swiper-slide img {
        width: 100%;
        height: 100%;
        /* border: 4px solid #986606; */
    }

    .discounts-box, .cards-member-list, .member-box {
        width: 98%;
    }

    .discounts-table tr th:last-child {
        width: 14.4%;
    }

    .discounts-table tr {
        height: 1.5rem;
    }

    .discounts-table tr th {
        /* width: auto; */
    }

    .discounts-table tr th div, .discounts-table tr th:last-child div {
        height: auto;
    }

    .discounts-table tr th:first-child div {
        height: 1rem;
    }

    .member-table tr td {
        font-size: 14px;
    }

    .member-matters {
        width: 93%;
    }

    .personal_info div strong {
        font-size: 0.26rem;
    }

    .member-statistics {
        width: 80%;
        height: 0.8rem;
        line-height: 0.8rem;
        font-size: 0.28rem;
    }

    .member-progress-t span, .member-progress-b span {
        width: 1rem;
    }

    .member-progress-c {
        width: 6.6rem;
        height: 0.4rem;
    }

    .member-progress-t, .member-progress-b {
        width: 7.6rem;
        height: 0.4rem;
    }

    .member-progress h4 {
        width: 6.6rem;
    }

    .member-progress-in::after {
        width: 6.6rem;
        height: 0.4rem;
    }

    .member-progress-in {
        max-width: 6.6rem;
    }

    .login-title {
        font-size: 0.5rem;
        padding: 0 0 0.3rem;
    }

    .logo-input-list span {
        font-size: 0.36rem;
    }

    .logo-input-list input {
        width: 4.5rem;
        height: 0.7rem;
        border-radius: 4px;
        font-size: 0.3rem;
    }

    .logo-but {
        width: 1.65rem;
        height: 1.65rem;
    }

    .logo-but1 {
        width: 1.65rem;
        height: 1.65rem;
    }

    .login-rules {
        font-size: 0.3rem;
        padding-left: 1.2rem;
        margin: 0.3rem 0 0;
    }

    .login-but-list p {
        font-size: 0.32rem;
        padding: 0.2rem;
    }

    .login-but-list button {
        width: 1rem;
        height: 1rem;
        margin: 0 0.2rem;
    }

    .login-prompt {
        width: 3.32rem;
        height: 0.99rem;
        top: 1.1rem;
        right: 0.5rem;
        /* transform: rotate(90deg); */
    }

    .news-message .news-m-page-num ul li:nth-child(2) button {
        padding: 0.14rem 0.24rem;
        font-size: 0.3rem;
    }

    .personal_name {
        font-size: 0.36rem;
    }

    .member-matters ul {
        font-size: 0.3rem;
    }

    .service_files {
        height: 0.5rem;
        width: 2rem;
        background-size: contain;
    }

    .activity-box li {
        width: 48%;
    }

    .activity-box li p {
        width: 3rem;
        height: 1.2rem;
        line-height: 0.61rem;
        padding: 0.5rem 0 0;
        font-size: 0.24rem;
    }

    .activity-box li div img {
        border: 3px solid #bd9747;
    }

    .activity-box li div {
        padding-top: 0.7rem;
    }

    /* 必須移除 */
    /* .close-btn {
        right: 0;
        left: 0;
        top: auto;
        bottom: -1rem;
        margin: auto;
        width: .8rem;
        height: .8rem;
        background-size: contain;
    } */
    .pop-text {
        margin-top: 0.4rem;
        font-size: 0.32rem;
        line-height: 0.56rem;
        width: 7.56rem;
    }

    .pop-con {
        height: 32vh;
    }

    .pop-main {
        overflow: inherit;
    }

    .pop-h3 {
        font-size: 0.32rem;
        height: 0.7rem;
        line-height: 0.7rem;
        padding: 0 0.2rem;
    }

    .bottom {
        height: 2.4rem;
    }

    .bot-con {
        width: 7.3rem;
        font-size: 0.1rem;
    }

    .bot-con span {
        font-size: 0.1rem;
    }

    .logo {
        left: 3%;
    }

    .service_but_box {
        /* left: -2rem; */
        width: 80%;
    }
}

@media screen and (min-width: 801px) and (max-width: 1024px) {
    .user-message, .news-message {
        height: 4.6rem;
    }

    .outside-game {
        height: 2.9rem;
    }
}

@media only screen and (min-device-width: 768px) and (max-device-width: 1023px) and (orientation: portrait) {
    .nav {
        width: 100%;
        background-image: url(../images/nav_bg.png);
        background-size: contain;
    }

    .nav ul {
        padding-top: 0.74rem;
        padding-left: 1rem;
        width: 90%;
    }

    .nav ul li:nth-child(1) {
        width: 16%;
        background-size: 95%;
    }

    .nav ul li:nth-child(2) {
        width: 19%;
        background-size: 95%;
    }

    .nav ul li:nth-child(3) {
        width: 18%;
        background-size: 95%;
    }

    .nav ul li:nth-child(4) {
        width: 17.5%;
        background-size: contain;
    }

    .nav ul li:nth-child(5) {
        width: 18%;
        background-size: contain;
    }

    .head-banner {
        border: 5px solid #986606;
        width: 9.9rem;
        height: 4rem;
    }

    .message, .within-game-img {
        width: 9.9rem;
    }

    .outside-game {
        width: 9.9rem;
        height: 2.8rem;
    }

    .money_list ul li p {
        width: 9.1rem;
    }

    .money_list ul li.grade::after {
        left: 6.46rem;
    }

    .member-progress-c, .member-progress-in::after {
        width: 6.6rem;
        height: 0.34rem;
    }

    .member-progress-in {
        max-width: 6.6rem;
    }

    .member-progress h4 {
        width: 6.6rem;
    }
}

@media only screen and (min-device-width: 1025px) and (max-device-width: 1366px) and (orientation: portrait) {
    .nav {
        width: 100%;
        background-image: url(../images/nav_bg.png);
        background-size: contain;
    }

    .nav ul {
        padding-top: 0.59rem;
        padding-left: 1.3rem;
    }

    .money_list ul li p {
        width: 9.1rem;
    }

    .money_list ul li.grade::after {
        left: 6.46rem;
    }

    .outside-game {
        height: 2.8rem;
    }
}

.set-border {
    border-image: -webkit-linear-gradient(#986606, #ffefba, #986606, #ffefba, #986606, #ffefba, #986606) 20 20;
    border-image: -moz-linear-gradient(#986606, #ffefba, #986606, #ffefba, #986606, #ffefba, #986606) 20 20;
    border-image: -o-linear-gradient(#986606, #ffefba, #986606, #ffefba, #986606, #ffefba, #986606) 20 20;
    border-image: linear-gradient(#986606, #ffefba, #986606, #ffefba, #986606, #ffefba, #986606) 20 20;
    box-shadow: #292929 0px 0px 6px 1px;
}

.p_01 {
    display: block;
}

#pop-page table, #post-page table {
    margin: 10px 0 !important;
}

#pop-page th,
#pop-page tr,
#pop-page td,
#post-page th,
#post-page tr,
#post-page td {
    padding: 2px 7px !important;
    border: solid 2px #fff !important;
}

#pop-page .sec-con p, #pop-page .sec-table,
#post-page .sec-con p, #post-page .sec-table {
    padding-left: 0 !important;
}