* { -webkit-tap-highlight-color: transparent; outline: none;}
html {
    /* font-size 由 rem-adapter.js 动态设置 */
}
html {width:100%;margin:0;padding:0;background-color:#eee;height:100%;user-select:none;}
h1, h2, h3, h4, h5, h6, dl, dt, dd, ul, li, p, form, a, span {
    margin: 0;
    list-style: none;
    padding: 0;
    font-family: NotoSansThai Regular,-apple-system,BlinkMacSystemFont,Helvetica Neue,Helvetica,Arial,PingFang SC,Hiragino Sans GB,Microsoft YaHei,sans-serif;
    font-weight: 400;
    text-align: left;
    font-style: normal;
    text-transform: none;
}
/* 隐藏垂直滚动条上下箭头 */
::-webkit-scrollbar-button:vertical {
    display: none;
}

/* 隐藏水平滚动条左右箭头 */
::-webkit-scrollbar-button:horizontal {
    display: none;
}
/* 滚动条轨道 */
::-webkit-scrollbar-track {
    background: #fff;
    border-radius: .2rem;
}

/* 滚动条滑块 */
::-webkit-scrollbar-thumb {
    background: rgba(0,0,0, 0.1);
    border-radius: .2rem;
}

/* 整体滚动条宽度 */
::-webkit-scrollbar {
    width: .4rem; /* 垂直滚动条宽度 */
    height: .4rem; /* 水平滚动条高度 */
}

body { box-sizing:border-box;margin:0;box-sizing:border-box; height: 100%;}
a {color:#000;text-decoration:none;cursor:pointer;transition:color .2s,background .2s,border .2s;}
a:hover, a:active {color:#0884e1;}
input,textarea,button {font-size:1.2rem;}
textarea {resize:none;}
button {cursor:pointer; background: linear-gradient( 90deg, #F9696A 0%, #FF4D6D 50%, #EEB165 100%);    border: 0; color: #fff;}
header,footer,main,content,section {display:block;}
img {pointer-events:none;}
.no-login-dialog-background{position:absolute; width: 100%; height: 100%; top: 0; left: 0; background: rgba(0, 0, 0, 0.85); z-index: 99; display: none;}
.readform {
    
    width:100%;height:100%;
    max-width: 37.5rem;
}
.div-content{position: absolute;width: 100%;height: 100%;z-index: 1}
.div-content.div-content-dialog{
    opacity: 0.9;
}
.playlet-readform{
    margin:0 auto;
    position:absolute;
    top:0;
    z-index:999;
    font-size:1.4rem;
    background-color:#eee;
    /*left:50%; 
    transform: translateX(-50.1%);
    overflow:hidden;*/
}
.free-list{
    height: auto;
    min-height: 100%;
}
.home-black-theme{
    background: #040404;
    /*padding-bottom: 6rem;*/
    /*overflow-y: auto;*/
}
.playlet-home{
    padding-bottom: 6rem;
}
.readbox {
    position:relative;max-width: 37.5rem;width:auto;margin:0 auto;
    /*height:calc(100% - 5.8rem);*/
    height:100%;
    overflow-y:  auto;
    z-index:1;box-shadow:0 0 5.0rem rgb(0 0 0/10%);box-sizing:border-box;
}
.playlet-home .readbox{
    overflow: visible;
}
.home-black-theme .header{
    position:  fixed;
    top:0;
    
    z-index: 99;
   
    background-image: url("../images/jvchangbg.png");
    background-repeat:no-repeat;
    background-size: contain;
    background-color: #040404;
    height: 14rem;
    width: 100%;
    max-width:  37.6rem;
}

.playlet-home .header{
    background: none;
    height: 15rem;
    /* 创建从上到下的渐变背景 */
    background: linear-gradient(
            to bottom,
            #040404 0%,      
            #040404 50%,
            rgba(0, 0, 0, 0.6) 80%,     
            rgba(0, 0, 0, 0.6) 90%, 
            rgba(0, 0, 0, 0.3) 95%, 
            rgba(0, 0, 0, 0) 100%  
    );
   
    -webkit-mask-image: linear-gradient(
            to bottom,
            rgba(0, 0, 0, 1) 0%,
            rgba(0, 0, 0, .8) 70%,
            rgba(0, 0, 0, 0.6) 80%,
            rgba(0, 0, 0, 0.4) 90%,
            rgba(0, 0, 0, 0.2) 100%
    );
    mask-image: linear-gradient(
            to bottom,
            rgba(0, 0, 0, 1) 0%,
            rgba(0, 0, 0, .8) 70%,
            rgba(0, 0, 0, 0.6) 80%,
            rgba(0, 0, 0, 0.4) 90%,
            rgba(0, 0, 0, 0.2) 100%
    );
}
.playlet-home .header .header-box{
    position: absolute;
    width: 100%;
    height: 15rem;
    top: 0;
    z-index: 999;
}
.playlet-home .home-content .focus .swiper::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 10rem; /* 渐变高度，可调整 */
    background: linear-gradient(to top, rgba(4, 4, 4, 1) 0%, transparent 100%);
    pointer-events: none; 
    z-index: 88; 
}
/*.playlet-home .home-content .focus .bg{
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 11rem;
    z-index: 99;
    
}*/
.readbox .header .header-search{
    width: 34.5rem;
    margin: .2rem auto 1.5rem;
}
.readbox .header .header-search .van-cell{
    background: #212121;
    border: .1rem solid #323232;
    border-radius: .6rem;
    height:  3.8rem;
    padding:  .8rem 1.6rem;
}
.readbox .header-search .van-cell input{
    font-size: 1.4rem;
    color: #ACACAC;
    line-height: 2rem;
    text-align: left;
    font-style: normal;
    text-transform: none;
}
.readbox .header .header-search .van-cell i.van-icon{
    font-size: 1.6rem;
}
.readbox .header-icon {
    /*background-image: url('../images/lQLPKdx6AlaKzmtgzQLusII4KNAtvpQsB8c1mETzSAA_750_96.png');
    background-repeat: no-repeat;
    background-size: contain;*/
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 4.8rem;
}
.readbody {position:relative;z-index:1;width:100%;height:auto;}
.headback {float:left;width:4.6rem;height:4.6rem; background:url(../fonts/back.svg) center no-repeat;background-size:50%;opacity:0.8;}

.readbox .home-content .vip-list{
    margin: 1rem auto;
    width: 100%;
}
.readbox .home-content .new-list{
    margin-top: 0;
}
.readbox .home-content .vip-list dt{
    padding: 0 1.25rem;
}
.readbox .home-content .vip-list p{
    padding: 0 1.25rem;
    font-weight: 400;
    font-size: 1.3rem;
    color: #8F9096;
    line-height: 1.8rem;
    text-align: left;
    font-style: normal;
    text-transform: none;
}

.readbox .home-content .vip-list .bg{
    height: 27.1rem;
    background-image: url("../images/yellowbg.png");
    background-repeat:no-repeat;
    background-size: cover;
}

.readbox .home-content .vip-list ul{
    display:  flex;
    flex-wrap:nowrap;
    overflow-x:auto;
    padding: 1.3rem 1.25rem 0;
}
.readbox .home-content .vip-list ul li{
    flex-shrink: 0;
    margin-right: 1rem;
}
.readbox .home-content .vip-list ul li .imgshowbox{
    border-radius: 1rem;
    width: 13.5rem;
    height: 19.6rem;
    background: linear-gradient( 180deg, rgba(255,255,255,0) 0%, rgba(76,76,76,0) 81.17%, rgba(0,0,0,0.8) 100%);
}
.home-black-theme ul li h3{
    width: 13.5rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-weight: 400;
    font-size: 1.3rem;
    color: #FFFFFF;
    line-height: 1.8rem;
    text-align: left;
    font-style: normal;
    text-transform: none;
    margin-top: .8rem;
}
.category-list ul li h3{
    margin: 0;
}
.readbox .home-content .listbox b{
    font-weight: 600;
    font-size: 2.1rem;
    color: #F2F2F7;
    line-height: 2.9rem;
    text-align: left;
    font-style: normal;
    text-transform: none;
}

.readbox .home-content .hot-list{
    margin-top: 2rem;
}
.readbox .home-content .hot-list dd{
    margin-top: 1rem;
}
.readbox .home-content .listbox .hotlist li {
    width: calc(50% - .4rem);
}
.readbox .home-content .listbox .hotlist li .imgshowbox{
    height: 24.1rem;
}
.headback a {display:block;width:100%;height:100%;background:url(../fonts/back.svg) center no-repeat;background-size:50%;opacity:0.8;}
.headback a:active {opacity:1;}
.headtitle {float:left;height:4.6rem;max-width:35.0rem;font-size:1.8rem;margin-left:1.7rem; line-height: 4.6rem; color: #212224}
.headtitle img {display:inline-block;vertical-align:middle;width:8.8rem;}
.headtitle img.logo-icon{ width: 2.5rem; height: 2.5rem; margin-right: .3rem; border-radius: .5rem}
.headtitle span.title{font-weight: 400; font-size: 1.7rem;color: #fff;}

.headsearch .headsearchbtn .search img{width: 2.4rem; height: 2.4rem;}
.headsearch .headsearchbtn .news img{width: 2.6rem; height: 2.4rem;}
.headsearch .headsearchbtn .news{position: relative}
.headsearch .headsearchbtn .news span.tip{
    position: absolute;
    top: -.4rem;
    right: -.6rem;
    width: 1.4rem;
    height: 1.4rem;
    background: #FF0000;
    border-radius: 50%;
    font-weight: 600;
    font-size: 1.1rem;
    color: #FFFFFF;
    line-height: 1.5rem;
    text-align: center;
}
.headsearch .headsearchbtn .search{margin-right: 2rem}
.focus {width:37.5rem;height:48rem;box-sizing:border-box;}
.focus .swiper {width:100%;height:100%;overflow:hidden;position:relative;}
.focus img {display:block;width:100%;height:100%;overflow:hidden;}
.focus img {object-fit:cover;object-position:center;}
.focus .swiper-pagination {bottom: 3rem; width:auto;left:50%; transform: translateX(-50%); z-index: 999;}
.focus .swiper-pagination-bullet {width:.7rem;height:.7rem;border-radius:50%;background: rgba(255,255,255,0.4);opacity: 1}
.focus .swiper-pagination-bullet-active {background: #FFFFFF;}

.playform {margin:0 auto;position:absolute;top:0;left:0;width:100%;height:100%;z-index:1;background-color:#000;font-size:1.4rem;overflow:hidden;}
.playbox {position:relative;max-width:37.5rem;width:auto;margin:0 auto;height:100%;background-color:#000;z-index:1;overflow:hidden;}
.playhead {position:absolute;top:0;left:0;width:100%;height:4.8rem;z-index:3;line-height:4.6rem;color:#fff; display: flex;justify-content: space-between; align-items:center;}
.playhead .headtitle {display:none;}
.playhead .menu{margin-right: 1.6rem}
.playhead .menu img{display:block;width:2.4rem;height:2.4rem;}
 .meun-tip{display: flex; align-items: center}
 .tip-num{margin-right: 2rem; position: relative;}
 .tip-num span.tip{
    position: absolute; 
    top: -.4rem;
    right: -.6rem;
    width: 1.4rem;
    height: 1.4rem;
    background: #FF0000;
    border-radius: 50%;
    font-weight: 600;
    font-size: 1.1rem;
    color: #FFFFFF;
    line-height: 1.5rem;
    text-align: center;}
 .tip-num img{display:block;width:2.4rem;height:2.4rem;}
/*菜單*/
/* 汉堡菜单按钮 */
.menu-btn {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    transition: all 0.3s ease;
}

.menu-btn:hover {
    transform: scale(1.05);
}
.menu-btn img{width:2.4rem;height:2.4rem;}

/* 菜单弹出框 */
.menu-modal {
    position: absolute;
    top: 5.4rem;
    right: 1.6rem;
    width: 18.8rem;
    background: #1B1C24;
    border-radius: 1.1rem;
    box-shadow: 0 .4rem .4rem .1rem rgba(48,48,48,0.5);
    z-index: 99;
    overflow: hidden;
    transform: translateY(-30px) scale(0.95);
    opacity: 0;
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    visibility: hidden;
}

.menu-modal.active {
    transform: translateY(0) scale(1);
    opacity: 1;
    visibility: visible;
}

.close-btn {
    color: rgba(255, 255, 255, 0.7);
    font-size: 24px;
    cursor: pointer;
    transition: all 0.3s ease;
}

.close-btn:hover {
    color: #fff;
    transform: rotate(90deg);
}

/* 菜单项样式 */
.menu-items {
    padding: 2rem;
}
.menu-items .divider{
    background: #373946;
    width: 100%;
    height: .1rem;
    margin: 1.6rem 0;
}
.menu-item {
    display: flex;
    align-items: center;
    text-decoration: none;
    color: rgba(255, 255, 255, 0.9);
    transition: all 0.3s ease;
    position: relative;
    cursor: pointer;
}

.menu-item:hover {
    padding-left: .25rem;
}

/*.menu-item:hover::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
}*/

.menu-icon {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-right: 1rem;
}
.menu-icon img{width: 2.2rem; height: 2.2rem; display: block;}
.menu-text a{
    font-weight: 400;
    font-size: 1.6rem;
    color: #FFFFFF;
    line-height: 2.2rem;
}


.playbody {position:relative;z-index:1;width:100%;height:100%;padding:0rem 0;background-color:#000;overflow:hidden;box-sizing:border-box;}
.playbottom {z-index:2;position:absolute;left:0rem;top:0rem;width:100%;height:4.6rem;padding:0rem 0rem 0rem 4.6rem;box-sizing:border-box;opacity:1;}
 video::-moz-media-controls-play-button,
 video::-webkit-media-controls-play-button {
    display: none !important;
}

/* 隐藏所有浏览器原生控件 */
video::-webkit-media-controls {
    display: none !important;
}
.progress-container-box{
    position: absolute;
    bottom: .2rem;
    /*height: .6rem;*/
    width: 34.5rem;
    left: 50%;
    transform: translateX(-50%);
    z-index: 999;
}
.playlet-index-home{
    height: calc(100% - 5.7rem);
    position: relative;
}
.playlet-index-home .progress-container-box{
    width: 33.4rem;
    bottom: .1rem;
}
.progress-container {
    width: 100%;
    height: .2rem;
    background-color: rgba(255, 255, 255, 0.15);
    position: relative;
    cursor: pointer;
}

/* 缓冲条样式 */
.buffer-bar {
    position: absolute;
    height: 100%;
    background: #666; /* 缓冲颜色 */
    width: 0%;
    transition: width 0.3s;
}

/* 播放进度条样式 */
.progress-bar {
    height: 100%;
    /*background: linear-gradient( 90deg, #F9696A 0%, #FF4D6D 50%, #EEB165 100%);*/
    background-color: rgba(255, 255, 255, 0.25);
    transform-origin: left;
    will-change: transform;
    transition: width 0.1s linear;
    z-index: 2;
}


.progress-container.dragging::after {
    content: attr(data-time);
    position: absolute;
}
/* 拖拽滑块 */
.progress-thumb{
    width: 1.6rem;
    height: 1.6rem;
    position: absolute;
    top: -.7rem;
    left: 0;
    z-index: 99;
    /*opacity: 0;*/
    transition: opacity 0.3s;
    pointer-events: auto; /* 确保可交互 */
    display: flex;
    align-items: center;
    justify-content: center;
}
.progress-thumb span{
    display: block;
    width: .4rem;
    height: .4rem;
    background: #fff;
    border-radius: 50%;
    margin: 0 auto;
}
.progress-container.paused{
    height: .4rem;
}
.progress-container.paused .progress-thumb span{
    width: .6rem;
    height: .6rem;
}
.progress-container.paused .progress-thumb{
    top: -.65rem;
}
.progress-container.paused .progress-bar{
    background-color: #ED7D17;
}
.progress-container.dragging{
    height: 1.6rem;
}
.progress-container.dragging .progress-bar{
    background-color: rgba(255, 255, 255, 0.55);
}
.progress-container.dragging .progress-thumb{
    top: 0;
}
.progress-container.dragging .progress-thumb span{
    height: 2rem;
    width: .6rem;
    border-radius: .2rem;
    
    filter: drop-shadow(0 0 .2rem rgba(255,255,0,0.3));
}

.playlet.progress-container-box{
    bottom: 5.8rem;
}

.played {
    height: 100%;
    background: #ff4757;
    transition: width 0.3s;
    border-radius: .3rem;
}

.thumb {
    width: 1.2rem;
    height: 1.2rem;
    background: white;
    border-radius: 50%;
    position: absolute;
    top: -.3rem;
    transform: translateX(-50%);
}


.zanwu-content {
    position: absolute;
    left: 50%;
    transform: translate(-50%, -50%);
    top: 30%;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.zanwu-content img{
    width: 18.4rem;
    height: 13.9rem;
}
.zanwu-content span{
    font-weight: 400;
    font-size: 1.4rem;
    color: #A5A5A5;
    margin-top: 1rem;
}

.playbody .Swiper3 .swiper-slide .video-background{ position: absolute; width: 100%; height: 100%; left: 0; top: 0;}
.playbody .Swiper3 .swiper-slide .video-set{display: flex; flex-direction: column; align-items:center; position: absolute; right: 1.9rem; bottom: 9rem}
.playlet-index-home .swiper-slide .video-set{bottom: 6.2rem !important;}
.playbody .Swiper3 .swiper-slide .video-set > div {display: flex; flex-direction: column; align-items: center; margin-top: 2.4rem;}
.playbody .Swiper3 .swiper-slide .video-set img{ width: 3.4rem; height: 3.4rem; margin-bottom: .7rem;}
.playbody .Swiper3 .swiper-slide .video-set .flower-background{
    width: 4rem; height: 5rem;
    background: url("/Scripts/images/give_flower.png") no-repeat;
    background-position: center;
    background-size: contain;
}
.playbody .Swiper3 .swiper-slide .video-set .flower-background img{
    display: block;
    margin: 0.8rem auto 0;
}
.playbody .Swiper3 .swiper-slide .video-set span{ font-size: 1.3rem; color: #fff; font-weight: 400; text-shadow: 0px 1px 1px rgba(0,0,0,0.3);}
.playbody .Swiper3 .swiper-slide .video-msg{position: absolute; left: 0; bottom: 0rem; width: 100%; transition: all 0.3s ease; z-index: 99;}
.playbody .Swiper3 .swiper-slide .video-msg .series-count {
    height: 5.8rem;
    background: #000;
    
    display: flex;
    align-items: center;
    margin-top: 1.5rem;
}
.playlet-index-home .video-msg .series-count{
    margin-top: 0 !important;
    height: auto !important;
}
.playbody .Swiper3 .swiper-slide .video-msg .series-count .count{
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 4.0rem;
    width: 31.7rem;
    margin: 0 auto;
    background: #242424;
    padding: 0 1.4rem;
}
.playbody .Swiper3 .swiper-slide .video-msg .series-count span {             
    font-weight: 600;
    font-size: 1.3rem;
    color: #fff;
    flex-grow: 1;
    margin-left: .5rem;
    margin-top: .25rem;
}
.playbody .Swiper3 .swiper-slide .video-msg .series-count img{
    width: 1.0rem;
    height: .6rem;
}
.playbody .Swiper3 .swiper-slide .video-msg .series-count img.bofang{
    width: 1.3rem;
    height: 1.3rem;
}
.playchange {display:block;position:relative;width:auto;height:4.6rem;line-height:4.6rem;font-size:1.4rem;color:rgb(255 255 255/70%);background-color:transparent;border-radius:0rem;padding:0 .5rem 0 .5rem;box-sizing:border-box;}
.playchange span {float:right;width:auto;height:4.6rem;font-size:1.4rem;color:#ccc;display:block;padding:0 1.0rem;}
.playchange span svg {display:inline-block;width:2.0rem;height:2.0rem;vertical-align:middle;fill:#ccc;}
.playchange span:after {content:"";display:none;width:0.05rem;height:0.05rem;border-width:0.02rem 0.02rem 0 0 ;border-style:solid;border-color:#ccc;transform:rotate(135deg);margin-left:0.08rem;top:-0.03rem;position:relative;z-index:0;}
.playchange h2 {font-size:1.4rem;font-weight:normal;display:block;overflow:hidden;height:4.6rem;text-align:center;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}

nav {display:block;text-align:center;font-size:0;width:100%;box-sizing:border-box;padding:0 .10rem;}
nav ul{display: flex; align-items: center; width: 34rem; margin: 0 2.7rem}
nav li {display:inline-block;font-size:1.6rem;box-sizing:border-box;padding:0rem;margin-right:1.8rem;}
nav li.on{}
nav li a {display:flex; align-items: center; flex-direction: column;}

nav li a b {font-size: 1.5rem; color: #A2A2A2; font-weight: normal; padding-bottom: .4rem}
nav li.on b{border-bottom: .2rem solid #fff; color: #fff; }
nav li a img{width: 5rem; height: 5rem; display: block; margin-bottom: .6rem}

/*.listbox {margin:1.0rem 1.0rem 0 1.0rem;background-color:#f3f3f3;border-radius:1.0rem;padding:0 0.5rem;box-sizing:border-box;}*/
.listbox>dt {display:block;height:4.0rem;line-height:4rem;font-size:1.6rem;position:relative; color: #181818;display: flex; align-items: center; justify-content: space-between;}
.listbox>dt b {font-weight: 600;}
.listbox.vip-list>dt b.vip{
    font-weight: 600;
    font-size: 2.1rem;
    color: #F3AE44;
    line-height: 2.9rem;
    text-align: left;
    font-style: normal;
    text-transform: none;
}
.listbox.vip-list dd p{
    font-weight: 400;
    font-size: 1.3rem;
    color: #8F9096;
    line-height: 1.8rem;
    text-align: left;
    font-style: normal;
    text-transform: none;
}
.listbox>dt .reflush { font-size:1.4rem;color:#A1A1A1; display: flex; align-items: center;}
.listbox>dt .reflush img{ display: block; margin-left: .3rem; width: .6rem; height: 1rem}
.listbox>dd {padding:0rem 0rem .5rem 0rem;position:relative;}
.playlet-home .vip-list .reflush{color: #F2F2F7;}
i.ico {display:inline-block;vertical-align:middle;width:.20rem;height:.20rem;margin-left:.05rem;}
i.ico.rank {background:url(../fonts/rank.svg) center no-repeat;background-size:100% 100%;}

dl.listbox{
    width: 34.5rem; margin: 0 auto;
}
/*.piclist {font-size:0;}*/
ul.piclist{display: flex; flex-wrap: wrap; gap: .7rem}
.js ul.piclist{ justify-content: start; }
.piclist li {display:inline-block;vertical-align:top;width:10.9rem; margin-bottom: .8rem;}
/*.piclist li a {display:block;border-radius:0.8rem;padding:0.5rem;}*/
.piclist li a:active {background-color:#fff;box-shadow:0 0 .10rem rgb(0 0 0/15%)}
.piclist li img {display:block;margin:0 auto;width:100%;height:100%;object-fit:cover;object-position:center;border-radius:.5rem;}

.piclist li h3 {font-size:1.5rem;line-height:2.0rem;height:2.0rem;overflow:hidden;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:400; color: #181818; }
.piclist li.lock a {position:relative;}
.piclist li.lock a .imgshowbox:after {content:"";display:block;top:0;left:0;width:100%;height:100%;z-index:2;background:url(../fonts/lock.svg) center no-repeat rgb(0 0 0/100%);background-size:5.0rem 5.0rem;opacity:0.6;position:absolute;box-sizing:border-box;border:0rem solid #fff;border-radius:0.5rem;}

.piclist.hotlist.hide {animation:fadeout .2s forwards;}
.piclist.hotlist.hide.show {animation:fadein .2s forwards;}

.addzj {position:absolute;top:50%;right:0;width:6.0rem;text-align:center;font-size:1.4rem;color:#fff;text-shadow:0 0 0.4rem #000;z-index:2;}
.addzj a:before {content:"";display:block;width:4.0rem;height:4.0rem;background:url(../fonts/fav.svg) center no-repeat;background-size:contain;margin:0 auto 0.1rem auto;}
.addzj a.following:before {background:url(../fonts/faved.svg) center no-repeat;background-size:contain;}
.addzj a {color:#fff;display:block;background-color:rgb(0 0 0/10%);border-radius:0.5rem;padding:0.5rem  0 1.0rem 0;}

.db {position:absolute;top:50%;right:0;width:6.0rem;text-align:center;font-size:1.4rem;color:#fff;text-shadow:0 0 0.4rem #000;z-index:2;}
.db a:before {content:"";display:block;width:4.0rem;height:4.0rem;background:url(../fonts/db.svg) center no-repeat;background-size:contain;margin:0 auto 0.1rem auto;}
.db a.following:before {background:url(../fonts/db.svg) center no-repeat;background-size:contain;}
.db a {color:#fff;display:block;background-color:rgb(0 0 0/10%);border-radius:0.5rem;padding:0.5rem  0 1.0rem 0;}
.dbcont {font-size:1.4rem;text-align:left;width:30rem;}
.dbcont dd input {font-size:1.5rem;border:1px solid #ccc;border-radius:0.5rem;background-color:#f3f3f3;padding:.5rem;display:block;width:100%;box-sizing:border-box;}
.dbcont dd textarea {font-size:1.5rem;border:1px solid #ccc;border-radius:0.5rem;background-color:#f3f3f3;padding:.5rem;display:block;width:100%;box-sizing:border-box;height:18rem;}
.dbcont dt {padding:.5rem 0;}
.dbcont dd {display:block;padding:0 0 .5rem 0;}
.dbcont > span {display:block;padding:1rem 0;text-align:center;color:#666;font-size:0;position:relative;}
.dbcont>span em {display:inline-block;font-size:1.2rem;color:#999;padding:0 1rem;vertical-align:middle;font-style:normal;position:relative;z-index:1;background-color:#fff;}
.dbcont >span:after {content:"";display:inline-block;width:10rem;height:0;border-width:1px 0;border-style:solid;border-color:#ccc;vertical-align:middle;position:absolute;z-index:0;left:0;top:50%;margin-top:-1px;width:100%;}
.dbpopbox {padding:1rem 0;}
.dbpopbox h2 {display:block;font-size:1.8rem;line-height:120%;padding-bottom:1.5rem;}

.readgo {position:fixed;left:0;bottom:30%;padding:0.5rem;z-index:3;}
.readgo a {display:block;width:10.0rem;box-sizing:border-box;padding:0.5rem;text-align:center;border:0.2rem solid #e96b00;background-color:#faac31;border-radius:1.0rem;font-size:1.2rem}
.readgo a img {width:100%;border-radius:0.6rem;margin-bottom:0.2rem;}
.readgo a h3 {display:inline-block;background-color:#e24c00;color:#fff;border-radius:3.0rem;padding:0.2rem 1.0rem;font-weight:normal;text-shadow:0 0 0.2rem rgb(0 0 0/10%);}

.mainpiclist {font-size:0;padding:0.5rem;}
.mainpiclist .none{
    position: absolute;
    top: 24%;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    flex-direction: column;
}
.mainpiclist .none span{
    font-weight: 400;
    font-size: 1.5rem;
    color: #9C9C9C;
    margin-bottom: 2.0rem;
}
.mainpiclist .none button{
    width: 12.2rem;
    height: 4rem;
    border-radius: .5rem;
    font-size: 1.7rem;
}
.mainpiclist ul {
    width: 34.5rem;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    gap: 1.2rem;
}
.mainpiclist li {vertical-align:top;width:calc(33.33% - .8rem);box-sizing:border-box;margin-top: .5rem}
.mainpiclist li a {display:block;border-radius:.6rem;position:relative;z-index:1;overflow:hidden;}

.mainpiclist li img {display:block;margin:0 auto;width:100%;height:100%;object-fit:cover;object-position:center;border-radius:.5rem;}
.mainpiclist li h3 {font-size:1.4rem;line-height:2.0rem;height:2.0rem;overflow:hidden;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:normal;padding:.6rem 0 0rem 0;}
.mainpiclist.rank li em {position:absolute;top:6.3rem;left:-7.7rem;width:20.0rem;height:2.0rem;line-height:1.6rem;text-align:center;font-size:1.4rem;font-weight:bold;color:#fff;background-color:#ff1f00;transform:rotate(-45deg);transform-origin:0 0;padding-top:3.0rem;border-bottom:0.1rem solid #b21500;box-shadow:0 0 1.5rem rgb(0 0 0/40%);font-style:normal;z-index:2;}
.mainpiclist.rank li:nth-child(2) em {background-color:#ff5e00;border-bottom:0.1rem solid #cc4b00}
.mainpiclist.rank li:nth-child(3) em {background-color:#ff9400;border-bottom:0.1rem solid #c47200}
.search-readform .readbox{height: calc(100% - 5.2rem); position: relative}
.search-readform .readbody{padding-top: 0; height: 100%;}
.search-readform .search-title-input{width: 26.0rem; height: 3.8rem;background: #F7F7F7; border-radius: .7rem; display: flex; align-items: center; justify-content: space-between}
.search-readform .search-title-input input{border: 0; flex-grow: 1; height: 100%; background: #f7f7f7; font-size: 1.4rem; color: #181818;}
.search-readform .search-title-input img{width: 0.9rem;height: 0.9rem; margin: 0 1.3rem;}
.search-readform .search-title-input .search-icon{width: 1.2rem;height: 1.2rem;}
.search-readform .nav-header-title span.button{ font-size: 1.6rem; color: #181818; }


.linepiclist {display:block;padding:0rem 0.5rem 1.0rem 0.5rem;}
.linepiclist li {display:block;background-color:#f3f3f3;margin:1.0rem 0.5rem 0 0.5rem;border-radius:1.0rem;padding:1.0rem;box-sizing:border-box;}
.linepiclist li>div {position:relative;z-index:0;height:15.0rem;}
.linepiclist li .imgshowbox {display:block;width:10.0rem;height:15.0rem;float:left;object-fit:cover;border-radius:0.5rem;overflow:hidden;margin-right:1.0rem;margin-top:0;padding:0;}
.linepiclist li h3 {display:block;overflow:hidden;width:auto;height:6.0rem;line-height:3.0rem;overflow:hidden;font-size:2.0rem;padding-top:0rem;padding-right:3.5rem;font-weight:normal;}
.linepiclist li span {font-size:1.4rem;height:2.0rem;line-height:2.0rem;overflow:hidden;display:block;padding-bottom:0rem;padding-top:1.0rem;color:#f30;}
.linepiclist li em {font-size:1.4rem;height:2.0rem;line-height:2.0rem;overflow:hidden;display:block;position:absolute;left:11.0rem;bottom:0.5rem;font-style:normal;color:#666;}
.linepiclist li>div a {position:absolute;right:0rem;bottom:0rem;font-size:1.4rem;background-color:#00bb93;color:#fff;border-radius:0.5rem;padding:0.5rem 1.5rem;}
.linepiclist li>div dl {position:absolute;top:0.5rem;right:0.5rem;}
.linepiclist li>div dl dt {display:block;width:2.4rem;height:2.4rem;}
.linepiclist li>div dl dt button {display:block;width:2.4rem;height:2.4rem;background:url(../fonts/menu.svg) center no-repeat;background-size:100% 100%;border:0;background-color:transparent;opacity:0.5;}
.linepiclist li>div dl dt button:active {opacity:1;}
.linepiclist li>div dl dd {position:absolute;right:0;top:2.0rem;display:none;}
.linepiclist li>div dl.show dd {display:block;}
.linepiclist li>div dl dd button {display:block;border:0;background:transparent;font-size:1.4rem;white-space:nowrap;background-color:#666;padding:0.5rem 1.0rem;border-radius:0.5rem;color:#fff;}

.homerank {display:block;margin:0.5rem 1.0rem;}
.homerank .swiper {display:block;position:relative;overflow:hidden;height:32.0rem;}
.homerank .swiper-slide {width:16.0rem;height:auto;text-align:center;transform:scale(0.8);transition:all .3s;}
.homerank .swiper-slide.swiper-slide-active {width:15.0rem;transform:scale(1)}
.homerank .swiper-slide img {width:100%;height:100%;display:block;margin:0 auto;object-fit:cover;border-radius:1.0rem;overflow:hidden;}
.homerank .swiper-slide.swiper-slide-active img {}
.homerank .swiper-slide h3 {display:inline-block;margin:1.0rem 0;background-color:#00bb93;border-radius:3.4rem;height:3.4rem;line-height:3.4rem;padding:0 1.5rem;display:none;color:#fff;font-weight:normal;}
.homerank .swiper-slide.swiper-slide-active h3 {display:inline-block;}

.mybox {display:block;}
.myhead {padding:1.0rem;height:9.0rem;}
.myhead img {display:block;float:left;width:9.0rem;height:9.0rem;margin-right:1.0rem;border-radius:50%;overflow:hidden;}
.myhead b {display:block;overflow:hidden;height:3.0rem;line-height:3.0rem;padding:1.8rem 0 0.5rem 0;font-size:1.8rem;font-weight:normal;}
.myhead span {display:block;overflow:hidden;height:2.0rem;line-height:2.0rem;font-size:1.4rem;color:#666;}
.mycoin {margin:0 1.5rem 1.0rem 1.5rem;font-size:1.4rem;height:3.0rem;line-height:3.0rem;}
.mycoin button {display:inline-block;vertical-align:top;width:auto;height:2.6rem;line-height:2.6rem;padding:0 1.5rem;color:#fff;background-color:#f30;font-size:1.4rem;border:0;border-radius:3.0rem;margin-left:1.5rem;margin-top:0.2rem;}
.mycoin b {color:#f30;}

.mymember {display:block;margin:0 1.0rem 1.0rem 1.0rem;background:#f7da7c;border-radius:1.0rem;background:linear-gradient(to right,#ffa71b,#ff8b28);padding:1.0rem;color:#fff;position:relative;}
.mymember .member {display:block;padding-bottom:0.5rem;height:3.0rem;line-height:3.0rem;font-size:1.6rem;}
.mymember .member:before {content:"";display:inline-block;vertical-align:top;width:2.0rem;height:2.0rem;background:url(../fonts/member.svg) center no-repeat #fff8db;background-size:70%;border-radius:50%;margin-right:0.6rem;margin-top:0.5rem;}
.mymember .membertxt {border-radius:1.0rem;padding:0.5rem;background:linear-gradient(to right,rgb(226 97 0 / 0.80),rgb(226 97 0 / 0));display:inline-block}
.mymember>span {position:absolute;top:50%;right:1.0rem;background-color:#ffe16b;color:#672300;padding:0rem 1.0rem;border-radius:5.0rem;height:3.0rem;line-height:3.0rem;margin-top:-1.5rem;}

.mynav {margin:0 1.0rem 1.0rem 1.0rem;background-color:#f3f3f3;padding:0rem;border-radius:1.0rem;overflow:hidden;}
.mynav li {display:block;padding:0rem;border-bottom:1px solid #fff;}
.mynav li:last-child {border:0;}
.mynav li a {display:block;height:5.6rem;line-height:5.6rem;position:relative;z-index:0;font-size:1.6rem;}
.mynav li a:active {background-color:rgb(0 0 0/3%);}
.mynav li a i {display:block;width:5.0rem;height:5.6rem;float:left;margin:0 0.5rem 0 0.5rem;}
.mynav li a:after {content:"";display:block;width:0.8rem;height:0.8rem;border-width:0.2rem 0.2rem 0 0 ;border-style:solid;border-color:#ccc;position:absolute;top:50%;right:1.5rem;margin-top:-0.6rem;transform:rotate(45deg)}
.mynav li:nth-child(1) a i {background:url(../fonts/myn1.svg) center no-repeat;background-size:60%;}
.mynav li:nth-child(2) a i {background:url(../fonts/myn2.svg) center no-repeat;background-size:50%;}
.mynav li:nth-child(3) a i {background:url(../fonts/myn3.svg) center no-repeat;background-size:45%;}
.mynav li:nth-child(4) a i {background:url(../fonts/myn4.svg) center no-repeat;background-size:55%;}
.mynav li:nth-child(5) a i {background:url(../fonts/myn7.svg) center no-repeat;background-size:45%;}
.mynav li:nth-child(6) a i {background:url(../fonts/myn5.svg) center no-repeat;background-size:50%;}
.mynav li:nth-child(7) a i {background:url(../fonts/myn6.svg) center no-repeat;background-size:50%;}

.mytxt {margin:0 1.0rem 1.0rem 1.0rem;padding:1.0rem;color:#333;line-height:180%;font-size:1.4rem;}

.readpop {position:absolute;top:0%;left:0;width:100%;height:100%;display:none;z-index:4;overflow:hidden;background-color:rgb(0 0 0/30%);opacity:0;}
.readpopbg {display:block;position:absolute;z-index:0;width:100%;height:100%;top:0;left:0;}
.readpopbox {background-color:#fff;border-radius:1.6rem 1.6rem 0 0;box-sizing:border-box;position:absolute;left:0;z-index:2;bottom:-100%;width:100%;height:auto;z-index:5;max-height:80%;overflow:hidden;overflow-y:auto;min-height: 60%;}
.readpop.show {display:block;animation:fadein .2s forwards;}
.readpop.show .readpopbox {animation:showtop .3s forwards;}
@keyframes fadein {0%{opacity:0;}100%{opacity:1;}}
@keyframes showtop {0%{bottom:-100%;}100%{bottom:0}}

.toppop {position:fixed;top:0%;left:0;width:100%;height:100%;display:none;z-index:4;overflow:hidden;opacity:0;pointer-events:none;text-align:center;box-sizing:border-box;padding:1.0rem;}
.toppopbg {display:block;position:absolute;z-index:0;width:100%;height:100%;top:0;left:0;}
.toppopbox {background-color:#fff;border-radius:1.5rem;box-sizing:border-box;position:relative;left:0;z-index:2;top:-100%;width:auto;height:auto;z-index:5;max-height:80%;overflow:hidden;overflow-y:auto;display:inline-block;max-width:38.0rem;box-shadow:0 0 3.0rem rgb(0 0 0/50%);border:0rem solid #ddd;min-width:26.0rem;box-sizing:border-box;}
.toppop.show {display:block;animation:fadein .2s forwards;}
.toppop.show .toppopbox {animation:showtop2 .3s forwards;}
.toppoptxt {font-size:1.6rem;padding:1.5rem 3.0rem;}
@keyframes showtop2 {0%{top:-100%;}100%{top:0}}

.fuli {border-radius:1.5rem;padding:0 2rem 1rem 2rem;background:linear-gradient(to bottom,#ffa12f,#ffdb69);text-align:center;overflow:hidden;display:block;position:relative;}
.fulipop .popbody {background-color:rgb(128 21 0)}
.fuli h2 {display:inline-block;font-size:1.2rem;line-height:2.6rem;padding:0 2rem;background-color:rgb(212 82 0);color:#fff152;border-radius:0 0 1rem 1rem;position:relative;z-index:1;}
.fuli .fulibox {padding:.8rem 0;position:relative;z-index:1;}
.fuli h3 {display:block;font-size:1.4rem;color:#fff500;text-shadow:0 0 5px #51430b;}
.fuli b {display:block;font-size:2rem;padding:0 0 1rem 0;color:#a81100;text-shadow:0 0 .5rem #fff;}
.fuli h4 {display:inline-block;font-size:2rem;color:#a81100;text-shadow:0 0 .5rem #fff;}
.fuli:after {width:150%;height:150%;background:linear-gradient(to bottom,rgb(0 0 0/0.1),rgb(0 0 0/0));display:block;content:"";position:absolute;top:90%;left:150%;transform:rotate(20deg);transform-origin:center;margin-top:-75%;margin-left:-75%;}
.fuli:before {width:150%;height:150%;background:linear-gradient(to bottom,rgb(0 0 0/0.1),rgb(0 0 0/0));display:block;content:"";position:absolute;top:90%;left:-50%;transform:rotate(-20deg);transform-origin:center;margin-top:-75%;margin-left:-75%;}
.fuli .vipcard {display:inline-block;background-color:rgb(255 255 255/0.3);border:2px solid rgb(255 255 255/.6);border-radius:1rem;padding:1.5rem;margin:1rem 0 0 0;}

.cz {padding:1.0rem;}
.cz dl {display:block;}
.cz dl dt {display:block;padding:0.5rem;position:relative;}
.cz dl dt b {display:block;font-weight:normal;font-size:1.6rem;padding-bottom:.8rem;}
.cz dl dt span {display:block;font-size:1.4rem;color:#666;}
.cz dl dt span i {display:inline-block;vertical-align:top;background-color:#eee;border-radius:2.0rem;color:#333;padding:.5rem 1.0rem;font-style:normal;margin:0 .5rem .5rem 0;}
.cz dl dt em {font-style:normal;position:absolute;right:.5rem;bottom:.5rem;font-size:1.4rem;color:#666;}
.cz dl dd {display:block;padding:.5rem;}
.cz .coinline {display:block;border-top:1px solid rgb(255 175 56/40%);height:2.0rem;margin-top:2.0rem;position:relative;}
.cz .coinline:before {display:block;width:3.0rem;height:3.0rem;position:absolute;content:"";left:50%;top:-1.5rem;margin-left:-1.5rem;background:url(../fonts/coin.svg) center no-repeat #fff;background-size:60% 100%;border:1px solid rgb(255 175 56/40%);border-radius:50%;overflow:hidden;}
.cz dl dd ul {display:block;font-size:0;}
.cz dl dd ul li {display:inline-block;vertical-align:top;width:50%;box-sizing:border-box;padding:.5rem;}
.cz dl dd ul li a {display:block;width:100%;height:8.0rem;border-radius:1.0rem;border:.2rem solid #eee;line-height:8.0rem;text-align:center;transition:transform .2s;}
.cz dl dd ul li a:active {transform:scale(1.05)}
.cz dl dd ul li a>div {display:inline-block;vertical-align:middle;font-size:1.2rem;line-height:150%;}
.cz dl dd ul li a h3 {display:inline-block;height:2.0rem;vertical-align:middle;width:100%;overflow:hidden;font-size:2.0rem;font-weight:normal;color:#f30;font-weight:bold;margin-bottom:.2rem;}
.cz dl dd ul li a h3 em {font-size:1.6rem;font-style:normal;}
.cz dl dd ul li a h4 {font-size:1.4rem;font-style:normal;font-weight:normal;text-decoration:line-through;color:#666;line-height:1.6rem;}
.cz dl dd ul li.best a h4{color:#f7ff3b;}
.cz dl dd ul li a h4 em {font-style:normal;}
.cz dl dd ul li a span {display:inline-block;vertical-align:middle;height:auto;color:#666;line-height:100%;color:#663300}
.cz dl dd ul li a b {display:inline-block;width:100%;vertical-align:middle;height:2.0rem;font-weight:normal;color:#f60;}
.cz dl dd ul li.better a {border-color:#fcc869;background-color:#fff7ce}
.cz dl dd ul li.best a {border-color:#cc0000;background-color:#e61f1f;color:#fffa21}
.cz dl dd ul li.best a h3 {color:#fcff00;}
.cz dl dd ul li.best a span {color:#fff;}
.cz dl dd ul li.best a b {color:#ffc;}

.js {padding:3rem 1.5rem 1rem 1.5rem}
.js .series-info {display: flex;}
.js .series-info img{width: 6.3rem; height: 8.9rem; border-radius: .6rem;}
.js .series-info .series{margin-left: 1.1rem; width: 20.0rem;}
.js .playlet-info{display: flex; justify-content: space-between; align-items: center;}
.js .playlet-info .binge-watch button{
    font-weight: 400;
    font-size: 1.3rem;
    color: #4B4B4B;
    line-height: 1.8rem;
    width: 7.5rem;
    height: 3.2rem;
    background: linear-gradient( 90deg, #F9696A 0%, #FF4D6D 50%, #EEB165 100%);
    border-radius: .4rem;
    outline: none;
    border: 0;
    color: #fff;
}
.js .series-info .series .playlet-title{display: flex; align-items: center;}
.js .series-info .series .playlet-title img{
    width: .6rem; height: 1.2rem
}
.js .series-info .series h3 {
    font-weight: 600;
    font-size: 1.7rem;
    color: #000000;
    line-height: 2.4rem;
    width: 16.7rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.js .series-info .series span.series-count{
    font-weight: 400;
    font-size: 1.3rem;
    color: #4C4C4C;
    line-height: 1.8rem;
    display: block;
    margin: .8rem 0; 
}
.js .series-info .series .tag{
    display: flex;
    flex-wrap: wrap;
}
.js .series-info .series .tag span{
    margin-right: .8rem;
    display: block;
    text-align: center;
    width: 5.5rem;
    height: 2.5rem;
    line-height: 2.5rem;
    background: #F7F7F7;
    border-radius: .4rem;
    font-weight: 400;
    font-size: 1.3rem;
    color: #4B4B4B;
    margin-bottom: .7rem;
}
/*.js dl {display:block;}*/
.js dl dt {display:block;padding:.5rem;position:relative;}
.js dl.intro dt{padding: 0 !important; white-space: break-spaces;}
.js dl dt b {display:block;font-weight:normal;font-size:1.6rem;padding-bottom:.8rem;}
.js dl dt span {display:flex;font-size:1.4rem;color:#666; flex-wrap: wrap;}
.js dl dt span i {
    font-weight: 600;
    font-size: 1.5rem; 
    color: #9F9F9F; 
    line-height: 2.1rem;
    font-style: normal;
    text-transform: none;
    margin-right: .8rem;
    display: block;
    width: 6rem;
    margin-bottom: .8rem;
}
.tab-content dt i{
    width: 5.5rem !important;
}
.js dl.intro dt span {
    font-weight: 400;
    font-size: 1.4rem;
    color: #181818;
    line-height: 2.3rem;
    font-weight: 400;
    font-style: normal;
    text-transform: none;
}
.js .meun ul{display: flex;margin: 2rem 0;}
.js .meun ul li {
    font-weight: 600;
    font-size: 1.7rem;
    color: #9A9A9A;
    line-height: 2.5rem;
    margin-right: 2.0rem;
}
.js .meun ul li.on{
    color: #181818
}
.js dl dt span i.now {color: #181818; }
.js dl dt em {font-style:normal;position:absolute;right:.5rem;bottom:.5rem;font-size:1.4rem;color:#666;}
/*.js dl dd {display:block;padding:5rem;}*/
.js dl dd .piclist li {
    width:5rem; height: 5rem; line-height: 5rem; border-radius: .5rem; text-align: center; margin-bottom: 0rem;
    /*margin-right: .2rem;*/
}
.js dl dd .piclist.series-list{ gap: .8rem }
.js dl dd .piclist.series-list li{background: #F7F7F7; position: relative}
.js dl dd .piclist.series-list li img{
    position: absolute; 
    right: 0; top: 0; 
    width: 2.4rem; height: 1.3rem;
    border-radius: 0 .5rem 0 0;
}
.js dl dd .piclist.series-list li span.series-item-num{
    font-weight: 400;
    font-size: 1.5rem;
    color: #181818;
}
.more-playlet{margin-top: 4.1rem;}
.more-playlet .piclist li {
    width: calc(33.33% - .9rem) !important;
    height: auto !important;
}
.more-playlet > h4 {
    margin-bottom: 1.6rem;
    font-weight: 600;
    font-size: 1.8rem;
    color: #181818;
}
.js dl dd .piclist li a {
    font-weight: 400;
    font-size: 1.5rem;
    color: #181818;
}
.js dl dd .piclist li.series-number-select{
    background: #FEEFE8;
}
.js dl dd .piclist li.series-number-select a{
    color:#F96624
}

/*@media screen and (max-width:1280px) {
    .js dl dd .piclist li {width:20%;}
}
@media screen and (max-width:1000px) {
    .js dl dd .piclist li {width:25%;}
}
@media screen and (max-width:768px) {
    .js dl dd .piclist li {width:33.33%;}
}*/

.txtlist {display:block;}
.txtlist li {display:block;padding:1.5rem;position:relative;border-bottom:1px solid #ddd;}
.txtlist li h3 {display:block;padding-right:5.0rem;font-size:1.6rem;font-weight:normal;margin-bottom:.8rem;}
.txtlist li span {display:block;font-size:1.2rem;color:#999;}
.txtlist li b {position:absolute;top:50%;right:1.0rem;width:auto;height:3.0rem;line-height:3.0rem;margin-top:-1.5rem;font-size:2.0rem;color:#f30;font-weight:normal;}

.Swiper3 {display:block;position:absolute;top:0;left:0;width:100%;height:100%;overflow:hidden;border-width: 0;box-sizing:border-box;border-color:#000;border-style:solid;}
.Swiper3 .swiper-slide{}
/*.Swiper3 .swiper-slide {position: relative}
.Swiper3 .swiper-slide::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url(https://cdn.17video.net/UploadFiles/wjl_cover/6D3AAE1087.png);*/ /* 背景图路径 */
    /*background-size: cover;
    
    filter: blur(10px); 
    z-index: -1; 
}*/

.Swiper3 .swiper-slide img {width:100%;height:100%;object-fit:contain;}

.Swiper3 .swiper-slide video {
    width:100%;  
    height: calc(100% - 5.8rem);
    object-fit: cover;
}
.playlet-index-home .swiper-slide video{
    height:100%;
}
.paused-icon {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 999;
    width: 5rem !important;
    height: 5rem !important;
    display: none;
}
.popbox {position:absolute;top:0;left:0;z-index:5;width:100%;height:100%;text-align:center;display:none;}
.popbg {display:block;position:absolute;top:0;left:0;z-index:0;width:100%;height:100%;}
.popbody {position:relative;height:auto;max-width:39.0rem;margin:auto auto;background-color:#fff;z-index:1;border-radius:1.5rem;padding:1.0rem 2.0rem;background-color:#fff;box-shadow:0 0 1.5rem rgb(0 0 0/30%);font-size:1.4rem;box-sizing:border-box;display:inline-block;vertical-align:middle;line-height:120%;}
.popclose {position:absolute;top:-1.0rem;right:-1.0rem;width:3.0rem;height:3.0rem;line-height:2.8rem;text-align:center;font-size:2.0rem;color:#fff;background-color:#666;border-radius:50%;}
.popclose:active {background-color:#444;}
.poptxt {padding:1.0rem;}
.popinput {display:block;text-align:center;padding:1.0rem 0;}
.popinput input {width:15.0rem;font-size:1.4rem;height:2.6rem;line-height:2.6rem;border:.2rem solid #ccc;border-radius:.5rem;background-color:#f3f3f3;display:inline-block;vertical-align:top;margin:0 .5rem;}
.popinput button {display:inline-block;vertical-align:top;height:3.1rem;line-height:2.7rem;background-color:#0884e1;color:#fff;padding:0 1.0rem;font-size:1.4rem;border:.2rem solid #0884e1;border-radius:.5rem;margin:0 .5rem;}
.popinput button.gray {background-color:#666;border-color:#666;}
.popinput button.red {background-color:#f60;border-color:#f60;}

.loginbox {text-align:center;}
.loginbox>h2 {display:block;font-size:1.8rem;padding:1.0rem 0;color:#333;}
.loginbtn {text-align:center;font-size:0;padding:.5rem;}
.loginbtn button {display:block;font-size:1.8rem;background-color:#0884e1;border-radius:.6rem;padding:1.0rem 1.4rem;border:0;color:#fff;margin:1.0rem 0;width:100%;box-sizing:border-box;text-align:left;}
.loginbtn button.line {background-color:#00bb93}
.loginbtn button svg {display:inline-block;width:2.0rem;height:2.0rem;fill:#fff;margin-right:.4rem;vertical-align:middle;}
.logintxt {font-size:1.6rem;padding:1.0rem;line-height:150%;max-width:30.0rem;text-align:left;color:#666;}
.logintxt a {color:#0884e1;text-decoration:underline;}

button.daybtn {display:block;width:24rem;margin:1rem auto;text-align:center;background-color:#f60;}

.paybox {text-align:center;}
.paybox>h2 {display:block;font-size:1.8rem;padding:1.0rem 0;color:#333;}
.paybtn {text-align:center;font-size:0;padding:.5rem;}
.paybtn button {display:block;font-size:1.8rem;background-color:#0884e1;border-radius:.6rem;padding:1.0rem 1.4rem;border:0;color:#fff;margin:1.0rem 0;width:100%;box-sizing:border-box;text-align:left;}
.paybtn button.line {background-color:#00bb93}
.paybtn button svg {display:inline-block;width:2.0rem;height:2.0rem;fill:#fff;margin-right:.4rem;vertical-align:middle;}

.paypalbox {position:relative;padding:2.0rem;margin-top:4.6rem;}

.buytxt {font-size:1.6rem;padding:0 0 1.0rem 0;}
.buytxt .buyConfirm_content {padding:2.0rem 0;}
.buytxt button {display:inline-block;font-size:1.6rem;background-color:#0884e1;color:#fff;border:0;padding:.8rem 1.8rem;border-radius:.5rem;margin:.3rem;}

.pageloading {position:fixed;top:0;left:0;width:100%;height:100%;z-index:10;background:rgb(0 0 0/20%)}
.poploading {position:absolute;top:0;left:0;width:100%;height:100%;z-index:10;background:rgb(0 0 0/20%)}
.pageloading .loading, .poploading .loading {position:absolute;width:12.0rem;height:12.0rem;top:50%;left:50%;margin:-6.0rem auto auto -6.0rem;}
.pageloading .loading:before, .poploading .loading:before {content:"";display:block;top:0;left:0;z-index:1;background:url(../fonts/loading.svg) center no-repeat;background-size:50%;animation:zz .5s linear infinite;width:100%;height:100%;position:absolute;top:0;left:0;}
.pageloading .loading:after, .poploading .loading:after  {content:"";display:block;top:0;left:0;z-index:0;border-radius:50%;width:100%;height:100%;position:absolute;top:0;left:0;}
@keyframes zz {0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}
i.loadingico {display:block;width:100%;height:100%;vertical-align:middle;background:url(../fonts/loading.svg) center no-repeat;background-size:90%;animation:zz .5s linear infinite;margin:0 .2rem;pointer-events:none;opacity:1;}
i.loadingico2 {display:block;width:100%;height:100%;vertical-align:middle;background:url(../fonts/loading2.svg) center no-repeat;background-size:90%;animation:zz .5s linear infinite;margin:0 .2rem;pointer-events:none;opacity:1;}
i.loadingico.show {}
i.loadingico.hide {}
@keyframes fadeout {0%{opacity:1;}100%{opacity:0;}}
.loadingicobg {position:absolute;top:0;left:0;width:100%;height:100%;z-index:3;pointer-events:none;display:none;opacity:0;border-radius:1.0rem;background-color:rgb(0 0 0/0%)}
.loadingicobg.show {display:block;animation:fadein .3s forwards;}
.loadingicobox {position:absolute;top:0;width:4.0rem;height:4.0rem;position:absolute;top:50%;left:50%;margin:-2.0rem auto auto -2.0rem;z-index:4; pointer-events:none;opacity:0;}
.loadingicobox.show {animation:fadein .1s  forwards;display:block;}
.loadingicobox.hide {animation:fadeout .5s forwards;}

.payresult {text-align:center;padding:7.6rem 2.0rem 2.0rem 2.0rem;}
.payresult h1 {display:block;font-size:2.4rem;font-weight:bold;color:#f60;margin-bottom:2.0rem;height:auto;line-height:4.0rem;}
.payresult h1 svg {display:block;width:5.4rem;height:5.4rem;vertical-align:top;margin:0 auto;}
.payresult h2 {display:block;padding:1.0rem 0 0 0;font-size:2.0rem;font-weight:normal;color:#666;}
.payresult button {display:inline-block;font-size:1.8rem;color:#fff;background-color:#0884e1;margin:3.0rem 0 0 0;border:0;border-radius:1.0rem;padding:1.5rem 3.0rem;}

.scrollloading {position:relative;width:auto;height:5.0rem;width:5.0rem;margin:0rem auto;border:.10rem solid transparent;}

.imgshowbox {display:block;width:auto;height:15.6rem;position:relative;overflow:hidden;}
.imgshowbox > img {position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;object-position:center;z-index:1;}
.imgshowbox img.imgmask {display:block;width:100%;height:auto;position:relative;z-index:0;}

.imgshowbox .bottom-title{position: absolute; bottom: 0; left: 0; width: 100%; height: 100%; z-index: 99; background: rgba(0, 0, 0, 0.1); border-radius: .5rem;}
.imgshowbox .bottom-title span{font-size: 1.2rem; color: #fff; line-height:  2rem;}
.imgshowbox .bottom-title .all-playlet{display: flex; justify-content: space-between; margin-right: .6rem; width: calc(100% - .6rem);}
.imgshowbox .bottom-title .all-playlet span.free{display: block; width: 3.3rem; height: 1.7rem; line-height: 1.7rem; text-align: center;  font-weight: 400; font-size: 1.1rem;color: #FFFFFF; background: #E2432D;
    border-radius: .5rem 0 .5rem 0;}
.imgshowbox .bottom-title .play-num{display: flex; align-items: center;position: absolute; bottom: 0.3rem; left: 0.4rem;}
.imgshowbox .bottom-title .play-num img{
    display: block;
    width: .7rem; height: .9rem;
    margin-right: .3rem;
    margin-left: .3rem;
}
.piclist li .play-num img {
    width: .8rem;
    height: .8rem;
    display: block;
    border-radius: 0;
    margin-right: .2rem;
    margin-left: .3rem;
    border-radius: 0;
}
.mainpiclist li .play-num img{border-radius: 0;}
/*.imgshowbox .bottom-title .text{flex-grow: 1; display: flex; justify-content:space-between; align-items: center;margin-left: 0.2rem}*/
.removeacc {
    padding: 2.0rem;
    text-align: center;
}
.removeacc>h4 {display:block;font-size:2.0rem;text-align:center;padding:0 0 2.0rem 0;color:#333;}
.removeacc p {display:block;margin:0 0 1.0rem 0;font-size:1.6rem;line-height:150%;text-align:left;}
.removeacc button {display:inline-block;font-size:1.6rem;padding:1.0rem 1.5rem;background:#f30;color:#fff;border-radius:.6rem;border:0;margin:2.0rem 0 0 0;}
.removeacc>div {border:.4rem solid #f5d58a;padding:1.5rem;border-radius:1.5rem;margin:2.0rem 2.0rem 1.0rem 2.0rem;display:block;color:#333;background-color:#fffcf3}

.copyrightbody {position:relative;z-index:1;width:100%;height:auto;padding:5.6rem 1.0rem 1.0rem 1.0rem;box-sizing:border-box;}
.copyrightbody h2 {padding:1.0rem 0 0 0;font-size:2.5rem;font-weight:normal;text-align:center;}
.copyrightbody p {margin:1.0rem 0;text-indent:2.4rem;display:block;line-height:160%;font-size:1.7rem;}
.copyrightbody b {margin:1.5rem 0 1.0rem 0;text-indent:0rem;display:block;border-top:1px dashed #999;padding-top:1.5rem;font-size:1.7rem;}
.copyrightbody hr {margin:3.0rem 0;display:block;opacity:0;}



.headsearch .headsearchbtn {margin-right:1.5rem; display: flex;}
.headsearch .headsearchbtn button{display:flex; align-items: center; color: #3D3F46; background: none; font-size: 1.5rem}
.headsearch .headsearchform button .icon{width: 2rem; height: 2rem;}
.headsearch .headsearchbtn button img.search-icon{margin-left: .4rem; width: 1.7rem}
.headsearch .headsearchbtn>a {display:block;border:0;background:none;width:100%;height:100%;font-size:1.6rem;color:#fff;line-height:4.6rem;}
.headsearch .headsearchbtn>a img{display: block; width: 1.6rem; height: 1.6rem;}
/*.headsearch .headsearchbtn>button svg {fill:#fff;display:inline-block;width:3rem;height:100%;box-sizing:border-box;padding:.3rem;vertical-align:top;}*/
.headsearch .headsearchform {width:auto;padding-right:.7rem;display:none;}
.headsearch .headsearchform.show {display:block;}
.headsearch .headsearchform button {display:block;border:0;background:none;width:3.6rem;height:4.6rem;position:absolute;top:0;right:.7rem;}
.headsearch .headsearchform button svg {fill:#3D3F46;display:block;width:100%;height:100%;box-sizing:border-box;padding:.3rem;}
.headsearch .headsearchform input {display:block;height:3rem;box-sizing:border-box;font-size:1.6rem;color:#3D3F46;border:2px solid #3D3F46;background-color:transparent;position:relative;border-radius:3.0rem;background-color:rgb(255 255 255/15%);width:4.0rem;transition:all .3s;padding:0 1.5rem;-webkit-appearance:none!important;appearance:none;outline:0;lighting-color:transparent;}
.headsearch .headsearchform input:-internal-autofill-selected, 
.headsearch .headsearchform input:-internal-autofill-previewed 
{background-color:transparent;transition: background-color 50000s ease-out 0.5s;color:#fff!important;}
.headsearch .headsearchform.show input {width:22.0rem;animation:inputw .3s forwards;}
.headsearchbox {position:absolute;top:4.6rem;left:0;width:37.5rem;height:auto;background-color:#fff;z-index:2;box-shadow:0 0 .2rem rgb(0 0 0/50%);display:none;}
@keyframes inputw {0%{width:4.0rem;}100%{width:22.0rem;}}
.headsearchbox>div.search {display:block;padding:1.5rem;}
.headsearchbox>div.search input {display:block;width:34.0rem;height:4.4rem;box-sizing:border-box;border:.2rem solid #ccc;background-color:#f3f3f3;border-radius:1.0rem 0 0 1.0rem;}
.headsearchbox>div.search button {display:block;width:4.4rem;height:4.4rem;position:absolute;top:1.5rem;right:1.5rem;box-sizing:border-box;border:.2rem solid #ccc;background:#ddd;border-radius:0 1.0rem 1.0rem 0;border-left:0;}
.headsearchbox>div.search button:after {display:block;width:1.2rem;height:1.2rem;position:absolute;top:50%;left:50%;border-width:.2rem .2rem 0 0 ;border-style:solid;border-color:#888;transform:rotate(45deg);content:"";display:block;margin:-.7rem auto auto -.8rem;border-radius:.2rem;}
.hotsearch {padding:0 1.5rem 1.5rem 1.5rem;}
.hotsearch li {display:block;padding:0rem;line-height:120%;}
.hotsearch li a {display:block;padding:.9rem;transition:all .2s;font-size:1.5rem;}
.hotsearch li a:active {background-color:#f3f3f3;}
.headsearchboxbg {display:none;position:absolute;top:0;left:0;width:100%;height:100%;z-index:2;background-color:transparent;}
.headsearchform {display:none;}

.catelist {padding:1.5rem 1rem .5rem 1.5rem;}
.catelist dl {display:block;font-size:0;margin:0;padding:0;}
.catelist dt {display:block;vertical-align:top;font-size:1.3rem;float:left;margin:0;padding:0;line-height:3rem;padding-right:.5rem;}
.catelist dd {display:block;font-size:1.4rem;color:#333;overflow:hidden;width:auto;float:none;line-height:3rem;}
.catelist dd span {display:inline-block;font-size:1.4rem;margin:0 .5rem;cursor:pointer;padding:0 .5rem;line-height:3rem;}
.catelist dd span:active {background-color:#f3f3f3;}
.catelist dd span.now {color:#f60;font-weight:bold;text-decoration:underline;}
.catelist dd span.now a {color:#f60;font-weight:bold;text-decoration:underline;}

.fixtopbar {position:fixed;top:0;left:0;width:100%;height:auto;text-align:center;z-index:4;}
.fixtopbar .ios {display:block;margin:0 auto;max-width:41.4rem;background-color:#fff;line-height:5rem;font-size:0;}
.fixtopbar .other {display:block;margin:0 auto;max-width:41.4rem;background-color:#fff;line-height:5rem;font-size:0;}
.fixtopbar .fixtopbarbox {display:block;margin:0 auto;max-width:41.4rem;background-color:#fff;line-height:5rem;font-size:0;position:relative;}
.fixtopbar b {font-size:1.5rem;line-height:110%;vertical-align:middle;padding:0 1rem;font-weight:normal;display:inline-block;}
.fixtopbar .ios b {text-align:left;width:24rem;line-height:1.6rem;max-height:3.2rem;overflow:hidden;}
.fixtopbar span {display:inline-block;width:3.0rem;height:3.0rem;overflow:hidden;vertical-align:middle;}
.fixtopbar span img {display:block;width:100%;height:100%;}
.fixtopbar em {display:inline-block;width:auto;height:auto;vertical-align:middle;}
.fixtopbar em img {display:block;width:auto;height:3rem;border-radius:0.5rem;overflow:hidden;box-shadow:0 0.1rem 0.4rem rgb(0 0 0/20%);border:1px solid #ccc;}
.fixtopbar div.fbbtn {width:153px;height:28px;vertical-align:middle;display:inline-block}
.fixtopbar .close {position:absolute;right:0;top:100%;width:3rem;height:3rem;text-align:center;font-size:2.4rem;line-height:3rem;color:#777;background-color:#ddd;display:block;border:0;}

.appdeskpop {position:fixed;left:0;bottom:0;width:100%;height:100%;z-index:3;display:none;background-color:rgb(0 0 0/30%)}
.appdeskpop>div {position:absolute;left:0;bottom:0;width:100%;height:auto;z-index:1;box-sizing:border-box;padding:1rem;background-color:#fff;border-radius:2rem 2rem 0 0;font-size:1.6rem;}
.appdeskpop em {display:inline-block;width:3rem;height:3rem;border-radius:50%;font-style:normal;color:#fff;background-color:#f60;text-align:center;line-height:3rem;margin-right:1rem;}
.appdeskpop .safariadd {display:block;background-color:rgb(238,237,243);margin-bottom:1rem;padding:1rem;border-radius:1rem;}
.appdeskpop .safariadd2 {display:block;background-color:rgb(238,237,243);padding:1rem;border-radius:1rem;}
.appdeskpop img {display:block;margin:0 auto;max-width:80%;}

.feedbacklist li {display:block;padding:1.5rem ;border-bottom:1px solid #ddd;}
.feedbacklist .feedbackcont {display:block;font-size:1.2rem;line-height:150%;}
.feedbacklist .re {display:block;margin:.8rem 0 0 0;background-color:#f3f3f3;border-radius:1rem;padding:1rem;font-size:1.2rem;line-height:150%;color:#f60;}
.feedbacklist .feedbackdate {display:block;font-size:.8rem;color:#666;}

/*底部*/
.footer-banner {
    width: 100%;
    max-width: 37.5rem;
    height: 5.8rem;
    position: fixed;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0;
    background-color: #161719;
    z-index: 9999;
    display: block;
}
/*.footer-banner.scroll-up{
    background: rgba(0, 0, 0, .8);
    backdrop-filter: blur(1rem) brightness(1.8);
}*/
.playlet-home .header.scroll-up{
    mask-image: none !important;
    background: rgba(0, 0, 0, .8);
}
.footer-banner.scroll-up{
    
    background: #040404 !important;
    background-color: hsla(0deg 2.75% 5.21% / 50%) !important;
    backdrop-filter: blur(1rem)
}
.footer-banner  ul{
    height: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.footer-banner  ul li{ width: 25%; text-align: center;}
.footer-banner  ul li a{color: #7D7D7D; font-size: 1rem; display: flex; flex-direction: column; align-items: center;}
.footer-banner  ul li a img{display: block; width: 2.2rem; height: 2.2rem; margin-bottom: .3rem}

.body-content{height: 100%; max-width: 37.5rem; margin: 0 auto; }
.user-top {
    width: 100%;

    background-size: cover;
}
.lazyload {
    opacity: 0;
    transition: opacity 0.3s;
}
.lazyloaded {
    opacity: 1;
}
.user-top h2{
    font-family: PingFang SC, PingFang SC;
    font-weight: 600;
    font-size: 2.1rem;
    color: #181818;
    line-height: 2.9rem;
    text-align: left;
    font-style: normal;
    text-transform: none;
}
.user-top .info{
    margin-left: 1.5rem;
    padding-top: 6.0rem;
}
.user-top .login-btn {
    margin-top: 1.3rem;
    width: 10.0rem;
    height: 3.5rem;
    background: linear-gradient( 90deg, #F9696A 0%, #FF4D6D 50%, #EEB165 100%);
    border-radius: .4rem;
    border: none;
    color: #fff;
    font-size: 1.5rem;
}
.user-info{
    background: #F2F2F2;
}
.user-info .content {
    
    padding-top: 1rem;
}
.user-info .vip-info{
    width: 35.5rem;
    margin: 2rem auto 0;
    background: url("/Scripts/images/vipcard_info_bg.png");
    border-radius:.8rem;
    background-repeat: no-repeat;
    background-size: cover;
}
.user-info .vip-info .vip-info-open{
    width: 32.5rem;
    margin: 0 auto;
    padding: 1.4rem 0;
    /*border: 1px solid #fae0b4;*/
}
.user-info .vip-info .vip-info-open .open{
    display: flex;
    justify-content: space-between;
}
.user-info .vip-info .vip-info-open .open img{width: 7.2rem; height: 3.2rem;}
.user-info .vip-info .vip-info-open .interests{
    font-family: PingFang SC, PingFang SC;
    font-weight: 400;
    font-size: 1.2rem;
    color: #815C44;
    line-height: 1.7rem;
    text-align: left;
}
.user-info .vip-info .vip-info-open .vip-title{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    margin-top: .9rem;
}
.user-info .vip-info .vip-info-open .vip-title > div{
    width: 50%;
    margin-bottom: .8rem;
    display: flex;
    align-items:  center;
}
.user-info .vip-info .vip-info-open .vip-title > div span{
    display: block;
    font-family: PingFang SC, PingFang SC;
    font-weight: 400;
    font-size: 1.3rem;
    color: #815C44;
    line-height: 1.8rem;
    margin-left: .4rem;
}
.user-info .vip-info .vip-info-open .vip-title > div img{
    display: block;
    width: 1.7rem;
    height: 1.7rem;
}
.user-info .vip-info .open-vip-btn{
    width: 6.8rem;
    height: 3.2rem;
    line-height: 1.3rem;
    font-size: 1.4rem;
    color: #FFEAC9;
    border-radius: .4rem;
    background: linear-gradient( 90deg, #AE784F 0%, #462505 100%);
}
.open-vip-model .countdown p{
    font-size: 1.2rem;
    color: #FF5E54;
}
.user-info .content ul{
    width: 35.5rem;
    margin: 0 auto;
    display: flex;
    background: #fff;
    border-radius: .8rem;
    margin-bottom: 1rem;
}
.user-info .content ul.meun li{width: 25%;}
.user-info .content ul.meun li a{ color: #181818; font-size: 1.4rem; line-height: 3.2rem; display: flex; flex-direction: column; align-items: center;}
.user-info .content ul.meun li a img{display: block; width: 2.8rem; height: 2.8rem;}
.line-name .code{
    width: 35.5rem;
    margin: 0 auto 1rem;
    padding: 1.4rem 0;
    background: #FFFFFF;
    border-radius: .8rem;
}
.line-name .code .input-btn{width: 32.7rem; height: 3.8rem;margin: 0 auto; display: flex; align-items: center}
.line-name .code .input-btn input{
    background: #F2F2F2;
    width: calc(100% - 7.6rem);
    height: 100%;
    border-radius: .4rem 0 0 .4rem;
    font-weight: 400;
    font-size: 1.4rem;
    
    color: #131313;
    line-height: 3.2rem;
    padding: 0 1.4rem;
    border: 0;
    display: block;
}
.line-name .code .input-btn input::placeholder{
    color: #ABABAB;
}
.line-name .code .input-btn button{
    width: 7.6rem;
    height: 3.8rem;
    font-weight: 400;
    font-size: 1.4rem;
    color: #FFFFFF;
    line-height: 3.2rem;
    background: #F86D31;
    border-radius: 0px .4rem .4rem 0px;
}
.line-name .code .input-btn button:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.line-name .code .title{
    display: flex;align-items: center;
    width: 32.7rem; 
    margin: 0 auto 1.4rem;
}
.line-name .code .title h3{
    font-size: 1.6rem;
    font-family: PingFang SC, PingFang SC;
    color: #181818;
    font-weight: 500;
    line-height: 2.2rem;
}
.line-name .code .title span{
    display: block;
    margin-left: .9rem;
    font-size: 1.2rem;
    color: #A4A4A4;
    line-height: 2.8rem;
}
.line-name ul{
    display: flex; flex-direction: column;
}
.line-name ul li{width: 32.5rem; height: 5.0rem;margin: 0 auto; border-bottom: .1rem solid #eee}
.line-name ul li:last-child{border-bottom: 0}
.line-name ul li a{
    width: 100%;
    display: flex;
    height: 100%;
    align-items: center;
    justify-content: space-between
}
.line-name ul li a > div{display: flex; align-items: center;}
.line-name ul li a > div > img{width: 2rem;
    height: 2rem;}
.line-name ul li .icon{width: 2.2rem; height: 2.2rem;}
.line-name ul li .arrowll{width: .7rem; height: 1.3rem;}
.line-name ul li a span{color: #131313; font-size: 2.3rem; margin-left: .6rem;}
.line-name ul.home-ul-list li{display: flex; align-items: center; border-bottom: 0;}
.line-name ul.home-ul-list li > img{width: 2rem; height: 2rem;}
.line-name ul.home-ul-list li a{ border-bottom: .1rem solid #eee; }
.line-name ul.home-ul-list li:last-child a{border-bottom: 0}
.line-name ul.home-ul-list li a span{font-size: 1.6rem}
.user-info .content .wallet{
    font-size: 1.6rem;
    font-family: PingFang SC, PingFang SC;
    color: #181818;
    font-weight: 500;
    margin-left: 0;
}
.user-info .content .detail{
    color: #A5A5A5 !important;
    display: block;
    margin-right: .6rem;
    font-size: 1.4rem;
}
.user-info .content button.pay-btn{width: 6.8rem; height: 3.2rem; line-height: 3.2rem; border-radius: .4rem; font-weight: 400; font-size: 1.4rem; color: #FFFFFF;background: #F86D31}

.user-info .login{display: flex; align-items: center}
.user-info .login > img{display: block; width: 5.4rem; height: 5.4rem; object-fit:cover; border-radius: 50%; margin-right: 1.0rem; border: 1px solid #fff;}
.user-info .login > div{flex-grow: 1}
.user-info .login button{ background: #F96624; font-size: 1.2rem; color: #fff;border: none; border-radius: 1.1rem 0 0 1.1rem; height: 2.4rem; line-height: 2.4rem;display: flex; align-items: center;padding-left: 1.0rem; padding-right: .6rem}
.user-info .login button img{width: .4rem; height: .7rem;margin-right: 0;margin-left: .4rem;}
.user-info .login > div span{font-weight: 400; font-size: 1.2rem; color: #636363; line-height: 1.8rem;}
.user-info .login .author .author-id{display: block; }
.user-info .login > div h4{font-weight: 600; font-size: 1.8rem; color: #181818; line-height: 2.8rem;}
.user-info .login .author{display: flex; flex-direction: column}
.user-info .login .author span.vip{
    width: 8.4rem; height: 2.4rem; 
    line-height: 2.4rem; border-radius: .4rem; 
    border: .1rem solid #ECC3AA;
    font-size: 1.2rem;
    color: #CB6628;
    display: flex; align-items: center
}
.user-info .login .author span.vip-true{
    width: 17rem;
    border: none;
}
.user-info .login .author span.vip img{width: 2.4rem; height: 1.2rem; display: block; margin:0 .3rem}
.edit-user{width: 100%;background: #fff;}
.edit-user .header{display: flex; justify-content: space-between; align-items: center;padding: 0 1.5rem; height: 4.8rem; border-bottom: 1px solid #eee}
.edit-user .header img {width: 1.0rem; height: 1.7rem;}
.edit-user .header .title { font-weight: 400; font-size: 1.8rem; color: #181818; line-height: 2.5rem; }
.edit-user .header .button {font-weight: 400; font-size: 1.5rem; color: #F96624; line-height: 2.1rem;}
.edit-user .van-form .van-cell{
    line-height: 3.2rem;
    
}
.edit-user .van-form .van-cell .van-cell__title span{
    font-weight: 400;
    font-size: 1.5rem;
    color: #787878;
}
.edit-user .van-form .van-cell input{
    font-weight: 400;
    font-size: 1.5rem;
    color: #0A0A0A;
}
.edit-user .van-form .van-field__right-icon .van-icon{font-size: 1rem;}
.edit-user .tag-meun{
    width: 35.5rem;
    margin:  1rem auto 0;
}
.edit-user .tag-meun h4{
    font-weight: 400;
    font-size: 1.5rem;
    color: #787878;
}
.edit-user .tag-meun .tag-list{
    display: flex; justify-content: space-between; flex-wrap: wrap; 
}
.edit-user .tag-meun .van-tag{
    width: 7.6rem;
    height: 3.6rem;
    display: block;
    text-align: center;
    line-height: 3.6rem;
    background: #F7F7F7;
    border-radius: .4rem;
    margin-top: 1rem;
    font-weight: 400;
    font-size: 1.4rem;
    color: #8F8F8F;
}
.edit-user .tag-meun .van-tag.selected{
    background: #F86D31;
    color: #FFFFFF; 
}
.edit-user .tag-meun .van-button{
    width: 100%;
    height: 4.8rem;
    background: linear-gradient( 90deg, #F9696A 0%, #FF4D6D 50%, #EEB165 100%);
    border-radius: .6rem;
    border: none;
    margin-top: 4rem;
    font-weight: 400;
    line-height: 4.8rem;
    font-size: 1.7rem;
    color: #FFFFFF;
}
.edit-user .user{
    padding-bottom: 1.8rem;
}
.user .avatar-box{ display: flex; justify-content: center;}
.user .img-avatar{ width: 7.2rem; height: 7.2rem; }
.user .img-avatar .van-uploader__wrapper, .user .img-avatar .van-uploader__input-wrapper{width: 100%; height: 100%}
.user .img-avatar .van-loading{margin-top: 1rem}
.user .img-avatar img{width: 100%; height: 100%; border-radius: 50%; object-fit: cover;}
.user .avatar-box{ position: relative; text-align: center; margin-top: 2.5rem;}
.user .avatar-box .edit{position: absolute; width: 2.7rem; height: 2.7rem; bottom: 0; right: 50%; transform: translateX(3.8rem); z-index: 999}
.user .info li{height: 5.0rem;display: flex; align-items: center; border-bottom: .1rem solid #eee; padding: 0 1.5rem;}
.user .info li span{font-size: 1.5rem; font-weight: 400; color: #181818;margin-right: 2.8rem;}
.user .info li span.name{ color: #B5B5B5}
.user .info li input{width:calc(100% - 10.0rem);height: 100%;border: none;font-size: 1.5rem; color: #181818}
.layui-layer-loading-icon {
    color: #F96624;
}
.playbody .video-msg .playlet {
    display: flex;
    align-items: center;
    width: 34.5rem;
    margin: 1rem auto 0
}
.playlet-index-home .video-msg .playlet{
    width: 33.2rem;
    margin: .7rem auto 1rem;
}
.playbody .video-msg .playlet p {
    width: 25rem;
    font-weight: 400;
    font-size: 1.3rem;
    color: #e4e9eb;
    line-height: 2.1rem;
    overflow: hidden;
    text-overflow: ellipsis; 
    white-space: nowrap;
    text-shadow: 0 .1rem .1rem rgba(0, 0, 0, 0.3);
}

.playbody .video-msg .playlet span{
    font-weight: 400;
    font-size: 1.3rem;
    color: #F8F8F8;
    text-align: left;
    font-style: normal;
    text-transform: none;
}
.playbody .video-msg .playlet-name{
    display: flex;
    align-items: center;
    width: 34.5rem;
    margin: 0 auto;
}
.playbody .video-msg .playlet-name img.avatar{
    width: 2.6rem;
    height: 3.4rem; 
    border-radius: .5rem;
    object-fit: cover;
}
.playlet-index-home .playlet-name img.avatar {
    width: 3.7rem !important;
    height: 5.3rem !important;
}
.playlet-index-home .playlet-name{
    border-radius: .3rem;

}
.playbody .video-msg .playlet-name span.title {
    font-weight: 600;
    font-size: 1.5rem;
    color: #fff;
    text-shadow: 0 .1rem .1rem rgba(0,0,0,0.3);
}
.playbody .video-msg .playlet-name .playlet-info-tag-name{
    display: flex; flex-direction: column;
    margin-left: .6rem;
}
.playbody .video-msg .playlet-name .playlet-info-tag-name > div{
    display: flex;
}
.playbody .video-msg .playlet-name .playlet-info-tag-name .tag {
    padding: .2rem .6rem;
    background: rgba(255,255,255,0.2);
    font-size: 1.2rem;
    color: #FFFFFF;
    border-radius: .3rem;
    margin-right: .6rem;
    margin-top: .8rem;
    display: block;
}
.comment-dialog {
    height: 100%;
    position: relative;
}
.comment-dialog .header {
    display: flex;
    width: 34.5rem;
    height: 5.8rem;
    margin: 0 auto;
    border-bottom: 1px solid #eee;
}
.comment-dialog .header .header-icon{
    display: flex;
    align-items: center;
}
.comment-dialog .header img {
    display: block;
    width: 1.7rem;
    height: 1rem;
}
.comment-dialog .header .comment-count{
    flex-grow: 1;
    font-weight: 600;
    font-size: 1.5rem;
    color: #171717;
    line-height: 5.8rem;
    text-align: center;
    margin-right: 2.5rem;
}
.comment-dialog .comment-content{

}
.comment-dialog .comment-add{
    width: 100%;
    text-align: center;
    position: absolute;
    bottom: 0;
    left: 0;
}
.comment-dialog .comment-add .disabled {
    background: linear-gradient( 90deg, #F9696A 0%, #FF4D6D 50%, #EEB165 100%);
}

.comment-dialog .comment-add textarea::placeholder{
    font-weight: 400;
    font-size: 1.4rem;
    color: #949494;
}


.comment-dialog .input-wrapper {
    display: flex;
    align-items: flex-end;
    gap: 3.0rem;
    padding: 1.2rem;
    background: #fff;
}

.comment-dialog .input-container {
    position: relative;
    flex: 1;
}

.comment-dialog textarea {
    width: 100%;
    max-height: 14.0rem;
    padding: .7rem 1.2rem;
    border: 0;
    border-radius: 8px;
    font-size: 1.4rem;
    resize: none;
    transition: all 0.2s ease;
    background: #F7F7F7;
    line-height: 2.2rem;
}

.comment-dialog textarea:focus {
    border-color: #2196f3;
    box-shadow: 0 0 0 .2rem rgba(33, 150, 243, 0.2);
}

.comment-dialog .ghost-suggestion {
    position: absolute;
    top: 3.0rem;
    left: 1.2rem;
    right: 1.2rem;
    pointer-events: none;
    color: #666;
    white-space: pre-wrap;
}

.comment-dialog .ghost-tail {
    opacity: 0.5;
}

.comment-dialog button {
    min-width: 6.4rem;
    height: 3.6rem;
    line-height: 3.6rem;
    padding: 0 1.6rem;
    color: white;
    border: none;
    border-radius: .4rem;
    cursor: pointer;
    transition: all 0.2s ease;
    margin-bottom: .27rem;
}

.comment-dialog button:hover:not(.disabled) {
    
}

.comment-dialog button.disabled {   
    cursor: not-allowed;
}
.comment-dialog .comment-content{width: 34.5rem; margin: 0 auto; height: calc(100% - 15.1rem); overflow-y: auto}
.comment-dialog .comment-content .msg-item{ margin-top: 2.0rem; }
.comment-dialog .comment-content .msg-item .comment-style{display: flex; justify-content: space-between;gap: 1.0rem;}
.comment-dialog .comment-content .avatar{width: 3.3rem; height: 3.3rem;border-radius: 50%;}
.comment-dialog .comment-content .child-comment .avatar{width: 2.3rem; height: 2.3rem;}
.comment-dialog .comment-content .msg-item .comment-style .comment-msg{flex-grow: 1; display: flex;flex-direction: column;}
.comment-dialog .comment-msg .avatar-name{ font-weight: 400; font-size: 1.3rem; color: #A5A5A5; }
.comment-dialog .comment-msg .avatar-name.vip-member{ color: #B16E0A; display: flex; align-items: center}
.comment-dialog .comment-msg .avatar-name.vip-member img{
    width: 2.4rem; height: 1.2rem;
    margin-left: .4rem;
}
.comment-dialog .comment-msg .comment{font-weight: 400; font-size: 1.4rem; color: #181818;margin: .5rem 0;}
.comment-dialog .comment-msg .date-time{font-weight: 400;font-size: 1.3rem;color: #A5A5A5;}
.comment-dialog .msg-item .comment-style .comment-set{align-self: flex-end; display: flex; gap: 2.0rem;}
.comment-dialog .comment-content .msg-item .child-comment{
    width: 27.0rem; margin: 0 auto; margin-top: 2.0rem;
}
.my-like{
    height: 100%;
}
.like-content {
    margin-top: 1.0rem;
    height: calc(100% - 5rem);
    overflow-y: auto;
}
.my-comment {
    background: #F4F6F8;
    height: 100%;
}
.my-comment .comment-card {
    width: 31.5rem;
    padding: 1.5rem;
    background: #ffffff;
    border-radius: 8px;
    
    font-family: -apple-system, sans-serif;
    margin: 1.2rem auto 0;
}

/* 评论文本样式 */
.my-comment > .comment-content{
    overflow-y: auto;
    height: calc(100% - 6.0rem);

}
.my-comment .comment-content p.comment-content {
    font-weight: 500;
    font-size: 1.5rem;
    color: #181818;
    line-height: 2.2rem;
}
.my-comment span.name{
    display: block;
    font-weight: 400;
    font-size: 1.4rem;
    color: #8A8A8A;
    margin: 0.9rem 0;
}
/* 日期样式 */
.my-comment .comment-date {
    color: #8A8A8A; /* 中灰色文字 */
    font-size: 1.4rem;
    display: block; /* 独占一行 */
}


/* 单个视频项 */
.my-watch-history{
    height: 100%;
}
.my-watch-history .video-list{
    height: calc(100% - 5rem);
    overflow-y: auto;
}
.my-watch-history .video-item {
    width: 34.5rem;
    margin: 2.0rem auto;
    display: flex;
    background: white;
    border-radius: .8rem;
}

/* 封面图片 */
.my-watch-history .cover {
    width: 7.4rem;
    height: 10.6rem;
    object-fit: cover;
    border-radius: .4rem;
    margin-right: 1.4rem;
}

/* 右侧内容区 */
.my-watch-history .content {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

/* 标题样式 */
.my-watch-history .video-title .title {
    width: 100%;
    color: #333;
    font-size: 1.6rem;
    line-height: 1.4;
    margin-bottom: .8rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.my-watch-history .video-title{
    width: 18.0rem;
}
/* 观看信息 */
.my-watch-history .info {
    color: #666;
    font-size: 1.2rem;
    margin-bottom: 1.5rem;
}
.my-watch-history .info .series-count{
    font-weight: 400;
    font-size: 1.3rem;
    color: #FE6013;
}
.my-watch-history .info .all-series{
    font-weight: 400;
    font-size: 1.3rem;
    color: #949A9E;
    margin-top: .6rem;
}
/* 按钮容器 */
.my-watch-history .actions {
    display: flex;
    flex-direction: column;
    gap: .8rem;
}

/* 通用按钮样式 */
.my-watch-history .btn {
    width: 6.4rem;
    height: 3.2rem;
    line-height: 3.2rem;
    border: none;
    border-radius: .4rem;
    font-size: 1.4rem;

}

/* 观看按钮 */
.my-watch-history .watch-btn {
    background: linear-gradient( 90deg, #F9696A 0%, #FF4D6D 50%, #EEB165 100%);
    color: white;
    text-align: center;
}

/* 取消按钮 */
.my-watch-history .cancel-btn {
    background: #fff;
    color: #FE6013;
    border: 1px solid #FE6013;
}

.feedback-container {  
    background: white;

}
.feedback-container .tab-container > p{
    font-weight: 400;
    font-size: 1.5rem;
    color: #181818;
}
.feedback-container .container-description{
    width: 34.5rem;
    margin: 1.6rem auto 0;
    display: flex;
    flex-direction: column;
}
/* 选项卡样式 */

.feedback-container .tab-buttons {
    display: flex;
    justify-content: space-between;  
    margin-top: 1.6rem;
}
.feedback-container .tab-button {
    width: calc(50% - .8rem);
    height: 3.8rem;    
    font-size: 1.5rem;
    background: #F7F7F7;
    border-radius: .4rem;
    color: #181818;
    border: none;
}
.feedback-container .tab-button.active {
    color: #ff4444;
    background: #F6E7E0;
}

/* 输入框样式 */
.feedback-container .description-box {
    width: calc(100% - 2.4rem);
    height: 12.0rem;
    padding: 1.2rem;
    border: 0;
    border-radius: .6rem;
    margin: 1.5rem 0 11rem;
    resize: vertical;
    background: #F7F7F7;
    font-weight: 400;
    font-size: 1.5rem;
    color: #181818;
    line-height: 2.4rem;
}
.feedback-container .description-box::placeholder{
    font-weight: 400;
    font-size: 1.5rem;
    color: #919191;
    line-height: 2.4rem;
}
/* 提交按钮 */
.feedback-container .submit-button {
    width: 100%;
    height: 4.8rem;    
    color: white;
    border: none;
    border-radius: .6rem;
    font-size: 1.6rem;
    cursor: pointer;
    transition: opacity 0.3s;
}
.feedback-container .submit-button:hover {
    opacity: 0.9;
}
.logout-div{
    text-align: center;
}
.logout {
    width: 34.5rem;
    height: 4.8rem;
    line-height: 4.8rem;
    color: #F96624;
    margin: 1rem auto 0;
    border: 0;
    background: #FFF6F2;
    font-size: 1.6rem;
    border-radius: .6rem;
}
.playlet-index-home .series-count {
    background: none !important;
    line-height: 4.0rem !important;
}
.playlet-index-home .series-count .count {
    background: rgba(0,0,0,0.2) !important;    
    width: 100% !important;
    padding: 0 2.1rem !important;
}
.playlet-index-home .series-count span{
    font-weight: 600;
    font-size: 1.5rem;
    color: #FFFFFF;
}
.playlet-index-home .search-div{
    position: absolute;
    top: 1.5rem; 
    right: 1.5rem;
    z-index: 9;
}
.playlet-index-home .search-div img{
    width: 1.6rem; height: 1.6rem;
}
.my-follow-watch{height: 100%;}
.my-follow-watch .nav-header-title{display: flex; align-items: center; justify-content: center}
.my-follow-watch .nav-header-title .title{height: 4.8rem; line-height: 4.8rem; font-size: 1.8rem; color: #181818;}
.my-follow-watch .video-list{height: calc(100% - 11.0rem); overflow-y: auto;}
/*.have-header-nav .readbox {
    height: 100%;
}*/
.have-header-nav .readbody {
    padding-top: 0;
    /*height: calc(100% - 5.8rem);*/
   /* overflow-y: auto*/
}
.have-header-nav .home-content{
    padding-top: 13rem;
}
.category-list{min-height: 100%;height: auto;padding-bottom: 1rem}
.category-list .header{
    height: 16rem;
}
.category-list .cate-content{
    padding-top: 16rem;
}

.category-list .listbox{
    height: calc(100% - 10.0rem);
    overflow-y: auto;
}
.category-list .listbox::-webkit-scrollbar {
    width: 0;               /* 初始宽度设为0彻底隐藏 */
}
.category-list .listbox:hover::-webkit-scrollbar {
    width: .3rem;
}
.category-list .header.add-header-height{
    min-height: 40rem;
}
.category-list .header .van-dropdown-menu__bar{
    background: none;
    height: 3rem;
}
.category-list .header .van-dropdown-menu__bar .van-dropdown-menu__item{
    justify-content: left;
}
.category-list .header .van-dropdown-menu__bar .van-dropdown-menu__title{
    font-size: 1.4rem;
    color: #FFFFFF;
    line-height:  4rem;
    text-align: left;
}
.category-list .van-dropdown-menu{
    width: 34.5rem; margin: 0 auto;
}
.van-dropdown-item{
    width: 100%;
    max-width: 37.5rem;
    left: 50%;
    transform: translateX(-50.1%);
}
.van-dropdown-item .van-popup .checkbox-content{
    background: #20222C;
    max-height: 30rem;
    overflow-y: auto;
    padding-bottom: 1rem;
}
.van-dropdown-item .van-popup .footer{
    background: #020202;
    height: 8.1rem;
    display:  flex;
    align-items: center;
    justify-content: center;
    gap: 1.2rem;
}
.van-dropdown-item .van-popup .footer button{
    width: 15.9rem;
    height: 3.2rem;
    border-radius: .8rem;
    border: .1rem solid #8E8E94;
    line-height: 3.2rem;
    font-size: 1.3rem;
    color: #FFFFFF;
    text-align: center;
    background: #020202;
    
}
.van-dropdown-item .van-popup .footer button.confirm{
    background: #4500FF;
    border: none;
}
.van-dropdown-item .van-dropdown-item--down{
    height: 15rem;
}
.van-dropdown-item .van-checkbox__icon .van-icon{
    border-radius: .3rem;
}
.van-dropdown-item .van-checkbox{
    height: 3.3rem;
    line-height: 3.3rem;
    background: #3D3E56;
    border-radius: .6rem;
    padding: 0 1.2rem;
    margin: 1.2rem 0 0 1.2rem;
    position: relative;
}
.van-dropdown-item .van-checkbox[aria-checked="true"]{
    border: .1rem solid #FFFFFF;
}
.van-dropdown-item .van-checkbox .van-checkbox__label{
    font-weight: 400;
    font-size: 1.3rem;
    color: #DADDE3;
}


.van-dropdown-item .checkbox-content .tip {
    /* 平时隐藏 */
    display: none;
    /* 绝对定位：相对于van-checkbox */
    position: fixed;
   
    /* 避免被其他元素遮挡 */
    z-index: 9999;
    /* 样式优化：防止换行、增加背景等 */
    white-space: nowrap;
    
    background: #333;
    color: #fff;
    font-size: 1rem;
    border-radius: .4rem;
    /* 去掉p标签默认的margin/padding */
    line-height: 1.4;
    pointer-events: none; /* 关键：避免提示框遮挡鼠标事件 */
}
/* 可选：小三角箭头 */
.checkbox-content .tip::before {
    content: '';
    position: absolute;
    top: -.4rem;
    left: 1rem;
    width: 0;
    height: 0;
}

.van-dropdown-item .van-checkbox-group{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin-left: 1rem;
}
.van-dropdown-item .van-checkbox-group .van-checkbox__icon{
    height: 1.2rem;
    line-height: 1.2rem;
}
.van-dropdown-item .van-checkbox-group .van-checkbox__icon .van-icon{
    width:1.2rem; height: 1.2rem; line-height: 1rem;
}
.van-dropdown-item .van-checkbox-group .van-checkbox__icon .van-icon::before{
    font-size: 1.2rem;
}
.van-dropdown-item .van-checkbox-group .van-checkbox__icon--checked .van-icon{
    background-color: #3D3E56;
    border:.1rem solid #3D3E56;
}
.van-checkbox__icon .van-icon
.cate-content{padding-top: 17rem}
.cate-content .synthetical {
    margin-left: 1.5rem;
    margin-top: 1.0rem;
}
.cate-content .synthetical,
.cate-content .synthetical .cate-list {
    display: flex;
    align-items: center;
    width: calc(100% - 1.5rem);
    overflow-x: auto;
}
.cate-content .synthetical .cate-list::-webkit-scrollbar {
    height: 0;
}
.cate-content .synthetical .cate-list:hover::-webkit-scrollbar {
    height: .3rem; /* 悬停时显示滚动条宽度 */
}
.cate-content .listbox{
    width: 100%;
}
.cate-content .synthetical .cate-list::-webkit-scrollbar {
    display: none;   
}

.cate-content .synthetical span {
    display: block;
    width: 5.8rem;
    height: 3.2rem;
    background: #EEEEEE;
    border-radius: .4rem;
    font-size: 1.4rem;
    color: #181818;
    line-height: 3.2rem;
    text-align: center;
    margin-right: .8rem;
    flex-shrink: 0;
}
.cate-content .on-select-cate {
    background: #F6E7E0 !important;
    color: #F96624 !important;
}
.cate-content ul.piclist{
    gap: 0;
    flex-direction: column;
}
.cate-content ul.piclist li{
    width:  100%;
}
.cate-content ul.piclist li a{
    width: 100%;
    display:  flex;
    justify-content: space-between;
    align-items: center;
}
.cate-content ul{
    width: 34.5rem;
    margin: 0 auto;
}
.cate-content ul li a{
    display: flex;
    justify-content: space-between;
    margin-top: 1rem;
}
.cate-content ul li img{
    display: block;
    width: 6.7rem;
    height: 10.2rem;
    flex-shrink: 0;
    border-radius: .3rem;
    object-fit: cover;
}
.cate-content ul li .content{
    width: 26.4rem;
    margin-left: 1.2rem;
    flex-shrink: 0;
 
}
.cate-content ul li .content > div.title{
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.cate-content ul li .content > div.title div{
    display: flex;
    align-items: center;
    
}
.cate-content ul li .content > div.title div span{
    font-weight: 400;
    font-size: 1.1rem;
    color: #DADDE3;
}
.cate-content ul li .content > div.title img{
    display: block;
    width: .8rem;
    height: 1.1rem;
    margin-right: .3rem;
}
.cate-content ul li .content p{
    margin-top: .8rem;
    font-weight: 400;
    font-size: 1.2rem;
    color: #9499A3;
    line-height: 1.8rem;
    white-space: break-spaces;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}
.cate-content ul li .content .tag-list{
    display: flex;
    align-items: center;
}
.cate-content ul li .content .tag-list .van-tag{
    margin-right: 0.5rem;
    margin-top: .5rem;
    border-radius: .4rem;
    padding: .4rem;
    font-size: 1.1rem;
    line-height: 1.4rem;
    text-align: center;
}
.share-friend-dialog{
    width: 100%;
}
.share-friend-dialog h3{
    font-weight: 600;
    font-size: 1.8rem;
    color: #171717;
    text-align: center;
    margin-top: 1.8rem;
}
.share-friend-dialog ul{width: 34.5rem; margin: 3.0rem auto 0; display: flex; justify-content: space-between;}
.share-friend-dialog ul li{
    display: flex; flex-direction:column;
    align-items: center;
}
.share-friend-dialog ul li img{width: 5rem; height: 5rem;}
.share-friend-dialog ul li span{
    margin-top: .6rem;
    font-size: 1.3rem;
    color: #646464;
}
.share-friend-dialog .cancel-div {
    margin-top: 2.2rem;
    border-top: .6rem solid #F6F6F6;
    text-align: center;
    line-height: 4.9rem;
}
.share-friend-dialog .cancel-div span {
    font-size: 16px;
    color: #181818;
}
.share-website-link-dialog .copy-link {
    width: 31.5rem;
    height: 4.8rem;
    margin: 4.0rem auto 0;
    background: #F5F6F9;
    border-radius: .6rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 1.5rem;
}
.share-friend-dialog .copy-link .link{
    font-size: 1.8rem;
    color: #171717;
}
.share-friend-dialog .copy-link .btn{
    width: 7.2rem;
    height: 3.2rem;
    background: #FFFFFF;
    border-radius: .4rem;
    border: .1rem solid #E3E4E7;
    text-align: center;
    line-height: 3.2rem;
}
.add-desktop{
    height: 5.8rem;
    width: 34.5rem;
    margin: 2.2rem auto;
    display: flex;
    justify-content: space-between;
    align-items: center
}
.add-desktop > img{width: 5.8rem; height:5.8rem;}
.add-desktop .content{
    margin-left: 1.0rem;
    width: calc(100% - 6.8rem);
    display: flex;
    flex-direction: column;
}
.add-desktop .content .text{
    font-size: 1.7rem;
    color: #181818;
    font-weight: 600;
}
.add-desktop .content .line{
    height: .1rem; width: 19.0rem;
    background: #e6e6e6;
    display: block;
    margin: .7rem 0;
}
.add-desktop .content .link{
    font-weight: 400;
    font-size: 1.4rem;
    color: #9A9A9A;
}
.guide {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;

    background: rgba(0, 0, 0, 0.7);
    z-index: 999;
    overflow: auto;
}
.guide .guide-nav{width: 100%; height: 10.0rem;background: #fff;}
.guide .guide-nav span.text{
    font-weight: 600;
    font-size: 14px;
    color: #181818;
    margin-left: 2.5rem;
}
.guide .guide-nav span.link{
    border-radius: 4rem;
    border: .1rem solid #E6E6E6;
    display: block;
    width: 16.0rem;
    height: 2.8rem;
    margin-left: 1.1rem;
    line-height: 2.8rem;
    padding: 0 1.0rem;
}
.guide .guide-nav .nav1{
    display: flex;
    align-items: center;
    padding-top: 1.4rem;
}
.guide .guide-nav .tab{
    display: flex; align-items: center;
    margin-left: 1.5rem;
    margin-top: 1.0rem;
}
.guide .guide-nav .tab span.tab-span{
    display: block;
    width: 15.3rem; height: 3.6rem;
    background: #F5F6F9;
    border-radius: 9.0rem;
    line-height: 3.6rem;
    margin-right: .8rem;
    text-align: center;
}
.guide .guide-nav .tab img{
    width: 2.0rem; height: 2.0rem;
}
.guide .add-content{width: 34.5rem; margin: 2.0rem auto 0; display: none;}
.guide .add-content img{display: block; width: 100%;}
.vip-dialog img{display: block; width: 100%;}
.payment_v2_main_container {
    padding: 0 1.7rem;
    padding-bottom: 2.2rem;
    background: #fff;
    border-radius:1.2rem;
}
.payment_v2_main_container span.money{
    display: block;
    font-weight: 600;
    font-size: 3rem;
    color: #E6100E;
    line-height: 4.2rem;
    padding: 2rem 0;
    text-align: center;
}
.payment_v2_main_container h1.title{
    font-weight: 600;
    font-size: 1.8rem;
    color: #333333;
    line-height: 3rem;
    text-align: center;
    padding-top: 2rem;
}
.payment_v2_fl_container {
    display: flex;
    justify-content: space-between;
}
.payment_v2_fl_container .payment_v2_fl_item{
    width: 15rem;
    height: 7.2rem;
    background: linear-gradient( 137deg, #FFFFFF 0%, #FAF0E8 100%);
    border-radius: .5rem;
    border: .1rem solid #F4D5B4;
}
.payment_v2_fl_container .payment_v2_fl_item .payment_v2_fl_item_top{
    font-weight: 600;
    font-size: 1.4rem;
    color: #563204;
    text-align: center;
    margin: .6rem 0 .3rem;
}
.payment_v2_fl_container .payment_v2_fl_item .payment_v2_fl_item_main{
    padding: 0 .5rem;
    width: 100%;
    box-sizing: border-box;
    font-size: 1.2rem;
    color: #787878;
    line-height: 1.7rem;
}

.payment_v2_djyl{display: flex; align-items: center; justify-content: center; margin: 1.6rem 0 1.4rem}
.payment_v2_djyl span{font-size: 1.5rem; color: #563204; margin: 0 1.2rem;}
.payment_v2_djyl img{display: block; width: 4rem; height: 1rem;}
.payment_v2_djyl img.right{ transform: rotate(180deg); }

.payment_v2_select {
    display: flex;
    justify-content: space-between;
    width: 100%;
    box-sizing: border-box;
}
.payment_v2_item {
    width: 15.3rem;
    height: 10rem;
    background: #F7F7F7;
    border-radius: .5rem;
    border: .2rem solid #E5E5E5;
    box-sizing: border-box;
    position: relative;
    cursor: pointer;
}
.payment_v2_select.price .payment_v2_item{
    width: calc(33.33% - .4rem);
}
.payment_v2_item.active {
   
    background: linear-gradient(100deg, #FFFFFF 0%, #FCDA9E 100%);
    border-radius: .5rem;
    border: .2rem solid #D6964D;
    box-sizing: border-box;
}

.active .payment_v2_select_circle {
    background: url('/Scripts/images/check.svg');
    background-size: 100%;
}

.payment_v2_select_circle {
    width: 1.9rem;
    height: 1.9rem;
    background: #FFFFFF;
    border: 1px solid #E5E5E5;
    box-sizing: border-box;
    border-radius: 1.9rem;
    position: absolute;
    left: .6rem;
    top: .8rem;
}
.payment_v2_select_title {
    width: 100%;
    font-size: 1.3rem;
    color: #7C7C7C;
    margin-top: 2rem;
    text-align: center;
}
.active .payment_v2_select_title {
    color: #563204;
}
.payment_v2_price {
    width: 100%;
    font-size: 2rem;
    color: #2E2E2E;
    text-align: center;
    font-weight: bold;
    margin-top: .4rem;
}
.payment_v2_price .meijin {
    font-size: 1.2rem;
    font-weight: normal;
}
.payment_v2_price .original-price{
    font-size: 1.6rem;
    color: #5e5e5e;
    display: block;
    text-align: center;
    margin-top: .6rem;
    text-decoration: line-through;
}

.payment_v2_type_item {
    display: flex;
    align-items: center;
    position: relative;
    width: auto;
    height: 5.4rem;
    
    border-radius: .6rem;
    border: 1px solid #D8D8D8;
    padding: 0 1.3rem;
}
.payment_v2_type_item img {
    width: 2.3rem;
    height: 2.3rem;
    margin-right: .8rem;
}
.payment_v2_type_item span {
    font-size: 1.5rem;
    color: #000000;
}
.payment_v2_type_select {
    width: 1.9rem;
    height: 1.9rem;
    background: #FFFFFF;
    border: 1px solid #D8D8D8;
    border-radius: 1.9rem;
    position: absolute;
    right: 1.3rem;
    cursor: pointer;
}
.payment_v2_type_container{
    margin-bottom: 1.8rem;
}
.payment_v2_type_container.active .payment_v2_type_item{
    border: .2rem solid #F96624;
}
.payment_v2_type_container.active .payment_v2_type_select{
    background: url(/Scripts/images/select_on.svg);
    background-size: 100%;
    border: none;
}
.payment_v2_btn {
    width: 100%;
    height: 4.8rem;
    background: linear-gradient( 90deg, #F9696A 0%, #FF4D6D 50%, #EEB165 100%);
    border-radius: .6rem;
    font-size: 1.7rem;
    color: #FFFFFF;
    line-height: 4.8rem;
    text-align: center;
}

.pay-success .success-tip{ position: absolute; left: 50%; top: 16rem; transform: translateX(-50%);}
.pay-success .success-tip .tip{ display: flex; flex-direction: column; align-items: center}
.pay-success .success-tip .tip img{display: block; width: 11rem; height: 8.3rem;margin-bottom: 1rem}
.pay-success .success-tip .tip span{font-size: 2rem;color: #181818; font-weight: 600;}
.pay-success .success-tip .btn{width: 27.5rem;display: flex; align-items: center; justify-content: space-between;margin-top: 4rem;}
.pay-success .success-tip .btn button {
    width: 12.9rem;
    height: 4.4rem;
    
    border-radius: .4rem;
    font-weight: 400;
    font-size: 1.7rem;
    
    line-height: 4.4rem; 
}
.pay-success .success-tip .btn button.return-home{
    background: #F2F2F2;
    color: #181818;
}
.pay-success .success-tip .btn button.success-back-btn{width: 100%}
.close-pay-btn-dialog{display: flex; justify-content: center;margin-top: 2rem}
.close-pay-btn-dialog img{display: block; width: 3rem; height: 3rem;}

.contact-information{
    width: 34.5rem;
    margin: 1.2rem auto 6rem;
}
.contact-information p{
    font-size: 1.6rem;
    color: #2E2E2E;
}
.contact-information a{
    display: block;
    font-size:  1.6rem;
    margin-top: 1.2rem;
    text-decoration: underline;
}
.contact-information .line{color: #008000; }
.contact-information .facebook{color: #337AB7; }
.my-wallet .content .gold-content{
    /*padding: 0 1.5rem;*/
    width: 34.5rem;
    margin: 0 auto;
    background: #fff;
}
.my-wallet .content .gold{
    margin-top: 1.6rem;
    background-image: url("../images/coinbg.png");
    background-repeat: no-repeat;
    background-size: 12.1rem 12.1rem;
    background-position: right -1.2rem;
}
.my-wallet .content .gold .sum{
    display: flex;
    align-items: center;
}
.my-wallet .content .gold .sum img{
    display: block;
    width: 2.4rem;
    height: 2.4rem;
}
.my-wallet .content .gold .sum span{
    font-weight: 600;
    font-size: 3rem;
    color: #181818;
    line-height: 4.2rem;
    margin-left: .6rem;
}
.my-wallet .content .gold .remaining-gold{
    margin-top: 1rem;
    margin-bottom: 2rem;
}
.my-wallet .content .gold p{
    font-weight: 400;
    font-size: 1.4rem;
    color: #6D6D6D;
    line-height: 2rem;
}
.my-wallet .content button.top-up{
    width: 34.5rem;
    height: 4.8rem;
    background: linear-gradient( 90deg, #F9696A 0%, #FF4D6D 50%, #EEB165 100%);
    border-radius: .6rem;

    font-family: PingFang SC, PingFang SC;
    font-weight: 400;
    font-size: 1.7rem;
    color: #FFFFFF;
    line-height: 2.4rem;
}
.my-wallet .line-name{margin-top: 1.2rem;}
.my-wallet .line-name ul li a span{margin-left: 0}
.my-wallet .line-name ul li{width: 34.5rem; margin: 0 auto}
.my-wallet .line-name ul li a span{
    font-weight: 400;
    font-size: 1.5rem;
    color: #181818;
    line-height: 2.1rem;
}
.trading-record{height: 100%}
.trading-record .content{
    height: calc(100% - 5.9rem);
    background: #F2F2F2;
    padding-top: 1rem;
}
.trading-record .record-list-content{
    width: 35.5rem;
    margin: 0 auto;
    background: #fff;
    border-radius: .9rem;
}
.trading-record .record-list-content .item{
    width: 32.7rem;
    margin: 0 auto;
    border-bottom: 1px solid #f2f2f2;
    padding: 2rem 0;
    display: flex; justify-content: space-between; align-items: center
}
.trading-record .record-list-content .item:last-child{border: 0;}
.trading-record .record-list-content .item p{
    font-weight: 400;
    font-size: 1.4rem;
    color: #181818;
    line-height: 1.9rem;
}
.trading-record .record-list-content .item .date-time{
    font-weight: 400;
    font-size: 1.2rem;
    color: #999999;
    line-height: 1.6rem;
    margin-top: .6rem;
    display: block;
}
.trading-record .record-list-content .item .pay{
    font-weight: 400;
    font-size: 1.8rem;
    
    line-height: 2.4rem;
}
.trading-record .record-list-content .item .pay.in{
    color: #25A721;
}
.trading-record .record-list-content .item .pay.out{
    color: #F34553;
}

/*充值*/
.container{
    height: 100%;
    background-color: #fff;
}
.top-up-page, .my-wallet, .discount-coupon-list, .my-watch-history, .my-comment{
    
    background-color: #fff;
}
.top-up-page .pay-title{
    display: flex; justify-content: space-between;
    margin: 3.8rem 0 1.2rem;
    align-items: center;
}
.top-up-page .pay-title h1{
    font-weight: 400;
    font-size: 1.5rem;
    color: #181818;
}
.top-up-page .remaining-sum{
    display: flex;
    align-items: center;
}
.top-up-page .remaining-sum-title{
    width: 35.5rem;
    margin: 20px auto 0;
}
.top-up-page .remaining-sum h1{
    font-weight: 400;
    font-size: 1.3rem;
    color: #929292;
}
.top-up-page .remaining-sum img{
    margin-left: .7rem;
    width: 1.6rem;
    height: 1.6rem;
    display: block;
}
.custom-image .van-empty__image {
    width: 17rem;
    height: auto;
    object-fit: contain;
}
.top-up-page .nav-header-title{border-bottom: .4rem solid #f8f8f8}
.top-up-page .remaining-sum span{
    font-weight: 400;
    font-size: 1.4rem;
    color: #181818;
    line-height: 2.2rem;
    margin-left:  .4rem;
}
.top-up-page .discount-coupon-list{
    display: flex;
    flex-direction: column;
}
.playlet-readform .top-up-page .discount-coupon-list{
    height: calc(100% - 6rem);
}
.top-up-page .discount-coupon-list h5{
    font-weight: 400;
    font-size: 1.6rem;
    color: #181818;
    line-height: 4.4rem;
    margin-left: 1.6rem;
}
.top-up-page .discount-coupon-list .list-item{
    margin-top: 0;
    margin-bottom: 1rem;
}
.top-up-page-dialog{
    width: 35.5rem;
    margin: 0 auto;
}
.van-tabs--card>.van-tabs__wrap{
    height: 4rem;
}
.van-tabs__nav{
    height: 4rem;
    background: #F5F6FA;
    border-radius: .6rem;
    border: .2rem solid #F5F6FA;
    font-weight: 400;
}
.van-tabs__nav span{
    font-size: 1.4rem;
    line-height: 4rem;
}
.van-tabs__nav .van-tab{
    color: #181818 !important;
    border: none;
}
.van-tabs__nav--card .van-tab.van-tab--active{
    background: #FFFFFF;
    color: #E53925 !important;
}
.top-up-page .discount-coupon-list .van-tabs__content{
    margin-top: 1rem;
    height: 35rem;
    overflow-y: auto;
    
}
.playlet-readform .top-up-page .discount-coupon-list .van-tabs__content{
    height: calc(100% - 5rem);
}
.top-up-page .discount-coupon-list .van-button{
    flex-shrink: 0;
    width: 34.3rem;
    height: 4.8rem;
    display: block;
    margin: 1rem auto 3rem;
    background: linear-gradient(90deg, #F9696A 0%, #FF4D6D 50%, #EEB165 100%);
    border-radius: .6rem;
    font-weight: 400;
    font-size: 1.7rem;
    color: #FFFFFF;
}
.top-up-page .discount-coupon-list .content{
    border-bottom: .1rem solid #F2F2F2;
}
.playlet-readform .top-up-page .discount-coupon-list .content{
    height: calc(100% - 5rem);
}
.playlet-readform .van-tabs{
    height: 100%;
}
.top-up-page .discount-coupon-list .content .van-tab__pane-wrapper{
    position: relative;
}
.top-up-page .discount-coupon-list .content .custom-image{
    width: 100%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}
    /*打賞*/
.give-flower{
    width: 100%;
}
.give-flower .playlet-header{
    width: 100%;
    height: 14.6rem;
    background-image: url("../images/flowerbg.png");
    background-repeat:no-repeat;
    background-size:cover;
    background-position: center;
    position: relative;
}
.give-flower .playlet-header .close{
    position: absolute;
    right: 0;
    top: 4.1rem;
    width: 2.7rem;
    height: 2.8rem;
    background: #DCDCDC;
    border-radius: 0 1.6rem 0 2rem;
}
.give-flower .playlet-header .close img{
    display:  block; width: 1rem; height: 1rem;
    margin: .8rem auto 0;
}
.give-flower .playlet-header img.avatar{
    display:  block;
    width:6.7rem; height: 6.7rem;
    border-radius:50%;
    margin: 0 auto;
    
    object-fit: cover;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: .6rem;
}
.give-flower .playlet-header p{
    text-align: center;
    font-size: 1.6rem;
    font-weight: 400;
    color: #181818;
    line-height: 2.2rem;
    margin-top: .5rem;
    padding-top: 8rem;
}
.give-flower .playlet-header span{
    display: block;
    text-align: center;
    font-size: 1.4rem;
    color: #919191;
    line-height: 2rem;
    font-weight: 400;
    margin-top: .5rem;
}
.give-flower .give-content{
    background: #fff;
    padding: 0 2rem 1.1rem;
    /*border-radius:0 0 1.6rem 1.6rem;*/
}
.give-flower .give-content .num{
    display: flex;flex-wrap: wrap;
    justify-content: space-between;
}
.give-flower .give-content .num span.on{
    background: #FBECE5;
    border-radius: .4rem;
    color: #FE6013;
}
.give-flower .give-content .num span, .give-flower .give-content .num input {
    background: #F2F2F2;
    border-radius: .4rem;
    display: block;
    width: 8.7rem; height: 3.6rem; text-align: center; line-height:  3.6rem;
    margin-bottom: 1.1rem;
    font-size: 1.5rem;
}
.give-flower .give-content .num input{border: 0}
.give-flower .give-content .give-btn{
    width: 100%; height: 4.4rem; text-align: center; line-height: 4.4rem;
    font-weight: 400;
    font-size: 1.7rem;
    color: #FFFFFF;
    border-radius: .6rem;
    margin-top: 1rem;
}
.give-flower .give-content .give-tip{
    margin-top: 1rem;
}
.give-flower .give-content .give-tip p{
    font-weight: 400;
    font-size: 1.4rem;
    color: #9E9DA7;
    line-height: 1.8rem;
    text-align: center;
}
.give-log-list{
    background: linear-gradient( 180deg, #FFF7F3 0%, #FFFFFF 30%, #FFFFFF 100%);
    border-radius:0 0 1.6rem 1.6rem;
}
.give-log-list .title{display: flex; justify-content: center; align-items: center; padding-top: 1.4rem}
.give-log-list .title span, .give-log-list .title h3{
    display: block;
    font-weight: 400;
    font-size: 1.6rem;
    color: #181818;
    line-height: 2.2rem;
}
.give-log-list .title h3{
    margin: 0 .8rem;
}
.give-log-list .log-list{margin-top: 1.5rem; padding: 0 2rem 2.4rem;height: 10rem; overflow-y: auto;}
.give-log-list .log-item{display: flex; justify-content: space-between; margin-bottom: 1.2rem}
.give-log-list .log-item > div{display: flex; align-items: center}
.give-log-list .log-item img.avatar{width: 2.6rem; height: 2.6rem; border-radius: 50%;}
.give-log-list .log-item span.name{
    font-weight: 400;
    font-size: 1.4rem;
    color: #989898;
    line-height: 2rem;
    margin-left: .6rem;
}
.give-log-list .log-item span.give-num{
    font-weight: 400;
    font-size: 1.4rem;
    color: #FE6013;
    line-height: 2rem;
    margin-right: .6rem;
}
.give-log-list .log-item img.flower{ width: 1.4rem;height: 1.7rem}

.dialog-box{
    height: 100%;
    display: flex;
    flex-direction: column;
    position: relative;
}
.dialog-box .header{
    position: relative;
}
.dialog-box .header .menu-modal{
    position: absolute;
}
.dialog-box .menu-btn img{
    width: 2.4rem; height: 2.4rem;
}
.dialog-box .msg-content{
    height: calc(100% - 10rem);
    background: #F3F4F5;
    padding: 0 1.6rem 3rem 1.6rem;
    overflow-y: auto;
}
.dialog-box .msg-content .content-item:nth-last-child(2){margin-bottom: 1.2rem;}
.dialog-box .msg-content > p{
    text-align: center;
    font-size: 1.3rem;
    color: #93949A;
    position: absolute;
    width:  100%;
    bottom: 6rem;
    left: 50%;
    transform: translateX(-50%);
}
.dialog-box .msg-commit{
    padding: 0 1.3rem;
    height: 5.8rem;

    background: #F8F8F8;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.dialog-box .msg-commit .add-img-img img{ display: block; width: 2.4rem; height: 2.4rem; }
.dialog-box .msg-commit .msg-post{
    flex-grow: 1;
    height: 4.2rem;
    background: #FFFFFF;
    border-radius: 2.1rem;
    position: relative;
    margin-left: 1.3rem;
}
.dialog-box .msg-commit .msg-post textarea{
    width: calc(100% - 5rem);
    height: 100%;
    border: 0;
    margin-left: 1.2rem;
    font-weight: 400;
    font-size: 1.5rem;
    color: #181818;
    line-height: 4.2rem;
    border-radius: 1rem 0 0 1rem;
}
.dialog-box .msg-commit .msg-post .img-btn{
    position: absolute;
    width: 2.4rem;
    height: 2.4rem;
    right: 1.2rem;
    bottom: 50%;
    transform: translateY(50%);
    z-index: 99;
}
.dialog-box .msg-commit .msg-post .msg-loading{
    animation: spin 1.5s linear infinite; /* 应用动画：名称 时长 速度曲线 无限循环 */
}
/* 定义旋转动画的关键帧 */
@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}
.dialog-box .msg-commit .msg-post .img-btn img{display: block; width: 100%; height: 100%;}
.dialog-box .content-item > div{
    display: flex;
    margin-top: 2.4rem;
}
.dialog-box .content-item .receive .avatar{
    margin-right: .8rem;
}
.dialog-box .content-item .send{
    justify-content: end;
}
.dialog-box .content-item .send .msg{ display: flex; flex-direction: column; align-items: end;}
.dialog-box .content-item .receive .msg{ display: flex; flex-direction: column; align-items: start;}
.dialog-box .content-item .avatar img{
    display:  block;
    width: 4.4rem; height: 4.4rem;
    border-radius: 50%;
    object-fit: cover;
}
.dialog-box .content-item .msg span.time{
    font-weight: 400;
    font-size: 1.2rem;
    color: #818181;
    line-height: 1.6rem;
    display: block;
}
.dialog-box .content-item .send .msg span.time{
    text-align: right;
}
.dialog-box .content-item .send .avatar{margin-left: .8rem}
.dialog-box .content-item .msg p, .dialog-box .content-item .msg a{
    display: block;
    font-weight: 400;
    font-size: 1.5rem;
    color: #181818;
    line-height: 2.4rem;
    background: #FFFFFF;
    max-width: 26rem;
    border-radius: .8rem;
    padding: 1rem;
    margin-top: .6rem;
    white-space: break-spaces;
}
.dialog-box .content-item .msg a{
    color: #0d71bb;
}
.dialog-box .content-item .msg img{
    width: 12rem;
    border-radius: .8rem;
}
.welfare-center{
    height: calc(100% - 6rem);
    overflow-y: auto;
    background-color: #F6F6F6;
    background-image: linear-gradient(to top,
    rgba(255, 255, 255, 0.5) 1%,
    rgba(255, 255, 255, 0) 20%,
    transparent 100%), url("../images/fulibg.png");
    background-repeat: no-repeat;
    background-size: contain;
}
.welfare-center .header{
    width:  100%;
    position: relative;
}
.welfare-center .nav-header-title{
    width: 35.5rem;
    height: 6.8rem;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: end;
    position: relative;
}
.welfare-center .nav-header-title span.title{
    flex-grow: 1;
    font-weight: 400;
    font-size: 1.8rem;
    color: #FFFFFF;
    line-height: 4.8rem;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}
.welfare-center .header .line-name{
    width: 35.5rem; margin: 0 auto;
}
.welfare-center .header .line-name ul{background: #fff; border-radius: .8rem;}
.welfare-center .header .line-name ul span.wallet{font-size: 1.6rem; font-weight: 500;margin-left: 0}
.welfare-center .header .line-name ul span.detail{font-weight: 400; font-size: 1.4rem; color: #A5A5A5; margin-right: .6rem}
.welfare-center .header .line-name ul button.pay-btn{width: 6.8rem; height: 3.2rem;background: linear-gradient( 270deg, #F86D31 0%, #F5965D 100%); border-radius: .4rem; font-weight: 400; font-size: 1.4rem; color: #FFFFFF;line-height: 3.2rem;}
.welfare-center .header .qiandao{
    width: 35.5rem; margin: 1.1rem auto 0;
    border-radius: .8rem;
    background-color: #FFFFFF;
    padding-bottom: 1.6rem;
    background-image: url("../images/qiandaobg.png");
    background-repeat: no-repeat;
    background-size: contain;
}
.welfare-center .header .qiandao .bg{
    width: 100%;
    
    border-radius: .8rem;
}
.welfare-center .header .qiandao .btn-bg-clicked{
    opacity: .6;
}
.welfare-center .header .qiandao h4{
    font-weight: 500;
    font-size: 1.6rem;
    color: #181818;
    padding: 1.5rem 0 1.5rem 1.2rem;
}
.welfare-center .header .qiandao ul{width: 33.5rem; margin: 0 auto;display: flex; justify-content: space-around; border-radius: .8rem .8rem 0 0; padding: .8rem .6rem 0 .6rem;background: #fff;}

.welfare-center .header .qiandao li .gold{
    width: 4.3rem;
    height: 5.2rem;
    background: #FAEADD;
    border-radius: .4rem;
    display:  flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.welfare-center .header .qiandao li .gold span{
    font-weight: 500;
    font-size: 1.2rem;
    color: #F6901F;
}
.welfare-center .header .qiandao li.clocked .gold{
    background: linear-gradient( #FF6929, #FFBA82 100%, #FF965B 36%, #FF6929 0%);
    opacity: 0.5;
}
.welfare-center .header .qiandao li.clocked .gold span{
    color: #fff;
}
.welfare-center .header .qiandao li.clock-now .gold{
    background: linear-gradient( #FF6929, #FFBA82 100%, #FF965B 36%, #FF6929 0%);
}
.welfare-center .header .qiandao li.clock-now .gold span{
    color: #fff;
}
.welfare-center .header .qiandao li .gold img{display: block; width: 1.6rem; height: 1.6rem; margin-top: .5rem;}
.welfare-center .header .qiandao li .day{
    font-weight: 400;
    font-size: 1.2rem;
    color: #808080;
    display: block;
    text-align: center;
    margin-top: .7rem;
}
.welfare-center .header .qiandao .btn-bg{
    background-image:  url("../images/btn_checkin.png");
    background-repeat:no-repeat;
    background-size:cover;
    width: 22.6rem;
    height: 5.6rem;
    font-weight: 400;
    font-size: 1.7rem;
    color: #FFFFFF;
    text-align: center;
    line-height: 5.6rem;
    margin: 1.6rem auto 0;
}
.welfare-center .more-gold{
    width: 35.5rem; margin: 1rem auto;
    background: #fff;
    border-radius: .8rem;
    
}
.welfare-center .more-gold h4{
    font-weight: 500;
    font-size: 1.6rem;
    color: #181818;
    margin-left: 1.6rem;
    padding-top: 1.6rem;
}
.welfare-center .more-gold ul{
    width: 33.1rem; margin: 0 auto;
}
.welfare-center .more-gold ul li{
    display: flex;
    align-items: center;
    width: 100%;
    margin-top: 1.2rem;
}
.welfare-center .more-gold ul li > img{
    width: 3.4rem;
    height: 3.4rem;
    border-radius: .6rem;
    margin-bottom: 1rem;
}
.welfare-center .more-gold ul li .content{
    flex-grow: 1;
    margin-left: 1.1rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #f4f4f4;
    padding-bottom: 1rem;
}
.welfare-center .more-gold ul li .content p{
    font-weight: 500;
    font-size: 1.5rem;
    color: #181818;
}
.welfare-center .more-gold ul li .content .icon{
    display: flex;
    align-items: center;
    margin-top: .5rem;
}
.welfare-center .more-gold ul li .content .icon img{
    display: block;
    width: 1.4rem; height: 1.4rem;
    margin-right: .2rem;
}
.welfare-center .more-gold ul li .content .icon span.invite{
    color: #AEAEAE;
    margin-right: 1.2rem;
    font-size: 1.2rem;
}
.welfare-center .more-gold ul li .content .icon span.gold{
    font-weight: 400;
    font-size: 1.4rem;
    color: #E95F41;
}
.welfare-center .more-gold ul li .content button{
    width: 7.6rem;
    height: 3rem;
    flex-shrink: 0;
    line-height: 3rem;
    border-radius: .4rem;
    background: linear-gradient( 270deg, #F86D31 0%, #F5965D 100%);
    font-size: 1.3rem;
}
.welfare-center .van-popup{
    border-radius: 2.5rem;
    background: none;
}
.welfare-center .discount-coupon-box{
    width: 29.1rem;
    /*32.6rem*/
    height: auto;
    background: #fff;
    background-image: url("../images/tcbg.png");
    background-repeat:no-repeat;
    background-size: contain;
    border-radius: 2.5rem;
    padding-bottom: 1rem;
}
.welfare-center .close-icon{
    margin: 1.6rem 0;
    text-align: center;
}
.welfare-center .discount-coupon-box h2{
    font-weight: 600;
    font-size: 2.2rem;
    color: #411A00;
    text-align: center;
    padding: 2.7rem 0 1.6rem;
}
.welfare-center .discount-coupon-box .list{
    max-height: 17rem;
    overflow-y: auto;
}
.welfare-center .discount-coupon-box .van-button{
    width: 22.8rem;
    height: 4.8rem;
    background: linear-gradient(90deg, #FE521B 0%, #EB2736 100%);
    border-radius: 2.5rem;
    font-weight: 400;
    font-size: 1.7rem;
    color: #FFFFFF;
    margin: 2.6rem auto 1.6rem;
}
.welfare-center .discount-coupon-box .list .coupon{
    width: 25.6rem;
    height: 6.8rem;
    margin: 0 auto;
    background-image: url("../images/voucherbg.png");
    background-repeat:no-repeat;
    background-size: contain;
    margin-top: 1rem;
    display: flex;
    align-items: center;
}
.welfare-center .discount-coupon-box .list .coupon .left{
    width: 6.5rem;
    margin-left: 1.2rem;
    margin-bottom: 1rem;
}
.welfare-center .discount-coupon-box .list .coupon .right{
    margin-left: 1.8rem;
}
.welfare-center .discount-coupon-box .list .coupon .right h4{
    font-weight: 400;
    font-size: 1.5rem;
    color: #FFFFFF;
    margin-bottom: .3rem;
}
.welfare-center .discount-coupon-box .list .coupon .right p{
    font-weight: 400;
    font-size: 1.1rem;
    color: #FFFFFF;
}
.welfare-center .discount-coupon-box .list .coupon .money{
    color: #E53925;
    text-align: center;
}
.welfare-center .discount-coupon-box .list .coupon .money span{
    font-family: Roboto;
    font-weight: bold;
    font-size: 3.1rem;
}
.welfare-center .discount-coupon-box .list .coupon .type{
    text-align: center;
    font-weight: 400;
    font-size: 1.1rem;
    color: #E53925;
}
.invite-friend{
    min-height: 100%;
    padding-bottom: 3rem;
    background-color: #FD556C;
}
.invite-friend .header{position: relative}
.invite-friend .share-bg{
    width: 100%;
    height: calc(100% - 16rem);
    overflow-y: auto;
    background-image: url("../images/sharebg.png");
    background-repeat:no-repeat;
    background-size:cover;
    
}
.invite-friend .nav-header-title{position: relative}
.invite-friend .nav-header-title .title{
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    margin-right: 0;
}
.invite-friend .share-bg img.invite-bg{
    display: block;
    width: 100%;
}
.invite-friend .share-bg .invite-code{
    width: 24rem; height: 11.2rem;
    margin: 0 auto;
    background-image:  url("../images/coadbg.png");
    background-repeat:no-repeat;
    background-size:cover;
}
.invite-friend .share-bg .invite-code p{
    text-align: center;
    padding-top: 3rem;
    font-weight: 400;
    font-size: 1.5rem;
    color: #101010;
}
.invite-friend .share-bg .invite-code span.code{
    font-weight: 600;
    font-size: 2.2rem;
    color: #FE6013;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    line-height: 3rem;
    margin-top: .3rem;
}
.invite-friend .share-bg .invite-code span.code img{
    width: 1.5rem;
    height: 1.5rem;
    display: block;
    margin-left: .7rem;
}
.invite-friend .share-bg .invite-three{width: 100%; margin-top: 3rem;}
.invite-friend .share-bg .share-friend-dialog .cancel-div,
.invite-friend .share-bg .share-friend-dialog h3{display: none;}
.invite-friend .share-bg .share-friend-dialog ul{margin-top: 1.5rem; width: 30rem}
.invite-friend .share-bg .share-to{
    width: 35.5rem;
    margin: 2rem auto 0;
    background: #FFFFFF;
    border-radius: .8rem;
    padding: 1.5rem 0 1.9rem 0;
}
.invite-friend .share-bg .share-to h4{
    font-weight: 500;
    font-size: 1.6rem;
    color: #181818;
    line-height: 2.2rem;
    width: 32.5rem;
    margin: 0 auto;
}
.invite-friend .invite-friends-list{
    width: 32.5rem;
    margin: 1rem auto 0;
    background: #fff;
    border-radius: .8rem;
    padding: 1.5rem;
}
.invite-friend .invite-friends-list h4{
    font-weight: 500;
    font-size: 1.6rem;
    color: #181818;
    line-height: 2.2rem;
}
.invite-friend .invite-friends-list li{display: flex; justify-content: space-between; align-items: center;}
.invite-friend .invite-friends-list li img.avatar{width: 3.4rem; height: 3.4rem; border-radius: 50%}
.invite-friend .invite-friends-list li .content{
    flex-grow: 1;
    margin-left: .8rem;
    border-bottom: .1rem solid #eee;
    display: flex;
    justify-content: space-between;
    align-items:  center;
    padding: 1.2rem 0
}
.invite-friend .invite-friends-list li .content h5{
    font-weight: 400;
    font-size: 1.4rem;
    color: #181818;
}
.invite-friend .invite-friends-list li .content span{
    font-weight: 400;
    font-size: 1.2rem;
    color: #929292;
    margin-left: .4rem;
}
.invite-friend .invite-friends-list li .content button{
    width: 7.6rem;
    height: 3rem;
    line-height: 3rem;
    background: #FFF1EB;
    border-radius: .4rem;
    font-weight: 400;
    font-size: 1.3rem;
    color: #FE6F34;
    flex-shrink: 0;
}
.invite-friend .invite-friends-list li .content button.unfinished{
    background: #D5D5D5;
    color: #FFFFFF;
}
.invite-friend .invite-friends-list li .nick{
    display: flex;
    align-items: center;
    flex-wrap:wrap;
}
.invite-friend .invite-friends-list li .nick p{
    width: 100%;
    font-weight: 400;
    font-size: 1.2rem;
    color: #E95F41;
    margin-top: .5rem;
}
.invite-friend .invite-friends-list li .nick p.unfinished{
    color: #4EA64D;
}
#offer-vip-dialog{
    width: 100%;
    height: 100%;
    position: relative;
}
#offer-vip-dialog .backgroud{
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-66%);
    width: 27.5rem;
    height: 40.4rem;
    background-image: url("../images/vipbg.png");
    background-repeat:no-repeat;
    background-size:cover;
}
#offer-vip-dialog .backgroud .title{
    margin-top: 6rem;
    margin-left: 1.5rem;
}
#offer-vip-dialog .backgroud .title img{
    display: block;
    width: 8.1rem;
    height: 2.8rem;
}
#offer-vip-dialog .backgroud .vip-img{
    width: 100%;
    margin-top: 3.1rem;
}
#offer-vip-dialog .backgroud .vip-img img{
    display: block;
    margin: 0 auto;
    width: 13.379rem;
    height: 3.144rem;
}
#offer-vip-dialog .backgroud .vip-img p{
    font-weight: 400;
    font-size: 1.5rem;
    color: #9F4E37;
    text-align: center;
    margin-top: .9rem;
}
.count-down {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 1.2rem;
}
#offer-vip-dialog .count-down > img{

    width: 1.5rem;
}
.count-down > span{

    font-weight: 400;
    font-size: 1.3rem;
    color: #7E2B16;

}
 .count-down .van-count-down{
    margin: 0 .6rem;
}
.count-down .colon {
    display: inline-block;
    margin: 0 .3rem;
    color: #F94E3B;
}
.count-down .block {
    display: inline-block;
    padding: .1rem .4rem;
    color: #fff;
    font-size: 1.2rem;
    
    background: #F94E3B;
    border-radius: .3rem;
}
#offer-vip-dialog .money{
    margin: 1rem 0;
}
#offer-vip-dialog .money p{
    text-align: center;
}
#offer-vip-dialog .money p.discount{
    font-size: 2.4rem;
    color: #FB3938;
}
#offer-vip-dialog .money p.discount span{
    font-size: 5.2rem;
}
#offer-vip-dialog .money .original{
    font-size: 1.7rem;
    color: #A49F97;
    text-decoration: line-through;
}
#offer-vip-dialog .offer-btn-box button{
    width: 22.8rem;
    height: 4.8rem;
    background: linear-gradient(180deg, #F9C088 0%, #F13917 100%);
    box-shadow: 0 .3rem .6rem rgba(0,0,0,0.16);
    border-radius: 2.5rem;
    margin: 0 auto;
    color: #fff;
    font-size: 1.7rem;
}
#offer-vip-dialog .offer-btn-box button.van-button--default{
    border: none
}
#offer-vip-dialog .offer-btn-box > span{
    display: block;
    text-align: center;
    font-weight: 400;
    font-size: 1.5rem;
    color: #A49F97;
    margin-top: 1.3rem;
}
.top-up-page .van-popup h3{
    font-family: PingFang SC;
    font-weight: 600;
    font-size: 1.8rem;
    color: #181818;
    width:  100%;
    text-align: center;
    line-height: 6rem;
}
.open-vip span{
    font-weight: 400;
    font-size: 1.3rem;
    color: #A2A2A2;
}
.open-vip .van-cell{
    padding: 0;
    margin: 1.5rem 0 .4rem
}
/*.open-vip .van-cell::after{
    border-bottom: 0;
}*/
.open-vip .van-cell__title span{
    font-weight: 400;
    font-size: 1.5rem;
    color: #181818;
}
.open-vip .do-open-vip-btn{
    margin-top: 1.1rem;
    width: 35.5rem;
    height: 4.8rem;
    background: linear-gradient(90deg, #EA6659 0%, #D94032 100%);
    border-radius: .6rem;
    font-weight: 400;
    font-size: 1.6rem;
    color: #FFFFFF;
}
.open-vip .do-open-vip-btn .van-button__text{
    font-size: 1.6rem;
    color: #FFFFFF;
}
.discount-coupon-list .list-item{
    width: 34.3rem;
    height: 8rem;
    margin: 0 auto 1rem;
    background: #FDF1F3;
    border-radius: .6rem;
    display: flex;
    justify-content: space-between;
    align-items:  center;
}
.discount-coupon-list .list-item .left{
    width: 9rem;
}
.discount-coupon-list .list-item .left .money{
    font-weight: 400;
    font-size: 1.1rem;
    color: #E53925;
    text-align: center;
}
.discount-coupon-list .list-item .left span{
    font-family: Roboto;
    font-weight: bold;
    font-size: 3.1rem;
}
.discount-coupon-list .list-item .left .type{
    font-weight: 400;
    font-size: 1.1rem;
    color: #E53925;
    text-align: center;
}
.discount-coupon-list .list-item  .center-line{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
}
.discount-coupon-list .list-item .round{
    display: block;
    width: .9rem;
    height: .9rem;
    background: #FFF;
    border-radius: 50%;
}
.discount-coupon-list .list-item .line{
    height: 6.7rem;
    border-left: .1rem dotted #DCC1BD;
}

.discount-coupon-list .list-item .right{
    flex-grow: 1;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 0 1.4rem;
}
.discount-coupon-list .list-item .right h4{
    font-family: PingFang SC;
    font-weight: 600;
    font-size: 1.5rem;
    color: #181818;
}
.discount-coupon-list .list-item .right p{
    font-family: PingFang SC;
    font-weight: 400;
    font-size: 1.1rem;
    color: #DD3F23;
    margin-top: .4rem;
}
.discount-coupon-list .list-item .right .van-radio__icon{
    font-size: 1.6rem;
}
.discount-coupon-list .list-item .right .van-button{
    height: 2.6rem;
    background: #E53925;
    border-radius: .4rem;
    font-weight: 400;
    font-size: 1.2rem;
    color: #FFFFFF;
}
.discount-coupon-list .list-item .right .van-checkbox__icon{
    height: auto;
}
.discount-coupon-list .list-item.list-item-record{
    background: #F8F8F8;
}
.discount-coupon-list .list-item.list-item-record .money,
.discount-coupon-list .list-item.list-item-record .type{
    color: #EE978D;
}
.discount-coupon-list .list-item.list-item-record .right p{
    color: #C5C5C5;
}
.discount-coupon-list .list-item.list-item-record .right h4{
    color: #A2A2A2;
}
.discount-coupon-list .list-item .right .right-timeout{
    display: flex;
    align-items: center;
    margin-top: .4rem;
}
.discount-coupon-list .list-item .right .right-timeout span{
    font-weight: 400;
    font-size: 1.2rem;
    color: #DD3F23;
}
.discount-coupon-list .list-item .right .right-timeout .van-count-down{
    margin-left: .3rem;
    display: flex;
    align-items: center;
}
.discount-coupon-list .list-item.list-item-record .right .van-button{
    background: #C0C0C0;
    border:  none;
}
.discount-coupon-list .list-item.list-item-record .line{
    border-left: .1rem dotted #D8D8D8;
}
.my-discount-coupon-list{
    height: 100%;
}
.my-discount-coupon-list .my-coupon-list.coupon-list{
    height: calc(100% - 5.2rem);
}
.my-discount-coupon-list .my-coupon-list.coupon-list .list, .my-discount-coupon-list .my-coupon-list.coupon-list .van-tabs{
    height: 100%;
}
.my-discount-coupon-list .my-coupon-list.coupon-list .van-tab__pane{
    position: relative;
    height: 100%;
}
.my-discount-coupon-list .my-coupon-list.coupon-list .van-tabs__content{
    height: calc(100% - 7.3rem);
    overflow-y: auto;
}
.my-coupon-list.coupon-list .van-tabs__wrap{
    padding: 1.6rem 0;
    background: #fff;
}
.my-coupon-list.coupon-list .van-sticky{
    width: 37.5rem;
    margin: 0 auto;
}
.van-popup--bottom{
    width: 37.5rem;
    margin: 0 auto;
    left: auto;
}
.playlet-readform .van-popup--bottom{
    height: 75%;
}
.top-up-page .van-popup--bottom .van-icon{
    font-size: 1.8rem;
}
.top-up-page .van-popup--bottom .van-popup__close-icon--top-right{
    top: 2rem
}

.discount-dialog-popup.van-popup--show{
    display: flex !important;
}
.discount-dialog-popup{
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    max-height: none !important;
    background: none !important;
    background-color: transparent !important;
    align-items: center !important;
    overflow: visible !important;
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    transform: none !important;
}
#top-up-discounnt-dialog{
    width: 100%;
    min-height: 40rem;
    position: absolute;
    bottom: 50%;
    transform: translateY(50%);
}
#top-up-discounnt-dialog:has(li:last-child:nth-child(n+3)){
    transform: translateY(70%);
}
#top-up-discounnt-dialog:has(li:last-child:nth-child(n+4)){
    transform: translateY(80%);
}
#top-up-discounnt-dialog .close{
    width: 3rem;
    margin: 1.7rem auto 0;
    text-align: center;
}
#top-up-discounnt-dialog .close img{
    display:  block;
    width: 100%;
}
#top-up-discounnt-dialog .backgroud{
    width: 37.5rem;
    margin: 0 auto;
    min-height: 30.9rem;
    background-image: url('../images/f-ee1_02.png');
    background-size: contain;
    background-repeat: no-repeat;
    position: relative;
}
#top-up-discounnt-dialog .backgroud button{
    width: 20rem;
    height: 4.6rem;
    margin: 0 auto;
    background: linear-gradient( 0deg, #FEED98 0%, #FFF7CD 62.58%, #FFFDED 100%);
    box-shadow: 0 .3rem .6rem .1rem rgba(0,0,0,0.16);
    border-radius: 2.3rem 2.3rem 2.3rem 2.3rem;
    font-weight: 600;
    font-size: 1.7rem;
    color: #242423;
    
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    bottom: 23px;
    transform: translateX(-50%);
    left: 50%;
}
#top-up-discounnt-dialog .discount-list{
    position: absolute;
    bottom: 12rem;
    left: 50%;
    transform: translateX(-50%);
    width: 29.5rem;
    margin: 0 auto;
    background-color: #FFE5C1;
    border-radius: 2rem 2rem 0 0;
}
#top-up-discounnt-dialog .discount-list .border{
    width: 28.4rem;
    margin: .6rem auto 0;
    border-top: .2rem solid #FFC8A4;
   
    padding-left: .2rem; 
    box-sizing: border-box; 

    
    background: 
            linear-gradient(to bottom, #FFC8A4, transparent) 0 0 / .2rem 100% no-repeat,
                
            linear-gradient(to bottom, #FFC8A4, transparent) right / .2rem 100% no-repeat;
    border-radius: 2rem 2rem 0 0;
}
/*#top-up-discounnt-dialog .discount-list .border .van-hairline--left::after{
    border: .1rem dotted #DBDBDB;
}*/
#top-up-discounnt-dialog .discount-list .border .hairline--left{
    width: .1rem;
    height: 3.8rem;
    background: linear-gradient(to bottom, #DBDBDB 0%, #DBDBDB 50%, transparent 10%);
    background-size: 100% .6rem;  
    background-repeat: repeat-y;
}
#top-up-discounnt-dialog .discount-list .price-box{
    flex-shrink: 0;
    text-align: center;
    
    width: 9rem;
}
#top-up-discounnt-dialog .discount-list .vip-type{
    flex-grow: 1;
    margin-left: .8rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
#top-up-discounnt-dialog .discount-list .vip-type p{
    font-weight: 600;
    font-size: 1.5rem;
    color: #1F1F1F;
}
#top-up-discounnt-dialog .discount-list .vip-type span{
    font-weight: 400;
    font-size: 1.2rem;
    color: #8A8A8A;
    margin-top: .1rem;
}
#top-up-discounnt-dialog .discount-list .price-box span{
    font-weight: 600;
    font-size: 1.4rem;
    color: #FD3436;
}
#top-up-discounnt-dialog .discount-list .price-box span.m{
    font-size: 2.6rem;
}
#top-up-discounnt-dialog .discount-list img{
    display: block;
    width: 21.1rem;
    margin: 2rem auto 1.7rem;
}
#top-up-discounnt-dialog .discount-list li{
    width: 26.9rem;
    height: 6.6rem;
    margin: 0 auto .6rem;
    background: #FFFFFF;
    border-radius: 1rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
#top-up-discounnt-dialog .discount-list li:last-child{
    margin-bottom: 0;
}
#top-up-discounnt-dialog .discount-list li .van-hairline--left{
    height: 80%;
    margin-top: 2%;
}
::-webkit-scrollbar {
    width: .4rem;
    height: .4rem;
}

::-webkit-scrollbar-track {
    background:#313131;
    border-radius: .6rem;
}

::-webkit-scrollbar-thumb {
    background: #434343;
    border-radius: .6rem;
}

@media screen and (min-width:768px) {
    .body-content{
        overflow-y: auto;
    }
    .guide{
        display: none
    }
    .readbox::-webkit-scrollbar {
        width: 5px;
        background-color: transparent;
    }

    .readbox::-webkit-scrollbar-thumb {
        border-radius: 5px;
        background-color: #ccc;
    }

    ul.piclist {
        gap: .4rem;
    }
    .cate-content .synthetical .cate-list::-webkit-scrollbar {
        display: block;
    }
}
@media screen and (max-width:768px){
    .open-vip-model .vip-type, .body-content, .readbox .home-content .vip-list ul {
        /* 1. 激活滚动功能 */
        overflow-x: auto;
        white-space: nowrap; /* 如果内容是横向列表，通常需要这个 */
    
        /* 2. 隐藏滚动条 */
        scrollbar-width: none; /* Firefox */
        -ms-overflow-style: none; /* IE 和 Edge */
    }
    /* 隐藏Chrome、Safari等浏览器的滚动条 */
    .body-content::-webkit-scrollbar, .open-vip-model .vip-type::-webkit-scrollbar {
        display: none;
    }
}