body { background-color: #fff } input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus { box-shadow:0 0 0 60px #ffffff inset; -webkit-text-fill-color: #333333; } #footer { position: fixed; bottom: 0; background-color: #fff; height: 1.1rem; width: 100%; z-index: 9; box-shadow: 0 .03rem .2rem rgba(0, 0, 0, 0.06) } #footer a { flex: 1; -webkit-flex: 1; text-align: center; font-size: .2rem; color: #b5b5b5 } #footer a.on { color: #ff5c40 } #footer a .icon { font-size: .55rem } #footer a .name { margin-top: -0.02rem; font-weight: bold; font-size: 0.24rem; } #footer a .pictrue { width: .6rem; height: .6rem; margin: 0 auto 0rem auto; } #footer a .pictrue img { width: 100%; height: 100%; display: block } .swiper-list { padding: .29rem .2rem 0 } .swiper-list .item { width: 3.45rem; margin-bottom: .29rem } .swiper-list .item .pictrue { width: 100%; height: 1.92rem } .swiper-list .item .pictrue img { width: 100%; height: 100%; border-radius: .1rem } .swiper-list .item .name { margin-top: .12rem; font-size: .3rem; line-height: .42rem; color: #333; overflow: hidden; white-space: nowrap; text-overflow: ellipsis } .swiper-list .item .label-wrapper { margin-top: .12rem } .swiper-list .item .age { padding-right: .12rem; padding-left: .12rem; border-radius: .06rem; background-color: rgba(44, 142, 255, .06); font-size: .22rem; line-height: .4rem; color: #2c8eff } .swiper-list .item .money { height: .45rem; margin-top: .1rem; font-size: .24rem; line-height: .45rem; color: #FF6B00 } .swiper-list .item .money span { font-size: .32rem } .swiper-list .item .free { height: .45rem; margin-top: .1rem; font-size: .24rem; line-height: .45rem; color: #FF6B00 } .swiper-list2 .item { padding-left: .2rem; margin-top: .2rem } .swiper-list2 .item .pictrue { position: relative; width: 2.5rem; height: 1.4rem } .swiper-list2 .item .pictrue img { width: 100%; height: 100%; border-radius: .1rem } .swiper-list2 .item .pictrue .label { position: absolute; right: .1rem; bottom: .1rem; padding-right: .11rem; padding-left: .11rem; border-radius: .03rem; background-color: rgba(0, 0, 0, .5); font-size: .22rem; line-height: .34rem; color: #fff } .swiper-list2 .item .underline { -webkit-flex: 1; flex: 1; padding-right: .2rem; padding-left: .24rem } .swiper-list2 .item .text-pic { flex-wrap: nowrap; -webkit-flex-wrap: nowrap } .swiper-list2 .item .text-pic .name { font-size: .32rem; line-height: .45rem; color: #333; overflow: hidden; white-space: nowrap; text-overflow: ellipsis } .swiper-list2 .item .text-pic .notes { font-size: .28rem; color: #989898 } .swiper-list2 .item .text-pic .bottom { height: .45rem; margin-top: .09rem } .swiper-list2 .item .text-pic .bottom .free { margin-top: 0 } .swiper-list2 .item .text-pic .num { padding-right: .12rem; padding-left: .12rem; border-radius: .06rem; background-color: rgba(44, 142, 255, .06); font-size: .22rem; line-height: .4rem; color: #2c8eff } .swiper-list2 .item .text-pic .num ~ .num { margin-left: .14rem } .swiper-list2 .item .text-pic .money { height: .45rem; margin-top: .15rem; font-size: .24rem; line-height: .45rem; color: #FF6B00 } .swiper-list2 .item .text-pic .money span { font-size: .32rem } .swiper-list2 .item .text-pic .free { height: .45rem; margin-top: .15rem; font-size: .24rem; line-height: .45rem; color: #FF6B00 } .swiper-details .banner { height: 4.2rem } .swiper-details .banner .swiper-slide { width: 100%; height: 100% } .swiper-details .banner .swiper-slide img { width: 100%; height: 100% } .swiper-details .banner .swiper-pagination-bullet { width: .1rem; height: .1rem; border-radius: .05rem; background-color: #b4b4b4; opacity: .5 } .swiper-details .banner .swiper-pagination { bottom: 0 } .swiper-details .banner .swiper-pagination-bullet-active { width: .2rem; height: .1rem; border-radius: .05rem; background-color: #2c8eff; opacity: 1 } .swiper-details .swiper .swiper-int { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; padding: .18rem .3rem .14rem } .swiper-details .swiper .swiper-int .swiper-int-top { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; min-width: 0; } .swiper-details .swiper .swiper-int .swiper-int-top .collect { width: 3em; margin-left: .16rem } .swiper-details .swiper .swiper-int .name { font-size: .32rem; line-height: .5rem; color: #333 } .swiper-details .swiper .swiper-int .attr { display: -webkit-box; display: -webkit-flex; display: flex; } .swiper-details .swiper .swiper-int .attr div { padding-right: .12rem; padding-left: .12rem; border-radius: .1rem; background-color: rgba(44, 142, 255, .06); font-size: .2rem; line-height: .4rem; color: #2c8eff } .swiper-details .swiper .swiper-int .attr div ~ div { margin-left: .14rem } .swiper-details .swiper .swiper-int .infor { font-size: .28rem; color: #999 } .swiper-details .swiper .swiper-int .pin-money { font-size: .24rem; color: #ff4a4a } .swiper-details .swiper .swiper-int .pin-money .money { font-size: .36rem; margin-left: .1rem } .swiper-details .swiper .swiper-int .num { font-size: .24rem; color: #999; width: 1.15rem; height: .35rem; border-radius: .5rem; border: 1px solid #999; margin-top: .1rem } .swiper-details .swiper .swiper-int .num ~ .num { margin-left: .15rem } .swiper-details .swiper .swiper-int .collect { width: 0.8rem; font-size: .26rem; line-height: .37rem; color: #999999; text-align: center } .swiper-details .swiper .swiper-int .collect .iconfont { font-size: .41rem; line-height: 1; color: #999999; margin-bottom: .13rem } .swiper-details .swiper .swiper-int .collect .iconfont.iconshoucang2 { color: #FF6B00 } .swiper-details .swiper .swiper-int > .acea-row { margin-top: .14rem } .swiper-details .swiper .swiper-int > .acea-row .collect { font-size: .24rem; line-height: normal; color: #999 } .swiper-details .swiper .peopleNum { padding: .18rem .28rem .2rem .33rem; border-top: 1px solid rgba(229, 229, 229, .75) } .swiper-details .swiper .peopleNum .pictrue { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis } .swiper-details .swiper .peopleNum .pictrue img { width: .56rem; height: .56rem; border: 1px solid #e5e5e5; border-radius: 50%; vertical-align: middle } .swiper-details .swiper .peopleNum .pictrue img ~ img { margin-left: .1rem } .swiper-details .swiper .peopleNum .iconfont { font-size: .25rem; color: #999; margin-left: .3rem } .swiper-details .swiper .peopleNum .text { font-size: .28rem; color: #999 } .swiper-details .swiper-nav .navCon .item { position: relative; height: .96rem; font-size: .3rem; line-height: .96rem; text-align: center; color: #999999; cursor: pointer } .swiper-details .swiper-nav .navCon .item ~ .item { margin-left: 0.5rem; } .swiper-details .swiper-nav .navCon .item.on::after { content: " "; position: absolute; bottom: 0; left: 50%; width: 0.44rem; height: .04rem; border-radius: .02rem; background-color: #2c8eff; -webkit-transform: translateX(-50%); transform: translateX(-50%) } .swiper-details .swiper-nav .navCon .item.on { font-weight: bold; font-size: .32rem; color: #333333; } .thematic-details .swiper-details .swiper-nav { margin-top: .14rem; background-color: #fff } .swiper-details .swiper-conter { padding: .3rem; background-color: #fff } .swiper-details .swiper-conter img { display: block; width: 100% } .swiper-details .video-list .title { font-size: .3rem; color: #333; height: .6rem; line-height: .6rem; background-color: #f2f2f2; font-weight: bold; padding: 0 .3rem } .swiper-details .video-listn .item { padding-left: .3rem } .swiper-details .video-listn .item ~ .item { margin-top: .3rem } .swiper-details .video-listn .item .underline { -webkit-flex: 1; flex: 1; -webkit-align-self: flex-start; align-self: flex-start; min-width: 0; padding-right: .3rem; padding-left: .24rem } .swiper-details .video-listn .item .pictrue { width: 2.5rem; height: 1.4rem } .swiper-details .video-listn .item .pictrue img { width: 100%; height: 100%; border-radius: .1rem } .swiper-details .video-listn .item .pictrue .label { position: absolute; right: .1rem; bottom: .1rem; padding-right: .11rem; padding-left: .11rem; border-radius: .03rem; background-color: rgba(0, 0, 0, .5); font-size: .22rem; line-height: .34rem; color: #fff } .swiper-details .video-listn .item .text .name { width: 100%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: .3rem; line-height: .42rem; color: #333; font-weight: 400 } .swiper-details .video-listn .item .text .attr { display: -webkit-flex; display: flex; margin-top: .08rem } .swiper-details .video-listn .item .text .attr div { padding-right: .08rem; padding-left: .08rem; border-radius: .03rem; background-color: rgba(44, 142, 255, .06); margin-left: .14rem; font-size: .24rem; line-height: .4rem; color: #2c8eff } .swiper-details .video-listn .item .text .attr div:first-child { margin-left: 0 } .swiper-details .video-listn .item .text .free { width: .86rem; border-radius: .19rem; margin-top: .19rem; background-color: rgba(254, 183, 32, .1); font-size: .22rem; line-height: .38rem; text-align: center; color: #FF6B00 } .swiper-details .video-listn .item .text .price { margin-top: .12rem; font-size: .24rem; line-height: .45rem; color: #FF6B00 } .swiper-details .video-listn .item .text .price span { font-size: .32rem } .swiper-details .video-listn .item .text .num { font-size: .3rem; color: #999 } .swiper-details .video-listn .item .text .num .iconfont { font-size: .3rem; margin-right: .13rem } .swiper-details .video-listn .item .text .num .see { font-size: .22rem; color: #157dfa; width: .6rem; height: .3rem; border: 1px solid #157dfa; margin-left: .05rem } .swiper-details .successTip { position: absolute; top: 0.9rem; left: 0.2rem; z-index: 5; } .swiper-details .successTip .picTxt { color: #fff; font-size: .24rem; width: 4rem; background-color: rgba(0, 0, 0, 0.3); border-radius: 0.37rem; padding: .05rem .25rem; } .swiper-details .successTip .pictrue { width: .4rem; height: .4rem } .swiper-details .successTip .pictrue img { width: 100%; height: 100%; border-radius: 50% } .swiper-details .successTip .name { max-width: .8rem; margin-left: .15rem } .teamwork .list { padding: .47rem .64rem .53rem; } .teamwork .list .pictrue { width: .94rem; height: .94rem; margin-left: .38rem; position: relative; margin-bottom: .29rem } .teamwork .list .pictrue .king { width: .51rem; height: .37rem; position: absolute; top: -0.1rem; left: -0.1rem; z-index: -1; transform: rotate(-20deg); } .teamwork .list .pictrue img { width: 100%; height: 100%; border-radius: 50% } .teamwork .tiptime { font-size: .32rem; color: #333; font-weight: bold; text-align: center } .teamwork .tiptime .time { color: #ea2f2f } .teamwork .listSuccess { padding: 0 .3rem 0 0 } .teamwork .listSuccess .pictrue { margin-left: .3rem } .teamwork .listSuccess .pictrue { width: .74rem; height: .74rem } .teamwork .listSuccess .pictrue img { width: 100%; height: 100%; border-radius: 50% } .teamwork .listSuccess .pictrue .king { top: -0.22rem; left: -0.07rem } .course-list .header { width: 100%; height: 3.5rem; background-repeat: no-repeat; background-size: 100% 100% } .initiate-group .header { padding: .23rem .3rem; } .initiate-group .header .pictrue { width: 2.5rem; height: 1.4rem; border-radius: .1rem; overflow: hidden } .initiate-group .header .pictrue img { display: block; width: 100%; height: 100%; object-fit: cover } .initiate-group .header .text { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; min-width: 0; margin-left: .2rem; font-size: .3rem; line-height: .42rem; color: #222222; } .initiate-group .header .text .money { display: inline-block; vertical-align: middle; font-weight: bold; font-size: .24rem; line-height: .45rem; color: #FF6B00 } .initiate-group .header .text .money span { font-size: .32rem } .initiate-group .header .text .mark { display: inline-block; vertical-align: middle; height: .3rem; padding-right: .09rem; padding-left: .09rem; border: 1px solid #2C8EFF; border-radius: .15rem; margin-left: .11rem; font-size: .2rem; line-height: .3rem; color: #2C8EFF; } .initiate-group .count-down { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-justify-content: center; justify-content: center; -webkit-align-items: center; -webkit-box-align: center; align-items: center; padding-top: .36rem; padding-bottom: .31rem; border-top: .2rem solid #F5F5F5; } .initiate-group .count-down .inner { position: relative; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; padding-right: .5rem; padding-left: .5rem; font-size: .28rem; line-height: .4rem; color: #282828; } .initiate-group .count-down .inner::before { content: ""; position: absolute; top: 50%; right: 100%; width: 1.36rem; height: 1px; background-color: #DDDDDD; } .initiate-group .count-down .inner::after { content: ""; position: absolute; top: 50%; left: 100%; width: 1.36rem; height: 1px; background-color: #DDDDDD; } .initiate-group .count-down .time { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; margin-right: .12rem; margin-left: .12rem; font-weight: bold; color: #FEB720; } .initiate-group .count-down .number { width: .42rem; height: .42rem; border-radius: .03rem; margin-right: .06rem; margin-left: .06rem; background-color: #FFF5E1; line-height: .42rem; text-align: center; } .initiate-group .tips-section { font-weight: bold; font-size: .3rem; line-height: .42rem; text-align: center; color: #2C8EFF; } .initiate-group .people-section { margin-top: .46rem; padding-right: .64rem; padding-left: .64rem; text-align: center; } .initiate-group .people-section li { display: inline-block; width: .94rem; height: .94rem; border-radius: 50%; overflow: hidden; vertical-align: middle; } .initiate-group .button-section { padding: 0 .64rem; text-align: center; } .initiate-group .button-section .invitation { height: .86rem; border-radius: .43rem; background-color: #2C8EFF; font-size: .3rem; line-height: .86rem; text-align: center; color: #FFFFFF; } .initiate-group .button-section .cancel { display: inline-block; padding-left: .35rem; margin-top: .25rem; background: url(img/b01_8b8c9565ae.png) left center/.26rem .26rem no-repeat; font-size: .24rem; line-height: .33rem; color: #282828; } .initiate-group .header .label { font-size: .3rem; color: #ea2f2f; font-weight: bold; width: 1.15rem; height: 1.15rem; border: .04rem solid #ea2f2f; border-radius: 50%; padding: 0 .1rem; text-align: center; background-color: #fff } .initiate-group .bnt { font-size: .32rem; color: #333; width: 3rem; height: 1rem; border-radius: .1rem; border: 1px solid #e5e5e5; background-color: #fff; margin-top: .4rem } .initiate-group .bnt.invite { margin-left: .29rem; background-color: #ea2f2f; color: #fff; border-color: #ea2f2f } .initiate-group .service { width: 1.1rem; height: 1.1rem; border-radius: 50%; background-color: #509efb; font-size: .24rem; color: #fff; font-weight: bold; flex-direction: column; position: fixed; right: .35rem; bottom: 1.88rem } .initiate-group .service .iconfont { font-weight: normal; font-size: .4rem; margin-bottom: -0.09rem } .initiate-group2 .list { padding: 0 .3rem 0 .2rem; margin: .47rem auto .2rem auto } .initiate-group2 .list .pictrue { width: .79rem; height: .79rem; margin-left: .13rem; position: relative; margin-bottom: .1rem } .initiate-group2 .list .pictrue .king { width: .51rem; height: .37rem; position: absolute; top: -0.23rem; left: -0.05rem; z-index: -1 } .initiate-group2 .list .pictrue img { width: 100%; height: 100%; border-radius: 50% } .initiate-group2 .tiptime { text-align: center; font-size: .32rem; color: #333; font-weight: bold } .initiate-group2 .tiptime2 { margin-bottom: .27rem } .initiate-group2 .tiptime .time { color: #ea2f2f } .initiate-group2 footer { height: 1.28rem; background-color: #fff; border-top: 1px solid #e6e6e6; padding: 0 .3rem; position: fixed; bottom: 0; width: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box } .initiate-group2 footer .open-group { font-size: .32rem; color: #333; font-weight: bold; width: 2.77rem; height: 1rem; border: 1px solid #d9d9d9; border-radius: .15rem } .initiate-group2 footer .goin-group { font-size: .36rem; color: #333; font-weight: bold; width: 3.9rem; height: 1rem; background-color: #fbdc46; border-radius: .15rem } .user .header { height: 1.6rem; background-color: #fff; padding: 0 .3rem 0 .52rem } .user .header .pic-text { width: 5.85rem } .course-list .nav::-webkit-scrollbar { display: none } .user .header .pic-text .pictrue { width: 1rem; height: 1rem } .user .header .pic-text .pictrue img { width: 100%; height: 100%; border-radius: 50% } .user .header .pic-text .name { font-size: .32rem; color: #333; font-weight: bold; width: 4.57rem } .user .header .iconfont { color: #000; font-size: .35rem } .user .list { background-color: #fff; margin-top: .2rem } .user .list .item { padding: 0 .26rem; font-size: .32rem; color: #333; height: 1rem; border-bottom: 1px solid #e6e6e6 } .user .list .item .pictrue { width: .48rem; height: .48rem } .user .list .item .pictrue img { width: 100%; height: 100% } .user .list .item .name { width: 6.28rem } .user .quit { font-size: .36rem; color: #509efb; font-weight: bold; text-align: center; height: 1rem; line-height: 1rem; background-color: #fff; margin-top: .4rem } .personal-infor-set .header { height: 1.8rem; padding: 0 .3rem; font-size: .32rem; color: #333; border-bottom: .2rem solid #f2f2f2 } .personal-infor-set .header .pictrue { width: 1rem; height: 1rem } .personal-infor-set .header .pictrue img { width: 100%; height: 100%; border-radius: 50% } .personal-infor-set .header .iconfont { margin-left: .2rem; font-size: .35rem; color: #333; font-weight: normal } .personal-infor-set .list .item { padding: 0 .3rem; height: 1.02rem; font-size: .32rem; color: #333; border-bottom: 1px solid #e6e6e6 } .personal-infor-set .list .item .name { width: 4.2rem; color: #999; margin-right: .23rem; text-align: right } .personal-infor-set .list .item .iconfont { color: #999; font-size: .35rem; vertical-align: middle } .replace-phone .list { background-color: #fff; border: 1px solid #e6e6e6; border-radius: .15rem; width: 5.5rem; height: 2rem; margin: .3rem auto } .replace-phone .list .item { height: 1rem } .replace-phone .list .item ~ .item { border-top: 1px solid #e6e6e6 } .replace-phone .list .item input { height: 100%; width: 100%; padding: 0 .26rem; font-size: .3rem } .replace-phone .list .item input::placeholder { color: #ccc } .replace-phone .list .item.itemCode { padding-right: .18rem } .replace-phone .list .item.itemCode input { width: 2.8rem } .replace-phone .list .item .code { color: #509efb; font-size: .28rem; height: 100% } .replace-phone .list .item .code.on { color: #999 } .replace-phone .bnt { font-size: .36rem; color: #333; font-weight: bold; background-color: #f9e067; border-radius: .15rem; text-align: center; line-height: 1rem; height: 1rem; width: 5.5rem; margin: .4rem auto } .index .search { font-size: .3rem; color: #999; width: 6.9rem; height: .7rem; background-color: #f2f2f2; border-radius: .1rem; margin: .18rem auto .4rem auto } .index .search .iconfont { margin-right: .15rem; font-size: .38rem } .index nav { margin: .3rem 0 .26rem 0 } .index nav .item { flex: 1; -webkit-flex: 1; text-align: center; font-size: .28rem; color: #333 } .index nav .item .pictrue { width: .81rem; height: .81rem; margin: 0 auto .12rem auto } .index nav .item .pictrue img { width: 100%; height: 100% } .index .swiper-details .banner { width: 6.9rem; height: 2.4rem; margin: 0 auto } .index .studyCourse .title { font-size: .36rem; color: #333; font-weight: bold; padding: 0 .3rem; height: .97rem; line-height: .97rem } .index .studyCourse .swiper-list2 { padding-top: .2rem } .index .studyCourse .swiper-list2 .item:nth-last-of-type(1) .underline { border-bottom: 0 } .index .studyCourse .swiper-list2 .item:first-child { margin-top: 0 } .index .studyCourse .swiper-list3 { margin-top: 0 } .index .studyCourse .swiper-list3 .item { padding: 0 .3rem; margin-bottom: .3rem } .course-list.index .studyCourse .swiper-list3 .pictrue { width: 100%; height: 3.8rem } .index .studyCourse .swiper-list3 .pictrue img { border-radius: .1rem .1rem 0 0 } .index .studyCourse .swiper-list3 .text-pic { width: 100%; padding-right: .2rem; padding-bottom: .2rem; padding-left: .2rem; border-bottom-right-radius: .1rem; border-bottom-left-radius: .1rem; box-shadow: 0 .03rem .1rem rgba(0, 0, 0, .06) } .index .studyCourse .swiper-list3 .text-pic .name { margin-top: .2rem } .index .studyCourse .list { padding: 0 .3rem } .index .studyCourse .list .item { width: 100%; height: 2.54rem; margin-bottom: .3rem } .index .studyCourse .list .item img { width: 100%; height: 100%; border-radius: .1rem } .search-page .header { padding: 0 .16rem 0 .3rem; height: 1.12rem; background-color: #fff } .search-page .header .searchBnt { width: 1.3rem; color: #509efb; font-size: .3rem; height: .7rem; line-height: .7rem; text-align: center } .search-page .header .input { width: 5.67rem; height: .7rem; background-color: #f2f2f2; border-radius: .13rem; padding: 0 .27rem; font-size: .3rem; color: #333 } .search-page .header .input .iconfont { color: #a8a8a8; font-size: .35rem; margin-top: .05rem } .search-page .header .input input { width: 4.67rem; height: 100% } .search-page .header .input input::placeholder { color: #999 } .search-page .hotSearch .title { font-size: .36rem; color: #000; font-weight: bold; height: .92rem; line-height: .92rem; padding: 0 .3rem } .search-page .hotSearch .list { padding: 0 .3rem 0 .12rem } .search-page .hotSearch .list .item { font-size: .3rem; color: #333; font-weight: bold; background-color: #fff; border-radius: .1rem; text-align: center; line-height: .66rem; height: .66rem; min-width: 1.59rem; margin: 0 0 .26rem .18rem } .search-page .searchResult { background-color: #fff } .search-page .searchResult .title { font-size: .32rem; color: #333; font-weight: bold; padding: 0 .3rem; height: .66rem; background-color: #f2f2f2 } .search-page .searchResult .more { font-size: .3rem; color: #333; padding: 0 .38rem; height: .75rem } .search-page .searchResult .video-listn .item .text .num { margin-top: .05rem } .extension .header { background-color: #2c8eff; width: 100%; height: 2.85rem; color: #fff; font-size: .28rem; position: relative } .extension .header .money { font-size: .72rem; font-weight: bold } .extension .header .iconfont { font-size: .2rem; margin-left: .05rem } .extension .header .cashBnt { position: absolute; width: 1.4rem; height: .6rem; border-radius: .5rem; background-color: #f2f2f2; text-align: center; line-height: .6rem; font-size: .24rem; color: #2c8eff; right: .3rem } .extension nav { height: 1.92rem } .extension nav .item { flex: 1; -webkit-flex: 1; text-align: center; font-size: .3rem; color: #999 } .extension nav .item .num { font-size: .48rem; color: #333; font-weight: bold } .extension nav .item ~ .item { border-left: 1px solid #e6e6e6 } .extension .list { border-top: .2rem solid #f2f2f2 } .extension .list .item { height: 1.01rem; border-bottom: 1px solid #e6e6e6; font-size: .32rem; color: #333; padding: 0 .3rem; position: relative } .extension .list .item .spot { position: absolute; width: .12rem; height: .12rem; background-color: #ea2f2f; border-radius: 50%; left: 1.7rem; top: .3rem } .extension .list .item .spot.spotr { left: 1.9rem } .cash-withdrawal { font-size: .3rem; color: #333; padding: .54rem 1.25rem } .cash-withdrawal .money { font-size: .79rem; color: #333; font-weight: bold } .cash-withdrawal .money input { width: 4.3rem; border-bottom: 1px solid #999; margin-left: .17rem; text-align: center; font-weight: bold } .cash-withdrawal .tip { margin-top: .35rem } .cash-withdrawal .tip .all { color: #509efb } .cash-withdrawal button { font-size: .32rem; color: #fff; width: 100%; height: 1rem; background-color: #49a839; text-align: center; line-height: 1rem; border-radius: .1rem; margin-top: .75rem } .withdrawals-record .data { height: .88rem; font-size: .32rem; color: #333; border-bottom: 1px solid #e6e6e6; padding: 0 .3rem } .withdrawals-record .data .iconfont { font-size: .2rem; margin-left: .08rem } .withdrawals-record .data input { height: 100%; width: 1.8rem } .withdrawals-record .list .item { height: 1.43rem; padding: 0 .3rem; border-bottom: 1px solid #e6e6e6; font-size: .32rem; color: #333 } .withdrawals-record .list .item .time { font-size: .28rem; color: #999; margin-top: -0.08rem } .withdrawals-record .list .item .money { font-size: .36rem; color: #ea2f2f; font-weight: bold } .withdrawals-record .loadTip { font-size: .28rem; color: #999; text-align: center; height: .83rem; line-height: .83rem } .my-course .header { height: 1.17rem } .my-course .header .nav { border-radius: .1rem; border: 1px solid #509efb } .my-course .header .item { width: 2.2rem; height: .68rem; text-align: center; line-height: .68rem; font-size: .3rem; color: #509efb } .my-course .header .item.on { background-color: #509efb; color: #fff } .my-course .header .item:nth-of-type(2) { border-radius: 0 .1rem .1rem 0 } .my-course .header .item:nth-of-type(1) { border-radius: .1rem 0 0 .1rem } .my-course .swiper-list2 { border-top: .2rem solid #f2f2f2 } .my-course .swiper-list2 .loadTip { font-size: .28rem; color: #999; text-align: center; height: .83rem; line-height: .83rem } .my-spelling-order .video-listn .list { border-bottom: .2rem solid #f2f2f2; padding: 0 .3rem } .my-spelling-order .video-listn .list .item { padding: .33rem 0; border-bottom: 1px solid #e6e6e6 } .my-spelling-order .video-listn .list .item .text .num { font-size: .24rem; color: #999; font-weight: normal } .my-spelling-order .video-listn .list .item .text .num .money { font-size: .32rem; color: #ea2f2f; font-weight: bold; margin-left: .2rem } .my-spelling-order .video-listn .list .bottom { height: .9rem; font-size: .3rem; color: #333 } .my-spelling-order .video-listn .list .status { width: 2.95rem } .my-spelling-order .video-listn .list .bottom .time { color: #999 } .my-spelling-order .loadTip { font-size: .28rem; color: #999; text-align: center; height: .83rem; line-height: .83rem } .assemble .header { height: 1.57rem; background-color: #fff; padding: 0 .45rem } .assemble .header .item { font-size: .28rem; color: #333; text-align: center } .assemble .header .item .iconfont { font-size: .5rem; width: .6rem; height: .75rem; margin: 0 auto } .assemble .header .icon-weixinzhifu { color: #70c97f } .assemble .header .icon-yaoqing- { color: #e3706b } .assemble .header .icon-bofang1 { color: #74b7ec; font-size: .4rem !important } .assemble .header .icon-icon-yxj-arrow-right { font-size: .4rem; color: #ccc !important } .assemble .teamwork { position: relative; padding: .3rem; margin-top: .14rem; background-color: #fff } .assemble .teamwork .list { min-height: 1.15rem; padding: 0 .09rem 0 0; margin: 0 } .assemble .teamwork div.label { top: .2rem; right: .2rem } .assemble .my-course { margin-top: .14rem; background-color: #fff } .assemble .my-course .swiper-list2 { border-top: 0 } .assemble .my-course .swiper-list2 .item { padding: .2rem } .assemble .my-course .swiper-list2 .item .pictrue { width: 3.45rem; height: 1.92rem; border-radius: .1rem; overflow: hidden } .assemble .my-course .swiper-list2 .item .pictrue img { display: block; width: 100%; height: 100%; object-fit: cover } .assemble .my-course .swiper-list2 .item .text-pic { position: relative; -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; min-width: 0; margin-left: .2rem } .assemble .my-course .swiper-list2 .item .text-pic .name { font-size: .28rem; line-height: .4rem } .assemble .my-course .swiper-list2 .item .text-pic .label { margin-top: .12rem } .assemble .my-course .swiper-list2 .item .text-pic .bottom { position: absolute; bottom: 0; left: 0; height: auto; margin-top: 0 } .assemble .my-course .swiper-list2 .item .text-pic .money { margin-top: 0 } .assemble .my-course .swiper-list2 .item .text-pic .money span { font-size: .32rem } .assemble .my-course .swiper-list2 .item .text-pic .free { font-size: .24rem; line-height: .45rem; color: #FF6B00 } .assemble .initiate-group { margin-top: .7rem } .assemble .initiate-group .invite { width: 6.9rem; height: .9rem; border: 0; border-radius: .45rem; background-color: #539dfd; font-size: .32rem; line-height: .9rem; text-align: center; color: #fff } .assemble .lessonBnt { font-size: .32rem; color: #fff; background-color: #ea2f2f; border-radius: .1rem; width: 6.9rem; height: 1rem; text-align: center; line-height: 1rem; margin: .3rem auto } .assemble .teamwork .label { position: absolute; right: .1rem; top: .26rem; font-size: .3rem; color: #ea2f2f; font-weight: bold; width: 1.15rem; height: 1.15rem; border: .04rem solid #ea2f2f; border-radius: 50%; padding: 0 .1rem; text-align: center; background-color: #fff } .assemble footer { height: 1.28rem; background-color: #fff; border-top: 1px solid #e6e6e6; padding: 0 .3rem; position: fixed; bottom: 0; width: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box } .assemble footer .goin-group { font-size: .36rem; color: #333; font-weight: bold; width: 6.9rem; height: 1rem; background-color: #fbdc46; border-radius: .15rem } .my-promoter nav { height: 1.92rem; background-color: #fff } .my-promoter nav .item { flex: 1; -webkit-flex: 1; text-align: center; font-size: .3rem; color: #999 } .my-promoter nav .item .num { font-size: .48rem; color: #333; font-weight: bold } .my-promoter nav .item ~ .item { border-left: 1px solid #e6e6e6 } .my-promoter .search { width: 6.9rem; height: .7rem; background-color: #fff; border-radius: .1rem; margin: .15rem auto } .my-promoter .search .iconfont { color: #999; font-size: .35rem; margin-top: .06rem } .my-promoter .search .input { font-size: .3rem; height: 100%; width: .8rem; text-align: center } .my-promoter .search input::placeholder { color: #999 } .my-promoter .search .input.on { text-align: left; padding: 0 .1rem; width: 6rem } .my-promoter .list { font-size: .3rem; color: #333 } .my-promoter .list .nav { background-color: #fff; height: 1rem } .my-promoter .list .nav .item { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; position: relative; text-align: center } .my-promoter .list .nav .item.item4 .icon { left: 1.67rem } .my-promoter .list .nav .item.item1 { width: 1.5rem } .my-promoter .list .nav .item.item2 { width: 2.25rem } .my-promoter .list .nav .item.item3 { width: 1.6rem } .my-promoter .list .nav .item.item4 { width: 2.15rem } .my-promoter .list .listcon { padding: 0.15rem 0; background-color: #fff } .my-promoter .list .listcon ~ .listcon { border-top: 1px solid #999999; } .my-promoter .list .listcon .item { flex: 1; min-width: 0; text-align: center; font-size: .28rem } .my-promoter .footer { width: 100%; height: 1rem; line-height: 1rem; background-color: #509efb; position: fixed; bottom: 0; font-size: .32rem; z-index: 9 } .my-promoter .footer .increase { width: 50%; text-align: center; color: #fff } .my-promoter .footer .increase.increase1 { background-color: #fff; color: #509efb } .promotion-poster .tip { font-size: .32rem; color: #fff; font-weight: bold; text-align: center; margin: .45rem auto .27rem auto } .promotion-poster .pictrue { width: 4.63rem; height: 8.23rem; margin: 0 auto } .promotion-poster .pictrue img { width: 100%; height: 100% } .promotion-poster .shareBnt { font-size: .32rem; color: #333; width: 3.55rem; height: .8rem; text-align: center; line-height: .8rem; background-color: #fff; border-radius: .15rem; margin: .4rem auto .35rem auto } .promotion-poster .notes { font-size: .28rem; color: #fff; padding: 0 .25rem } .promotion-poster .notes .title { margin-bottom: .05rem; font-weight: bold } .become-promoter { position: absolute; top: 38%; left: 0; width: 100%; transform: translateY(-50%); } .become-promoter .phone { background-color: #fff; padding: .25rem 0 .01rem 0 } .become-promoter .phone .list { padding: 0 1.25rem } .become-promoter .phone .list .item { border-bottom: 1px solid #999; padding: .3rem 0 .18rem 0 } .become-promoter .phone .list .item .code { width: 1.56rem; height: .53rem; background-color: #509efb; color: #fff; font-size: .26rem; border-radius: .1rem } .become-promoter .phone .list .item .code.on { background-color: #bbb } .become-promoter .phone .list .item input { font-size: .3rem; height: .53rem } .become-promoter .phone .list .item input::placeholder { color: #999 } .become-promoter .phone .list .item.itemCode input { width: 3.1rem } .become-promoter .phone .bnt { font-size: .32rem; color: #fff; width: 5rem; height: 0.88rem; background-color: #509efb; border-radius: .1rem; margin: .54rem auto } .become-promoter .rule { font-size: .28rem; color: #333; padding: 0 .3rem; line-height: 1.7 } .become-promoter .rule .title { font-weight: bold; padding: .25rem 0 .1rem 0 } .my-gift .video-listn .list .item .text .num .money { margin-left: 0 } .my-gift .video-listn .list .bottom .time.goBnt { width: 1.41rem; height: .6rem; background-color: #ea2f2f; border-radius: .1rem; font-size: .3rem; color: #fff } .commission-details header { height: 2.19rem; font-size: .28rem; color: #333 } .commission-details header .money { font-weight: bold; font-size: .72rem } .commission-details .commission { border-top: .2rem solid #f2f2f2; font-size: .3rem; border-bottom: .2rem solid #f2f2f2 } .commission-details .commission .title { color: #333; font-weight: bold; height: .9rem; padding: 0 .3rem; border-bottom: 1px solid #e6e6e6 } .commission-details .commission .list .item { flex: 1; -webkit-flex: 1; text-align: center; padding: 0 .3rem; margin: .4rem 0; color: #999 } .commission-details .commission .list .item ~ .item { border-left: 1px solid #e6e6e6 } .commission-details .commission .list .item .money { font-size: .48rem; color: #333; font-weight: bold } .commission-details .commission .list .item .iconfont { color: #999; font-size: .3rem } .promotion-details .list .item { height: 1.46rem } .promotion-details .list .item .title { width: 3.4rem } .promotion-details .list .item .name { width: 2.5rem; text-align: right; color: #999 } .promotion-details .list .item .time { margin-top: 0 } .promotion-details .list .item .money { color: #49a839 } .present-topics { padding: 0 .3rem } .present-topics .white { background-color: #fff; border-radius: .15rem; width: 100%; padding: .43rem 0 .22rem 0; margin-top: .4rem } .present-topics .white .pictrue { width: 1.28rem; height: 1.28rem; margin: 0 auto } .present-topics .white .pictrue img { width: 100%; height: 100%; border-radius: 50% } .present-topics .white .tip { font-size: .32rem; color: #333; font-weight: bold; text-align: center; margin-top: .15rem } .present-topics .white .giftName { font-size: .32rem; color: #333; font-weight: bold; text-align: center; margin-top: .05rem } .present-topics .white .pictrue2 { width: 6.36rem; height: 2.72rem; margin: .15rem auto 0 auto } .present-topics .white .pictrue2 img { width: 100%; height: 100%; border-radius: .1rem } .present-topics .white .sendBnt { font-size: .32rem; color: #333; font-weight: bold; width: 6.14rem; height: 1rem; background-color: #f9e067; border-radius: .1rem; margin: .46rem auto 0 auto } .present-topics .white .see { font-size: .32rem; color: #333; text-align: center; margin-top: .1rem } .present-topics .pictrue3 { width: 100%; height: 2.89rem; margin: .3rem auto } .present-topics .pictrue3 img { width: 100%; height: 100%; border-radius: .1rem } .thematic-promotion nav { font-size: .32rem; color: #333; font-weight: bold; height: .97rem; justify-content: space-around; -webkit-justify-content: space-around } .thematic-promotion nav .item { height: 100%; line-height: .92rem } .thematic-promotion nav .item.ont { color: #509efb } .thematic-promotion nav .on { width: .3rem; height: .05rem; background-color: #157dfa; border-radius: .15rem; margin: 0 auto } .thematic-promotion .swiper-details { background-color: #fff } .thematic-promotion .swiper-details ~ .swiper-details { margin-top: .14rem } .thematic-promotion .swiper-details .title { height: .98rem; padding-right: .2rem; padding-left: .2rem; font-size: .32rem } .thematic-promotion .swiper-details .video-listn { border-top: 1px solid #f5f5f5; padding: .26rem .2rem } .thematic-promotion .swiper-details .video-listn .item { position: relative; padding-left: 0 } .thematic-promotion .swiper-details .video-listn .item ~ .item { margin-top: .26rem } .thematic-promotion .swiper-details .video-listn .item .text { position: relative; -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; min-width: 0; margin-left: .2rem } .thematic-promotion .swiper-details .video-listn .item .text .name { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: .28rem; line-height: .4rem } .thematic-promotion .swiper-details .video-listn .item .text .num { position: absolute; bottom: 0; left: 0; width: 100%; font-size: .24rem; color: #FF6B00; font-weight: 500 } .thematic-promotion .swiper-details .video-listn .item .text .num .money span { font-size: .32rem; line-height: .45rem } .thematic-promotion .swiper-details .video-listn .item .text .num .earn { font-size: .48rem; color: #FF6B00; height: .64rem; padding: 0 .22rem; border: 1px solid #FF6B00; border-radius: 1rem; margin-left: .14rem; transform: scale(0.5); line-height: .64rem; transform-origin: 0 50%; font-weight: normal } .thematic-promotion .swiper-details .video-listn .item .toPromote { position: absolute; right: 0; bottom: 0; width: 1.4rem; height: .5rem; border-radius: .25rem; background-color: #2c8eff; font-size: .24rem; line-height: .5rem; text-align: center; color: #fff } .promotion-poster2 { padding-top: 1.59rem } .promotion-poster2 .tip { margin: .4rem auto 0 auto } .promotion-poster2 .shareBnt { margin: .2rem auto 0 auto } .thematic-details .swiper-details .swiper { background-color: #fff } .thematic-details .follow { position: fixed; top: 0; left: 0; z-index: 9; width: 100%; height: 0.8rem; padding-right: 0.3rem; padding-left: 0.3rem; background-color: rgba(0, 0, 0, 0.32); font-size: 0.26rem; color: #FFFFFF; } .thematic-details .follow .picTxt .pictrue { width: .85rem; height: .85rem } .thematic-details .follow .picTxt .pictrue img { width: 100%; height: 100%; border-radius: .15rem } .thematic-details .follow .picTxt .text { width: 3.65rem; font-size: .28rem; color: #509efb } .thematic-details .follow .picTxt .text .name { font-weight: bold } .thematic-details .follow .followBnt { display: inline-block; width: 1.6rem; height: 0.5rem; border-radius: 0.25rem; background-color: #2C8EFF; vertical-align: middle; font-size: 0.24rem; line-height: 0.5rem; text-align: center; color: #FFFFFF; } .thematic-details .follow .iconguanbi2 { margin-left: .24rem; vertical-align: middle; font-size: .3rem; } .thematic-details .swiper-details .swiper .swiper-int .pin-money { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1 } .thematic-details .swiper-details .swiper .swiper-int .pin-money .price { display: inline-block; font-weight: bold; font-size: .24rem; color: #FF6B00 } .thematic-details .swiper-details .swiper .swiper-int .pin-money .price b { font-weight: bold; font-size: .4rem; line-height: .56rem } .thematic-details .swiper-details .swiper .swiper-int .pin-money .vip-price { font-size: .28rem; color: #282828 } .thematic-details .swiper-details .swiper .swiper-int .pin-money .vip-price + .vip-price-icon { vertical-align: inherit } .thematic-details .swiper-details .swiper .swiper-int .pin-money .total { margin-left: .1rem; font-size: .26rem; color: #999 } .thematic-details .swiper-details .pinTip { height: .7rem; padding-left: .33rem; font-size: .26rem; line-height: .7rem } .thematic-details .pinTip2 { height: .7rem; padding-right: .3rem; padding-left: .3rem; border-radius: .12rem; margin: .14rem .2rem; background-color: #e2efff } .thematic-details .pinTip2 .chatBnt { width: 1.36rem; height: .46rem; border: 1px solid #3895ff; border-radius: .23rem; background-color: #2c8eff; font-size: .24rem; line-height: .42rem; text-align: center; color: #f5f5f5; cursor: pointer } .thematic-details .pinTip2 .reminder { font-size: .26rem; color: #2c8dff } .thematic-details .swiper-details .list { padding-left: .3rem; background-color: #fff } .thematic-details .swiper-details .list .item { padding-top: .25rem; padding-right: .3rem; padding-bottom: .25rem } .thematic-details .swiper-details .list .item ~ .item { border-top: 1px solid #f0f0f0 } .thematic-details .swiper-details .list .item .pictrue { width: .8rem; height: .8rem; border-radius: 50%; margin-right: .2rem; overflow: hidden } .thematic-details .swiper-details .list .item .pictrue img { display: block; width: 100%; height: 100%; object-fit: cover } .thematic-details .swiper-details .list .item .name { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; min-width: 0 } .thematic-details .swiper-details .list .item .left { width: 2.1rem; font-size: .24rem; line-height: .34rem; text-align: center } .thematic-details .swiper-details .list .item .link { width: 1.4rem; height: .5rem; border-radius: .25rem; background: linear-gradient(90deg, #409DFF 0%, #1E85FB 100%); font-size: .24rem; line-height: .5rem; text-align: center; color: #fff } .thematic-details .swiper-details .list .item .link .iconfont { margin-left: .11rem; font-size: .18rem } .thematic-details .swiper-details .list .item .left span { color: #FEB720 } .thematic-details .swiper-details .list .item .left .time { line-height: .3rem; color: #82848f } .thematic-details footer { position: fixed; bottom: 0; left: 0; z-index: 9; width: 100%; border-top: 1px solid #eee; background-color: #fff } .thematic-details footer .link { width: .9rem; height: 1rem; line-height: 1rem; text-align: center } .thematic-details footer .link .cont { display: inline-block; vertical-align: middle; font-size: .18rem; line-height: .36rem; color: #666 } .thematic-details footer .link img { display: block; width: .4rem; height: .4rem; margin-right: auto; margin-left: auto } .thematic-details footer .wrap { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; min-width: 0; padding-right: .3rem; padding-left: .3rem } .thematic-details footer .item { border: .01rem solid #d9d9d9; width: 1.33rem; height: 1rem; border-radius: .1rem; font-size: .24rem; color: #333 } .thematic-details footer .item img { width: .42rem; height: .46rem } .thematic-details footer .item.item1 { width: 1.87rem } .thematic-details footer .item.item2 { width: 1.87rem; background-color: #f9e067; border-color: #f9e067 } .thematic-details footer .item .money { font-size: .36rem; color: #333; font-weight: bold; margin-bottom: -0.06rem } .thematic-details footer .item.on { width: 3.9rem } .thematic-details footer .item.on .money { margin-bottom: 0 } .thematic-details .groupCode { width: 4.79rem; height: 5.74rem; background-color: #fff; border-radius: .2rem; position: fixed; left: 50%; top: 50%; margin-left: -2.395rem; margin-top: -2.87rem; z-index: 99 } .thematic-details .groupCode .code { width: 3.1rem; height: 3.1rem; margin: .7rem auto 0 auto } .thematic-details .groupCode .code img { width: 100%; height: 100% } .thematic-details .groupCode .codeTip { text-align: center; margin-top: .4rem; font-size: .37rem; color: #333 } .swiper-details .catalogue li { position: relative; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; height: 1.02rem; padding-right: .3rem; padding-left: .3rem; background-color: #f9fafc; } .swiper-details .catalogue li::before { content: " "; position: absolute; top: 0; right: .3rem; left: 1.1rem; height: 1px; border-top: 1px solid #f5f5f5; color: #f5f5f5; -webkit-transform-origin: center top; transform-origin: center top; -webkit-transform: scaleY(.5); transform: scaleY(.5) } .swiper-details .catalogue li:first-child { border-radius: 0.06rem 0.06rem 0 0; } .swiper-details .catalogue li:last-child { border-radius: 0 0 0.06rem 0.06rem; } .swiper-details .catalogue li:first-child::before { display: none } .swiper-details .catalogue li.gray { color: #999 } .swiper-details .catalogue .image { width: 0.38rem; height: 0.27rem; } .swiper-details .catalogue .image .img { display: block; width: 100%; height: 100%; pointer-events: none; } .swiper-details .catalogue .title { -webkit-flex: 1; flex: 1; min-width: 0; margin-right: .2rem; margin-left: .2rem; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: .26rem; color: #666666; } .swiper-details .catalogue .free { padding-right: .21rem; padding-left: .21rem; border-radius: .19rem; background-color: rgba(254, 183, 32, .1); font-size: .22rem; line-height: .38rem; color: #FF6B00 } .swiper-details .catalogue .iconsuozi,.swiper-details .catalogue .iconziyuan2 { width: .86rem; font-size: .3rem; text-align: center; color: #ccc } .swiper-details .parent-catalogue .parent-title { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; padding: .12rem .3rem .12rem; background-color: #fff; } .swiper-details .parent-catalogue .parent-title .name { -webkit-flex: 1; flex: 1; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-weight: bold; font-size: .28rem; line-height: .45rem; color: #333 } .swiper-details .parent-catalogue .parent-title .iconfont { font-weight: bold; font-size: .28rem; color: #999999; } .swiper-details .parent-catalogue .catalogue { display: none; } .swiper-details .parent-catalogue .active .catalogue { display: block; } .thematic-details footer .item.on2 { width: 5.39rem } .thematic-details .password { width: 5.38rem; height: 3.22rem; background-color: #fff; border-radius: .1rem; position: fixed; top: 50%; left: 50%; margin-left: -2.69rem; margin-top: -1.61rem; z-index: 88; padding-top: .2rem; transition: all .3s ease-in-out; opacity: 0; transform: scale(0) } .thematic-details .password.on { opacity: 1; -webkit-transform: scale(1); transform: scale(1); } .thematic-details .password .title { font-size: .32rem; color: #333; text-align: center; font-weight: bold } .thematic-details .password input { width: 4.53rem; height: .88rem; border-radius: .1rem; border: 1px solid #d9d9d9; background-color: #f2f2f2; display: block; margin: .28rem auto 0 auto; text-align: center } .thematic-details .password .psdBnt { font-size: .32rem; color: #fff; width: 4.62rem; height: .8rem; border-radius: .1rem; background-color: #509efb; text-align: center; line-height: .8rem; margin: .28rem auto 0 auto } .select-btn { height: .96rem; padding: 0 .33rem } .select-btn .iconfont { color: #3ab034; font-size: .4rem; margin-right: .15rem; vertical-align: middle } .checkbox-wrapper { position: relative; height: 100%; line-height: .96rem } .checkbox-wrapper input { display: none } .checkbox-wrapper .icon { display: inline-block; width: 14px; height: 14px; border: 1px solid #cdcdcd; border-radius: 50%; } .entry { width: 100%; height: 5.6rem; background-color: #fff; position: fixed; bottom: 0; left: 0; z-index: 66; transform: translate3d(0, 100%, 0); -webkit-transform: translate3d(0, 100%, 0); -moz-transform: translate3d(0, 100%, 0); -o-transform: translate3d(0, 100%, 0); -ms-transform: translate3d(0, 100%, 0); -webkit-transition: all .5s ease; -moz-transition: all .5s ease; -o-transition: all .5s ease; -ms-transition: all .5s ease; transition: all .5s ease } .entry.up { transform: translate3d(0, 0, 0); -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0) } .entry .title { font-size: .36rem; color: #333; text-align: center; line-height: .87rem; height: .87rem; position: relative; font-weight: bold } .entry .title .iconfont { position: absolute; left: .3rem; font-weight: normal; font-size: .5rem; color: #000 } .entry .entry-list { padding: 0 1rem } .entry .entry-list .item { height: 1.02rem; width: 100%; border-bottom: 1px solid #999 } .entry .entry-list .item input { height: 100%; width: 100%; font-size: .3rem } .entry .entry-list .item.item1 input { width: 2.65rem } .entry .entry-list .item input::placeholder { color: #ccc } .entry .entry-list .item .code { font-size: .28rem; color: #509efb } .entry .entry-list .item .code.on { color: #999 } .entry .enterBnt { width: 5.5rem; height: 1rem; background-color: #f9e067; border-radius: .1rem; font-size: .36rem; font-weight: bold; margin: .5rem auto } .entry .checkbox-wrapper .well-check { font-size: .24rem; color: #999 } .entry .checkbox-wrapper .well-check a { color: #509efb } .entry .checkbox-wrapper .icon { margin-right: .1rem; vertical-align: middle; } .entry .checkbox-wrapper input:checked + .icon { background-color: #4387ff; border-color: #4387ff; background-image: url("../images/enter.png"); -webkit-background-size: .2rem; -moz-background-size: .2rem; background-size: .2rem; background-repeat: no-repeat; background-position: center center } .entry .select-btn { padding: 0 1rem; border-bottom: 0; height: unset; margin-top: .2rem } .entry .select-btn .checkbox-wrapper { line-height: unset } .payment .checkbox-wrapper input:checked + .icon:after { content: ' '; position: absolute; width: 8px; height: 8px; border-radius: 50%; background-color: #3ab034; left: 50%; top: 50%; margin-top: -4px; margin-left: -4px } .payment { position: fixed; bottom: 0; width: 100%; background-color: #fff; z-index: 99; transform: translate3d(0, 150%, 0); -webkit-transform: translate3d(0, 150%, 0); -moz-transform: translate3d(0, 150%, 0); -o-transform: translate3d(0, 150%, 0); -ms-transform: translate3d(0, 150%, 0); -webkit-transition: all .5s ease; -moz-transition: all .5s ease; -o-transition: all .5s ease; -ms-transition: all .5s ease; transition: all .5s ease } .payment.up { transform: translate3d(0, 0, 0); -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0) } .payment .title { height: .94rem; line-height: .94rem; text-align: center; font-size: .36rem; color: #333; font-weight: bold; position: relative; } .payment .title .iconfont { position: absolute; font-weight: normal; font-size: .5rem; color: #000; left: .33rem; top: 50%; transform: translateY(-50%) } .payment .total { height: .9rem; padding: 0 .33rem; font-size: .3rem; color: #333 } .payment .total .money { color: #e00; font-size: .34rem; font-weight: bold } .payment .mode { font-size: .3rem; color: gray; padding: 0 .33rem; background-color: #f2f2f2; height: .6rem; line-height: .6rem } .payment .select-btn { padding: 0 .33rem } .payment .select-btn .iconfont { color: #3ab034; font-size: .4rem; margin-right: .15rem; vertical-align: middle } .payment .checkbox-wrapper { position: relative; height: 100%; line-height: .96rem } .payment .checkbox-wrapper input { display: none } .payment .checkbox-wrapper .icon { position: absolute; right: 0; top: 50%; display: inline-block; width: 14px; height: 14px; border: 2px solid #cdcdcd; border-radius: 50%; -webkit-transform: translate(0, -50%); -moz-transform: translate(0, -50%); -o-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%) } .payment .checkbox-wrapper input:checked + .icon { border: 2px solid #3ab034 } .payment .checkbox-wrapper input:checked + .icon:after { content: ' '; position: absolute; width: 8px; height: 8px; border-radius: 50%; background-color: #3ab034; left: 50%; top: 50%; margin-top: -4px; margin-left: -4px } .payment .payBnt { font-size: .36rem; color: #333; font-weight: bold; width: 6.9rem; height: 1rem; background-color: #f9e067; border-radius: .1rem; text-align: center; line-height: 1rem; margin: .5rem auto } .loading-line { height: .86rem; line-height: .86rem; text-align: center; color: #999 } .loading-line i { display: inline-block; width: .7rem; height: 1px; background-color: #333; vertical-align: middle } .loading-line span { margin: 0 .2rem } @keyframes myfirst { from { transform: rotate(0) } to { transform: rotate(360deg) } } .fa-spinner { animation: myfirst linear 1s infinite } .right-menu-wrapper { position: fixed; right: .22rem; top: 62%; width: .66rem; z-index: 45 } .right-menu-wrapper a { display: inline-block; width: .64rem; height: .64rem; margin-top: .12rem; box-sizing: border-box; border: 1px solid #e1e1e1; border-radius: 50%; background-image: url(../images/right-menu-icon.png); background-size: 1.24rem auto; background-repeat: no-repeat; background-color: rgba(255, 255, 255, .9) } .right-menu-wrapper a.home { background-position: .06rem .06rem } .right-menu-wrapper a.buy-car { background-position: -.66rem .08rem } .receive-details { padding: 0 .3rem } .receive-details .white { background-color: #fff; border-radius: .1rem; margin-top: .38rem } .receive-details .white .header { background-image: url("../images/receive-bg.png"); background-repeat: no-repeat; background-size: 100% 100%; width: 6.9rem; height: 2.55rem; font-size: .32rem; font-weight: bold; border-radius: .1rem .1rem 0 0 } .receive-details .white .header .name { position: relative } .receive-details .white .header .name img { width: .45rem; height: .45rem; border-radius: 50%; position: absolute; left: -0.57rem } .receive-details .white .padding { padding: 0 .27rem .35rem .27rem } .receive-details .white .padding .receive { font-size: .28rem; color: #999; border-bottom: 1px solid #e6e6e6; margin-top: .32rem } .receive-details .white .padding .pic-text { margin: .32rem 0 } .receive-details .white .padding .pic-text .pictrue { width: .97rem; height: .97rem } .receive-details .white .padding .pic-text .pictrue img { width: 100%; height: 100%; border-radius: 50% } .receive-details .white .padding .pic-text .text { width: 5rem; font-size: .32rem; color: #a0a0a0; padding-right: .16rem } .receive-details .white .padding .pic-text .text .name { color: #333; font-weight: bold } .receive-details .white .padding .pictrue3 { width: 6.36rem; height: 2.72rem } .receive-details .white .padding .pictrue3 img { width: 100%; height: 100%; border-radius: .1rem } .receive-details .pictrue4 { width: 6.9rem; height: 2.89rem; margin: .3rem 0 } .receive-details .pictrue4 img { width: 100%; height: 100%; border-radius: .1rem } .payment-tip { width: 5.91rem; height: 2.85rem; margin: .1rem 0 0 1.14rem } .payment-tip img { width: 100%; height: 100% } .payState .pictrue { width: 1.94rem; height: 1.94rem; margin: .5rem auto 0 auto } .payState .pictrue img { width: 100%; height: 100% } .payState .status { font-size: .36rem; color: #333; text-align: center; font-weight: bold; margin-top: .25rem } .payState .learn { font-size: .3rem; color: #fff; margin: .75rem auto 0 auto; width: 3.17rem; height: .88rem; background-color: #509efb; text-align: center; line-height: .88rem; border-radius: .5rem } .shares-model { z-index: 100 } .course-list .header { width: 100%; height: 3.5rem; position: relative; overflow: hidden } .course-list .header .swiper-slide { width: 100%; height: 100% } .course-list .header .swiper-slide img { width: 100%; height: 100% } .course-list .nav { position: -webkit-sticky; position: sticky; top: 0; left: 0; z-index: 9; width: 100%; height: 1rem; background-image: -webkit-linear-gradient(left, #2c65f7, #409dff); background-image: linear-gradient(to right, #2c65f7, #409dff); line-height: 1rem; font-size: .3rem; color: rgba(254, 254, 254, .8); white-space: nowrap; overflow-x: auto; overflow-y: hidden } .course-list .nav .item { display: inline-block; margin-left: .39rem } .course-list .nav .item.on { color: #fefefe; position: relative } .course-list .nav .item.on:after { position: absolute; content: ''; width: .39rem; height: .04rem; background-color: #fff; border-radius: .02rem; left: 50%; margin-left: -0.195rem; bottom: .12rem } .course-list .nav .item:nth-last-of-type(1) { margin-right: .28rem } .course-list .line { width: 100%; height: .11rem; background-color: #f2f2f2; margin-bottom: .2rem } .promotion-poster .phraseWindow { width: 5.38rem; height: 5.07rem; background-color: #f7f7f7; border-radius: .2rem; color: #000; font-weight: bold; font-size: .34rem; position: fixed; top: 50%; margin-top: -2.535rem; left: 50%; margin-left: -2.69rem; z-index: 99 } .promotion-poster .phraseWindow .name { text-align: center; height: .95rem; line-height: .95rem } .promotion-poster .phraseWindow .phraseCon { font-size: .26rem; padding: 0 .35rem; height: 3.2rem; overflow-x: hidden; overflow-y: auto; line-height: 1.7 } .promotion-poster .phraseWindow .but { border-top: 1px solid #d8dadb } .promotion-poster .phraseWindow .but .item { width: 50%; text-align: center; height: .9rem; line-height: .9rem; color: #157efb } .promotion-poster .phraseWindow .but .item.copy { border-left: 1px solid #d8dadb } .promotion-poster .phrase { width: 1rem; height: 1rem; border-radius: 50%; position: fixed; right: .45rem; bottom: 1.5rem; display: block } .broadcast-details .header { position: absolute; top: 0; left: 0; width: 100%; height: 4.2rem; background-color: #333 } .broadcast-details .header .text { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font-size: .3rem; line-height: 1.4; text-align: center; color: #fff } .broadcast-details .header .text img { width: .65rem; height: .54rem; display: block; margin: 0 auto .2rem } .broadcast-details .chat { position: absolute; top: 4.2rem; right: 0; bottom: 1rem; left: 0; padding-right: .23rem; padding-bottom: .37rem; padding-left: .3rem; overflow-y: scroll; -webkit-overflow-scrolling: touch } .broadcast-details .chat .item { margin-top: .37rem } .broadcast-details .chat .item .pictrue { width: .8rem; height: .8rem; margin-top: .1rem } .broadcast-details .chat .item .pictrue img { width: 100%; height: 100%; border-radius: 50% } .broadcast-details .chat .item .text { margin-left: .2rem } .broadcast-details .chat .item .text.textR { text-align: right; margin: 0 .2rem 0 0 } .broadcast-details .chat .item .text .name { font-size: .24rem; color: #999 } .broadcast-details .chat .item .text .name .return { color: #509efb; margin-left: .17rem } .broadcast-details .chat .item .text.textR .name .return { margin: 0 .17rem 0 0 } .broadcast-details .chat .item .text .conter { background-color: #fff; border-radius: .08rem; padding: .16rem .2rem; font-size: .3rem; color: #333; position: relative; max-width: 4.96rem; margin-top: .02rem; word-break: break-all } .broadcast-details .chat .item .text .spot { width: .15rem; height: .15rem; background-color: #c00000; border-radius: 50%; margin-left: .2rem } .broadcast-details .chat .item .text .conter:before { position: absolute; content: ''; width: 0; height: 0; border-bottom: .09rem solid transparent; border-right: .14rem solid #fff; border-top: .09rem solid transparent; left: -0.14rem; top: .25rem } .broadcast-details .chat .item .text.textR .conter:before { left: unset; right: -0.14rem; transform: rotateY(180deg) } .broadcast-details .chat .item .text .conter img { width: 100%; display: block } .broadcast-details .chat .item .text .conter .img { width: .5rem } .broadcast-details .chat .item .text .conter .signal { width: .48rem; height: .48rem } .broadcast-details .chat .item .text .conter .signal.signalR { transform: rotate(180deg); -ms-transform: rotate(180deg); -webkit-transform: rotate(180deg) } .broadcast-details .footerCon { position: fixed; bottom: 0; left: 0; min-height: 1rem; z-index: 55; width: 100%; transform: translate3d(0, 77.6%, 0); transition: all .3s cubic-bezier(.25, .5, .5, .9); background-color: #fff } .broadcast-details .footerCon.on { transform: translate3d(0, 0, 0) } .broadcast-details .footerCon .banner .swiper-slide { flex-wrap: wrap; -webkit-flex-wrap: wrap; background-color: #fff; padding-bottom: .7rem; border-top: 1px solid #f5f5f5 } .broadcast-details .footerCon .banner .swiper-slide .emoji-outer { display: block; width: .5rem; height: .5rem; margin: .4rem 0 0 .5rem } .broadcast-details .footerCon .banner .swiper-container-horizontal > .swiper-pagination-bullets { bottom: .1rem } .broadcast-details .footerCon .slider-banner .swiper-pagination-bullet-active { background-color: #999 } .broadcast-details .recording { width: 3rem; height: 3rem; position: fixed; top: 40%; left: 50%; margin-left: -1.5rem } .broadcast-details .recording img { width: 100%; height: 100% } .broadcast-details .footer { width: 100%; background-color: #fff; padding: 0 .26rem; height: 1rem } .broadcast-details .footer img { width: .61rem; height: .6rem; display: block } .broadcast-details .footer .input { max-height: 1.5rem; overflow-y: auto; overflow-x: hidden } .broadcast-details .footer .input, .broadcast-details .footer .voice { width: 4.18rem; height: .7rem; border-radius: .1rem; background-color: #e5e5e5; padding: 0 .3rem } .broadcast-details .fixed { position: fixed; right: .23rem; bottom: 1.2rem } .broadcast-details .fixed .item { width: .6rem; height: .6rem; text-align: center; line-height: .6rem; border: .02rem solid #509efb; background-color: #fff; border-radius: 50%; font-size: .24rem; color: #509efb; position: relative } .broadcast-details .fixed .item.on:before { position: absolute; width: 1px; height: .56rem; background-color: #509efb; content: ''; transform: rotateZ(-20deg); left: 50%; margin-left: -0.5px } .broadcast-details .fixed .item ~ .item { margin-left: .15rem } .broadcast-details .barrage { position: fixed; bottom: 2.08rem; right: .24rem; transform: translate3d(150%, 0, 0); transition: all .3s cubic-bezier(.25, .5, .5, .9) } .broadcast-details .barrage.on { transform: translate3d(0, 0, 0) } .broadcast-details .barrage .item { opacity: .5 } .broadcast-details .barrage .item ~ .item { margin-top: .2rem } .broadcast-details .barrage .item:nth-last-of-type(1) { opacity: 1 } .broadcast-details .barrage .item .pictrue { width: .59rem; height: .59rem } .broadcast-details .barrage .item .pictrue img { width: 100%; height: 100%; border-radius: 50% } .broadcast-details .barrage .item .text { background-color: #666161; font-size: .24rem; color: #fff; border-radius: .08rem; max-width: 2.24rem; padding: .16rem .2rem; margin-right: .2rem } .broadcast-details .statistics { font-size: .24rem; color: #fff; position: fixed; right: 0; top: 4.6rem; background-color: rgba(48, 40, 40, 0.7); min-width: 1.7rem; height: .5rem; border-radius: .25rem 0 0 .25rem } .broadcast-details .statistics .spot { width: .12rem; height: .12rem; background-color: #54ff6b; border-radius: 50%; margin-right: .15rem } .broadcast-details .discuss { position: absolute; top: 4.2rem; right: 0; bottom: 1rem; left: 0; overflow-y: hidden; background-color: #e6e6e6; transform: translate3d(0, 100%, 0); transition: all .3s cubic-bezier(.25, .5, .5, .9) } .broadcast-details .discuss.on { transform: translate3d(0, 0, 0) } .broadcast-details .discuss .header { position: relative; height: .8rem; background-color: #fff; font-size: .3rem; line-height: .8rem; text-align: center; color: #333 } .broadcast-details .discuss .up { position: absolute; left: .25rem; font-size: .3rem; color: #333 } .broadcast-details .discuss .up .iconfont { font-size: .22rem; margin-right: .1rem } .broadcast-details .discuss .chat { position: absolute; top: .8rem; right: 0; bottom: 0; left: 0 } .publicFollow { position: fixed; bottom: .3rem; width: 6.9rem; height: .8rem; border-radius: .1rem; background-color: rgba(0, 0, 0, 0.7); color: #fff; font-size: .24rem; left: 50%; margin-left: -3.45rem; padding: 0 .2rem } .publicFollow .follow { width: 1rem; height: .4rem; background-color: #fff; text-align: center; font-size: .24rem; color: #509efb; border-radius: .07rem } .groupCode { width: 4.79rem; background-color: #fff; border-radius: .2rem; position: fixed; left: 50%; top: 20%; margin-left: -2.395rem; z-index: 99; padding-bottom: .24rem } .groupCode .code { width: 3.1rem; height: 3.1rem; margin: .7rem auto 0 auto } .groupCode .code img { width: 100%; height: 100% } .groupCode .codeTip { text-align: center; margin-top: .4rem; font-size: .37rem; color: #333 } .groupCode .ewmCon { position: relative } .groupCode .ewmCon .iconfont { position: absolute; bottom: -1.5rem; color: #fff; font-size: .5rem; left: 50%; margin-left: -0.25rem } .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet { margin: 0 .05rem } .indexNew .header { height: 1.09rem; padding-top: .2rem; padding-right: .2rem; padding-left: .2rem; background-color: #fff } .indexNew .header .search { height: .7rem; border-radius: .35rem; background-color: #f5f5f5; font-size: .26rem; color: #aaa } .indexNew .header .search .iconfont { margin-right: .16rem; font-size: .3rem; line-height: 1; color: #aaa } .indexNew .banner .swiper-slide { width: 6.66rem; height: 3.24rem; border-radius: .1rem } .indexNew .banner .swiper-slide img { width: 100%; height: 100%; display: block } .indexNew .banner .swiper-pagination { bottom: 0; } .indexNew .banner .swiper-pagination-bullet { width: .1rem; height: .1rem; border-radius: .05rem; background-color: #b4b4b4; opacity: .54 } .indexNew .banner .swiper-pagination-bullet.swiper-pagination-bullet-active { width: .2rem; background-color: #FFFFFF; opacity: .8 } .indexNew .nav .item { -webkit-box-flex: 0 0 20%; -webkit-flex: 0 0 20%; flex: 0 0 20%; min-width: 0; padding-top: .14rem; padding-bottom: .14rem; font-size: .24rem; line-height: .3rem; text-align: center; color: #666666; } .indexNew .nav .item .pictrue { width: .7rem; height: .7rem; overflow: hidden; margin: 0 auto .14rem } .indexNew .nav .item .pictrue img { display: block; width: 100%; height: 100% } .indexNew .activity { padding: .24rem .2rem; margin-top: .14rem; background-color: #fff } .indexNew .activity .left { width: 2.75rem; height: 2.9rem; border-radius: .16rem; padding-top: .27rem; background-color: #f9fafc; text-align: center } .indexNew .activity .left .title, .indexNew .activity .right .item .text .title { font-size: .28rem; line-height: .4rem } .indexNew .activity .left .info, .indexNew .activity .right .item .text .info { margin-top: .05rem; font-size: .22rem; line-height: .3rem; color: #999 } .indexNew .activity .left .pictrue { width: 1.5rem; height: 1.5rem; margin: .15rem auto 0 } .indexNew .activity .left .pictrue img { display: block; width: 100%; height: 100%; object-fit: cover; pointer-events: none; -webkit-touch-callout: none; } .indexNew .activity .right .text { -webkit-box-flex: 1; flex: 1; min-width: 0; } .indexNew .activity .right .item { width: 4.19rem; height: 1.38rem; padding-right: .3rem; padding-left: .3rem; border-radius: .16rem; background-color: #f9fafc } .indexNew .activity .right .item ~ .item { margin-top: .16rem } .indexNew .activity .right .item .pictrue { width: 1rem; height: 1rem; } .indexNew .activity .right .item .pictrue img { display: block; width: 100%; height: 100%; object-fit: cover; pointer-events: none; -webkit-touch-callout: none; } .public_title { height: 1.02rem; padding-right: .2rem; padding-left: .2rem } .public_title .name { font-weight: bold; font-size: .32rem; position: relative } .public_title .more { font-size: .22rem; color: #999 } .public_title .more .iconfont { margin-left: .09rem; font-size: .18rem; line-height: 1em } .public_title .spot .item { width: .1rem; height: .1rem; border-radius: 50%; background-color: #c3c4c4; margin-left: .12rem } .public_title .spot .item.on { background-color: #2c8eff } .indexNew .broadcast { margin-top: .14rem; background-color: #fff } .indexNew .broadcast .swiperScroll { margin-left: .22rem } .indexNew .broadcast .swiperScroll .item { width: 3.2rem; margin-right: .21rem } .indexNew .broadcast .swiperScroll .item .pictrue { width: 100%; height: 1.8rem; border-radius: .1rem; position: relative } .indexNew .broadcast .swiperScroll .item .pictrue img { width: 100%; height: 100%; border-radius: .1rem } .indexNew .broadcast .swiperScroll .item .pictrue .state { width: 1.2rem; height: .36rem; border-radius: .1rem 0 .1rem 0; background-image: linear-gradient(to right, #ff4a4a 0, #f00 100%); background-image: -webkit-linear-gradient(to right, #ff4a4a 0, #f00 100%); background-image: -moz-linear-gradient(to right, #ff4a4a 0, #f00 100%); top: 0; left: 0; position: absolute } .indexNew .broadcast .swiperScroll .item .pictrue .state.return { width: 1.02rem; background-image: linear-gradient(to right, #999 0, #666 100%); background-image: -webkit-linear-gradient(to right, #999 0, #666 100%); background-image: -moz-linear-gradient(to right, #999 0, #666 100%) } .indexNew .broadcast .swiperScroll .item .pictrue .state.make { width: 3.2rem; background-image: linear-gradient(to right, #85beff 0, #2c8eff 100%); background-image: -webkit-linear-gradient(to right, #85beff 0, #2c8eff 100%); background-image: -moz-linear-gradient(to right, #85beff 0, #2c8eff 100%) } .indexNew .broadcast .swiperScroll .item .pictrue .state img { width: .21rem; height: .21rem; display: block } .indexNew .broadcast .swiperScroll .item .pictrue .state .stateTxt { font-size: .22rem; color: #fff; margin-left: .07rem } .indexNew .broadcast .swiperScroll .item .text { padding-top: .18rem; padding-bottom: .33rem } .indexNew .broadcast .swiperScroll .item .text .name { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: .28rem; line-height: .4rem } .indexNew .broadcast .swiperScroll .item .text .info { margin-top: .12rem; font-size: .22rem; line-height: .4rem; color: #999; font-weight: 400 } .indexNew .broadcast .swiperScroll .item .text .info .red { font-weight: bold; font-size: 0.26rem; color: #999999; } .indexNew .curriculum { margin-top: .14rem; background-color: #fff } .indexNew .curriculum .seeAll { font-size: .24rem; color: #2c8eff; font-weight: bold; width: 2.2rem; height: .5rem; border-radius: .25rem; background-color: #f5f5f5; margin: .32rem auto 0 auto } .indexNew .curriculum .seeAll img { width: .09rem; height: .17rem; display: block; margin-left: .1rem } .indexNew .curriculum .swiper-course .public_list .item .text .robbing { font-size: .24rem; color: #999; margin-top: .18rem } .indexNew .curriculum .swiper-course .public_list .item .text .robbing .num { color: #ff4a4a } .indexNew .curriculum .money { display: inline-block; vertical-align: middle } .indexNew .curriculum .text .total { display: inline-block; margin-left: .1rem; vertical-align: middle; font-size: .22rem; color: #999 } .indexNew .curriculum .swiper-pagination { position: static } .indexNew .curriculum .swiper-pagination-bullet { width: .1rem; height: .1rem; border-radius: .05rem; background: #b4b4b4; opacity: .54 } .indexNew .curriculum .swiper-pagination-bullet-active { width: .2rem; background: #2c8eff; opacity: 1 } .indexNew .liveone { width: 5rem; height: 4.5rem; margin: 0 auto; position: relative } .indexNew .btn { width: 2rem; height: .7rem; line-height: .7rem; text-align: center; background-color: #0d8ddb; color: #fff; border-radius: 5px; margin: 18px 70px } .indexNew .close { position: absolute; right: 1px; top: -40px } .indexNew .masks { background-color: rgba(0, 0, 0, 0.7); position: fixed; top: 0; left: 0; bottom: 0; right: 0; z-index: 55 } .public_list { padding: 0 .2rem .3rem } .essential .list { padding-bottom: .24rem } .public_list .item ~ .item { margin-top: .3rem } .public_list .item .pictrue { width: 3.45rem; border-radius: .1rem; position: relative } .public_list .item .goods-picture { width: 1.92rem; } .public_list .item .pictrue img { width: 100%; height: 100%; display: block; border-radius: .1rem; object-fit: cover; pointer-events: none; -webkit-touch-callout: none; } .public_list .item .goods-picture img { object-fit: scale-down; } .public_list .item .pictrue .label { position: absolute; right: .1rem; bottom: .1rem; padding-right: .11rem; padding-left: .11rem; border-radius: .03rem; font-size: .22rem; line-height: .34rem; background-color: rgba(0, 0, 0, .5); color: #fff } .public_list .item .text .num { font-size: .22rem; color: #999 } .public_list .item .text { position: relative; -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; min-width: 0; margin-left: .2rem } .public_list .item .text > div:last-child { position: absolute; bottom: 0; left: 0; width: 100% } .public_list .item .text > div:last-child > div:first-child { font-size: 0 } .public_list .item .text .title { font-size: .28rem; line-height: .4rem; color: #333 } .public_list .item .text .title .line1 { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; white-space: normal } .public_list .item .text .title .label, .indexNew .essential .list .item .text .title .label, .indexNew .english .list .item .text .title .label { font-size: .2rem; color: #fffefe; border-radius: .1rem 0 .1rem 0; height: .28rem; padding: 0 .1rem; margin-right: .1rem; background-image: linear-gradient(to right, #333 0, #666 100%); background-image: -webkit-linear-gradient(to right, #333 0, #666 100%) } .public_list .item .text .labelList { position: absolute; bottom: .57rem; left: 0 } .public_list .item .text .labelList .labelItem, .indexNew .english .list .item .text .label .cell { display: inline-block; padding-right: .12rem; padding-left: .12rem; border-radius: .1rem; background-color: rgba(44, 142, 255, .06); font-size: .2rem; line-height: .36rem; color: #2c8eff; vertical-align: middle } .public_list .item .text .labelList .labelItem ~ .labelItem, .indexNew .english .list .item .text .info .label .cell ~ .cell { margin-left: .14rem } .indexNew .english .list .item .text .label .cell ~ .cell { margin-left: .14rem } .public_list .item .text .money { font-weight: bold; font-size: .24rem; color: #FF6B00 } .public_list .item .text .money span { font-size: .32rem } .public_list .item .text .row-between { margin-top: .15rem } .public_list .item .text .money .yen { font-size: .24rem } .indexNew .essential { margin-top: .14rem; background-color: #fff } .indexNew .essential .list .item ~ .item { margin-top: .24rem } .indexNew .essential .list .item .pictrue { position: relative; width: 7.1rem; border-radius: .1rem; margin-right: auto; margin-left: auto; overflow: hidden } .indexNew .essential .list .item .pictrue img { display: block; width: 100%; height: 100%; } .indexNew .essential .list .item .goods-picture img { object-fit: scale-down; } .indexNew .essential .list .item .pictrue .label { position: absolute; right: .16rem; bottom: .16rem; padding-right: .14rem; padding-left: .14rem; border-radius: .03rem; font-size: .24rem; line-height: .38rem; background-color: rgba(0, 0, 0, 0.5); color: #fff } .indexNew .essential .list .item .text { padding: .14rem .2rem } .indexNew .essential .list .item .text .title .name { font-size: .28rem; line-height: .4rem } .indexNew .essential .list .item .text .info { margin-top: .12rem } .indexNew .essential .list .item .text .info > div:last-child { font-size: 0 } .indexNew .essential.activity-offline .list .item .text .info > div:last-child { font-size: .22rem } .indexNew .essential.activity-offline .list .item .text .info { margin-top: .12rem; font-size: .22rem; color: #999 } .indexNew .essential.activity-offline .list .item .text .info > div ~ div { margin-top: .1rem } .indexNew .essential.activity-offline .list .item .text .info .iconfont { margin-right: .1rem; font-size: .22rem; line-height: 1em } .indexNew .essential .list .item .text .info .labelList .labelItem { display: inline-block; padding-right: .12rem; padding-left: .12rem; border-radius: .06rem; background-color: rgba(44, 142, 255, .06); font-size: .22rem; line-height: .4rem; color: #2c8eff; vertical-align: middle } .indexNew .essential .list .item .text .info .labelList .labelItem ~ .labelItem { margin-left: .14rem } .indexNew .essential .list .item .text .info .free { display: inline-block; vertical-align: middle; margin-top: 0 } .indexNew .essential .list .item .text .info .free + .total { display: inline-block; vertical-align: middle; margin-left: .1rem; font-size: .22rem; color: #999 } .indexNew .essential .list .item .text .info .money { display: inline-block; vertical-align: middle; font-weight: bold; font-size: .32rem; color: #FF6B00 } .indexNew .interest .public_list .item .text .money { display: inline-block; vertical-align: middle } .indexNew .interest .public_list .item .text .free { display: inline-block; vertical-align: middle } .indexNew .interest .public_list .item .text .total { display: inline-block; vertical-align: middle; margin-left: .1rem; font-size: .22rem; color: #999 } .indexNew .interest .public_list .item .text .free + .total { display: inline-block; vertical-align: middle; margin-left: .1rem; font-size: .22rem; color: #999 } .indexNew .interest .list .item .text .total { display: inline-block; vertical-align: middle; font-size: .22rem; color: #999 } .indexNew .interest .list .item .text .total { display: inline-block; vertical-align: middle; font-size: .22rem; color: #999 } .indexNew .essential .list .item .text .info .money .yen { font-size: .24rem } .indexNew .essential .list .item .text .info .money .tip { position: relative; display: inline-block; padding-right: .06rem; padding-left: .06rem; border-radius: .03rem; margin-left: .05rem; font-size: .16rem; line-height: .24rem; background-color: #ff4a4a; vertical-align: middle; color: #fff } .indexNew .essential .list .item .text .info .money .tip::before { content: " "; position: absolute; top: 50%; right: 100%; border: .05rem solid; border-color: transparent #f50 transparent transparent; -webkit-transform: translateY(-50%); transform: translateY(-50%) } .indexNew .essential .list .item .text .info .money + .total { display: inline-block; vertical-align: middle; margin-left: .1rem; font-size: .22rem; color: #999 } .indexNew .interest { margin-top: .14rem; background-color: #fff } .indexNew .english .list { padding: 0 .2rem } .indexNew .english .list .item { width: 3.25rem; margin-bottom: .3rem } .indexNew .english .list .item .pictrue { position: relative; width:100%; height: 2.32rem; border-radius: .1rem; overflow: hidden } .indexNew .english .list .item .goods-picture { height: 3.45rem; } .indexNew .english .list .item .pictrue img { display: block; width: 100%; height: 100%; } .indexNew .english .list .item .goods-picture img { object-fit: scale-down; } .indexNew .english .list .item .text { position: relative; padding-top: .14rem } .indexNew .english .list .item .text .title .name { font-size: .28rem; line-height: .4rem; color: #333; width: 100% } .indexNew .english .list .item .text .label { margin-top: .12rem; margin-bottom: .12rem; } .indexNew .english .list .item .text .group .money { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; font-weight: bold; font-size: .24rem; color: #FF6B00 } .indexNew .english .list .item .text .group .money .num { font-size: .32rem; line-height: .45rem } .indexNew .english .list .item .text .group .free { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; font-size: .24rem; line-height: .45rem } .indexNew .english .list .item .text .group .total { margin-left: .1rem; font-size: .22rem; color: #999 } .indexNew .english .list .item .text .info .money .tip { position: relative; display: inline-block; padding-right: .06rem; padding-left: .06rem; border-radius: .03rem; background-color: #ff4a4a; margin-left: .05rem; font-size: .16rem; line-height: .24rem; color: #fff; vertical-align: middle } .indexNew .english .list .item .text .info .money .tip::before { content: " "; position: absolute; top: 50%; right: 100%; border: .05rem solid; border-color: transparent #f50 transparent transparent; -webkit-transform: translateY(-50%); transform: translateY(-50%) } .userNew .header { padding: 0 .6rem 0 .3rem; background-color: #2c8eff; height: 1.82rem; position: relative } .userNew .header:after { position: absolute; left: 0; right: 0; bottom: -1.4rem; z-index: -1; content: ''; height: 2rem; width: 100%; border-radius: 0 0 50% 50%; background-color: #2c8eff } .userNew .header .picTxt { font-size: .36rem; color: #fff!important; } .userNew .header .picTxt .pictrue { width: 1.14rem; height: 1.14rem; border: .02rem solid #fff; border-radius: 50%; margin-right: .22rem } .userNew .header .picTxt .pictrue img { width: 100%; height: 100%; border-radius: 50% } .userNew .header .icon-icon-yxj-arrow-right { color: #fff; font-size: .25rem } .userNew .header .picTxt .name { width: 4rem; color: #fff!important; } .userNew .nav { justify-content: space-around; -webkit-justify-content: space-around; background-color: #fff; width: 6.9rem; height: 2rem; border-radius: .16rem; margin: 0 auto; position: relative } .userNew .nav .item { -webkit-flex: 1; flex: 1; text-align: center } .userNew .nav .item .pictrue { width: .7rem; height: .7rem; margin: 0 auto } .userNew .nav .item .pictrue img { width: 100%; height: 100% } .userNew .nav .item .name { font-size: .26rem; color: #333; margin-top: .14rem } .userNew .nav .item .info { font-size: .2rem; color: #999; margin-top: .04rem } .userNew .list { width: 6.9rem; background-color: #fff; margin: .18rem auto 0 auto; border-radius: .16rem } .userNew .list .item { padding: 0 .3rem; height: 1rem } .userNew .list .item .pictrue { width: .42rem; height: .42rem } .userNew .list .item .pictrue img { width: 100%; height: 100% } .userNew .list .item .name { font-size: .28rem; color: #666; margin-left: .3rem } .userNew .list .item .iconfont { color: #ccc; font-size: .25rem } .goodsClass .header { height: 1.78rem; background-image: linear-gradient(90deg, rgba(44, 101, 247, 1) 0, rgba(64, 157, 255, 1) 100%) } .goodsClass .header .search { padding: .16rem .3rem 0; } .goodsClass .header .search .pictrue { height: .64rem } .goodsClass .header .search .pictrue img { display: block; height: 100%; } .goodsClass .header .search .form { flex: 1; min-width: 0; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; } .goodsClass .header .search .label { flex: 1; min-width: 0; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; padding-left: .27rem; border-radius: .32rem; margin-left: .26rem; background-color: #fff } .goodsClass .header .search .input { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; height: .64rem; font-size: .26rem; font-family: inherit } .goodsClass .header .search .img { width: .29rem; height: .3rem; display: block; margin-right: .16rem } .goodsClass .header .search .submit { margin-left: .16rem; color: #fff; } .goodsClass .header .search .input input::placeholder { color: #aaa } .goodsClass .header .wrapper { overflow: hidden } .goodsClass .header .wrapper .scroller ul::after { content: " "; display: block; height: 0; clear: both; visibility: hidden } .goodsClass .header .wrapper .scroller li { float: left; height: .9rem; padding-right: .39rem; padding-left: .39rem; line-height: .9rem; text-align: center; cursor: pointer } .goodsClass .header .wrapper .scroller li a { color: rgba(254, 254, 254, 0.8); font-size: .3rem; position: relative } .goodsClass .header .wrapper .scroller li.cur a { color: rgba(254, 254, 254, 1) } .goodsClass .header .wrapper .scroller li.cur a:before { color: #fefefe; width: .39rem; height: .04rem; background-color: #fff; position: absolute; content: ''; bottom: -0.1rem; left: 50%; margin-left: -0.195rem } .goodsClass .nav { position: relative; width: 100%; overflow: hidden; margin: 0 auto; height: 1.76rem } .goodsClass .nav .scroller { position: absolute } .goodsClass .nav ul::after { content: " "; display: block; height: 0; clear: both; visibility: hidden } .goodsClass .nav .item { text-align: center; float: left; } .goodsClass .nav .item a { display: block; padding: .22rem .2rem 0 } .goodsClass .nav .item .pictrue { width: .9rem; height: .9rem; border-radius: 50%; margin: 0 auto .21rem; overflow: hidden } .goodsClass .nav .item .pictrue img { width: 100%; height: 100%; display: block; border-radius: 50%; box-sizing: border-box; } .goodsClass .nav .item.cur .pictrue img { border: 1px solid #2c8eff; } .goodsClass .nav .item .name { font-size: .24rem; line-height: .33rem; color: #333 } .goodsClass .nav .item.cur .name { color: #2c8eff } .goodsClass .goodList { padding: .26rem 0 } .goodsClass .goodList .item { padding: 0 .2rem } .goodsClass .goodList .item ~ .item { margin-top: .26rem } .goodsClass .goodList .pictrue { position: relative; width: 2.5rem; height: 1.4rem; border-radius: .1rem; overflow: hidden } .goodsClass .goodList .text .title .line1 { display: block; white-space: nowrap } .goodsClass .goodList .text .labelList { position: static; margin-top: .1rem; font-size: 0 } .goodsClass .goodList .text .row-between { margin-top: 0 } .goodsClass .goodList .text .money { display: inline-block; vertical-align: middle } .goodsClass .goodList .text .free { display: inline-block; margin-top: 0; vertical-align: middle } .goodsClass .goodList .text .money + .total { display: inline-block; margin-left: .1rem; vertical-align: middle; font-size: .22rem; color: #999 } .goodsClass .goodList .text .free + .total { display: inline-block; margin-left: .1rem; vertical-align: middle; font-size: .22rem; color: #999 } .cash-withdrawal .nav { height: 1.3rem; box-shadow: 0 .1rem .1rem #f8f8f8; -webkit-box-shadow: 0 .1rem .1rem #f8f8f8; -moz-box-shadow: 0 .1rem .1rem #f8f8f8; -o-box-shadow: 0 .1rem .1rem #f8f8f8 } .cash-withdrawal .nav .item { font-size: .26rem; flex: 1; -webkit-flex: 1; -o-flex: 1; -ms-flex: 1; text-align: center } .cash-withdrawal .nav .item ~ .item { border-left: 1px solid #f0f0f0 } .cash-withdrawal .nav .item .iconfont { width: .4rem; height: .4rem; border-radius: 50%; border: .02rem solid #2c8eff; text-align: center; line-height: .37rem; margin: 0 auto .06rem auto; font-size: .22rem } .cash-withdrawal .nav .item .iconfont.on { background-color: #2c8eff; color: #fff; border-color: #2c8eff } .cash-withdrawal .nav .item .line { width: .02rem; height: .2rem; margin: 0 auto; transition: height .3s; -webkit-transition: height .3s; -moz-transition: height .3s; -o-transition: height .3s } .cash-withdrawal .nav .item .line.on { height: .39rem } .cash-withdrawal .wrapper .list { padding: 0 .3rem } .cash-withdrawal .wrapper .list .item { border-bottom: 1px solid #eee; height: 1.07rem; font-size: .3rem; color: #333 } .cash-withdrawal .wrapper .list .item .name { width: 1.3rem } .cash-withdrawal .wrapper .list .item .input { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1 } .cash-withdrawal .wrapper .list .item .input input { width: 100% } .cash-withdrawal .wrapper .list .item .input select { width: 100% } .cash-withdrawal .wrapper .list .item .input input::placeholder { color: #bbb } .cash-withdrawal .wrapper .list .tip { font-size: .26rem; color: #999; margin-top: .25rem } .cash-withdrawal .wrapper .list .bnt { font-size: .32rem; color: #fff; width: 6.9rem; height: .9rem; text-align: center; border-radius: .5rem; line-height: .9rem; margin: .64rem auto } .cash-withdrawal .wrapper .list .tip2 { font-size: .26rem; color: #999; text-align: center; margin: .44rem 0 .2rem 0 } .cash-withdrawal .wrapper .list .value { height: 1.35rem; line-height: 1.35rem; border-bottom: 1px solid #eee; width: 6.9rem; margin: 0 auto } .cash-withdrawal .wrapper .list .value input { font-size: .8rem; color: #282828; height: 1.35rem; text-align: center; width: 100% } .cash-withdrawal .wrapper .list .value input::placeholder { color: #bbb } .member-manage { position: relative; padding: .5rem .3rem } .member-manage::before { content: " "; position: absolute; top: 0; right: 0; z-index: -1; width: 100%; height: 3.19rem; border-bottom-right-radius: .6rem; border-bottom-left-radius: .6rem; background-color: #282828 } .member-manage.card-active::before { border-bottom-right-radius: 0; border-bottom-left-radius: 0 } .member-manage .wrapper { width: 6.9rem; border-radius: .16rem; margin-top: .2rem } .member-manage .wrapper:first-child { margin-top: 0 } .member-manage .card { position: relative; height: 3.2rem; padding-top: .34rem; padding-right: .3rem; padding-left: .31rem; background-image: url("../images/card-bg.png"); background-position: left top; background-size: 100% 100%; background-repeat: no-repeat } .member-manage .card .user { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center } .member-manage .card .user img { width: .6rem; height: .6rem; border-radius: 50% } .member-manage .card .user .name { -webkit-flex: 1; flex: 1; overflow: hidden; margin-right: .2rem; margin-left: .2rem; font-size: .3rem; white-space: nowrap; text-overflow: ellipsis; color: #63440e } .member-manage .card .user .btn { width: 1.3rem; height: .4rem; border: 1px solid #63440e; border-radius: .2rem; font-size: .24rem; line-height: .4rem; text-align: center; color: #63440e } .member-manage .card .time { margin-top: .47rem; font-size: .24rem; line-height: .33rem; color: #63440e } .member-manage .card .time .iconfont { margin-right: .17rem; font-size: .26rem } .member-manage .card .label { position: absolute; right: .31rem; bottom: .32rem; font-size: .4rem; text-shadow: 0 1px 1px rgba(181, 156, 110, .5); color: #fff5e4 } .member-manage .rights { background-color: #fff } .member-manage .rights .title { padding-top: .34rem; padding-bottom: .34rem; text-align: center } .member-manage .rights .title svg { font-size: .49rem; vertical-align: middle } .member-manage .rights .title > span { display: inline-block; font-size: .36rem; line-height: .5rem; vertical-align: middle; color: #333 } .member-manage .rights ul { display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap } .member-manage .rights li { -webkit-flex: 0 0 -webkit-calc(100% / 3); -webkit-flex: 0 0 calc(100% / 3); -webkit-flex: 0 0 -webkit-calc(100% / 3); flex: 0 0 calc(100% / 3); margin-bottom: .34rem; text-align: center } .member-manage .rights img { width: .96rem; height: .96rem; border-radius: 50%; vertical-align: middle } .member-manage .rights .name { margin-top: .3rem; font-size: .26rem; line-height: .37rem; color: #282828 } .member-manage .rights .info { margin-top: .03rem; font-size: .21rem; line-height: .29rem; color: #999 } .member-manage .explain { background-color: #fff } .member-manage .explain .title { padding-top: .34rem; padding-bottom: .34rem; text-align: center } .member-manage .explain .title svg { font-size: .45rem; vertical-align: middle } .member-manage .explain .title > span { display: inline-block; font-size: .36rem; line-height: .5rem; vertical-align: middle; color: #333 } .member-manage .explain ol { padding-right: .2rem; padding-bottom: .37rem; padding-left: .3rem; margin-left: .3rem; font-size: .26rem; line-height: .46rem; color: #333; list-style-type: decimal } .member-manage .btn-wrapper { margin-top: .36rem } .member-manage .btn-wrapper button { width: 100%; border-radius: .45rem; font-size: .32rem; line-height: .9rem } .member-manage .btn-wrapper button ~ button { margin-top: .24rem } .member-manage .btn-wrapper .pay { color: #63440e; background-image: -webkit-linear-gradient(90deg, #f3e3c6 0, #daaf6b 100%); background-image: linear-gradient(90deg, #f3e3c6 0, #daaf6b 100%) } .member-manage .btn-wrapper .try { border: .02rem solid #999; color: #333 } .member-manage .tip-wrapper { margin-top: .18rem; font-size: .24rem; line-height: .33rem; text-align: center; color: #271e0f } .member-manage .tip-wrapper button { color: #a97505 } .member-manage .form .title { text-align: center } .member-manage .form .title svg { display: block; margin: 0 auto; font-size: .7rem } .member-manage .form .title .name { position: relative; display: inline-block; font-size: .36rem; line-height: .5rem; color: #e0c897 } .member-manage .form .title .name::before { content: " "; position: absolute; top: 50%; left: -.98rem; width: .72rem; height: .02rem; margin-top: -.01rem; background-color: #baa999 } .member-manage .form .title .name::after { content: " "; position: absolute; top: 50%; right: -.98rem; width: .72rem; height: .02rem; margin-top: -.01rem; background-color: #baa999 } .member-manage .form .content { border-radius: .2rem; padding-top: .15rem; padding-right: .25rem; padding-left: .25rem; background-color: #fff; margin-top: .3rem } .member-manage .form .content label { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; padding-top: .3rem; padding-bottom: .3rem; border-bottom: 1px solid #eee } .member-manage .form .content .iconfont { font-size: .36rem; color: #282828 } .member-manage .form .content input { -webkit-flex: 1; flex: 1; margin-left: .2rem; font-size: .3rem; line-height: .42rem } .member-manage .form .content input::-webkit-input-placeholder, .member-manage .form .content input::placeholder { color: #999 } .member-manage .form .content button { width: 100%; height: .86rem; border-radius: .86rem; margin-top: .37rem; margin-bottom: .37rem; font-size: .32rem; background-image: -webkit-linear-gradient(90deg, #f3e3c6 0, #daaf6b 100%); background-image: linear-gradient(90deg, #f3e3c6 0, #daaf6b 100%); color: #63440e } .member-manage .popup-mask { position: fixed; top: 0; right: 0; bottom: 0; left: 0; background-color: #4c4c4c } .member-manage .popup-active { position: fixed; top: 50%; left: 50%; width: 6.6rem; padding-top: 1.3rem; background-image: url("../images/active-popup-bg.png"); background-position: left top; background-size: 100% 100%; background-repeat: no-repeat; -webkit-transform: translate(-50%, -50%) scale(0); transform: translate(-50%, -50%) scale(0); -webkit-transition: transform .2s; transition: transform .2s } .member-manage .popup-active.active { -webkit-transform: translate(-50%, -50%) scale(1); transform: translate(-50%, -50%) scale(1) } .member-manage .popup-active .icon-guanbi { position: absolute; top: -.45rem; right: .3rem; font-size: .5rem; color: #fff } .member-manage .popup-active .popup-bd { padding: .32rem .31rem .32rem .29rem; border-radius: .2rem; margin-right: .6rem; margin-left: .6rem } .member-manage .popup-active .popup-bd input { width: 100%; padding: .17rem .29rem; border-radius: .1rem; background-color: #f5f5f5; font-size: .3rem; line-height: .42rem } .member-manage .popup-active .popup-bd input ~ input { margin-top: .24rem } .member-manage .popup-active .popup-bd input::-webkit-input-placeholder, .member-manage .popup-active .popup-bd input::placeholder { color: #ccc } .member-manage .popup-active .popup-ft { padding: 1.54rem .8rem .6rem; margin-top: -.82rem } .member-manage .popup-active .popup-ft button { width: 100%; border-radius: .43rem; background-color: #63440e; font-size: .32rem; line-height: .86rem; color: #f5e6bd } .member-recharge { position: relative; padding-top: .5rem } .member-recharge::before { content: " "; position: absolute; top: 0; left: 0; z-index: -1; width: 100%; height: 3.19rem; background-color: #282828 } .member-recharge .user { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; padding: .34rem .29rem .36rem .31rem; border-top-left-radius: .16rem; border-top-right-radius: .16rem; background-image: -webkit-linear-gradient(336deg, #e8d2a8 0, #c8a46a 100%); background-image: linear-gradient(336deg, #e8d2a8 0, #c8a46a 100%); margin-right: .3rem; margin-left: .3rem } .member-recharge .user img { width: .6rem; height: .6rem; border-radius: 50% } .member-recharge .user .name { -webkit-flex: 1; flex: 1; margin-right: .2rem; margin-left: .2rem; font-size: .3rem; color: #63440e } .member-recharge .user .time { font-size: .24rem; color: #63440e } .member-recharge .user .iconfont { margin-right: .17rem; font-size: .26rem; vertical-align: middle } .member-recharge .limit { border-top-left-radius: .2rem; border-top-right-radius: .2rem; background-color: #fff } .member-recharge .limit .titles { padding: .34rem .3rem .32rem; font-size: .3rem; color: #999 } .member-recharge .limit ul { padding-right: .3rem; padding-left: .3rem } .member-recharge .limit li { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center } .member-recharge .limit li ~ li { margin-top: .46rem } .member-recharge .limit .text { -webkit-flex: 1; flex: 1 } .member-recharge .limit .text .price { font-size: .3rem; color: #333 } .member-recharge .limit .text .number { font-size: .48rem; line-height: .67rem } .member-recharge .limit .text .number + span { padding: .02rem .13rem .02rem .16rem; border-radius: .03rem .12rem; margin-left: .12rem; background-image: -webkit-linear-gradient(90deg, #ff4a4a 0, #ff8989 100%); background-image: linear-gradient(90deg, #ff4a4a 0, #ff8989 100%); font-size: .22rem; vertical-align: super; color: #fff } .member-recharge .limit .text .info { font-size: .22rem; line-height: .3rem; color: #999 } .member-recharge .limit .btn { width: 1.31rem; border-radius: .27rem; background-image: -webkit-linear-gradient(270deg, #f3e3c6 0, #daaf6b 100%); background-image: linear-gradient(270deg, #f3e3c6 0, #daaf6b 100%); font-size: .28rem; line-height: .54rem; color: #63440e } .member-recharge .limit .service { margin-top: .72rem; font-size: .24rem; line-height: .33rem; text-align: center; color: #999 } .member-recharge .limit .service .iconfont { font-size: .32rem; vertical-align: middle } .audio-control { padding-top: .25rem; padding-bottom: .49rem; background-color: #fff } .audio-control .progress { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; margin-right: .3rem; margin-left: .3rem; font-size: .28rem; line-height: .4rem; text-align: center; color: #2c8eff } .audio-control .progress .time { width: .75rem } .audio-control .progress .bar { -webkit-flex: 1; flex: 1; border-radius: .02rem; margin-right: .18rem; margin-left: .18rem; background-color: rgba(44, 142, 255, .3) } .audio-control .progress .bar .range { position: relative; height: .04rem; border-radius: .02rem; background-color: rgba(44, 142, 255, .8) } .audio-control .progress .bar .dot { position: absolute; top: 50%; left: 100%; width: .16rem; height: .16rem; border-radius: 50%; background-color: #2c8eff; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%) } .audio-control .btn-group { display: -webkit-flex; display: flex; -webkit-justify-content: center; justify-content: center; -webkit-align-items: center; align-items: center; margin-top: .34rem } .audio-control .btn-group button { line-height: 1 } .audio-control .btn-group .iconleft, .audio-control .btn-group .iconright { font-size: .36rem; color: #46505b } .audio-control .btn-group .icon { margin-right: .88rem; margin-left: .88rem; font-size: 1.1rem } .vip-price-icon { width: .46rem; height: .21rem; vertical-align: middle } .study-record header { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; padding: .16rem .48rem .16rem .5rem; background-color: #2c65f7; background-image: linear-gradient(90deg, rgba(44, 101, 247, 1) 0, rgba(64, 157, 255, 1) 100%) } .study-record header .image { width: 1.26rem; max-height: 100% } .study-record header .img { display: block; width: 100% } .study-record header form { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; height: .64rem; padding-right: .27rem; padding-left: .27rem; border-radius: .32rem; margin-left: .26rem; background-color: #fff } .study-record header form img { width: .29rem } .study-record header form input { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; margin-left: .16rem; font-size: .26rem; line-height: .35rem } .study-record header form input::-webkit-input-placeholder, .study-record header form input::placeholder { color: #aaa } .study-record .goods { padding-top: .26rem; padding-bottom: .26rem } .study-record .goods .item { display: -webkit-box; display: -webkit-flex; display: flex; padding-right: .2rem; padding-left: .2rem } .study-record .goods .item ~ .item { margin-top: .26rem } .study-record .goods .image { position: relative; width: 2.5rem; height: 1.4rem; border-radius: .1rem; overflow: hidden } .study-record .goods img { display: block; width: 100%; height: 100% } .study-record .goods .image .label { position: absolute; right: .1rem; bottom: .1rem; width: .66rem; height: .34rem; border-radius: .03rem; background-color: rgba(0, 0, 0, .5); font-size: .22rem; line-height: .34rem; text-align: center; color: #fff } .study-record .goods .text { position: relative; -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; min-width: 0; margin-left: .22rem } .study-record .goods .name { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: .28rem; line-height: .4rem; color: #333 } .study-record .goods .text .label { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; margin-top: .1rem } .study-record .goods .text .label span { display: inline-block; height: .4rem; padding-right: .12rem; padding-left: .12rem; border-radius: .06rem; vertical-align: middle; background-color: rgba(44, 142, 255, .06); font-size: .22rem; line-height: .4rem; color: #2c8eff } .study-record .goods .text .label span ~ span { margin-left: .14rem } .study-record .goods .price { position: absolute; bottom: 0; left: 0; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; width: 100% } .study-record .goods .price .money { font-size: .24rem; color: #FF6B00 } .study-record .goods .price .money span { font-size: .32rem } .study-record .goods .price .free { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; font-size: .24rem; color: #FF6B00 } .study-record .goods .price .group-price-icon { position: relative; width: .76rem; height: .24rem; border-radius: .03rem; margin-left: .14rem; background-color: #ff4a4a; font-size: .16rem; line-height: .24rem; text-align: center; color: #fff } .study-record .goods .price .group-price-icon::before { content: " "; position: absolute; top: 50%; right: 100%; z-index: 2; border-width: .05rem; border-style: solid; border-color: transparent #ff4a4a transparent transparent; -webkit-transform: translateY(-50%); transform: translateY(-50%) } .study-record .goods .price .total { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; font-size: .22rem; text-align: right; color: #999 } .study-record main .foot { margin-top: .2rem; font-size: .28rem; text-align: center } .study-record main .foot .tip { color: #999 } .replay-directory .item { position: relative; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; height: 1.02rem; padding-right: .3rem; padding-left: .3rem } .replay-directory .item::before { content: " "; position: absolute; top: 0; right: .3rem; left: 1.1rem; z-index: 2; height: 1px; border-top: 1px solid #f5f5f5; color: #f5f5f5; -webkit-transform-origin: center top; transform-origin: center top; -webkit-transform: scaleY(.5); transform: scaleY(.5) } .replay-directory .item:first-child::before { display: none } .replay-directory .item .label { width: .6rem; border: 1px solid rgba(102, 102, 102, .5); border-radius: .03rem; font-size: .22rem; line-height: .32rem; text-align: center; color: #333 } .replay-directory .item .name { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; min-width: 0; margin-right: .2rem; margin-left: .2rem; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: .3rem; color: #333 } .replay-directory .item.active .label { border-color: rgba(44, 142, 255, .5); color: #2c8eff } .replay-directory .item.active .name { color: #2c8eff } .replay-directory .foot { font-size: .4rem; text-align: center } .replay-directory .foot .tip { font-size: .28rem; color: #999 } .favorite { padding-top: .26rem; padding-bottom: .26rem } .favorite .item { display: -webkit-box; display: -webkit-flex; display: flex; padding-right: .2rem; padding-left: .2rem } .favorite .item ~ .item { margin-top: .26rem } .favorite .item .image { position: relative } .favorite .item .image img { width: 2.5rem; height: 1.4rem; border-radius: .1rem; vertical-align: middle } .favorite .item .image .label { position: absolute; right: .1rem; bottom: .1rem; z-index: 2; height: .34rem; border-radius: .03rem; background-color: rgba(0, 0, 0, .5); font-size: .22rem; line-height: .34rem; text-align: center; color: #fff } .favorite .item .text { position: relative; -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; min-width: 0; margin-left: .24rem } .favorite .item .text .name { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: .28rem; line-height: .4rem; color: #333 } .favorite .item .text .label { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; margin-top: .1rem } .favorite .item .text .label span { display: inline-block; height: .4rem; padding-right: .12rem; padding-left: .12rem; border-radius: .06rem; background-color: rgba(44, 142, 255, .06); vertical-align: middle; font-size: .22rem; line-height: .4rem; color: #2c8eff } .favorite .item .text .label span ~ span { margin-left: .14rem } .favorite .item .text .price { position: absolute; bottom: 0; left: 0; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; width: 100% } .favorite .item .text .price .total { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; font-size: .22rem; text-align: right; color: #999 } .favorite .item .text .price .money { font-size: .24rem; color: #FF6B00 } .favorite .item .text .price .money span { font-size: .32rem } .favorite .item .text .price .free { font-size: .24rem; color: #FF6B00 } .favorite .item .text .price .group-price-icon { position: relative; width: .76rem; height: .24rem; border-radius: .03rem; margin-left: .14rem; background-color: #ff4a4a; font-size: .16rem; line-height: .24rem; text-align: center; color: #fff } .favorite .item .text .price .group-price-icon::before { content: " "; position: absolute; top: 50%; right: 100%; z-index: 2; border-width: .05rem; border-style: solid; border-color: transparent #ff4a4a transparent transparent; -webkit-transform: translateY(-50%); transform: translateY(-50%) } .gold-coin .header { height: 3.5rem; background: #2c8eff url(img/b02_b3c17e1c94.png) center/cover no-repeat } .gold-coin .header .cont { position: relative; height: 2.63rem; line-height: 2.63rem; text-align: center } .gold-coin .header .text { display: inline-block; max-width: 100%; vertical-align: middle; overflow: hidden; font-size: .26rem; line-height: 1; color: #fff } .gold-coin .header .num { margin-top: .3rem; font-weight: bold; font-size: .78rem } .gold-coin .header .link { position: absolute; top: .74rem; right: 0; height: .54rem; padding-right: .32rem; padding-left: .47rem; border-top-left-radius: .27rem; border-bottom-left-radius: .27rem; background-color: #feb720; font-size: .3rem; line-height: .54rem; color: #fff } .gold-coin .main { min-height: .87rem; border-top-left-radius: .24rem; border-top-right-radius: .24rem; margin-top: -.87rem; background-color: #fff } .gold-coin .main .wrap { padding-right: .3rem; padding-left: .3rem } .gold-coin .main .wrap ~ .wrap { margin-top: .1rem } .gold-coin .wrap .head { height: 1.08rem; font-size: .3rem; line-height: 1.08rem; color: #282828 } .gold-coin .select .list::after { content: " "; display: block; height: 0; clear: both; visibility: hidden } .gold-coin .select .list .item { float: left; display: block; margin-top: .21rem; margin-right: .21rem } .gold-coin .select .list .item:nth-child(-n+3) { margin-top: 0 } .gold-coin .select .list .item:nth-child(3n+3) { margin-right: 0 } .gold-coin .select .list input { display: none } .gold-coin .select .list .item-cont { width: 2.16rem; height: 1.2rem; border: 1px solid #eee; border-radius: .12rem; line-height: 1.2rem; text-align: center } .gold-coin .select .list input:checked + .item-cont { border-color: #539dfd } .gold-coin .select .list .text { display: inline-block; vertical-align: middle; font-size: .28rem; line-height: 1; color: #999 } .gold-coin .select .list .num { padding-right: .46rem; margin-bottom: .16rem; background: url(img/b03_58d2da57d8.png) right center/.36rem .36rem no-repeat; font-weight: bold; font-size: .36rem; color: #282828 } .gold-coin .input { display: block; height: .86rem; border: 1px solid #eee; border-radius: .12rem; margin-top: .21rem; line-height: .86rem } .gold-coin .checked { border-color: #539dfd } .gold-coin .input::after { content: " "; display: block; height: 0; clear: both; visibility: hidden } .gold-coin .input .cell { float: left; width: 50% } .gold-coin .input .cell:first-child { display: -webkit-box; display: -webkit-flex; display: flex; padding-right: .61rem; padding-left: .28rem; margin-right: -.16rem; background: url(img/b04_2c4b0e5619.png) right center/.31rem no-repeat; font-size: .3rem; color: #999 } .gold-coin .input input { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; min-width: 0; color: #282828 } .gold-coin .input input.on { color: #999 } .gold-coin .input input::-webkit-input-placeholder, .gold-coin .input input::placeholder { color: #999 } .gold-coin .input .cell:last-child { padding-left: 1.02rem; background: url(img/b05_58d2da57d8.png) .46rem center/.36rem .36rem no-repeat } .gold-coin .method .item { display: block } .gold-coin .method .item ~ .item { margin-top: .19rem } .gold-coin .method input { display: none } .gold-coin .method .item-cont { border: 1px solid #eee; border-radius: .06rem; font-size: .28rem; color: #282828 } .gold-coin .method input:checked + .item-cont { border-color: #539dfd; color: #539dfd } .gold-coin .method .item-cont::after { content: " "; display: block; height: 0; clear: both; visibility: hidden } .gold-coin .method .cell { float: left; width: 50%; height: .86rem; line-height: .86rem } .gold-coin .method .cell:first-child { padding-left: 1.5rem; background: url(img/b06_494611d12e.png) .86rem center/.44rem no-repeat } .gold-coin .method .item:last-child .cell:first-child { background-image: url(img/b07_53dfeddf69.png) } .gold-coin .method .cell:last-child { position: relative; font-size: .26rem; text-align: center; color: #aaa } .gold-coin .method .cell:last-child::before { content: " "; position: absolute; top: 50%; left: 0; width: 1px; height: .3rem; background-color: #eee; margin-top: -.15rem } .gold-coin .handle { padding-right: .41rem; padding-left: .41rem; margin-top: .74rem } .gold-coin .handle .btn { display: block; width: 100%; height: .86rem; border-radius: .43rem; background-color: #539dfd; font-size: .3rem; color: #fff } .sign-in .header { height: 3.6rem; background: #2c8eff url(img/b08_b3c17e1c94.png) center/cover no-repeat } .sign-in .header .cont { position: relative; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; height: 2.97rem } .sign-in .header .image { width: 1.16rem; height: 1.16rem; border: .02rem solid #fff; border-radius: 50%; margin-right: .22rem; margin-left: .3rem; background-color: #fff; overflow: hidden } .sign-in .header .image .img { display: block; width: 100%; height: 100%; object-fit: cover } .sign-in .header .text { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; min-width: 0 } .sign-in .header .name { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: .32rem; line-height: 1em; color: #fff } .sign-in .header .info { display: inline-block; height: .36rem; padding-right: .18rem; padding-left: .18rem; border-radius: .18rem; margin-top: .26rem; background-color: #feb720; font-size: .26rem; line-height: .36rem; color: #fff } .sign-in .header .btn { position: absolute; top: .74rem; right: 0; height: .54rem; padding-right: .32rem; padding-left: .47rem; border-top-left-radius: .27rem; border-bottom-left-radius: .27rem; background-color: #feb720; font-size: .3rem; line-height: .54rem; color: #fff; cursor: pointer } .sign-in .main { padding-right: .3rem; padding-bottom: .3rem; padding-left: .3rem; margin-top: -.63rem } .sign-in .main .head { padding-bottom: .82rem; border-radius: .1rem; background-color: #fff } .sign-in .main .head .list { padding: .3rem .5rem } .sign-in .main .head .item { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; min-width: 0; color: #999 } .sign-in .main .head .item.on { color: #f90 } .sign-in .main .head .day { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; margin-left: .1rem; font-size: .32rem; color: #666 } .sign-in .main .head .reward { width: .74rem; height: .32rem; border-radius: .16rem; margin-right: auto; margin-left: auto; background-color: rgba(244, 180, 9, .6); font-size: .2rem; line-height: .32rem; text-align: center; color: #a67d40 } .sign-in .main .head .image { max-width: .75rem; height: .54rem; margin-right: auto; margin-left: .7rem; overflow: hidden } .sign-in .main .head .star { display: block; height: 100% } .sign-in .main .head .num { font-size: .32rem } .sign-in .main .head .btn { display: block; width: 4.5rem; height: .76rem; border-radius: .38rem; margin-right: auto; margin-left: auto; margin-top: .5rem; background-image: -webkit-linear-gradient(right, #409dff, #1e85fb); background-image: linear-gradient(to right, #409dff, #1e85fb); font-size: .28rem; color: #fff } .sign-in .main .foot { position: relative; padding-right: .4rem; padding-left: .4rem; border-radius: .1rem; margin-top: .14rem; background-color: #fff } .sign-in .main .foot .lock { position: absolute; top: -.41rem; left: 50%; width: 5.58rem; margin-left: -2.79rem } .sign-in .main .panel { padding-top: .69rem; padding-bottom: .41rem } .sign-in .main .panel .name { font-size: .32rem; line-height: .42rem; text-align: center; color: #666 } .sign-in .main .panel .count { margin-top: .42rem; text-align: center } .sign-in .main .panel .cont { position: relative; display: inline-block } .sign-in .main .panel .cont::after { content: " "; display: block; height: 0; clear: both; visibility: hidden } .sign-in .main .panel .item { position: relative; float: left; width: .8rem; height: 1.16rem; border-radius: .1rem; background-image: -webkit-linear-gradient(top, #409dff, #1e85fb, #409dff); background-image: linear-gradient(#409dff, #1e85fb, #409dff); font-size: .72rem; line-height: 1.16rem; text-align: center; color: #fff } .sign-in .main .panel .item::before { content: " "; position: absolute; top: 50%; left: 0; width: 100%; height: .04rem; margin-top: -.02rem; background-color: #eee; opacity: .2 } .sign-in .main .panel .item ~ .item { margin-left: .19rem } .sign-in .main .panel .unit { position: absolute; bottom: 0; left: 100%; margin-left: .15rem; font-size: .3rem; line-height: 1; color: #232323 } .sign-in .main .panel .info { padding-right: .16rem; padding-left: .16rem; margin-top: .44rem; font-size: .3rem; line-height: .43rem; text-align: center; color: #999 } .sign-in .main .record { border-top: 1px dashed rgba(195, 170, 140, .5) } .sign-in .main .record .item { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; height: 1.3rem } .sign-in .main .record .item ~ .item { border-top: 1px solid #fbf4ec } .sign-in .main .record .text { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; min-width: 0 } .sign-in .main .record .name { font-size: .3rem; line-height: .42rem; color: #232323 } .sign-in .main .record .time { margin-top: .06rem; font-size: .24rem; line-height: .33rem; color: #bbb } .sign-in .main .record .num { font-size: .36rem; color: #e93323 } .sign-in .poster { position: fixed; top: 15%; left: 15%; width: 70%; z-index: 60 } .sign-in .poster img { width: 100% } .sign-in .poster p { color: #eee; font-size: 14px; margin-left: 25% } .sign-list .list { background-color: #fff } .sign-list .item { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; height: 1.3rem; padding-right: .43rem; padding-left: .4rem } .sign-list .item ~ .item { border-top: 1px solid #fbf4ec } .sign-list .text { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; min-width: 0 } .sign-list .name { font-size: .3rem; line-height: .42rem; color: #232323 } .sign-list .time { margin-top: .06rem; font-size: .24rem; line-height: .33rem; color: #bbb } .sign-list .num { font-size: .36rem; color: #e93323 } .sign-list .tips { height: 1rem; font-size: .32rem; line-height: 1rem; text-align: center; color: #999 } .bill .header { height: 2.2rem; padding-left: .6rem; background: #539dfd url(img/b09_595e0a130c.png) 5.35rem center/1.2rem no-repeat; line-height: 2.2rem } .bill .header .cont { display: inline-block; vertical-align: middle; font-size: .28rem; line-height: .4rem; color: #fff } .bill .header .cont .num { margin-top: .03rem; font-size: .5rem; line-height: .7rem } .bill .main .nav-bar { display: -webkit-box; display: -webkit-flex; display: flex; background-color: #fff } .bill .main .nav-bar .item { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; height: .86rem; font-size: .28rem; line-height: .86rem; text-align: center; color: #282828 } .bill .main .nav-bar .active { border-bottom: 1px solid #539dfd; color: #539dfd } .bill .main .nav-cont { border-top: 1px solid #f2f2f2 } .bill .main .nav-cont .list { padding-left: .3rem; background-color: #fff } .bill .main .nav-cont .list .item { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; min-height: 1.2rem; padding-right: .3rem } .bill .main .nav-cont .list .item ~ .item { border-top: 1px solid #f2f2f2 } .bill .main .nav-cont .list .item .text { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1 } .bill .main .nav-cont .list .item .name { font-size: .3rem; color: #282828 } .bill .main .nav-cont .list .item .time { margin-top: .1rem; font-size: .28rem; color: #999 } .bill .main .nav-cont .list .item .num { font-size: .32rem; color: #e93323 } .bill .main .nav-cont .list .item .nums { font-size: .32rem; color: #539dfd } .bill .main .nav-cont .tips { height: 1rem; font-size: .32rem; line-height: 1rem; text-align: center; color: #999 } .bills .header { height: 2.2rem; padding-left: .6rem; background: #539dfd url(img/b10_5804b3ea56.webp) center/cover no-repeat; line-height: 2.2rem } .bills .header .cont { display: inline-block; vertical-align: middle; font-size: .28rem; line-height: .4rem; color: #fff } .bills .header .cont .num { margin-top: .03rem; font-size: .5rem; line-height: .7rem } .bills .main .nav-bar { display: -webkit-box; display: -webkit-flex; display: flex; background-color: #fff } .bills .main .nav-bar .item { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; height: .86rem; font-size: .28rem; line-height: .86rem; text-align: center; color: #282828 } .bills .main .nav-bar .active { border-bottom: 1px solid #539dfd; color: #539dfd } .bills .main .nav-cont { border-top: 1px solid #f2f2f2 } .bills .main .nav-cont .list { padding-left: .3rem; background-color: #fff } .bills .main .nav-cont .list .item { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; min-height: 1.2rem; padding-right: .3rem } .bills .main .nav-cont .list .item ~ .item { border-top: 1px solid #f2f2f2 } .bills .main .nav-cont .list .item .text { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1 } .bills .main .nav-cont .list .item .name { font-size: .3rem; color: #282828 } .bills .main .nav-cont .list .item .time { margin-top: .1rem; font-size: .28rem; color: #999 } .bills .main .nav-cont .list .item .num { font-size: .32rem; color: #e93323 } .bills .main .nav-cont .list .item .nums { font-size: .32rem; color: #539dfd } .bills .main .nav-cont .tips { height: 1rem; font-size: .32rem; line-height: 1rem; text-align: center; color: #999 } .activity .header { background-color: #fff } .activity .header .image { height: 4.2rem } .activity .header .img { display: block; width: 100%; height: 100%; object-fit: cover } .activity .header .text { padding: .3rem } .activity .header .text .name { font-size: .36rem; color: #333 } .activity .header .text .group { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; margin-top: .27rem; font-size: .26rem; color: #999 } .activity .header .text .money { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; font-weight: bold; font-size: .24rem; line-height: 1; color: #FF6B00 } .activity .header .text .money .num { font-size: .4rem } .activity .header .info { padding: .23rem .3rem; border-top: 1px solid #f1f1f1; font-size: .26rem; line-height: .52rem; color: #999 } .activity .header .info .item { display: -webkit-box; display: -webkit-flex; display: flex } .activity .header .info .iconfont { margin-right: .18rem; font-size: .22rem; color: #999 } .activity .header .info .cont { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1 } .activity .chat { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; height: .7rem; padding-right: .3rem; padding-left: .3rem; border-radius: .12rem; margin: .12rem .2rem; background-color: #e2efff } .activity .chat .text { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; color: #2c8eff } .activity .chat .btn { width: 1.36rem; height: .46rem; border: 1px solid #3795ff; border-radius: .23rem; background-color: #2b8dff; font-size: .24rem; line-height: .42rem; text-align: center; color: #fff } .activity .main { margin-top: .14rem; background-color: #fff } .activity .nav-bar { display: -webkit-box; display: -webkit-flex; display: flex; box-shadow: 0 .06rem .2rem 0 rgba(51, 51, 51, .03) } .activity .nav-bar .item { position: relative; -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; height: .96rem; font-size: .3rem; line-height: .96rem; text-align: center; color: #333 } .activity .nav-bar .item.on { font-weight: bold; color: #2c8eff } .activity .nav-bar .item.on::after { content: " "; position: absolute; bottom: 0; left: 50%; width: 1.26rem; height: .04rem; border-radius: .02rem; background-color: #2c8eff; -webkit-transform: translateX(-50%); transform: translateX(-50%) } .activity .nav-cont .section { padding: .3rem } .activity .nav-cont .section img { display: block; width: 100% } .activity .footer { position: fixed; bottom: 0; left: 0; z-index: 9; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; width: 100%; padding-right: .3rem; border-top: 1px solid #eee; background-color: #fff } .activity .footer .link { width: .94rem; height: 1rem; line-height: 1rem; text-align: center } .activity .footer .link .cont { display: inline-block; vertical-align: middle; font-size: .2rem; line-height: .36rem; color: #333 } .activity .footer .link .img { display: block; width: .4rem; height: .4rem; margin-bottom: .1rem } .activity .footer .button { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; height: .76rem; border-radius: .38rem; background-color: #2c8eff; font-family: inherit; font-size: .28rem; color: #fff } .activity .popup { position: fixed; bottom: 0; left: 0; z-index: 99; width: 100%; background-color: #fff; -webkit-transform: translateY(100%); transform: translateY(100%); -webkit-transition: .3s; transition: .3s } .activity .popup.on { -webkit-transform: translateY(0); transform: translateY(0) } .activity .popup .head { position: relative; height: .98rem; font-size: .36rem; line-height: .98rem; text-align: center } .activity .popup .iconfont { position: absolute; top: 50%; left: .3rem; -webkit-transform: translateY(-50%); transform: translateY(-50%); font-family: inherit; font-size: .3rem; color: #999 } .activity .popup .cont { border-top: 1px solid #e2e2e2 } .activity .popup .label-group { padding: .24rem .75rem } .activity .popup .label { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; padding-top: .56rem; padding-bottom: .38rem; border-bottom: 1px solid #eee } .activity .popup .label .name { width: 1.53rem; font-size: .3rem; color: #282828 } .activity .popup .label .input { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; font-family: inherit; font-size: .28rem; color: #282828 } .activity .popup .label .input::-webkit-input-placeholder, .activity .popup .label .input::placeholder { color: #ccc } .activity .popup .button-group { padding: .47rem .3rem .53rem } .activity .popup .button { display: block; width: 100%; height: 1rem; border-radius: .5rem; background-color: #2c8eff; font-family: inherit; font-weight: bold; font-size: .36rem; color: #fff } .live { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; flex-direction: column; height: 100%; -webkit-box-sizing: border-box; box-sizing: border-box; overflow: hidden } .live .header { position: relative; height: 4.22rem; -webkit-box-sizing: border-box; box-sizing: border-box; background-color: #333 } .live .header .text { position: absolute; top: 50%; left: 50%; max-width: 100%; max-height: 100%; padding-top: .7rem; background: url(img/b11_ddd753962d.png) center top/.65rem .54rem no-repeat; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); font-size: .3rem; line-height: 1.6; text-align: center; color: #fff } .live .nav { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-sizing: border-box; box-sizing: border-box } .live .nav .item { position: relative; -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; height: .86rem; font-size: .3rem; line-height: .86rem; text-align: center; color: #282828 } .live .nav .active { color: #539dfd } .live .nav .active::after { content: " "; position: absolute; bottom: .1rem; left: 50%; width: .38rem; height: .04rem; border-radius: .02rem; background-color: #539dfd; margin-left: -.19rem } .live .main { position: relative; -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; min-height: 0; border-top: 1px solid #f1f1f1; -webkit-box-sizing: border-box; box-sizing: border-box } .live .footer { min-height: .9rem; border-top: 1px solid #f0efef; -webkit-box-sizing: border-box; box-sizing: border-box } .live .main .section { height: 100%; background-color: #f5f5f5; -webkit-overflow-scrolling: touch; overflow: auto } .live .main .section.recom, .live .main .section.rank { background-color: #fff } .live .recom .list .item { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; padding-right: .2rem; padding-left: .2rem; margin-top: .25rem; margin-bottom: .25rem; } .live .recom .list .image { position: relative; width: 2.5rem; height: 1.4rem; border-radius: .12rem; overflow: hidden } .live .recom .list .tag { position: absolute; right: .1rem; bottom: .1rem; width: .66rem; height: .34rem; border-radius: .03rem; background-color: rgba(0, 0, 0, .5); font-size: .22rem; line-height: .34rem; text-align: center; color: #fff; } .live .recom .list .img { display: block; width: 100%; height: 100%; object-fit: cover; pointer-events: none; -webkit-touch-callout: none; } .live .recom .list .text { position: relative; -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; min-width: 0; padding-left: .2rem } .live .recom .list .name { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; line-height: 1; } .live .recom .list .label { display: -webkit-box; display: -webkit-flex; display: flex; margin-top: .18rem } .live .recom .list .label .cell { height: .4rem; padding-right: .12rem; padding-left: .12rem; border-radius: .04rem; background-color: #eef5ff; font-size: .22rem; line-height: .4rem; color: #539dfd } .live .recom .list .label .cell ~ .cell { margin-left: .14rem } .live .recom .list .money { display: -webkit-box; display: -webkit-flex; display: flex; margin-top: .18rem } .live .recom .list .money .sell { font-size: .26rem; line-height: .32rem; color: #e93323 } .live .recom .list .money .sell .num { font-size: .32rem } .live .recom .list .link { position: absolute; right: 0; bottom: 0; width: 1.12rem; height: .448rem; border-radius: .224rem; background-color: #e93323; font-size: .28rem; line-height: .448rem; text-align: center; color: #fff } .live .rank .list { padding-right: .2rem; padding-left: .2rem } .live .rank .list ~ .list { border-top: .12rem solid #f3f3f3 } .live .rank .list .item { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; height: 1.08rem } .live .rank .list .item ~ .item { border-top: 1px solid #f3f3f3 } .live .rank .list .item .type { width: .72rem; font-size: .28rem; text-align: center; color: #666 } .live .rank .list .item .type .img { width: .4rem; height: .4rem; vertical-align: middle } .live .rank .list .item .image { width: .68rem; height: .68rem; border-radius: 50%; margin-right: .3rem; margin-left: .2rem; overflow: hidden } .live .rank .list .item .image .img { display: block; width: 100%; height: 100%; object-fit: cover } .live .rank .list .item .name { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: .28rem; color: #333 } .live .rank .list .item .num { padding-right: .46rem; background: right center/.31rem .31rem no-repeat; font-size: .28rem; color: #282828 } .live .footer .control { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; padding: .15rem .2rem .15rem .3rem } .live .footer .control .button { width: .48rem; height: .48rem } .live .footer .control .button ~ .button { margin-left: .2rem } .live .footer .control .button .img { display: block; width: 100%; height: 100% } .live .footer .control .form { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; min-width: 0; padding-right: .18rem; padding-left: .18rem; border-radius: .08rem; margin-left: .3rem; background-color: #f2f2f2 } .live .footer .control .form .text { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; min-width: 0; height: .72rem; font-family: inherit; font-size: .28rem } .live .footer .control .form .submit { width: .5rem; height: .5rem; margin-left: .18rem; background: url(img/b12_fba0e91ea5.png) center/cover no-repeat; } .live .swiper-container .swiper-slide { padding-bottom: .7rem; border-top: 1px solid #f5f5f5 } .live .swiper-container .swiper-slide::after { content: " "; display: block; height: 0; clear: both; visibility: hidden } .live .swiper-container .button { float: left; display: block; width: .5rem; height: .5rem; margin-top: .4rem; margin-left: .5rem } .live .swiper-container .img { display: block; width: 100%; height: 100% } .live .swiper-container .swiper-pagination-bullet-active { background: #999 } .live .load { padding-top: .1rem; padding-bottom: .1rem; font-size: .28rem; text-align: center; color: #999 } .live .load .fa-spinner { font-size: .32rem } .live .chat .list { padding: .2rem .9rem .2rem .2rem } .live .chat .item { display: -webkit-box; display: -webkit-flex; display: flex } .live .chat .item ~ .item { margin-top: .2rem } .live .chat .item .avatar { width: .55rem; height: .55rem; border-radius: 50%; background-color: #fff; overflow: hidden } .live .chat .item .avatar .img { display: block; width: 100%; height: 100%; object-fit: cover } .live .chat .item .text { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; min-width: 0; margin-left: .15rem } .live .chat .item .text-cont { display: inline-block; vertical-align: middle } .live .chat .item .text .name { font-size: .26rem; line-height: 1em; color: #999 } .live .chat .item .text .info { margin-top: .15rem } .live .chat .item .text .info .cont { display: inline-block; padding: .09rem .2rem; border-radius: .06rem .16rem .16rem; background-color: #fff; word-break: break-all; font-size: .28rem; line-height: .38rem; color: #333 } .live .chat .item .text .info .cont img { width: .36rem; height: .36rem; vertical-align: middle } .live .chat .send .text { margin-right: .15rem; margin-left: .7rem; text-align: right } .live .chat .send .text .info .cont { border-top-left-radius: .16rem; border-top-right-radius: .06rem; text-align: left; word-break: break-all } .live .side-menu { position: absolute; right: .2rem; bottom: .3rem } .live .side-menu .btn { display: block; width: .6rem; height: .6rem; border-radius: 50%; overflow: hidden } .live .side-menu .btn ~ .btn { margin-top: .2rem } .live .side-menu .btn .img { display: block; width: 100%; height: 100%; object-fit: cover } .live .side-menu .barrage-btn img { display: block; width: 100%; height: 100% } .live .online { position: absolute; top: .2rem; right: 0; height: .46rem; padding-right: .2rem; padding-left: .43rem; border-top-left-radius: .23rem; border-bottom-left-radius: .23rem; background-color: #54d16c; font-size: .26rem; line-height: .46rem; color: #fff } .live .online::before { content: " "; position: absolute; top: 50%; left: .2rem; width: .1rem; height: .1rem; border-radius: 50%; background-color: #ffdf58; margin-top: -.05rem } .live .welcome { position: absolute; top: .2rem; left: 0; z-index: 99; height: .46rem; padding-right: .25rem; padding-left: .2rem; border-top-right-radius: .23rem; border-bottom-right-radius: .23rem; background-color: #000; font-size: .26rem; line-height: .46rem; color: #fff; opacity: .3; -webkit-transform: translateX(-100%); transform: translateX(-100%); -webkit-transition: .3s; transition: .3s } .live .welcome.on { -webkit-transform: translateX(0); transform: translateX(0) } .live .welcome .name { color: #fee229 } .live .gift-wrapper { position: absolute; bottom: 0; left: 0; z-index: 99; width: 100%; background-color: #fff } .live .gift .swiper-slide { padding-top: .15rem; padding-bottom: .59rem } .live .gift .swiper-slide::after { content: " "; display: block; height: 0; clear: both; visibility: hidden } .live .gift .swiper-slide .item { position: relative; float: left; width: 25%; padding: .1rem; text-align: center; cursor: pointer } .live .gift .swiper-slide .item.on { border-radius: .1rem; background-color: #f5f9ff; color: #539dfd } .live .gift .swiper-slide .item.on::before { content: " "; position: absolute; top: 0; left: 0; z-index: -1; width: 100%; height: 100%; border: .02rem solid #539dfd; -webkit-box-sizing: border-box; box-sizing: border-box } .live .gift .item .image { width: 1rem; height: 1rem; margin-right: auto; margin-left: auto } .live .gift .item .img { display: block; width: 100%; height: 100%; object-fit: contain } .live .gift .item .name { margin-top: .1rem; font-size: .24rem; line-height: 1; text-align: center; color: #282828 } .live .gift .item .num { display: inline-block; margin-top: .1rem; padding-right: .23rem; background: url(img/b13_58d2da57d8.png) right center/.18rem .18rem no-repeat; font-size: .22rem; line-height: 1; color: #999 } .live .gift .swiper-pagination { bottom: 0 } .live .gift-wrapper .foot { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; height: 1rem; padding-right: .2rem; padding-left: .2rem; border-top: 1px solid #f1f1f1 } .live .gift-wrapper .foot .text-group { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; font-size: .2rem; color: #539dfd } .live .gift-wrapper .foot .text-group .iconfont { font-size: .3rem } .live .gift-wrapper .foot .text-group .number { padding-left: .46rem; background: url(img/b14_58d2da57d8.png) left center/.36rem .36rem no-repeat; vertical-align: middle; color: #282828 } .live .gift-wrapper .foot .text-group .iconfont2 { vertical-align: middle; font-size: .18rem; color: #666 } .live .gift-wrapper .foot .button-group { display: -webkit-box; display: -webkit-flex; display: flex; width: 3.2rem } .live .gift-wrapper .foot .button { position: relative; -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; height: .6rem; border: 1px solid #539dfd; font-family: inherit; font-size: .28rem; color: #282828 } .live .gift-wrapper .foot .select { border-right: 0; border-top-left-radius: .3rem; border-bottom-left-radius: .3rem } .live .gift-wrapper .foot .post { border-left: 0; border-top-right-radius: .3rem; border-bottom-right-radius: .3rem; background-color: #539dfd; color: #fff } .live .gift-wrapper .foot .button .iconfont2 { margin-left: .2rem; font-size: .18rem; color: #539dfd } .live .gift-wrapper .foot .button .list { position: absolute; bottom: 100%; left: 50%; z-index: 9; width: 1.93rem; margin-bottom: .13rem; background-color: #fff; box-shadow: 0 2px 5px 0 rgba(166, 166, 166, .3); -webkit-transform: translateX(-50%); transform: translateX(-50%); font-size: .3rem; line-height: .44rem; color: #539dfd } .live .gift-float { position: absolute; top: 1.75rem; left: 0; margin-bottom: .3rem; animation: move 1s } @keyframes move { 0% { -webkit-transform: translateY(500%); transform: translateY(500%); opacity: 0; } 100% { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; } } @-webkit-keyframes move { 0% { -webkit-transform: translateY(500%); transform: translateY(500%); opacity: 0; } 100% { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; } } .live .gift-float .cont { display: inline-block; height: .72rem; padding-right: .3rem; padding-left: .2rem; border-top-right-radius: .36rem; border-bottom-right-radius: .36rem; background-image: linear-gradient(90deg, rgba(83, 157, 253, 1) 0, rgba(119, 228, 255, 1) 100%); font-size: 0; line-height: .72rem } .live .gift-float .avatar { display: inline-block; width: .56rem; height: .56rem; border-radius: 50%; background: center/cover no-repeat; overflow: hidden; vertical-align: middle } .live .gift-float .text { display: inline-block; width: 1.52rem; margin-right: .15rem; margin-left: .15rem; vertical-align: middle; font-size: .18rem; line-height: 1; color: #fff } .live .gift-float .name { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; margin-bottom: .07rem; font-weight: bold; font-size: .26rem } .live .gift-float .image { display: inline-block; width: .72rem; height: .72rem; background: url(img/b15_7c6778196a.webp) center/contain no-repeat; vertical-align: middle } @keyframes giftnum { 0% { -webkit-transform: scale(.1); transform: scale(.1); } 100% { -webkit-transform: scale(1); transform: scale(1); } } @-webkit-keyframes giftnum { 0% { -webkit-transform: scale(.1); transform: scale(.1); } 100% { -webkit-transform: scale(1); transform: scale(1); } } .live .gift-float .num { display: inline-block; vertical-align: bottom; text-shadow: 1px 1px 0 #8b5a00, -1px -1px 0 #8b5a00; font: italic bold .72rem/1 "FZCuYuan-M03S"; color: #ffdf58; animation: giftnum 1s; -webkit-animation: giftnum 1s; } .live .barrage { position: absolute; right: .2rem; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; flex-direction: column; -webkit-box-pack: end; -webkit-justify-content: flex-end; justify-content: flex-end; overflow: auto; -webkit-overflow-scrolling: touch; transform: translate3d(150%, 0, 0); transition: all .3s cubic-bezier(.25, .5, .5, .9) } .live .barrage.on { transform: translate3d(0, 0, 0) } .live .barrage .item { opacity: .5 } .live .barrage .item ~ .item { margin-top: .2rem } .live .barrage .item:nth-last-of-type(1) { opacity: 1 } .live .barrage .item .pictrue { width: .55rem; height: .55rem; border-radius: 50%; background-color: #fff; overflow: hidden } .live .barrage .item .pictrue img { width: 100%; height: 100%; object-fit: cover } .live .barrage .item .text { background-color: #fff; font-size: .28rem; line-height: .46rem; color: #282828; border-radius: .16rem .06rem .16rem .16rem; max-width: 2.24rem; padding: .05rem .2rem; margin-right: .16rem; word-wrap: break-word } .live .barrage .item .text img { width: .37rem; height: .37rem; vertical-align: middle } .activity_list .list { padding-top: .26rem; padding-bottom: .26rem } .activity_list .nav-bar { display: -webkit-box; display: -webkit-flex; display: flex; background-color: #fff } .activity_list .nav-bar .item { position: relative; -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; height: .96rem; font-size: .28rem; line-height: .96rem; text-align: center } .activity_list .list .activitys { margin-top: 10px; background-color: #fff; display: block } .activity_list .nav-bar .active { color: #2c8eff } .activity_list .nav-bar .active::after { content: " "; position: absolute; bottom: 0; left: 50%; width: .6rem; height: .04rem; border-radius: .02rem; background-color: #2c8eff; -webkit-transform: translateX(-50%); transform: translateX(-50%) } .activity_list .list .item { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; padding:0 .2rem .2rem .2rem; } .activity_list .list .item ~ .item { margin-top: .26rem } .activity_list .list .items { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; padding: .13rem .2rem .0rem .2rem; color: #666; font-size: 14px } .activity_list .list .image { width: 2.5rem; height: 1.4rem; border-radius: .1rem; overflow: hidden } .activity_list .list .img { display: block; width: 100%; height: 100%; object-fit: cover } .activity_list .list .text { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; min-width: 0; margin-left: .2rem } .activity_list .list .name { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: .28rem; line-height: .4rem } .activity_list .list .names { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: .3rem; line-height: 1; color: #333 } .activity_list .list .time { margin-top: .1rem; font-size: .22rem; line-height: 1em; color: #999 } .activity_list .list .time .iconfont { margin-right: .1rem; font-size: .22rem } .activity_list .list .group { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; margin-top: .44rem; font-size: .22rem; line-height: 1em; color: #999 } .activity_list .list .group .money { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; font-size: .24rem; color: #FF6B00 } .activity_list .list .group .money .num { font-size: .32rem } .activity_list .tips { text-align: center; color: #999 } .promotion .header { height: 3.6rem; background: #2c8eff url(img/b16_b3c17e1c94.png) center/cover no-repeat } .promotion .header .cont { position: relative; height: 2.97rem; line-height: 2.97rem; text-align: center } .promotion .header .text { display: inline-block; vertical-align: middle; font-size: .28rem; line-height: 1; color: #fff } .promotion .header .money { margin-top: .3rem; margin-bottom: .45rem; font-weight: bold; font-size: .74rem } .promotion .header .link { color: #fff } .promotion .header .link .iconfont { margin-left: .1rem; font-size: .2rem } .promotion .header .btn { position: absolute; top: .74rem; right: 0; height: .54rem; padding-right: .32rem; padding-left: .47rem; border-top-left-radius: .27rem; border-bottom-left-radius: .27rem; background-color: #feb720; font-size: .3rem; line-height: .54rem; color: #fff } .promotion .sheet { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; height: 1.4rem; border-radius: .1rem; margin: -.63rem .3rem .27rem; background-color: #fff; box-shadow: 1px .02rem .15rem 0 rgba(210, 210, 210, .14); font-size: .28rem; line-height: 1; text-align: center; color: #9a9a9a } .promotion .sheet .item { position: relative; -webkit-box-flex: 1; -webkit-flex: 1; flex: 1 } .promotion .sheet .item ~ .item { border-left: 1px solid #ebebeb } .promotion .sheet .num { margin-top: .22rem; font-weight: bold; font-size: .42rem; color: #343434 } .promotion .control .link { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; height: .98rem; padding-right: .3rem; padding-left: .32rem; background-color: #fff; font-size: .3rem; color: #282828 } .promotion .control .link ~ .link { border-top: 1px solid #f2f2f2 } .promotion .control .name { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1 } .promotion .control .iconfont { font-size: .24rem; color: #999 } .activity-verify .list { padding-left: .3rem; border-top: 1px solid #f5f5f5; border-bottom: 1px solid #f5f5f5 } .activity-verify .list .item { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; padding-top: .3rem; padding-right: .3rem; padding-bottom: .3rem } .activity-verify .list .item ~ .item { border-top: 1px solid #f5f5f5 } .activity-verify .list .name { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1 } .activity-verify .list .image { width: 2.5rem; height: 1.4rem; border-radius: .1rem; overflow: hidden } .activity-verify .list .image .img { display: block; width: 100%; height: 100%; object-fit: cover } .activity-verify .list .text { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; min-width: 0; margin-left: .2rem } .activity-verify .list .text .title { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: .28rem; line-height: 1; color: #333 } .activity-verify .list .text .time { margin-top: .2rem; font-size: .22rem; line-height: 1; color: #999 } .activity-verify .list .text .time .iconfont2 { margin-right: .1rem; font-size: .22rem } .activity-verify .list .text .group { margin-top: .4rem } .activity-verify .list .text .money { font-weight: bold; font-size: .24rem; line-height: 1; color: #ff4a4a } .activity-verify .list .text .money .num { font-size: .32rem } .activity-verify .list .value { color: #999 } .activity-verify .list .value.status { color: #2c8eff } .activity-verify .list .value.time { font-size: .28rem; color: #539dfd } .activity-verify .list .value.money { color: #ff4a4a } .activity-verify .qrcode { padding-top: 1rem; padding-bottom: 1rem } .activity-verify .qrcode .image { width: 3.54rem; height: 3.54rem; margin-right: auto; margin-left: auto } .activity-verify .qrcode .image .img { display: block; width: 100%; height: 100% } .activity-verify .qrcode .text { margin-top: .1rem; font-size: .28rem; text-align: center; color: #333 } .activity-verify .button-group { padding: 1rem .3rem } .activity-verify .button-group .button { display: block; width: 100%; height: .76rem; border-radius: .38rem; background-color: #2c8eff; font-size: .28rem; color: #fff } .gift-given .main .list .item { background-color: #fff } .gift-given .main .list .item ~ .item { margin-top: .2rem } .gift-given .main .list .head { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; height: .98rem; padding-right: .3rem; padding-left: .3rem } .gift-given .main .list .head .name { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; font-size: .3rem; color: #282828 } .gift-given .main .list .head .link { font-size: .26rem; color: #999 } .gift-given .main .list .head .link.button { width: 1.16rem; height: .48rem; border-radius: .07rem; background-color: #feb720; line-height: .48rem; text-align: center; color: #fff } .gift-given .main .list .content { display: -webkit-box; display: -webkit-flex; display: flex; padding: .3rem; border-top: 1px solid #f2f2f2 } .gift-given .main .list .content .image { width: 2.5rem; height: 1.4rem; border-radius: .1rem; overflow: hidden } .gift-given .main .list .content .img { display: block; width: 100%; height: 100%; object-fit: cover } .gift-given .main .list .content .text { position: relative; -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; margin-left: .32rem } .gift-given .main .list .content .name { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; text-overflow: ellipsis; font-size: .28rem; line-height: .36rem; color: #333 } .gift-given .main .list .content .money { position: absolute; bottom: .19rem; left: 0; font-weight: bold; font-size: .24rem; color: #ff4a4a } .gift-given .main .list .content .money .number { font-size: .32rem } .gift-given .main .tips { height: 1rem; font-size: .28rem; line-height: 1rem; text-align: center; color: #999 } .gift-given .main .tips .fa { font-size: .32rem } .store-home { padding-bottom: 1.4rem; } .store-home .carousel { position: relative; padding-top: .3rem; padding-bottom: .3rem; } .store-home .carousel .swiper-container { width: 7.1rem; height: 3.1rem; border-radius: .2rem; } .store-home .carousel .img { display: block; width: 100%; height: 100%; border-radius: .2rem; object-fit: cover; pointer-events: none; } .store-home .carousel .swiper-pagination { bottom: .08rem; left: 0; width: 100%; font-size: 0; } .store-home .carousel .swiper-pagination-bullet { width: .1rem; height: .1rem; border-radius: .05rem; margin-right: .05rem; margin-left: .05rem; background: #d6d6d6; opacity: 1; } .store-home .carousel .swiper-pagination-bullet-active { width: .2rem; background: #2c8eff; } .store-home .navigation { position: -webkit-sticky; position: sticky; top: 0; background-color: #fff; } .store-home .navigation .swiper-slide { width: auto; height: .92rem; padding-right: .25rem; padding-left: .25rem; font-size: .3rem; line-height: .92rem; color: #666; cursor: pointer; } .store-home .navigation .swiper-slide.on { font-weight: bold; font-size: .3rem; color: #2d8eff; } .store-home .navigation .swiper-slide.on::after { content: " "; position: absolute; bottom: .1rem; left: 50%; z-index: 2; width: .42rem; height: .04rem; border-radius: .02rem; background-color: #2c8eff; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .store-home .nothing { display: block; width: 4.14rem; margin: .3rem auto; pointer-events: none; -webkit-touch-callout: none; } .store-home .list { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-lines: multiple; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -webkit-justify-content: space-between; justify-content: space-between; padding-top: .3rem; padding-right: .2rem; padding-left: .2rem; } .store-home .list .item { width: 3.45rem; margin-bottom: .3rem; } .store-home .list .image { height: 3.45rem; border-radius: .1rem; overflow: hidden; } .store-home .list .image .img { display: block; width: 100%; height: 100%; object-fit: scale-down; pointer-events: none; -webkit-touch-callout: none; } .store-home .list .text { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-direction: normal; -webkit-box-orient: vertical; -webkit-flex-direction: column; flex-direction: column; -webkit-box-pack: justify; -webkit-justify-content: space-between; justify-content: space-between; height: 1.48rem; padding-top: .13rem; } .store-home .list .title { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; font-size: .28rem; line-height: .4rem; color: #343434; } .store-home .list .group { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-pack: justify; -webkit-justify-content: space-between; justify-content: space-between; -webkit-box-align: center; -webkit-align-items: center; align-items: center; } .store-home .list .price { font-size: .24rem; color: #FF6B00; } .store-home .list .price .num { font-size: .32rem; } .store-home .list .sale { font-size: .22rem; color: #aaa; } .goods-detail .header { background-color: #fff; } .goods-detail .swiper-container img { display: block; width: 100%; height: 100%; object-fit: scale-down; pointer-events: none; } .goods-detail .swiper-container .img { display: block; width: 100%; height: 100%; object-fit: cover; pointer-events: none; } .goods-detail .swiper-container .swiper-pagination-bullet { width: .1rem; height: .1rem; border-radius: .05rem; margin-right: .05rem; margin-left: .05rem; background: #d6d6d6; opacity: 1; } .goods-detail .swiper-container .swiper-pagination-bullet-active { width: .2rem; background: #2c8eff; } .goods-detail .header .text { padding-top: .25rem; padding-right: .3rem; padding-left: .3rem; } .goods-detail .header .name { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; font-size: .32rem; line-height: .5rem; color: #333; } .goods-detail .header .group { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-pack: justify; -webkit-justify-content: space-between; justify-content: space-between; -webkit-box-align: center; -webkit-align-items: center; align-items: center; height: .7rem; margin-top: .05rem; } .goods-detail .header .price, .goods-detail .header .vip-price { display: inline-block; } .goods-detail .header .price { font-size: .24rem; color: #FF6B00; } .goods-detail .header .price { font-size: .24rem; } .goods-detail .header .price .num { font-weight: bold; font-size: .32rem; } .goods-detail .header .vip-price { font-size: .28rem; color: #282828; } .goods-detail .header .vip-price .img { width: .46rem; height: .21rem; pointer-events: none; -webkit-touch-callout: none; } .goods-detail .header .sale { font-size: .24rem; color: #999; } .goods-detail .main { margin-top: .2rem; background-color: #fff; } .goods-detail .main .name { height: .96rem; box-shadow: 0 .06rem .2rem 0 rgba(51, 51, 51, .03); font-size: .3rem; line-height: .96rem; text-align: center; color: #333; } .goods-detail .main .cont { padding: .3rem; } .goods-detail .main .cont img { display: block; width: 100%; pointer-events: none; } .goods-detail .footer { position: fixed; bottom: 0; left: 0; z-index: 9; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; width: 100%; padding-right: .3rem; background-color: #fff; } .goods-detail .footer .group { display: -webkit-flex; display: flex; height: 1rem; padding-right: .15rem; padding-left: .15rem; } .goods-detail .footer .link { display: -webkit-flex; display: flex; -webkit-flex-direction: column; flex-direction: column; -webkit-justify-content: center; justify-content: center; -webkit-align-items: center; align-items: center; width: 1rem; } .goods-detail .footer .link .image { width: .4rem; height: .4rem; margin-right: auto; margin-left: auto; } .goods-detail .footer .link img { display: block; width: 100%; height: 100%; object-fit: cover; pointer-events: none; } .goods-detail .footer .link .name { margin-top: .13rem; font-size: .2rem; line-height: 100%; color: #666; } .goods-detail .footer .button { -webkit-flex: 1; flex: 1; height: .76rem; border-radius: .38rem; background-image: linear-gradient(90deg, rgba(64, 157, 255, 1) 0%, rgba(30, 133, 251, 1) 100%); font-family: inherit; font-size: .28rem; color: #fff; } .order-confirm .contact { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; min-height: 1.4rem; padding: .3rem; background: #fff url(img/b17_05bf1c84db.jpg) left top/7.49rem .03rem repeat-x; cursor: pointer; } .order-confirm .contact > div:first-child { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; } .order-confirm .contact > div > div:first-child { font-weight: bold; font-size: .3rem; color: #282828; } .order-confirm .contact span { vertical-align: middle; } .order-confirm .contact span~span { margin-left: .3rem; } .order-confirm .contact .address { margin-top: .12rem; font-size: .26rem; color: #666; } .order-confirm .contact .address span~span { margin-left: .15rem; } .order-confirm .contact .address span:first-child { color: #ff4a4a; } .order-confirm .panel { margin-top: .12rem; background-color: #fff; } .order-confirm .panel .goods { display: -webkit-box; display: -webkit-flex; display: flex; padding: .2rem .3rem; } .order-confirm .panel .goods .image { width: 2.5rem; height: 1.4rem; border-radius: .1rem; overflow: hidden; } .order-confirm .panel .goods .img { display: block; width: 100%; height: 100%; object-fit: cover; pointer-events: none; } .order-confirm .panel .goods .text { position: relative; -webkit-flex: 1; flex: 1; margin-left: .2rem; } .order-confirm .panel .goods .name { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; font-size: .28rem; line-height: .36rem; color: #343434; } .order-confirm .panel .goods .group { position: absolute; bottom: 0; left: 0; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-pack: justify; -webkit-justify-content: space-between; justify-content: space-between; -webkit-box-align: center; -webkit-align-items: center; align-items: center; width: 100%; height: .4rem; } .order-confirm .panel .goods .price, .order-confirm .panel .goods .vip-price { display: inline-block; font-weight: bold; } .order-confirm .panel .goods .price { font-size: .24rem; color: #ff5656; } .order-confirm .panel .goods .price span { font-size: .32rem; } .order-confirm .panel .goods .vip-price { font-size: .24rem; } .order-confirm .panel .goods .vip-price img { display: inline-block; width: .46rem; height: .21rem; pointer-events: none; -webkit-touch-callout: none; } .order-confirm .panel .goods .spinner { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; } .order-confirm .panel .goods .spinner button { width: .4rem; height: .4rem; font-family: inherit; font-size: .24rem; color: #282828; } .order-confirm .panel .goods .spinner button:disabled { color: #dedede; } .order-confirm .panel .goods .spinner input { width: .68rem; height: .4rem; border-radius: .02rem; background-color: #f2f2f2; font-family: inherit; font-size: .22rem; line-height: .4rem; text-align: center; color: #282828; } .order-confirm .panel .postage { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; height: .86rem; padding-right: .4rem; padding-left: .4rem; } .order-confirm .panel .remark { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; height: 1.8rem; padding-right: .4rem; padding-left: .4rem; } .order-confirm .panel .postage .name, .order-confirm .panel .remark .name { font-size: .3rem; color: #282828; } .order-confirm .panel .remark .name { -webkit-align-self: flex-start; align-self: flex-start; line-height: .46rem; } .order-confirm .panel .postage .name, .order-confirm .panel .remark .textarea { -webkit-flex: 1; flex: 1; } .order-confirm .panel .postage .value { font-size: .3rem; color: #9a9a9a; } .order-confirm .panel .remark .textarea { margin-left: .2rem; resize: none; font-family: inherit; line-height: .42rem; font-size: .28rem; } .order-confirm .panel .remark .textarea::placeholder { color: #a8a8a8; } .order-confirm .footer { position: fixed; bottom: 0; left: 0; z-index: 9; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; width: 100%; padding-right: .3rem; background-color: #fff; } .order-confirm .footer .text { -webkit-flex: 1; flex: 1; height: 1rem; font-size: .28rem; line-height: 1rem; text-align: center; color: #343434; } .order-confirm .footer .text .money { display: inline; color: #ff5656; } .order-confirm .footer .text .money span { font-size: .2rem; } .order-confirm .footer button { width: 2.4rem; height: .7rem; border-radius: .35rem; background-image: linear-gradient(90deg, rgba(64, 157, 255, 1) 0%, rgba(30, 133, 251, 1) 100%); font-family: inherit; font-size: .3rem; color: #fff; } .order-confirm .popup { position: fixed; bottom: 0; left: 0; z-index: 99; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; flex-direction: column; width: 100%; height: 9.2rem; border-top-left-radius: .16rem; border-top-right-radius: .16rem; background-color: #fff; -webkit-transform: translateY(100%); transform: translateY(100%); -webkit-transition: .3s; transition: .3s; } .order-confirm .popup.on { -webkit-transform: translateY(0); transform: translateY(0); } .order-confirm .popup .head { height: 1rem; font-weight: bold; font-size: .32rem; line-height: 1rem; text-align: center; color: #282828; } .order-confirm .popup .cont { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; -webkit-overflow-scrolling: touch; overflow: auto; } .order-confirm .popup label { display: block; padding-right: .3rem; padding-left: .3rem; } .order-confirm .popup label~label>div { border-top: 1px solid #eee; } .order-confirm .popup label>div { padding: .3rem 1.26rem .3rem .6rem; background: url(img/b18_aed9fe7d90.png) left center/.33rem no-repeat; font-size: .25rem; color: #343434; } .order-confirm .popup label div div:first-child { margin-bottom: .12rem; font-weight: bold; font-size: .28rem; color: #282828; } .order-confirm .popup input:checked+div { background: url(img/b19_52d2fa1ce6.png) left center/.33rem no-repeat, url(img/b20_6366828cff.png) right center/.28rem no-repeat; color: #2a8eff; } .order-confirm .popup .foot { padding: .56rem .3rem; } .order-confirm .popup .foot a { display: block; width: 100%; height: .86rem; border-radius: .43rem; background-color: #2a8eff; font-weight: bold; font-size: .3rem; line-height: .86rem; text-align: center; color: #fff; } .order-confirm .popup button { position: absolute; top: .5rem; right: .3rem; width: .28rem; height: .28rem; background: url(img/b21_bb2274e508.png) center/cover no-repeat; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .refund-apply .goods { display: -webkit-box; display: -webkit-flex; display: flex; padding: .3rem; background-color: #fff; } .refund-apply .goods .image { width: 2.3rem; height: 1.28rem; border-radius: .1rem; overflow: hidden; } .refund-apply .goods .img { display: block; width: 100%; height: 100%; object-fit: cover; pointer-events: none; } .refund-apply .goods .text { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; flex-direction: column; -webkit-box-pack: justify; -webkit-justify-content: space-between; justify-content: space-between; margin-right: .2rem; margin-left: .2rem; } .refund-apply .goods .name { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; font-size: .28rem; line-height: .3rem; color: #343434; } .refund-apply .goods .money { margin-top: .4rem; } .refund-apply .goods .price, .refund-apply .goods .vip-price { display: inline-block; } .refund-apply .goods .price { font-size: .26rem; color: #9a9a9a; } .refund-apply .goods .price span { font-size: .26rem; } .refund-apply .goods .vip-price { font-size: .24rem; } .refund-apply .goods .vip-price img { display: inline-block; width: .46rem; height: .21rem; pointer-events: none; -webkit-touch-callout: none; } .refund-apply .goods .number { font-size: .26rem; line-height: .3rem; color: #9a9a9a; } .refund-apply form { margin-top: .12rem; } .refund-apply .form-bd { padding-left: .3rem; background-color: #fff; } .refund-apply .form-bd>label { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; padding-top: .3rem; padding-right: .3rem; padding-bottom: .3rem; } .refund-apply .form-bd>label div:first-child { font-size: .3rem; color: #343434; } .refund-apply .form-bd>label~label { border-top: 1px solid #eee; } .refund-apply .form-bd>label input, .refund-apply .form-bd>label select { -webkit-flex: 1; flex: 1; font-family: inherit; font-size: .3rem; text-align: right; color: #666; } .refund-apply .form-bd>label select { color: #bcbcbc; } .refund-apply .form-bd>label textarea { -webkit-flex: 1; flex: 1; margin-left: .25rem; font-family: inherit; font-size: .3rem; resize: none; } .refund-apply .form-bd>label input::placeholder, .refund-apply .form-bd>label textarea::placeholder { color: #bcbcbc; } .refund-apply .form-bd>label div:nth-child(3) { margin-left: .25rem; font-size: .3rem; line-height: 1; color: #999; } .refund-apply .form-bd>label:nth-child(3) div:first-child { -webkit-align-self: flex-start; align-self: flex-start; } .refund-apply .upload { border-top: 1px solid #eee; } .refund-apply .upload>div:first-child { display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between; -webkit-align-items: center; align-items: center; padding-top: .3rem; padding-right: .3rem; padding-bottom: .3rem; font-size: .3rem; color: #343434; } .refund-apply .upload>div:first-child>div:last-child { color: #bcbcbc; } .refund-apply .upload>div:last-child { padding-right: .3rem; } .refund-apply .upload>div:last-child::after { content: " "; display: block; height: 0; clear: both; visibility: hidden; } .refund-apply .upload label { float: left; display: -webkit-flex; display: flex; -webkit-flex-direction: column; flex-direction: column; -webkit-justify-content: center; justify-content: center; -webkit-align-items: center; align-items: center; width: 1.56rem; height: 1.56rem; border: 1px solid #ddd; border-radius: .03rem; margin-right: .3rem; margin-bottom: .3rem; } .refund-apply .upload label .image { width: .47rem; height: .47rem; } .refund-apply .upload label img { display: block; width: 100%; height: 100%; pointer-events: none; } .refund-apply .upload label .text { margin-top: .15rem; font-size: .24rem; color: #bcbcbc; } .refund-apply .upload li { position: relative; float: left; width: 1.56rem; height: 1.56rem; border: 1px solid #ddd; border-radius: .03rem; margin-right: .3rem; margin-bottom: .3rem; } .refund-apply .upload li img { display: block; width: 100%; height: 100%; object-fit: cover; pointer-events: none; } .refund-apply .upload li span { position: absolute; top: 0; right: 0; z-index: 2; width: .4rem; height: .4rem; border-radius: 50%; background-color: #2c8eff; -webkit-transform: translate(25%, -25%); transform: translate(25%, -25%); font-size: .4rem; line-height: 1; color: #fff; cursor: pointer; } .refund-apply .form-ft { padding: .3rem; margin-top: .4rem; } .refund-apply .form-ft button { width: 100%; height: .86rem; border-radius: .43rem; background-color: #2c8eff; font-family: inherit; font-size: .32rem; color: #fff; } .order-detail .section { background-color: #fff; } .order-detail .section~.section { margin-top: .12rem; } .order-detail .section.return { padding: .4rem .3rem; background-color: #666; font-size: .3rem; color: #fff; } .order-detail .section.return .time { margin-top: .15rem; font-size: .24rem; } .order-detail .section.reason { padding: .4rem .3rem; font-size: .3rem; color: #333; } .order-detail .section.reason .info { margin-top: .15rem; font-size: .24rem; color: #999; } .order-detail .section.status { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; padding: .32rem .3rem; background-color: #2c8eff; font-size: .3rem; color: #fff; } .order-detail .section.status .image { width: 1.1rem; height: 1.1rem; margin-right: .3rem; } .order-detail .section.status img { display: block; width: 100%; height: 100%; object-fit: cover; pointer-events: none; } .order-detail .section.status .text { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; } .order-detail .section.status div:first-child { font-weight: bold; } .order-detail .section.status .time { margin-top: .1rem; font-size: .24rem; opacity: .8; } .order-detail .section.contact { padding: .4rem .3rem; background: #fff url(img/b22_05bf1c84db.jpg) left bottom/7.49rem .03rem repeat-x; font-size: .3rem; color: #282828; } .order-detail .section.contact span~span { margin-left: .3rem; } .order-detail .section.contact .address { margin-top: .15rem; font-size: .26rem; color: #868686; } .order-detail .section.goods .goods-bd { display: -webkit-box; display: -webkit-flex; display: flex; padding: .26rem .3rem; } .order-detail .section.goods .image { width: 2.3rem; height: 1.28rem; border-radius: .1rem; overflow: hidden; margin-right: .2rem; } .order-detail .section.goods img { display: block; width: 100%; height: 100%; object-fit: cover; pointer-events: none; } .order-detail .section.goods .text { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; flex-direction: column; -webkit-box-pack: justify; -webkit-justify-content: space-between; justify-content: space-between; } .order-detail .section.goods .name { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; font-size: .28rem; line-height: .4rem; color: #343434; } .order-detail .section.goods .price, .order-detail .section.goods .vip-price { display: inline-block; } .order-detail .section.goods .price { font-size: .26rem; color: #9a9a9a; } .order-detail .section.goods .price span { font-size: .26rem; } .order-detail .section.goods .vip-price { font-size: .24rem; } .order-detail .section.goods .vip-price img { display: inline-block; width: .46rem; height: .21rem; pointer-events: none; -webkit-touch-callout: none; } .order-detail .section.goods .num { margin-left: .2rem; font-size: .26rem; line-height: .3rem; color: #9a9a9a; } .order-detail .section.goods .goods-ft { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-pack: end; -webkit-justify-content: flex-end; justify-content: flex-end; -webkit-box-align: center; -webkit-align-items: center; align-items: center; height: .93rem; padding-right: .3rem; padding-left: .3rem; border-top: 1px solid #f0f0f0; font-size: .26rem; color: #282828; } .order-detail .section.goods .goods-ft span { font-weight: bold; font-size: .28rem; color: #ff5656; } .order-detail .section.express { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; padding: .3rem; } .order-detail .section.express .image { width: .5rem; height: .5rem; margin-right: .2rem; } .order-detail .section.express img { display: block; width: 100%; height: 100%; padding: .1rem; -webkit-box-sizing: border-box; box-sizing: border-box; background-color: #ff9600; object-fit: cover; pointer-events: none; } .order-detail .section.express .text { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; font-size: .26rem; color: #999; } .order-detail .section.express .text div~div { margin-top: .1rem; } .order-detail .section.express .text span { color: #333; } .order-detail .section.express button { width: 1.06rem; height: .4rem; border: 1px solid #999; border-radius: .03rem; font-family: inherit; font-size: .2rem; color: #666; } .order-detail .section.list { padding: .3rem; font-size: .28rem; color: #282828; } .order-detail .section.list li { display: -webkit-box; display: -webkit-flex; display: flex; } .order-detail .section.list li~li { margin-top: .3rem; } .order-detail .section.list div:nth-child(2) { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; text-align: right; color: #868686; } .order-detail .section.list div.msg { text-align: left; word-break: break-all; } .order-detail .footer { position: fixed; bottom: 0; left: 0; z-index: 9; width: 100%; padding: .2rem .3rem; background-color: #fff; overflow: hidden; white-space: nowrap; text-align: right; } .order-detail .footer a { display: inline-block; width: 1.76rem; height: .6rem; border: 1px solid #dedede; border-radius: .3rem; vertical-align: middle; font-size: .27rem; line-height: .6rem; text-align: center; color: #aaa; } .order-detail .footer a~a { margin-left: .18rem; } .order-detail .footer a.blue { border-color: #2c8eff; background-color: #2c8eff; color: #fff; } .address-list ul { padding-top: .03rem; background: url(img/b23_05bf1c84db.jpg) left top/7.49rem .03rem repeat-x; } .address-list li { padding-right: .3rem; padding-left: .3rem; background-color: #fff; } .address-list li~li { margin-top: .12rem; } .address-list .head { padding-top: .32rem; padding-bottom: .32rem; font-size: .28rem; color: #282828; } .address-list .head div:first-child { margin-bottom: .08rem; font-weight: bold; font-size: .3rem; color: #282828; } .address-list .foot { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; height: .82rem; border-top: 1px solid #eee; font-size: .28rem; color: #282828; } .address-list .foot a { color: #282828; } .address-list .foot > div { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; text-align: right; } .address-list .foot label div { padding-left: .48rem; background: url(img/b24_15ee7602f4.png) left center/.38rem .38rem no-repeat; } .address-list .foot input:checked + div { background-image: url(img/b25_773fa0945d.png); } .address-list .foot a~a { margin-left: .5rem; } .address-list .foot a img { width: .38rem; height: .38rem; vertical-align: middle; object-fit: cover; pointer-events: none; } .address-list .footer { position: fixed; bottom: 0; left: 0; z-index: 9; display: flex; align-items: center; width: 100%; padding: .15rem .3rem; background-color: #fff; } .address-list .footer a { flex: 1; height: .76rem; border-radius: .38rem; background-color: #2a8eff; vertical-align: middle; font-size: .3rem; line-height: .76rem; text-align: center; color: #fff; } .address-list .footer a:nth-child(2) { margin-left: .3rem; background-color: #feb720; } .address-list .footer img { width: .36rem; height: .36rem; margin-right: .1rem; vertical-align: middle; object-fit: cover; pointer-events: none; } .address-list .footer a:nth-child(2) img { width: auto; } .address-list .footer span { vertical-align: middle; } .address-list .nothing { display: block; width: 4.14rem; margin: .3rem auto; pointer-events: none; -webkit-touch-callout: none; } .add-address .section { background-color: #fff; } .add-address .section~.section { margin-top: .23rem; } .add-address label { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; height: .9rem; padding-right: .3rem; padding-left: .3rem; font-size: .3rem; } .add-address label~label { border-top: 1px solid #eee; } .add-address label div { width: 2.2rem; color: #343434; } .add-address label img { width: auto; height: .38rem; pointer-events: none; -webkit-touch-callout: none; } .add-address input::placeholder, .add-address textarea::placeholder { color: #ccc; } .add-address input, .add-address textarea { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; font-family: inherit; font-size: .3rem; color: #333; } .add-address textarea { resize: none; } .add-address .checkbox { width: .42rem; height: .42rem; margin-right: .25rem; } .add-address img { display: block; width: 100%; height: 100%; object-fit: cover; pointer-events: none; } .add-address .btn { padding: .3rem; margin-top: .2rem; } .add-address button { width: 100%; height: .86rem; border-radius: .43rem; background-color: #2a8eff; font-family: inherit; font-size: .32rem; color: #fff; } .add-address button ~ button { margin-top: .5rem; } .add-address button[type="button"] { background-color: #feb720; } .add-address button img { display: inline-block; width: auto; height: .32rem; margin-right: .15rem; vertical-align: middle; } .order-list .header { height: 2.6rem; background-color: #2c8eff; } .order-list .header .cont { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; height: 1.9rem; padding-right: .3rem; padding-left: .3rem; } .order-list .header .text { -webkit-flex: 1; flex: 1; } .order-list .header .text > div:first-child { font-weight: bold; font-size: .34rem; color: #fff; } .order-list .header span { vertical-align: middle; font-size: .26rem; color: #fff; opacity: .8; } .order-list .header span~span { margin-left: .3rem; } .order-list .header .image { width: 1.22rem; height: 1.09rem; } .order-list .header img { display: block; width: 100%; height: 100%; object-fit: cover; pointer-events: none; } .order-list .main { padding-right: .3rem; padding-left: .3rem; margin-top: -.7rem; } .order-list .menu { display: -webkit-box; display: -webkit-flex; display: flex; border-radius: .06rem; background-color: #fff; } .order-list .menu li { position: relative; -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; min-width: 0; padding-top: .3rem; padding-bottom: .3rem; overflow: hidden; font-size: .26rem; text-align: center; color: #282828; cursor: pointer; } .order-list .menu div:first-child { margin-bottom: .3rem; } .order-list .menu .on { font-weight: bold; } .order-list .menu .on::after { content: " "; position: absolute; bottom: 0; left: 50%; z-index: 2; width: .78rem; height: .05rem; background-color: #2c8eff; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .order-list .list { margin-top: .14rem; } .order-list .list li { border-radius: .06rem; background-color: #fff; } .order-list .list li~li { margin-top: .14rem; } .order-list .list .head { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; height: .84rem; padding-right: .3rem; padding-left: .3rem; font-size: .28rem; color: #282828; } .order-list .list .head div:first-child { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; } .order-list .list .head div:last-child { color: #2c8eff; } .order-list .list .cont { padding-left: .3rem; border-top: 1px solid #eee; } .order-list .list .cont .goods-group { padding-top: .3rem; padding-right: .3rem; padding-bottom: .3rem; } .order-list .list .cont .goods { display: -webkit-box; display: -webkit-flex; display: flex; } .order-list .list .cont .image { width: 2.3rem; height: 1.28rem; border-radius: .1rem; overflow: hidden; } .order-list .list .cont img { display: block; width: 100%; height: 100%; object-fit: cover; pointer-events: none; -webkit-touch-callout: none; } .order-list .list .cont .text { position: relative; -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; flex-direction: column; -webkit-box-pack: justify; -webkit-justify-content: space-between; justify-content: space-between; margin-right: .2rem; margin-left: .2rem; } .order-list .list .cont .name { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; font-size: .28rem; line-height: .4rem; color: #343434; } .order-list .list .cont .money { font-size: 0; } .order-list .list .cont .price, .order-list .list .cont .vip-price { display: inline-block; } .order-list .list .cont .price { font-size: .26rem; color: #9a9a9a; } .order-list .list .cont .vip-price { margin-left: .05rem; } .order-list .list .cont .vip-price span { font-size: .24rem; } .order-list .list .cont .vip-price img { display: inline-block; width: .46rem; height: .21rem; pointer-events: none; -webkit-touch-callout: none; } .order-list .list .cont .num { font-size: .26rem; line-height: .3rem; color: #9a9a9a; } .order-list .list .cont .sum { margin-top: .3rem; font-size: .26rem; text-align: right; color: #282828; } .order-list .list .cont .sum span { font-weight: bold; font-size: .28rem; color: #ff5656; } .order-list .list .cont .btn { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-pack: end; -webkit-justify-content: flex-end; justify-content: flex-end; -webkit-box-align: center; -webkit-align-items: center; align-items: center; height: 1.06rem; padding-right: .3rem; border-top: 1px solid #eee; } .order-list .list .cont .btn a { width: 1.76rem; height: .6rem; border: 1px solid #ddd; border-radius: .3rem; font-size: .27rem; line-height: .6rem; text-align: center; color: #aaa; } .order-list .list .cont .btn a~a { margin-left: .18rem; } .order-list .list .cont .btn .blue { border-color: #2c8eff; background-color: #2c8eff; color: #fff; } .order-list .nothing { display: block; width: 4.14rem; margin: .3rem auto; pointer-events: none; -webkit-touch-callout: none; } .quick { position: fixed; right: .3rem; z-index: 9999; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .quick .main { width: .86rem; height: .86rem; border-radius: 50%; cursor: pointer; } .quick .main img { display: block; width: 100%; height: 100%; border-radius: 50%; -webkit-transform: rotate(90deg); transform: rotate(90deg); pointer-events: none; -webkit-touch-callout: none; } .quick .menu { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; align-items: center; height: .86rem; padding-right: .16rem; padding-left: .16rem; border-radius: .43rem; margin-right: .3rem; background-color: #2C8EFF; overflow: hidden; opacity: 1; -webkit-animation: bounceInRight .5s cubic-bezier(.215, .61, .355, 1); animation: bounceInRight .5s cubic-bezier(.215, .61, .355, 1); } .quick .menu a { width: .52rem; height: .52rem; } .quick .menu a ~ a { margin-left: .5rem; } .quick .menu img { display: block; width: 100%; height: 100%; pointer-events: none; -webkit-touch-callout: none; } @-webkit-keyframes bounceInRight { 0%, 60%, 75%, 90%, 100% { -webkit-animation-timing-function: cubic-bezier(.215,.61,.355,1); animation-timing-function: cubic-bezier(.215,.61,.355,1); } 0% { opacity: 0; -webkit-transform: translate3d(3000px,0,0); transform: translate3d(3000px,0,0); } 60% { opacity: 1; -webkit-transform: translate3d(-25px,0,0); transform: translate3d(-25px,0,0); } 75% { -webkit-transform: translate3d(10px,0,0); transform: translate3d(10px,0,0); } 90% { -webkit-transform: translate3d(-5px,0,0); transform: translate3d(-5px,0,0); } 100% { -webkit-transform: translateZ(0); transform: translateZ(0); } } @keyframes bounceInRight { 0%, 60%, 75%, 90%, 100% { -webkit-animation-timing-function: cubic-bezier(.215,.61,.355,1); animation-timing-function: cubic-bezier(.215,.61,.355,1); } 0% { opacity: 0; -webkit-transform: translate3d(3000px,0,0); transform: translate3d(3000px,0,0); } 60% { opacity: 1; -webkit-transform: translate3d(-25px,0,0); transform: translate3d(-25px,0,0); } 75% { -webkit-transform: translate3d(10px,0,0); transform: translate3d(10px,0,0); } 90% { -webkit-transform: translate3d(-5px,0,0); transform: translate3d(-5px,0,0); } 100% { -webkit-transform: translateZ(0); transform: translateZ(0); } } .task-info .ml15 { margin-left: 0.15rem; } .task-info .videoBox { padding: 0.25rem 0; box-sizing: border-box; border-bottom: 1px solid #f5f5f5; } .task-info .video_tit { width: 100%; height: 1.6rem; background: #fff; padding: 0.3rem 0.2rem; } .task-info .video_tit_top { font-weight: 400; font-size: .36rem; line-height: .5rem; } .task-info .video_tit_down { margin-top: .09rem; font-weight: 400; font-size: .24rem; color: #999; } .task-info .video_tab { position: relative; margin-top: .16rem; background-color: #fff; box-shadow: 0 .06rem .2rem rgba(0, 0, 0, .03); } .task-info .video_tab .item { position: relative; -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; height: .96rem; font-size: .3rem; line-height: .96rem; text-align: center; color: #333; } .task-info .video_tab .item.on { font-weight: 500; font-size: .32rem; color: #2c8eff; } .task-info .video_tab .item.on::after { content: " "; position: absolute; bottom: 0; left: 50%; width: .6rem; height: .04rem; border-radius: .02rem; background-color: #2c8eff; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .task-info .video_list_img { width: 2.18rem; height: 1.3rem; border-radius: 0.1rem; } .task-info .video_list_img img { width: 100%; height: 100%; } .task-info .video_list_on { width: 0.3rem; height: 0.23rem; border-radius: 5px; overflow: hidden; } .task-info .video_list_box { margin-left: 0.26rem; width: 62%; } .task-info .video_list_tit { height: 0.9rem; } .task-info .video_list_on img { width: 100%; height: 100%; } .task-info .video_list_sp { color: #999999; font-size: 0.26rem; } .task-info .video_list_btn { width: auto; height: auto; border: 1px solid #509efb; color: #509efb; font-size: 0.22rem; padding: 0.05rem 0.1rem; box-sizing: border-box; border-radius: 3px; } .task-info .content { padding: .3rem; background-color: #fff; font-size: .3rem; line-height: .44rem; color: #333; word-break: break-all; } .task-info .content img { display: block; width: 100%; pointer-events: none; -webkit-touch-callout: none; } .task-info .catalogue li { position: relative; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; height: 1.02rem; padding-right: .3rem; padding-left: .3rem; cursor: pointer; } .task-info .catalogue li::before { content: " "; position: absolute; top: 0; right: .3rem; left: 1.1rem; height: 1px; border-top: 1px solid #f5f5f5; color: #f5f5f5; -webkit-transform-origin: center top; transform-origin: center top; -webkit-transform: scaleY(.5); transform: scaleY(.5); } .task-info .catalogue li:first-child::before { display: none; } .task-info .catalogue li.gray { color: #999; } .task-info .catalogue .image { width: .38rem; height: .27rem; } .task-info .catalogue .image .img { display: block; width: 100%; height: 100%; pointer-events: none; } .task-info .catalogue .title { -webkit-flex: 1; flex: 1; min-width: 0; margin-right: .2rem; margin-left: .2rem; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-weight: 400; font-size: .28rem; } .task-info .catalogue .free { padding-right: .21rem; padding-left: .21rem; border-radius: .19rem; background-color: rgba(254, 183, 32, .1); font-weight: 400; font-size: .22rem; line-height: .38rem; color: #FF6B00; } .task-info .catalogue .iconsuozi,.task-info .catalogue .iconziyuan2 { font-size: .3rem; color: #ccc; } .task-info .catalogue { background-color: #fff; } .task-info .banner img { display: block; width: 100%; height: 100%; object-fit: cover; pointer-events: none; -webkit-touch-callout: none; } .task-info .intro { padding: .3rem; background-color: #fff; font-size: .24rem; line-height: .44rem; color: #999; } .task-info .intro div:first-child { margin-bottom: .1rem; font-size: .36rem; color: #333; } .task-info .audio-custom { padding-bottom: .49rem; background-color: #fff; } .task-info .audio-custom .progress { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; margin-right: .3rem; margin-left: .3rem; } .task-info .audio-custom .progress .time { width: .75rem; font-weight: 400; font-size: .28rem; line-height: .4rem; color: #2c8eff; } .task-info .audio-custom .progress .bar { -webkit-flex: 1; flex: 1; border-radius: .02rem; background-color: rgba(44, 142, 255, .3); margin-right: .18rem; margin-left: .18rem; } .task-info .audio-custom .progress .bar .range { position: relative; height: .04rem; border-radius: .02rem; background-color: rgba(44, 142, 255, .8); -webkit-transition: .2s linear; transition: .2s linear; } .task-info .audio-custom .progress .bar .range .dot { position: absolute; top: 50%; left: 100%; width: .16rem; height: .16rem; border-radius: 50%; background-color: #2c8eff; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .task-info .audio-custom .control { display: -webkit-flex; display: flex; -webkit-justify-content: center; justify-content: center; -webkit-align-items: center; align-items: center; margin-top: .34rem; } .task-info .audio-custom .control .iconfont { font-size: .36rem; color: #46505b; } .task-info .audio-custom .control button:nth-child(2) { margin-right: .88rem; margin-left: .88rem; } .task-info .audio-custom .control .icon { font-size: 1.1rem; } .news-list-page { padding-top: .3rem; } .news-list-page li ~ li { margin-top: .5rem; } .news-list-page li a { display: -webkit-box; display: -webkit-flex; display: flex; padding-right: .2rem; padding-left: .2rem; } .news-list-page .text { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column; -webkit-box-pack: justify; justify-content: space-between; padding-top: .05rem; padding-bottom: .05rem; margin-right: .35rem; } .news-list-page .name { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; font-size: .3rem; line-height: .41rem; color: #282828; } .news-list-page img { width: 2.55rem; height: 1.7rem; border-radius: .1rem; object-fit: cover; pointer-events: none; } .news-list-page .wrap { display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; } .news-list-page .hot-wrap { -webkit-box-flex: 1; flex: 1; } .news-list-page .hot { display: inline-block; height: .34rem; padding-right: .1rem; padding-left: .1rem; border-radius: .04rem; background-color: #FFF0E5; vertical-align: middle; font-size: .22rem; line-height: .34rem; text-align: center; color: #FF6B00; } .news-list-page .hot ~ .hot { margin-left: .14rem; } .news-list-page .browse { font-size: .26rem; line-height: .37rem; color: #999999; } .news-list-page .iconfont { margin-right: .08rem; font-size: .3rem; } .news-list-page .prompt { margin-top: .46rem; font-size: .22rem; line-height: .3rem; text-align: center; color: #CCCCCC; } .news-list-page .empty { position: absolute; top: 50%; left: 50%; width: 4.14rem; height: 3.36rem; pointer-events: none; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .news-detail-page { padding: .32rem .3rem .6rem; } .news-detail-page .title { font-size: .33rem; line-height: .49rem; color: #282828; } .news-detail-page .wrap { -webkit-box-align: center; align-items: center; margin-top: .26rem; } .news-detail-page .type { height: .4rem; padding-right: .1rem; padding-left: .1rem; border: 1px solid #FF6B00; border-radius: .03rem; background-color: #FFF0E5; font-size: .24rem; line-height: .4rem; text-align: center; color: #FF6B00; } .news-detail-page .time { margin-right: .27rem; font-size: .24rem; line-height: .33rem; color: #999999; } .news-detail-page .iconshijian11 { margin-right: .07rem; font-size: .22rem; color: #8A8A8A; } .news-detail-page .browse { margin-right: .21rem; font-size: .24rem; line-height: .33rem; color: #999999; } .news-detail-page .iconliulanliang { margin-right: .08rem; font-size: .24rem; color: #8A8A8A; } .news-detail-page .detail { padding-top: .38rem; border-top: 1px solid #EEEEEE; margin-top: .34rem; } .news-detail-page .detail img { width: 100%; } .group-list-page { min-height: 4.8rem; padding-top: 3.82rem; background-position: center top; background-size: 100%; background-repeat: no-repeat; } .group-list-page ul { padding-right: .3rem; padding-bottom: .6rem; padding-left: .3rem; } .group-list-page li ~ li { margin-top: .2rem; } .group-list-page li a { display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; padding: .2rem; border-radius: .1rem; background-color: #FFFFFF; } .group-list-page li img { width: 2.8rem; height: 1.57rem; border-radius: .1rem; object-fit: cover; pointer-events: none; -webkit-touch-callout: none; } .group-list-page .text { -webkit-box-flex: 1; flex: 1; min-width: 0; margin-left: .2rem; } .group-list-page .name { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: .3rem; line-height: .42rem; color: #282828; } .group-list-page .info { display: inline-block; height: .3rem; padding-right: .15rem; padding-left: .11rem; border-radius: .15rem; margin-top: .1rem; background-color: #FFF0E5; vertical-align: middle; font-size: .2rem; line-height: .3rem; color: #FF6B00; } .group-list-page .people { position: relative; display: inline-block; padding-right: .07rem; } .group-list-page .people::after { content: ""; position: absolute; top: 50%; right: 0; width: 1px; height: .12rem; background-color: rgba(255, 107, 0, .5); -webkit-transform: translateY(-50%); transform: translateY(-50%); } .group-list-page .people .iconfont { margin-right: .05rem; font-size: .18rem; } .group-list-page .wrap { display: -webkit-box; display: flex; -webkit-box-pack: justify; justify-content: space-between; -webkit-box-align: center; align-items: center; margin-top: .26rem; } .group-list-page .money { font-weight: bold; font-size: .24rem; color: #FF6B00; } .group-list-page .money span { font-size: .36rem; line-height: .5rem; } .group-list-page .button { width: 1.26rem; height: .44rem; border-radius: .22rem; background: linear-gradient(90deg, #409DFF 0%, #1E85FB 100%); font-size: .24rem; line-height: .44rem; text-align: center; color: #FFFFFF; } .group-list-page .empty { position: absolute; top: calc(50% + 2.4rem); left: 50%; width: 4.14rem; height: 3.36rem; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .source-detail-page .head { background-color: #FFFFFF; } .source-detail-page .head img { display: block; width: 100%; height: 4.2rem; object-fit: cover; pointer-events: none; } .source-detail-page .foot { position: fixed; bottom: 0; left: 0; z-index: 99; display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; width: 100%; height: 1rem; padding-right: .35rem; padding-left: .5rem; border-top: 1px solid #EEEEEE; background-color: #FFFFFF; } .source-detail-page .foot .link { font-size: .18rem; line-height: .25rem; text-align: center; color: #666666; cursor: pointer; } .source-detail-page .foot .link ~ .link { margin-left: .6rem; } .source-detail-page .foot img { height: .34rem; margin-bottom: .09rem; } .source-detail-page .foot .button { -webkit-box-flex: 1; flex: 1; min-width: 0; height: .76rem; border-radius: .38rem; margin-left: .55rem; background: linear-gradient(90deg, #409DFF 0%, #1E85FB 100%); font-size: .28rem; line-height: .76rem; text-align: center; color: #FFFFFF; cursor: pointer; } .source-detail-page .dialog { position: fixed; right: 0; bottom: 0; left: 0; z-index: 1002; height: 9.14rem; padding: .3rem .3rem 1.3rem .3rem; border-top-left-radius: .2rem; border-top-right-radius: .2rem; background-color: #FFFFFF; overflow: auto; -webkit-overflow-scrolling: touch; -webkit-transform: translateY(100%); transform: translateY(100%); -webkit-transition: -webkit-transform .3s ; transition: -webkit-transition .3s; transition: transform .3s; transition: transform .3s, -webkit-transition .3s; } .source-detail-page .dialog.active { -webkit-transform: translateY(0); transform: translateY(0); } .source-detail-page .mask { z-index: 1001; background-color: rgba(0, 0, 0, .5); } .source-detail-page .dialog li ~ li { margin-top: .23rem; } .source-detail-page .dialog a { display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; } .source-detail-page .dialog .figure { position: relative; } .source-detail-page .dialog img { display: block; width: 2.5rem; height: 1.4rem; border-radius: .1rem; object-fit: cover; pointer-events: none; -webkit-touch-callout: none; } .source-detail-page .dialog .figure span { position: absolute; right: .1rem; bottom: .1rem; width: .66rem; height: .34rem; border-radius: .03rem; background-color: rgba(0, 0, 0, .5); font-size: .22rem; line-height: .34rem; text-align: center; color: #FFFFFF; } .source-detail-page .dialog .figcaption { -webkit-box-flex: 1; flex: 1; min-width: 0; margin-left: .17rem; } .source-detail-page .dialog .title { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: .3rem; line-height: .42rem; color: #333333; } .source-detail-page .dialog .mark { margin-top: .08rem; font-size: 0; } .source-detail-page .dialog .mark span { display: inline-block; height: .4rem; padding-right: .1rem; padding-left: .1rem; border-radius: .1rem; background-color: rgba(44, 142, 255, .06); font-size: .2rem; line-height: .4rem; color: #2C8EFF; } .source-detail-page .dialog .mark span ~ span { margin-left: .17rem; } .source-detail-page .dialog .info { display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; margin-top: .22rem; } .source-detail-page .dialog .money { font-weight: bold; font-size: .24rem; color: #FF6B00; } .source-detail-page .dialog .money span { font-size: .32rem; line-height: .45rem; } .source-detail-page .dialog .lesson { -webkit-box-flex: 1; flex: 1; min-height: 0; margin-left: .09rem; font-size: .22rem; color: #999999; } .source-detail-page .dialog .learn { font-size: .22rem; color: #999999; } .indexNew .thematic-details { position: fixed; top: 0; left: 0; z-index: 9; width: 100%; height: .8rem; background-color: rgba(0, 0, 0, .32); } .indexNew .index .studyCourse .title .more { font-size: 0.25rem; color: #999; display: inherit; } .indexNew .index .studyCourse .title .titleCon { width: 4rem; } .indexNew .free { font-weight: 400; font-size: .24rem; color: #FF6B00; } .indexNew .news { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; padding: .24rem .2rem; background-color: #fff; margin-top: 0.14rem; } .indexNew .news .pictrue { width: 1.24rem; margin-right: .2rem; } .indexNew .news .pictrue img { display: block; width: 100%; pointer-events: none; -webkit-touch-callout: none; } .indexNew .news .swiper-container { -webkit-flex: 1; flex: 1; height: .4rem; } .indexNew .news .swiper-slide a { display: block; height: .4rem; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-weight: 400; font-size: .28rem; line-height: .4rem; } .indexNew .teacher { padding-bottom: .4rem; margin-top: .14rem; background-color: #FFFFFF; } .indexNew .teacher .teacher-hd { display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; padding: .15rem .2rem .3rem; } .indexNew .teacher .teacher-hd .name { -webkit-box-flex: 1; flex: 1; font-weight: bold; font-size: .32rem; line-height: .45rem; color: #333333; } .indexNew .teacher .teacher-hd .link { font-size: .22rem; color: #999999; } .indexNew .teacher .teacher-hd .iconfont { margin-left: .13rem; font-size: .22rem; } .indexNew .teacher .swiper-slide { width: 2rem; padding-bottom: .3rem; border-radius: .1rem; background-color: #F9FAFC; } .indexNew .teacher .swiper-slide .img { display: block; width: 1.1rem; height: 1.1rem; border-radius: 50%; margin: .3rem auto 0; object-fit: cover; pointer-events: none; -webkit-touch-callout: none; } .indexNew .teacher .swiper-slide .name { padding-right: .33rem; padding-left: .33rem; margin-top: .15rem; font-size: .3rem; line-height: .42rem; text-align: center; color: #282828; } .indexNew .teacher .swiper-slide .info { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; width: 100%; padding: 0 .27rem; margin-top: .12rem; overflow: hidden; font-size: .24rem; text-align: center; color: #999; } .indexNew .teacher .swiper-slide .label { margin-top: .1rem; font-size: 0; text-align: center; } .indexNew .teacher .swiper-slide .label .cell { display: inline-block; height: .34rem; padding: 0 .12rem; border-radius: .04rem; background-color: #FFF0E5; font-size: .22rem; line-height: .34rem; color: #FF6B00; } .indexNew .teacher .swiper-slide .explain { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; padding: 0 .33rem; margin-top: .19rem; overflow: hidden; font-size: .22rem; line-height: .39rem; text-align: center; color: #999999; } .indexNew .news-section { margin-top: .14rem; background-color: #FFFFFF; } .indexNew .news-section .title { display: -webkit-box; display: flex; -webkit-box-pack: justify; justify-content: space-between; -webkit-box-align: center; align-items: center; padding: .32rem .25rem .3rem .2rem; font-weight: bold; font-size: .32rem; line-height: .45rem; color: #333333; } .indexNew .news-section .title .link { font-weight: normal; font-size: .22rem; line-height: .3rem; color: #999999; } .indexNew .news-section .title .iconfont { margin-left: .13rem; font-size: .14rem; color: #8A8A8A; } .indexNew .news-section .list { padding-bottom: .3rem; overflow: hidden; } .indexNew .news-section .list .link { display: -webkit-box; display: flex; padding-right: .2rem; padding-left: .2rem; } .indexNew .news-section .list .link ~ .link { margin-top: .3rem; } .indexNew .news-section .list .text { -webkit-box-flex: 1; flex: 1; display: -webkit-box; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column; -webkit-box-pack: justify; justify-content: space-between; min-width: 0; padding: .05rem .35rem .05rem 0; } .indexNew .news-section .list .img { width: 2.55rem; height: 1.7rem; border-radius: .1rem; object-fit: cover; } .indexNew .news-section .list .name { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; text-overflow: ellipsis; font-size: .28rem; line-height: .4rem; color: #333333; } .indexNew .news-section .list .wrap { display: -webkit-box; display: flex; -webkit-box-pack: justify; justify-content: space-between; -webkit-box-align: center; align-items: center; } .indexNew .news-section .list .hot { height: .34rem; padding-right: .1rem; padding-left: .1rem; border-radius: .04rem; background-color: #FFF0E5; font-size: .22rem; line-height: .34rem; text-align: center; color: #FF6B00; } .indexNew .news-section .list .browse { font-size: .22rem; line-height: normal; color: #999999; } .indexNew .news-section .list .iconfont { margin-right: .08rem; vertical-align: middle; font-size: .3rem; } .indexNew .group-section { margin-top: .14rem; background-color: #FFFFFF; } .indexNew .group-section .title { display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; padding: .3rem .2rem; } .indexNew .group-section .title .name { padding-right: .21rem; padding-left: .5rem; background: url(img/b26_c7f5524e45.png) left center/.38rem .38rem no-repeat; font-weight: bold; font-size: .32rem; line-height: .45rem; color: #333333; } .indexNew .group-section .title .wrap { -webkit-box-flex: 1; flex: 1; display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; min-width: 0; padding-left: .22rem; border-left: 1px solid #DCDCDC; font-size: .26rem; color: #999999; } .indexNew .group-section .title .img-wrap { margin-right: .1rem; font-size: 0; } .indexNew .group-section .title .img { width: .33rem; height: .33rem; border: 1px solid #FFFFFF; border-radius: 50%; -webkit-box-sizing: border-box; box-sizing: border-box; background-color: #FF8A8A; object-fit: cover; pointer-events: none; -webkit-touch-callout: none; } .indexNew .group-section .title .img ~ .img { margin-left: -.11rem; } .indexNew .group-section .title .link { font-size: .22rem; line-height: .3rem; color: #999999; } .indexNew .group-section .title .iconfont { margin-left: .13rem; font-size: .14rem; color: #8A8A8A; } .indexNew .group-section .swiper-container { padding-bottom: .3rem; } .indexNew .group-section .swiper-slide { width: 4.1rem; } .indexNew .group-section .swiper-slide .link { display: block; } .indexNew .group-section .swiper-slide .img { display: block; width: 4.1rem; height: 2.31rem; border-radius: .1rem; object-fit: cover; pointer-events: none; -webkit-touch-callout: none; } .indexNew .group-section .swiper-slide .name { padding-right: .1rem; margin-top: .14rem; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: .28rem; line-height: .4rem; color: #333333; } .indexNew .group-section .swiper-slide .wrap { display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; padding-right: .1rem; margin-top: .2rem; } .indexNew .group-section .swiper-slide .pin { width: .3rem; height: .3rem; border-radius: .04rem; background-color: #FF6B00; font-size: .22rem; line-height: .3rem; text-align: center; color: #FFFFFF; } .indexNew .group-section .swiper-slide .money { -webkit-box-flex: 1; flex: 1; min-width: 0; margin-left: .02rem; font-weight: bold; font-size: .24rem; color: #FF6B00; } .indexNew .group-section .swiper-slide .money span { font-size: .32rem; line-height: .45rem; } .indexNew .group-section .swiper-slide .button { width: 1rem; height: .44rem; border-radius: .22rem; background: linear-gradient(90deg, #409DFF 0%, #1E85FB 100%); font-size: .22rem; line-height: .44rem; text-align: center; color: #FFFFFF; } .source-detail-page .cover { display: block; width: 100%; object-fit: cover; pointer-events: none; -webkit-touch-callout: none; } .source-detail-page .title-wrap { padding-top: .25rem; padding-right: .3rem; padding-left: .3rem; } .source-detail-page .title-wrap .title { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; font-size: .32rem; line-height: .5rem; color: #333333; } .source-detail-page .title-wrap .wrap { display: -webkit-box; display: flex; -webkit-box-pack: justify; justify-content: space-between; -webkit-box-align: end; align-items: flex-end; padding-top: .18rem; padding-bottom: .18rem; } .source-detail-page .title-wrap .learn { font-size: .22rem; line-height: .45rem; color: #999999; } .source-detail-page .title-wrap .share { font-size: .26rem; line-height: .37rem; text-align: center; color: #999999; cursor: pointer; } .source-detail-page .title-wrap .iconfenxiang { margin-bottom: .13rem; font-size: .4rem; color: #707070; } .source-detail-page .main { border-top: .14rem solid #F5F5F5; } .source-detail-page .main .title { padding-top: .25rem; padding-bottom: .26rem; padding-left: .28rem; box-shadow: 0 .06rem .2rem rgba(0, 0, 0, .03); font-weight: bold; font-size: .32rem; line-height: .45rem; color: #282828; } .source-detail-page .main .wrap { padding: .3rem .3rem 1.3rem; } .source-detail-page .main .wrap img { display: block; width: 100%; pointer-events: none; -webkit-touch-callout: none; } .source-detail-page .footer { position: fixed; right: 0; bottom: 0; left: 0; z-index: 1001; display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; height: 1rem; padding-right: .35rem; padding-left: .5rem; border-top: 1px solid #EEEEEE; background-color: #FFFFFF; } .source-detail-page .footer button { -webkit-box-flex: 1; flex: 1; height: .76rem; border-radius: .38rem; margin-left: .55rem; background: linear-gradient(90deg, #409DFF 0%, #1E85FB 100%); font-family: inherit; font-size: .28rem; line-height: normal; color: #FFFFFF; } .source-detail-page .footer div { font-size: .18rem; line-height: .36rem; text-align: center; color: #666666; } .source-detail-page .footer div ~ div { margin-left: .6rem; cursor: pointer; } .source-detail-page .footer img { display: block; height: .4rem; margin: 0 auto; pointer-events: none; -webkit-touch-callout: none; } .source-detail-page .share-mask { position: fixed; top: 0; left: 0; z-index: 1003; width: 100%; height: 100%; cursor: pointer; } .source-detail-page .progress { display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; padding-top: .25rem; padding-right: .3rem; padding-left: .3rem; } .source-detail-page .progress .time { width: .8rem; font-size: .28rem; line-height: .4rem; color: #2C8EFF; } .source-detail-page .progress .time:last-child { text-align: right; } .source-detail-page .progress .track { -webkit-box-flex: 1; flex: 1; height: .04rem; border-radius: .02rem; margin-right: .16rem; margin-left: .16rem; background-color: rgba(44, 142, 255, .3); } .source-detail-page .progress .range { position: relative; width: 50%; height: 100%; background-color: rgba(44, 142, 255, .8); cursor: pointer; } .source-detail-page .progress .thumb { position: absolute; top: -.06rem; right: -.06rem; width: .16rem; height: .16rem; border-radius: 50%; background-color: #2C8EFF; } .source-detail-page .handle-wrap { display: -webkit-box; display: flex; -webkit-box-pack: center; justify-content: center; -webkit-box-align: center; align-items: center; padding-top: .35rem; padding-bottom: .5rem; } .source-detail-page .handle-wrap .iconfont { font-size: .36rem; color: #CCCCCC; } .source-detail-page .handle-wrap button:disabled .iconfont { color: #46505B; } .source-detail-page .handle-wrap button:nth-child(2) { margin-right: .88rem; margin-left: .88rem; } .source-detail-page .handle-wrap svg { font-size: 1.1rem; } .source-detail-page .empty { position: absolute; top: 50%; left: 50%; width: 4.14rem; height: 3.36rem; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .member-page { min-height: 5.1rem; background: url(img/b27_7bfd972ca3.webp) center top/100% no-repeat; } .member-page .user-section { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; padding: .7rem .3rem .5rem; } .member-page .user-section .img { width: .9rem; height: .9rem; border: 2px solid #FFF5E8; border-radius: 50%; background-color: #E8D8B1; -webkit-box-sizing: border-box; box-sizing: border-box; object-fit: cover; pointer-events: none; -webkit-touch-callout: none; } .member-page .user-section .text-wrap { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; min-width: 0; margin-right: .2rem; margin-left: .2rem; } .member-page .user-section .name { font-weight: bold; font-size: .32rem; line-height: .45rem; color: #FFFFFF; } .member-page .user-section .info { font-size: .24rem; line-height: .33rem; color: rgba(255, 255, 255, .4); } .member-page .user-section .button { width: 1.74rem; height: .64rem; border: 1px solid #F9E1C2; border-radius: .32rem; font-size: .28rem; line-height: .64rem; text-align: center; color: #F9E1C2; } .member-page .power-section { padding-top: .35rem; padding-bottom: .1rem; border-radius: .16rem; margin: 0 .3rem; background-color: #FFFFFF; box-shadow: 0 .03rem .3rem rgba(223, 208, 183, .3); } .member-page .power-section .title, .member-page .card-section .title { text-align: center; } .member-page .power-section .text, .member-page .card-section .text { display: inline-block; padding-right: .45rem; padding-left: .45rem; background: url(img/b28_5539840718.png) center/100% no-repeat; vertical-align: middle; font-weight: bold; font-size: .36rem; line-height: .5rem; color: #9F620E; } .member-page .power-section .list { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; -webkit-flex-wrap: wrap; flex-wrap: wrap; } .member-page .power-section .item { -webkit-box-flex: 0 0 33.33%; -webkit-flex: 0 0 33.33%; flex: 0 0 33.33%; min-width: 0; padding-top: .5rem; padding-bottom: .5rem; } .member-page .power-section .img-wrap { width: .96rem; height: .96rem; border-radius: 50%; margin: 0 auto; background-color: #FFF5E8; line-height: .96rem; text-align: center; } .member-page .power-section .img { width: .6rem; height: .6rem; vertical-align: middle; pointer-events: none; -webkit-touch-callout: none; } .member-page .power-section .name { margin-top: .2rem; font-size: .26rem; line-height: .37rem; text-align: center; color: #282828; } .member-page .power-section .info { margin-top: .03rem; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: .21rem; line-height: .29rem; text-align: center; color: #999999; } .member-page .card-section { margin-top: .43rem; } .member-page .card-section .label-wrap { padding-right: .3rem; padding-left: .3rem; margin-top: .39rem; -webkit-overflow-scrolling: touch; overflow: auto; white-space: nowrap; font-size: 0; } .member-page .card-section .label-wrap::-webkit-scrollbar { display: none; } .member-page .card-section .label { display: inline-block; } .member-page .card-section .label ~ .label{ margin-left: .24rem; } .member-page .card-section .text-wrap { width: 2.1rem; padding-top: .36rem; padding-bottom: .29rem; border: .03rem solid #EBEBEB; border-radius: .16rem; background-color: #FFFFFF; } .member-page .card-section input:checked + .text-wrap { border-color: #EFB86D; background-color: #FFEED6; box-shadow: 0px 3px 20px rgba(219, 198, 169, 0.3); } .member-page .card-section .name { padding-left: .3rem; font-weight: bold; font-size: .3rem; line-height: .42rem; color: #9F620E; } .member-page .card-section .money { padding-left: .37rem; margin-top: .1rem; overflow: hidden; font-weight: 600; font-size: .26rem; color: #9F620E; } .member-page .card-section .money span { font-size: .58rem; line-height: .81rem; } .member-page .card-section .del { padding-left: .37rem; font-size: .24rem; line-height: .33rem; color: rgba(159, 98, 14, 1); } .member-page .card-section .free { padding-left: .37rem; font-size: .24rem; line-height: .33rem; color: rgba(159, 98, 14, 1); } .member-page .card-section .button-wrap { padding-right: .3rem; padding-left: .3rem; margin-top: 1.1rem; } .member-page .card-section .button { display: block; width: 100%; height: .94rem; border-radius: .47rem; background: linear-gradient(270deg, #EEB669 0%, #FBE1B8 100%); box-shadow: 0 .03rem .2rem rgba(235, 209, 173, .8); font-weight: bold; font-size: .34rem; color: #9F620E; } .member-page .card-section .button span { font-size: .24rem; } .member-page .card-section .exchange { margin-top: .26rem; font-size: .24rem; line-height: .33rem; text-align: center; color: #271E0F; } .member-page .card-section .exchange a { color: #80551A; } .member-page .explain-section { margin-top: .85rem; } .member-page .explain-section .title { padding-left: .55rem; font-size: .3rem; line-height: .42rem; color: #282828; } .member-page .explain-section ol { margin: .21rem .55rem .66rem .81rem; font-size: .26rem; line-height: .46rem; text-align: justify; color: #666666; list-style: decimal; } .member-page .popup-mask { position: fixed; top: 0; right: 0; bottom: 0; left: 0; background-color: #4c4c4c } .member-page .popup-active { position: fixed; top: 50%; left: 50%; width: 6rem; padding-top: .2rem; background-position: left top; background-size: 100% 100%; background-repeat: no-repeat; -webkit-transform: translate(-50%, -50%) scale(0); transform: translate(-50%, -50%) scale(0); -webkit-transition: transform .2s; transition: transform .2s } .member-page .popup-active.active { -webkit-transform: translate(-50%, -50%) scale(1); transform: translate(-50%, -50%) scale(1) } .member-page .popup-active .icon-guanbi { position: absolute; top: -.45rem; right: .3rem; font-size: .5rem; color: #fff } .member-page .popup-active .popup-hd { margin-bottom: .21rem; font-size: 0; text-align: center; } .member-page .popup-active .popup-hd .text { position: relative; display: inline-block; padding-top: .54rem; padding-right: .25rem; padding-left: .25rem; background: url(img/b29_850ec4995d.png) center top/.62rem .42rem no-repeat; font-size: .36rem; line-height: .5rem; color: #9F620E; } .member-page .popup-active .popup-hd .text::before { content: ""; position: absolute; top: 50%; right: 100%; width: .72rem; height: .02rem; margin-top: .27rem; background-color: #DEBF96; } .member-page .popup-active .popup-hd .text::after { content: ""; position: absolute; top: 50%; left: 100%; width: .72rem; height: .02rem; margin-top: .27rem; background-color: #DEBF96; } .member-page .popup-active .popup-bd { padding: .32rem .31rem 2.3rem .29rem; border-radius: .2rem; margin-right: .3rem; margin-left: .3rem; background-color: #FFFFFF; } .member-page .popup-active .popup-bd input { width: 100%; padding: .17rem .29rem; border-radius: .1rem; background-color: #f5f5f5; font-size: .3rem; line-height: .42rem } .member-page .popup-active .popup-bd input ~ input { margin-top: .24rem } .member-page .popup-active .popup-bd input::-webkit-input-placeholder, .member-page .popup-active .popup-bd input::placeholder { color: #ccc } .member-page .popup-active .popup-ft { position: absolute; bottom: 0; left: 0; width: 100%; padding: 1.54rem .5rem .4rem; background: url(img/b30_5c229ffad1.webp) center/100% 100% no-repeat; } .member-page .popup-active .popup-ft button { width: 100%; border-radius: .43rem; background-color: #9F620E; font-size: .32rem; line-height: .86rem; color: #F9E1C2 } .user-page .user-section { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; padding: .4rem .3rem .36rem .4rem; } .user-page .user-section .img { width: 1.2rem; height: 1.2rem; border: .04rem solid #EBEBEB; border-radius: 50%; object-fit: cover; } .user-page .user-section .text-wrap { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; min-width: 0; margin-right: .2rem; margin-left: .2rem; } .user-page .user-section .name { font-size: .36rem; line-height: .5rem; color: #282828; } .user-page .user-section .info { display: inline-block; height: .36rem; padding-right: .14rem; padding-left: .14rem; border-radius: .18rem; margin-top: .15rem; background-color: #FFF3E1; line-height: .36rem; } .user-page .user-section .icon { width: .23rem; height: .16rem; vertical-align: middle; } .user-page .user-section .time { margin-left: .06rem; vertical-align: middle; font-size: .2rem; color: #9F620E; } .user-page .user-section .iconxiangyou { font-size: .28rem; color: #999999; } .user-page .member-section { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; padding: .25rem .28rem .25rem .3rem; margin: 0 .3rem .2rem; background: url(img/b31_53e4c874cc.webp) center/cover no-repeat; } .user-page .member-section .img { width: .37rem; height: .41rem; } .user-page .member-section .text { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; min-width: 0; margin-right: .15rem; margin-left: .15rem; font-size: .3rem; color: #F9DCAF; } .user-page .member-section .button { width: 1.6rem; height: .5rem; border-radius: .25rem; background: linear-gradient(270deg, #EEB669 0%, #FBE1B8 100%); font-size: .24rem; line-height: .5rem; color: #9F620E; } .user-page .tool-section { border-radius: .16rem; margin: 0 .3rem .2rem; background-color: #FFFFFF; } .user-page .tool-section .title { padding-top: .2rem; padding-left: .2rem; font-size: .3rem; line-height: .42rem; color: #282828; } .user-page .tool-section .list { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; } .user-page .tool-section .item { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; min-width: 0; padding-top: .3rem; padding-bottom: .3rem; text-align: center; cursor: pointer; } .user-page .tool-section .img { height: .52rem; vertical-align: middle; pointer-events: none; -webkit-touch-callout: none; } .user-page .tool-section .text { margin-top: .12rem; font-size: .24rem; line-height: .33rem; color: #282828; } .user-page .serve-section { border-radius: .16rem; margin: 0 .3rem .2rem; background-color: #FFFFFF; } .user-page .serve-section .title { padding-top: .2rem; padding-left: .2rem; font-size: .3rem; line-height: .42rem; color: #282828; } .user-page .serve-section .list { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; -webkit-flex-wrap: wrap; flex-wrap: wrap; } .user-page .serve-section .item { -webkit-box-flex: 0 0 25%; -webkit-flex: 0 0 25%; flex: 0 0 25%; min-width: 0; padding-top: .3rem; padding-bottom: .3rem; text-align: center; cursor: pointer; } .user-page .serve-section .img { height: .52rem; vertical-align: middle; pointer-events: none; -webkit-touch-callout: none; } .user-page .serve-section .text { margin-top: .12rem; font-size: .24rem; line-height: .33rem; color: #282828; } .exchange-page { position: relative; } .exchange-page::before { content: ""; position: absolute; top: 0; left: 0; z-index: -1; width: 100%; height: 3.19rem; background: linear-gradient(210deg, #4F547E 0%, #2C3353 100%); } .exchange-page .title-section { padding-top: .38rem; padding-bottom: .31rem; text-align: center; } .exchange-page .title-section .text { position: relative; display: inline-block; padding: .54rem .25rem 0; background: url(img/b32_23154ba88e.png) center top/.62rem .42rem no-repeat; vertical-align: middle; font-size: .36rem; line-height: .5rem; color: #F9E1C2; } .exchange-page .title-section .text::before { content: ""; position: absolute; top: 50%; right: 100%; width: .72rem; height: .02rem; margin-top: .25rem; background-color: rgba(249, 225, 194, .5); } .exchange-page .title-section .text::after { content: ""; position: absolute; top: 50%; left: 100%; width: .72rem; height: .02rem; margin-top: .25rem; background-color: rgba(249, 225, 194, .5); } .exchange-page .form-section { padding: .14rem .25rem .37rem; border-radius: .16rem; margin-right: .3rem; margin-left: .3rem; background-color: #FFFFFF; } .exchange-page .form-section .label { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; border-bottom: 1px solid #EEEEEE; } .exchange-page .form-section .iconfont { font-size: .36rem; color: #282828; } .exchange-page .form-section .input { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; min-width: 0; height: 1.02rem; margin-left: .2rem; font-size: .3rem; } .exchange-page .form-section .input::placeholder { color: #999999; } .exchange-page .form-section .button { display: block; width: 100%; height: .86rem; border-radius: .43rem; margin-top: .37rem; background: linear-gradient(270deg, #EEB669 0%, #FBE1B8 100%); font-size: .32rem; color: #9F620E; } .exchange-page .power-section { padding-top: .35rem; padding-bottom: .1rem; border-radius: .16rem; margin: .2rem .3rem; background-color: #FFFFFF; } .exchange-page .power-section .title { text-align: center; } .exchange-page .power-section .text { display: inline-block; padding-right: .45rem; padding-left: .45rem; background: url(img/b33_5539840718.png) center/100% no-repeat; vertical-align: middle; font-weight: bold; font-size: .36rem; line-height: .5rem; color: #9F620E; } .exchange-page .power-section .list { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; -webkit-flex-wrap: wrap; flex-wrap: wrap; } .exchange-page .power-section .item { -webkit-box-flex: 0 0 33.33%; -webkit-flex: 0 0 33.33%; flex: 0 0 33.33%; min-width: 0; padding-top: .5rem; padding-bottom: .5rem; } .exchange-page .power-section .img-wrap { width: .96rem; height: .96rem; border-radius: 50%; margin: 0 auto; background-color: #FFF5E8; line-height: .96rem; text-align: center; } .exchange-page .power-section .img { width: .6rem; height: .6rem; vertical-align: middle; } .exchange-page .power-section .name { margin-top: .2rem; font-size: .26rem; line-height: .37rem; text-align: center; color: #282828; } .exchange-page .power-section .info { margin-top: .03rem; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: .21rem; line-height: .29rem; text-align: center; color: #999999; } .exchange-page .explain-section { margin-top: .4rem; } .exchange-page .explain-section .title { padding-left: .55rem; font-size: .3rem; line-height: .42rem; color: #282828; } .exchange-page .explain-section ol { margin: .21rem .55rem .66rem .81rem; font-size: .26rem; line-height: .46rem; text-align: justify; color: #666666; list-style: decimal; } .bind-phone-modal { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.7); display: flex; align-items: center; justify-content: center; z-index: 2000; } .bind-phone-content { background: #fff; padding: .4rem; border-radius: .2rem; width: 80%; max-width: 5.5rem; } .bind-phone-title { font-size: .32rem; color: #333; text-align: center; margin-bottom: .3rem; } .bind-input { width: 100%; border: 1px solid #ddd; border-radius: .1rem; padding: .2rem; font-size: .28rem; margin-bottom: .2rem; box-sizing: border-box; } .code-input-wrap { display: flex; gap: .2rem; margin-bottom: .3rem; } .code-input { flex: 1; border: 1px solid #ddd; border-radius: .1rem; padding: .2rem; font-size: .28rem; box-sizing: border-box; width:30%; } .send-code-btn { background: #ff5c40; color: #fff; border: none; border-radius: .1rem; padding: .2rem .3rem; font-size: .24rem; white-space: nowrap; } .send-code-btn:disabled { background: #ccc; } .bind-btns { display: flex; gap: .2rem; } .bind-btn { flex: 1; background: #ff5c40; color: #fff; border: none; border-radius: .1rem; padding: .2rem; font-size: .28rem; } .cancel-btn { flex: 1; background: #f0f0f0; color: #666; border: none; border-radius: .1rem; padding: .2rem; font-size: .28rem; } .userziliao .form-item { margin-bottom: 0.28rem; } .userziliao .form-item label { display: block; font-size: 0.28rem; color: #333; margin-bottom: 0.08rem; } .userziliao .form-item .required { color: #ff5c40; margin-right: 0.04rem; } .userziliao .select-group { display: flex; gap: 0.12rem; } .userziliao .select-group select { flex: 1; padding: 0.16rem 0.1rem; border: 1px solid #ddd; border-radius: 0.08rem; font-size: 0.26rem; background: #fff; appearance: auto; width:33%; } .userziliao .bind-input { width: 100%; border: 1px solid #ddd; border-radius: 0.08rem; padding: 0.16rem; font-size: 0.28rem; box-sizing: border-box; } .userziliao .bind-input:focus { border-color: #ff5c40; outline: none; box-shadow: 0 0 0 2px rgba(255, 92, 64, 0.15); } .userziliao .follow-btn { display: block; width: 100%; background: #07c160; color: #fff; border: none; border-radius: 0.1rem; padding: 0.2rem; font-size: 0.28rem; text-align: center; text-decoration: none; margin-top: 0.2rem; box-sizing: border-box; transition: background 0.2s; } .userziliao .follow-btn:active { background: #06ad56; } .userziliao .bind-phone-content { max-height: 80vh; overflow-y: auto; -webkit-overflow-scrolling: touch; } .qrcode-modal { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.7); display: flex; align-items: center; justify-content: center; z-index: 9999; } .qrcode-modal .qrcode-close { position: absolute; top: 10px; right: 10px; font-size: 24px; color: #999; cursor: pointer; } .qrcode-modal .qrcode-title { font-size: 16px; margin-bottom: 15px; color: #333; } .qrcode-modal .qrcode-img { width: 150px; height: 150px; margin: 0 auto; } .qrcode-modal .qrcode-tip { margin-top: 10px; font-size: 14px; color: #666; } .qrcode-modal .qrcode-content { background: white; border-radius: 10px; padding: 20px; text-align: center; position: relative; max-width: 80%; } .qrcode-modal .qrcode-img { width: 150px; height: 150px; margin: 0 auto; } .qrcode-modal .qrcode-tip { margin-top: 10px; font-size: 14px; color: #666; }


/* ===== PC端居中适配(方案一:PC显示为居中手机版,与H5一致) ===== */
@media (min-width: 751px) {
  html { font-size: 100px !important; }
  body { max-width: 750px; margin: 0 auto; }
  #footer,
  .initiate-group2 footer,
  .assemble footer,
  .my-promoter .footer,
  .thematic-details footer,
  .thematic-details .follow,
  .entry,
  .payment,
  .broadcast-details .footerCon,
  .activity .footer,
  .activity .popup,
  .goods-detail .footer,
  .order-confirm .footer,
  .order-confirm .popup,
  .order-detail .footer,
  .address-list .footer,
  .source-detail-page .foot,
  .source-detail-page .share-mask,
  .indexNew .thematic-details,
  .source-detail-page .dialog {
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    width: 750px;
  }
}


/* ===== PC端居中适配-补充(视图内联fixed元素+弹窗) ===== */
.modalcty {
  position: fixed; top: 0; left: 0; width: 100%; height: 100%;
  background: rgba(0,0,0,0.7); display: flex; align-items: center; justify-content: center; z-index: 9999;
}
.modal-content-code {
  background: #fff; border-radius: 12px; padding: 20px; text-align: center; max-width: 80%; position: relative;
}
.modal-content-code img { width: 200px; height: 200px; max-width: 100%; display: block; margin: 0 auto; }
.modal-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; }
.modal-title { font-size: 18px; color: #333; margin: 0; }
.closetyu { font-size: 26px; line-height: 1; color: #999; cursor: pointer; }
.modal-body p { font-size: 14px; color: #666; margin-top: 10px; }
.modal-footer p { font-size: 13px; color: #999; margin: 0; }
@media (min-width: 751px) {
  .login_check, .bottom, .bottom-actions, .bottom-buy-container, .bottom-fixed-area,
  .buy-layer, .con_dizhi, .fixed-bottom, .lijibaoming-end, .loading-more,
  .submit-btn, .tijiao_buttom, .yaoqing-layer,
  .tab-content.active .shengji .btn, .save-btn, .withdraw-btn {
    left: 0; right: 0; margin-left: auto; margin-right: auto; width: 750px; max-width: 750px;
  }
  .buy-layer, .yaoqing-layer { max-height: 600px; }
  .float-poster, .float-yaoqingbang { right: calc(50vw - 375px); }
  .float-buttons { right: calc(50vw - 375px + 0.3rem); }
  .float-audio-player { right: calc(50vw - 375px + 0.2rem); }
  .qrcode-content { max-width: 5rem; }
}