page{background-color: #fff;} .top{position: fixed;top: 0;left: 0;right: 0;z-index: 80;text-align: center;} .top-background{background: var(--mina);} .top-nav{position: relative;} .back{position: absolute;top: 50%;transform: translateY(-50%);left: 0;padding-left: 30rpx;} .back image{width: 22rpx;height: 38rpx;} .search{width: 400rpx;height: 65rpx;background-color: rgba(255,255,255,.8);border-radius: 33rpx;padding: 0 30rpx;font-size: 28rpx;color: #8B8B8B;margin-left: 36rpx;} .search image{width: 28rpx;height: 28rpx;margin-right: 13rpx;} .top-navc{position: relative;padding-left: 80rpx; padding-right: 80rpx;} .searchc{width: 100%;height: 65rpx;background-color: rgba(255,255,255,.4);border-radius: 33rpx;padding: 0 30rpx;font-size: 28rpx;color: #fff;} .searchc image{width: 28rpx;height: 28rpx;margin-right: 13rpx;} .top-nav-title{font-size: 36rpx;color: #333;font-weight: bold;} .top-bg{width: 100%;height: 420rpx;background: linear-gradient(180deg, var(--submain) 0%, var(--main) 100%);border-radius: 0 0 30rpx 30rpx;} .top-bg image{width: 100%;height: 100%;} .shop{background: #fff;border-radius: 10rpx;box-shadow: 0 0 15rpx rgba(0,0,0,.1);margin: -230rpx 20rpx 0;position: relative;z-index: 2;padding: 20rpx 20rpx 30rpx;} .shop-name{font-size: 36rpx;color: #333;font-weight: bold;line-height: 40rpx;flex-wrap: nowrap;} .shop-name view{max-width: 455rpx;} .daohang{width: 32rpx;height: 32rpx;margin-left: 10rpx;} .shop-datas{font-size: 24rpx;color: #999;margin-top: 12rpx;} .shop-datas image{width: 24rpx;height: 29rpx;margin-right: 6rpx;} .shop-addr{max-width: 370rpx;} .shop-infos{margin-top: 8rpx;font-size: 24rpx;color: #aaa;} .expre{height: 32rpx;border-radius: 5rpx;border: 1rpx solid rgba(1,151,114,.5);font-size: 22rpx;color: #12D776;padding: 0 12rpx;margin-right: 13rpx;} .expre image{width: 30rpx;height: 24rpx;margin-right: 7rpx;} .shop-pic{width: 132rpx;height: 132rpx;border-radius: 10rpx;position: relative;margin-left: 40rpx;border: 2rpx solid #e9e9e9;} .shop-logo{width: 100%;height: 100%;border-radius: 10rpx;} .m-tag{margin-top: 30rpx;font-size: 22rpx;color: #000;} .m-tag .li{margin-right: 18rpx;} .m-tag image{height: 28rpx;margin-right: 10rpx;} .shop-bot{border-top: 1rpx solid #DCDCDC;margin-top: 15rpx;padding-top: 27rpx;} .coupons-list{height: 50rpx;} .coupons-s{height: 70rpx;white-space: nowrap;} .coupons-list .li{display: inline-block;height: 50rpx;background: linear-gradient(90deg, #FE934C 0%, #FD3A31 100%);border-radius: 8rpx;font-size: 24rpx;color: #fff;margin: 0 10rpx 0 0;vertical-align: top;} .coupon-money{font-size: 36rpx;font-weight: bold;padding-left: 13rpx;} .coupon-money text{font-size: 24rpx;font-weight: normal;} .coupons-tit{height: 50rpx;padding: 0 16rpx 0 7rpx;border-right: 2rpx dashed rgba(255,255,255,.3);position: relative;line-height: 50rpx;} .coupons-tit::before,.coupons-tit::after{content: '';display: block;width: 13rpx;height: 13rpx;background: #fff;position: absolute;right: -6rpx;border-radius: 50%;} .coupons-tit::before{top: -6rpx;} .coupons-tit::after{bottom: -6rpx;} .coupons-list .coupon-ling{padding: 0 20rpx;} .coupon-num{font-size: 24rpx;color: #CD0B01;} .quan{margin-top: 17rpx;} .quan-list .li{height: 32rpx;border-radius: 5rpx;border: 1rpx solid rgba(255,101,6,.5);font-size: 22rpx;color: #FF6506;line-height: 32rpx;padding: 0 8rpx;margin-right: 10rpx;} .discount{margin-top: 15rpx;} .quan-num{font-size: 22rpx;color: #8B8B8B;} .quan-num image{width: 21rpx;height: 12rpx;margin-left: 13rpx;} .discount .li{height: 40rpx;border-radius: 10rpx;font-size: 22rpx;color: #C10316;border: 1rpx solid #C10316;padding: 0 14rpx;margin: 0 20rpx 0 0;} .left {width: 25%;background: #f8f8f8;position: absolute;left: 0;top: 0;bottom: 0;font-size: 26rpx;content: #333;bottom: 0;overflow-y: scroll;-webkit-overflow-scrolling: touch;} .left-position{position: fixed;z-index: 51;height: auto !important;} .left .li {/* line-height: 100rpx;text-align: center;text-overflow: ellipsis;white-space: nowrap;overflow: hidden; */height: 90rpx;justify-content: center;text-align: center;overflow: hidden;padding: 0 35rpx;position: relative;} .left .li.active{background: #fff;} .left .li.active:before{content: '';display: block;width: 6rpx;height: 32rpx;background-color: #F06520;position: absolute;top: 50%;transform: translateY(-50%);left: 0;} /* .left .li.active {font-weight: bold;background: #fff;border-left: 6rpx solid var(--mina) !important;} */ .right {width: 100%;/* position: absolute; */right: 0;top: 0;/* padding-top: 80rpx; */box-sizing: border-box;padding-left: 25%;background: #fff;} .right-position{/* position: absolute;padding-top: 80rpx; */margin-left: 25%;width: 75%;padding-left: 0;} .tab {white-space: nowrap;-webkit-overflow-scrolling: touch;padding: 0 0 0 20rpx;box-sizing: border-box;/* position: absolute;top: 0;left: 0;right: 20rpx; */z-index: 50;} .tab-position{position: fixed;top: 0;left: 0;right: 0;padding-left: calc(25% + 10rpx);background: #fff; padding-top: 10rpx; padding-bottom: 10rpx;} .tab .li {display: inline-block;margin-right: 25rpx;line-height: 48rpx;background-color: #F7F7F7;padding: 0 20rpx;color: #333;border-radius: 24rpx;font-size: 24rpx;} .tab .li:last-child {margin-right: 0;} .tab .li.active {color: var(--mina) !important;background-color: var(--textbg);} .sort {padding: 29rpx 0 0 20rpx;box-sizing: border-box;} .price .vip {font-size: 24rpx;margin-left: 12rpx;color: var(--vip);border: 1rpx solid;padding: 0 8rpx 2rpx 8rpx;border-radius: 5px;font-weight: normal;} .price .vip .members {font-size: 24rpx !important;font-weight: normal !important;margin-left: 2rpx;} .price .vip .sale {font-size: 24rpx !important;font-weight: normal !important;} .price text.del {font-weight: normal;font-size: 24rpx;color: #999;margin-left: 12rpx;text-decoration: line-through;} .sort .li {border-bottom: 2rpx solid #eee;padding-bottom: 39rpx;margin-bottom: 39rpx;overflow: hidden;padding-right: 20rpx;} .sort .li:last-child {margin-bottom: 0;border-bottom: none;} .sort .li .flex {overflow: hidden;} .proimgs{width: 160rpx;height: 160rpx;border-radius: 10rpx;position: relative;margin-right: 18rpx;border: 2rpx solid #E5E5E5;} .proimg {box-sizing: border-box;width: 100%;height: 100%;border-radius: 10rpx;} .shouqing{width: 100%;height: 100%;border-radius: 10rpx;position: absolute;top: 0;left: 0;} .proname {font-size: 28rpx;color: #333; /* text-overflow: ellipsis; white-space: nowrap; */ line-height: 36rp;height: 76rpx;overflow: hidden;} .pronames {font-size: 24rpx;color: #999;margin-top: 5rpx;} .endtime {display: inline-block;height: 32rpx;line-height: 32rpx;border: 2rpx solid #FE0419;border-radius: 6rpx;padding: 0 8rpx;font-size: 24rpx;color: #FE0419;margin: 15rpx 0 65rpx;} .operate {justify-content: space-between;align-items: center;margin-top: 10rpx;line-height: 1;} .price {font-size: 24rpx;color: #FE0419;align-items: center;display: flex;} .price text {font-size: 36rpx;font-weight: bold;} .add-cart image {width: 42rpx;height: 42rpx;} .nums {align-items: center;} .num {font-size: 30rpx;width: 50rpx;text-align: center;line-height: 42rpx;} /* 分类2 */ .sort-left {width: 22%;background: #F0F0F0;position: fixed;left: 0;top: 0;font-size: 26rpx;content: #333;} .sort-left .li {line-height: 100rpx;text-align: center;height: 101rpx;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;} .sort-left .li.active {font-weight: bold;background: #fff;border-left: 6rpx solid var(--mina) !important;} .sort-right {width: 78%;position: absolute;right: 0;top: 0;box-sizing: border-box;} .sort-right .rcon {padding: 0 20rpx 20rpx;} .sort-right .tit {padding: 25rpx 0 15px;font-size: 28rpx;color: #9A9A9A;} .sort-right .list {flex-wrap: wrap;background: #fff;border-radius: 10rpx;padding: 40rpx 15rpx 0;overflow: hidden;} .sort-right .list .li {margin-bottom: 55rpx;width: 33.33%;text-align: center;font-size: 28rpx;color: #666;} .sort-right .list image {display: block;width: 120rpx;height: 120rpx;margin: 0 auto 10rpx;} .litext {width: 120rpx;height: 120rpx;border-radius: 50%;font-size: 40rpx;color: #fff;text-align: center;line-height: 120rpx;background: #f3f1f2;margin: 0 auto 15rpx;} .nopronames {height: 31rpx;} .vip-news{height: 25rpx;background: #692A00;border-radius: 8rpx;line-height: 25rpx;flex-wrap: nowrap;font-weight: bold;} .vip-sale{background: linear-gradient(to right,#f9e0bc,#d9a168);font-size: 20rpx !important;color: #222;height: 25rpx;border-radius: 8rpx 0 0 8rpx;white-space: nowrap;width: 70rpx;text-align: center;} .vip-members{padding: 0 8rpx 0 5rpx;font-size: 20rpx !important;color: #fff !important;white-space: nowrap;}