﻿


.vip_card_end {
    font-size: 0.875rem;
    color: #B5804E;
}


.vip_card {
    width: calc(100% - 2rem);
    margin: 0.625rem 1rem 0 1rem;
    background: linear-gradient( 134deg, #FDDEBF 0%, #FBECDD 50%, #FFC998 100%);
    border-radius: 0.5rem 0.5rem 0.5rem 0.5rem;
    height: 6.9375rem;
}

.vip_card_name {
    display: flex;
    padding: 1.0625rem 1.125rem 0 1.125rem;
}

.vip_card_name_left {
    font-weight: bold;
    font-size: 1.0625rem;
    color: #7F4523;
}

.vip_card_btn_container {
    flex: 1;
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

.vip_card_btn {
    width: 3.875rem;
    height: 1.75rem;
    background: linear-gradient( 90deg, #D8853B 0%, #9E540F 100%);
    border-radius: 5.625rem 5.625rem 5.625rem 5.625rem;
    font-size: 0.875rem;
    color: #FFFFFF;
    display: flex;
    align-items: center;
    justify-content: center;
}

.vip_card_brief {
    margin-top: 0.625rem;
    padding: 0 1.125rem;
    font-size: 0.9375rem;
    color: #854B27;
    line-height: 1.375rem;
}

#h5_id_box {
    height: 1.0625rem;
    border-radius: 0.1875rem 0.1875rem 0.1875rem 0.1875rem;
    border: 0.0625rem solid rgba(255,255,255,0.5);
    padding: 0 0.3125rem;
    align-items: center;
    margin-left: 0.1875rem;
    font-size: 0.75rem;
    color: rgba(255,255,255,0.7);
    display: flex;
}

.user_container {
    margin-top: 0.625rem;
    overflow: hidden;
}



.user_container_topbar {
    width: 100%;
    height: 3.75rem;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #FFFFFF;
    font-size: 1rem;
    position: relative;
}

.user_info_container {
    width: calc(100% - 2rem);
    height: 5.1875rem;
    margin: 0 1rem;
    background: linear-gradient( 89deg, #FB4E4E 0%, #FC885F 100%);
    border: 1px solid #FF6A6A;
    border: 0.0625rem solid #FF6A6A;
    border-radius: 0.625rem;
    display: flex;
    position: relative;
    background-size: 100% 100%;
}

.user_container_back {
    position: absolute;
    left: 1.0625rem;
    width: 0.625rem;
    height: 1.0625rem;
}

.user_container_menu {
    position: absolute;
    right: 1.0625rem;
    width: 1.125rem;
    height: 0.875rem;
}

.avatar {
    width: 2.8125rem;
    height: 2.8125rem;
    border-radius: 2.8125rem;
    margin: 1.1875rem 0.6875rem 0 1.1875rem;
    border: 0.0625rem solid rgba(255,255,255,0.5)
}

.user_info {
    margin-top: 1.4375rem;
}

.username {
    font-size: 1.125rem;
    color: #fff;
    line-height: 1.5625rem;
    font-weight: bold;
    display: flex;
    align-items: center;
}

.viptext {
    font-size: 0.75rem;
    color: #fff;
    display: flex;
    align-items: center;
}

    .viptext svg {
        background: linear-gradient( 137deg, #FFFDFC 0%, #F9CCA6 100%);
        border-radius: 0.125rem;
    }

    .viptext span {
        margin-left: 0.3125rem;
        font-size: 0.75rem;
        color: #FFFFFF;
    }

.login_btn {
    width: 4.5rem;
    height: 1.875rem;
    background: #FFFFFF;
    border-radius: 0.9375rem 0.9375rem 0.9375rem 0.9375rem;
    font-size: 1rem;
    color: #FB4E4E;
    line-height: 1.875rem;
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    top: 1.6875rem;
    right: 0.875rem;
}

.vip_container {
    width: calc(100% - 2rem);
    margin: 0.9375rem 1rem 0.9375rem 1rem;
    height: 8.875rem;
    background: #fff;
    border-radius: 0.5rem 0.5rem 0.5rem 0.5rem;
}

body, .h5Main {
    background: #F5F5F5;
}

.vip_box_title {
    padding: 1.25rem 0 0.875rem 0.9375rem;
    color: #333333;
    font-size: 1rem;
}

.vip_input_box {
    width: calc(100% - 1.875rem);
    margin-left: 0.9375rem;
    height: 2.375rem;
    display: flex;
}


.vip_input_left {
    border-left: 0.0625rem solid #DEDEDE;
    border-bottom: 0.0625rem solid #DEDEDE;
    border-top: 0.0625rem solid #DEDEDE;
    width: 80%;
    height: 100%;
    box-sizing: border-box;
    border-radius: 0.375rem 0rem 0rem 0.375rem;
    overflow: hidden;
}

.vip_input_btn {
    width: 20%;
    height100 %;
    background: #FB4E4E;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.875rem;
    color: #FFFFFF;
    border-radius: 0rem 0.375rem 0.375rem 0rem;
}

.vip_input_left input {
    border: 0;
    background: #fff;
    text-decoration: none;
    width: 100%;
    height: 100%;
    padding: 0.625rem;
    font-size: 0.875rem;
}

    .vip_input_left input::placeholder {
        font-size: 0.875rem;
        color: #D6D6D6;
    }

.vip_tip {
    width: calc(100% - 1.875rem);
    margin-left: 0.9375rem;
    font-size: 0.75rem;
    color: #808080;
    line-height: 2rem;
    margin-top: 0.3125rem;
}

.menu_container {
    width: calc(100% - 1.875rem);
    padding: 0.125rem 1rem;
    box-sizing: border-box;
    height: 6.6875rem;
    background: #fff;
    border-radius: 0.5rem;
    margin: 0.9375rem;
    overflow: hidden;
}

.menu_item {
    width: 100%;
    height: 3.1875rem;
    display: flex;
    align-items: center;
    font-size: 1rem;
    color: #333333;
    position: relative;
}

.border_eee {
    border: 0.0625rem solid #f7f7f7;
}

.menu_item svg {
    position: absolute;
    right: 0;
    width: 0.625rem;
    height: 1.1875rem;
}
