@charset "utf-8";
html,
body {
    background: #F9F9F9;
}

.ytk_my_top {
    background: url(/images/my_top_bg.png) #fff no-repeat center top;
    background-size: 7.48rem 3.93rem;
}

.ytk_my_top_head {
    padding-top: 1.35rem;
    padding-left: .35rem;
    margin-bottom: .22rem;
}

.ytk_my_top_head_l {
    margin-right: .24rem;
}

.ytk_my_top_head_l > img {
    display: block;
    width: 1.18rem;
    height: 1.18rem;
    object-fit: cover;
    border-radius: 50%;
    box-sizing: border-box;
    border: 2px solid #fff;
    box-shadow: 0px 2px 8px 0px #C79600;
}

.head_name {
    font-size: .5rem;
    color: #181713;
    margin-bottom: .10rem;
    font-weight: 500;
}

.ytk_my_top_head_l_info {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.head_vip_state {
    display: flex;
    align-items: center;
}

.head_vip_state > .vip_normal {
    display: block;
    width: .31rem;
    height: .26rem;
    background: url(/images/vip_icon.png) no-repeat;
    background-size: .31rem .26rem;
    margin-right: .08rem;
}

.head_vip_state > span {
    font-size: .26rem;
    color: #181713;
}

.ytk_my_top_sub {
    width: 7.25rem;
    margin: 0 auto;
    background: url(/images/vip_bg.png) no-repeat center 0;
    background-size: 7.25rem 2.82rem;
    padding-bottom: .27rem;
}

.ytk_my_top_sub_vip {
    padding: .56rem .53rem .31rem .48rem;
}

.ytk_my_top_sub_vip_l {
    flex: 1;
}

.vip_icon_big {
    width: .47rem;
    height: .42rem;
    background: url(/images/big_vip.png) no-repeat;
    background-size: .47rem .42rem;
    margin-right: .15rem;
}

.ytk_my_top_sub_vip_l > span {
    font-size: .4rem;
    color: #784C22;
}

.vip_more {
    width: 1.5rem;
    height: .6rem;
    line-height: .6rem;
    background: rgba(165, 118, 73, 1);
    border-radius: 0.3rem;
    color: #FED68C;
    font-size: .26rem;
    display: block;
    text-align: center;
}

.vip_more:active {
    background: rgb(140, 96, 54);
}

.ytk_my_top_list {
    display: flex;
    padding-top: .35rem;
    align-items: center;
    justify-content: space-between;
    background: url(/images/my_list_bg.png) no-repeat center top;
    background-size: 7.5rem 1.63rem;
}

.ytk_my_top_list:after {
    content: '';
    display: block;
}

.ytk_my_top_list:before {
    content: '';
    display: block;
}

.ytk_my_top_list > a {
    text-align: center;
    display: block;
}

.ytk_my_top_list > a > p {
    font-size: .23rem;
    color: #777777;
}

.ytk_my_top_list > a > i {
    display: block;
    margin: 0 auto;
    margin-bottom: .14rem;
    width: .6rem;
    height: .6rem;
    background-repeat: no-repeat;
    background-size: .6rem .6rem;
}

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

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

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

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

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

.my_tool_list {
    background: #F9F9F9;
    padding: .25rem .22rem;
}

.my_tool_list_ul {
    margin-bottom: .26rem;
    border-radius: .14rem;
    overflow: hidden;
}

.my_tool_list_ul > li > a {
    background: #fff;
    height: .9rem;
    line-height: .9rem;
    border-bottom: 1px solid #F2F2F2;
    display: flex;
    align-items: center;
    box-sizing: border-box;
    padding-left: .84rem;
    position: relative;
}

.my_tool_list_ul > li > a:active {
    background: #ececec;
}

.my_tool_list_ul > li > a > i {
    position: absolute;
    left: .26rem;
    top: 50%;
    transform: translateY(-50%);
    z-index: 1;
}

.my_tool_list_ul > li > a > span {
    font-size: .3rem;
    color: #222222;
    flex: 1;
}

.my_tool_list_ul > li > a > b {
    font-size: .3rem;
    color: #CCCCCC;
    margin-right: .3rem;
    font-weight: normal;
}

.my_tool_list_ul > li:last-child > a {
    border-bottom: none;
}

.list_icon_vip {
    width: .38rem;
    height: .35rem;
    background: url(/images/tool_list1.png) no-repeat center center;
    background-size: .38rem .35rem;
}

.list_icon_tz {
    width: .31rem;
    height: .32rem;
    background: url(/images/tool_list2.png) no-repeat center center;
    background-size: .31rem .32rem;
}

.list_icon_dd {
    width: .31rem;
    height: .25rem;
    background: url(/images/tool_list3.png) no-repeat center center;
    background-size: .31rem .25rem;
}

.list_icon_qb {
    width: .28rem;
    height: .28rem;
    background: url(/images/tool_list7.png) no-repeat center center;
    background-size: .28rem .28rem;
}

.list_icon_tg {
    width: .32rem;
    height: .30rem;
    background: url(/images/tool_list5.png) no-repeat center center;
    background-size: .32rem .30rem;
}

.list_icon_sz {
    width: .32rem;
    height: .30rem;
    background: url(/images/tool_list6.png) no-repeat center center;
    background-size: .32rem .30rem;
}


.my_tool_list_ul .list_icon_coupon {
    font-size: .36rem;
    left: .23rem;
    color: #efa224;
    font-weight: bold;
}