/**index.wxss**/ page{background: #fff;} .top-fixed{position: fixed;top: 0;left: 0;right: 0;z-index: 50;background: var(--mina);} .topbg{width: 100%;height: 100%;} .top-title{position: absolute;left: 0;right: 0;text-align: left;font-size: 36rpx;color: #fff;padding-left: 34rpx;} .top-title image{height: 60rpx;position: absolute;left: 34rpx;top: 50%;transform: translateY(-50%);} .not-color{background: #fff;} .not-color .top-title{color: #333;} .top{box-sizing: border-box;align-items: center;position: relative;} .top-bg{width: 100%;height: 260rpx;position: absolute;top: 0;left: 0;z-index: 0;} .topcon{padding: 40rpx 45rpx;position: relative;z-index: 1;} .logo{width: 100rpx;height: 100rpx;border: 2rpx solid #fff;background: #fff;border-radius: 50%;margin-right: 25rpx;} .areas{font-size: 34rpx;color: #fff;} /* .areas image{width: 22rpx;height: 17rpx;margin-left: 10rpx;margin-top: 10rpx;} */ .recent{align-items: center;font-size: 22rpx;color: #fff;margin-top: 10rpx;} .recent text{display: block;width: 100rpx;height: 32rpx;text-align: center;line-height: 32rpx;border-radius: 16rpx;margin-right: 9rpx;font-size: 22rpx;} .renqi{padding: 0 35rpx;text-align: center;font-size: 34rpx;color: #fff;} .renqi text{display: block;opacity: .7;font-size: 24rpx;margin-top: 10rpx;} /* .top{box-sizing: border-box;align-items: center;position: relative;} .top-bg{display: block;width: 100%;height: 192rpx;position: absolute;top: 0;left: 0;z-index: 1;} .topcon{position: relative;z-index: 2;display: flex;display: -webkit-flex;} .logo{display: block;width: 80rpx;height: 80rpx;z-index: 2;} .areas{align-items: center;color: #fff; z-index: 3;} .areas image{width: 22rpx;height: 17rpx;margin-left: 10rpx;margin-top: 10rpx;} .recent{align-items: center;font-size: 22rpx;color: #fff;margin-top: 10rpx;} .recent text{display: block;width: 100rpx;height: 32rpx;text-align: center;line-height: 32rpx;border-radius: 16rpx;margin-right: 9rpx;font-size: 22rpx;} .renqi{padding: 0 35rpx;text-align: center;font-size: 34rpx;color: #fff;} .renqi text{display: block;opacity: .7;font-size: 24rpx;margin-top: 10rpx;} */ .tcon{position: relative;} .tcbg{width: 100%;height: 260rpx;position: absolute;top: 0;left: 0;z-index: 0;} .merchant{padding: 40rpx 45rpx;position: relative;z-index: 1;} .logo{width: 100rpx;height: 100rpx;border: 2rpx solid #fff;background: #fff;border-radius: 50%;margin-right: 25rpx;} .merchant-name{font-size: 36rpx;color: #fff;} .change{margin-left: 10rpx;font-size: 24rpx;color: rgba(255,255,255,.5);} .change image{width: 14rpx;height: 23rpx;margin-left: 6rpx;} .merchant-info{font-size: 24rpx;color: #FFDEC4;margin-top: 14rpx;} .merchant-info .li{margin-right: 20rpx;} .merchant-info image{width: 24rpx;height: 24rpx;margin-right: 8rpx;} .m-share{font-size: 22rpx;color: #fff;margin-left: 50rpx !important;} .m-share image{width: 34rpx;height: 34rpx;margin: 0 auto 15rpx;} .box1{border-radius: 50rpx 50rpx 0 0;padding-top: 26rpx;padding-bottom: 5rpx;position: relative;z-index: 2;} .search{background: #F0F2F3;height: 70rpx;border-radius: 35rpx;padding: 0 15rpx 0 30rpx;align-items: center;font-size: 26rpx;color: #666;} .search image{width: 30rpx;height: 30rpx;margin-right: 13rpx;} .search image.sao{width: 42rpx;height: 42rpx;} .banner{margin-top: 24rpx;overflow: hidden;position: relative;} .swiper,.swiper image{width: 100%;height: 300rpx;border-radius: 20rpx;} .swiper1{width: 100%;height: 400rpx;} .sat{padding-top: 1rpx;} .dotse,.dots1{position: absolute;left: 0;right: 0;bottom: 11rpx;align-items: center;justify-content: center;} .dot{background: #fff;width: 10rpx;height: 10rpx;border-radius: 5rpx;margin: 0 3rpx;} .dot.active{width: 30rpx;} .dot1{background: var(--mina);width: 10rpx;height: 10rpx;border-radius: 5rpx;margin: 0 3rpx;} .dot1.active{width: 30rpx;} .nav{flex-wrap: wrap;margin-top: 30rpx;position: relative;} .nav .li{width: 25% !important;text-align: center;font-size: 28rpx;color: #333;margin-bottom: 35rpx;/* height: 41%; */} .nav .li button{font-size: 28rpx !important;color: #333 !important;} .nav .li image{width: 80rpx;height: 80rpx;margin: 0 auto 10rpx;} .grid{flex-wrap: wrap;} .more{width: 16rpx;height: 27rpx;} .quan{padding-bottom: 40rpx;} .quan .li{width: 212rpx;height: 220rpx;margin-right: 17rpx;position: relative;text-align: center;} .quan .li:last-child{margin-right: 0;} .quanbg{width: 100%;height: 100%;position: absolute;top: 0;left: 0;z-index: 1;} .quan .lic{position: relative;z-index: 2;width: 100%;height: 100%;overflow: hidden;} .quan .li.gray .sbglinear{background: linear-gradient(90deg,#ddd,#c7c6c6);color: #666;} .amount{font-weight: bold;font-size: 56rpx;color: #fff;margin: 20rpx 0 0;} .amount text{font-size: 24rpx;} .rule{font-size: 24rpx;color: #fff;margin: 0 0 40rpx;} .ling{width:140rpx;height:40rpx;line-height: 40rpx;font-size: 22rpx;color: #FF6009;position: absolute;left: 50%;transform: translateX(-50%);bottom: 15rpx;} .jingxuan{padding-bottom: 40rpx;flex-wrap: wrap;} .jingxuan .li{width: 47%;margin-right: 20rpx;text-align: center;overflow: hidden;margin-bottom: 25rpx;} .jingxuan .li image{width: 100%;height: 210rpx;border-radius: 10rpx;} .name{font-size: 28Prpx;color: #333;text-overflow: ellipsis;white-space: nowrap;overflow: hidden;margin: 15rpx 0 10rpx;} .price{font-size: 24rpx;color: #FE0419;} .price text{font-size: 36rpx;font-weight: bold;} .shequ .li{border-bottom: 2rpx solid #eee;padding: 0 20rpx 38rpx;margin-bottom: 38rpx;overflow: hidden;} .shequ .li:last-child{border-bottom: none;margin-bottom: 0;} .shequ .li .flex{overflow: hidden;} .proimg{box-sizing: border-box;width: 210rpx;height: 210rpx;border-radius: 10rpx;margin-right: 20rpx;border: 2rpx solid #E5E5E5;} .proname{font-size: 28rpx;color: #333;overflow : hidden;line-height: 36rpx;height: 72rpx;} .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: 0 0 10rpx;/* margin: 15rpx 0 25rpx; */} .operate{justify-content: space-between;align-items: center;} .price .del{font-weight: normal;font-size: 24rpx;color: #999;margin-left: 12rpx;text-decoration: line-through;} .price .vip{ font-size: 24rpx;margin-left: 12rpx;color: #333;font-weight: normal;} .add-cart image{width: 42rpx;height: 42rpx;} .nums{align-items: center;} .num{font-size: 30rpx;width: 50rpx;text-align: center;line-height: 42rpx;} .remind{width: 150rpx;height: 50rpx;border-radius: 25rpx;font-size: 24rpx;color: #fff;text-align: center;justify-content: center;line-height: 50rpx;} .datas{justify-content: space-between;align-items: center;font-size: 24rpx;color: #666;padding: 20rpx 0 0} .yigou{margin-left: 6rpx;align-items: center;} .yigou image{width: 40rpx;height: 40rpx;border-radius: 50%;margin-left: -6rpx;border: 2rpx solid #fff;} .yigou image.more1{border: none;width: 46rpx;height: 46rpx;} .yigou text{margin-left: 12rpx;} .xiaoliang{color: #999;} .miaosha{margin-top: 15rpx;} .times{margin-bottom: 30rpx;} .times .li{width: 20%;text-align: center;font-size: 20rpx;color: #999;position: relative;} .times .li::before{content: '';display: block;width: 2rpx;height: 61rpx;background: #D2D2D2;position: absolute;left: 0;bottom: 5rpx;} .times .li:first-child::before{display: none;} .times .li text{display: block;font-size: 36rpx;color: #333;margin-bottom: 5rpx;} .times .li.active,.times .li.active text{color: #FE0419;} .msinfos{padding: 20rpx 20rpx 32rpx} .msinfos image{width: 100%;height: 390rpx;} .msinfo{padding: 0 9rpx} .msname{font-size: 30rpx;line-height: 36rpx;margin: 20rpx 0 10rpx} .qgsta{align-items: center;justify-content: space-between;} .qiang{width: 100rpx;height: 40rpx;border-radius: 35rpx;text-align: center;line-height: 40rpx;font-size: 24rpx;color: #fff;} .pintuan{padding-bottom: 50rpx;} .pintuan .li{margin-bottom: 50rpx;} .pintuan .li:last-child{margin-bottom: 0;} .pinimgs{box-sizing: border-box;width: 210rpx;height: 210rpx;border-radius: 10rpx;margin-right: 20rpx;border: 2rpx solid #E5E5E5;position: relative;} .pinimg{display: block;width: 100%;height: 100%;border-radius: 10rpx;} .tuan{display: block;width: 87rpx;height: 44rpx;font-size: 22rpx;color: #fff;text-align: center;line-height: 34rpx;position: absolute;top: 21rpx;left: -10rpx;} .tuan image{display: block;width: 100%;height: 100%;position: absolute;top: 0;left: 0;} .tuan text{position: relative;z-index: 2;display: block;} .pininfo{overflow: hidden;} .pininfo .endtime{margin-bottom: 45rpx;} .pininfo .del{font-size: 24rpx;color: #999;text-decoration: line-through;} /* .pininfo .price{color: #333;} */ .jishida{margin: 20rpx 0;} /* .tab{align-items: center;font-size: 28rpx;color: #666;} .tab .li{width: 25%;text-align: center;position: relative;} .tab .li::after{content: '';display: block;width: 2rpx;height: 28rpx;background: #D2D2D2;position: absolute;left: 0;top: 50%;transform: translateY(-50%);} .tab .li:first-child::after{display: none;} .tab .li.active{color: var(--mina) !important;} .tabcon{flex-wrap: wrap;margin-top: 20rpx;} .tabcon .li{width: 50%;} */ /* .tabcon .li{background: #fff;border-radius: 10rpx;width: 345rpx;margin: 20rpx 20rpx 0 0;} */ /* .tabcon .li:nth-child(2n){margin-right: 0;} */ .tabconTh .li{width: 223rpx;margin-right: 20rpx !important;} .tabconTh .li:nth-child(3n){margin-right: 0 !important;} .jsdimgs{width: 345rpx;height: 345rpx;position: relative;} .tabconTh .li .jsdimgs{width: 223rpx;height: 223rpx;} .jsdpro{width: 100%;height: 100%;} .jsdimg{width: 82rpx;height: 36rpx;position: absolute;top: 20rpx;left: 20rpx;} .jsdinfo{padding: 15rpx 20rpx 30rpx;} .kan-guoqi{background: #999;} .idxnav{justify-content: space-between;padding: 30rpx;} .zbgm image{width: 336rpx;height: 321rpx;} .lqzx{margin-bottom: 20rpx;} .lqzx image{width: 336rpx;height: 151rpx;} .myzx image{width: 336rpx;height: 151rpx;} .guide{position: fixed;top: 0;left: 0;right: 0;bottom: 0;background: rgba(0,0,0,.7);z-index: 102;} .guide image{width: 100%;} .layer{ position: fixed; top: 0; z-index: 101; left: 0; right: 0; display: flex; bottom: 0; background: rgba(0,0,0,0.7); justify-content: center; align-items: center; flex-direction: column; } .layer image{ width: 535rpx; height: 650rpx; } /*关闭按钮样式 */ .layer .close{ color:#fff; width: 60rpx; height: 60rpx; margin-top: 80rpx; } /* 专题 */ .ztdiv{height: 310rpx; background-color: #fff; margin-top: 20rpx; padding: 0rpx 0rpx 20rpx 0rpx; margin-right: 20rpx; border-radius: 20rpx; } .imgdiv{width: 100%; height: 240rpx; } .t-img{height:240rpx;width: 710rpx;border-radius: 20rpx 20rpx 0 0;} .txtdiv{padding-left: 20rpx;padding-top: 20rpx; border-top: 1rpx #eee solid; } .imgtit{width: 100%; margin-bottom:20rpx; } .jishida .imgtit{width: 100%; margin-bottom:10rpx; } /* 砍价活动 */ .kjcon{overflow: hidden;} .kan-price{align-items: center;margin: 10rpx 0 45rpx;} .tag{width: 80rpx;height: 36rpx;border-radius: 8rpx;text-align: center;line-height: 36rpx;font-size: 20rpx;color: #fff;} .kan-price .price{font-size: 38rpx;color: #FE0419;margin: 0 20rpx 0 12rpx;} .kan-price .price text{font-size: 25rpx;} .kan-price .del{font-size: 24rpx;color: #999;text-decoration: line-through;} .kan-times{align-items: center;justify-content: space-between;} .kan-time{align-items: center;font-size: 20rpx;color: #333;margin: 15rpx 0 65rpx;} .kan-time text{display: block;width: 38rpx;height: 38rpx;border-radius: 8rpx;background: #333;line-height: 38rpx;text-align: center;margin: 0 7rpx;font-size: 24rpx;color: #fff;} .kan-time text:first-child{margin-left: 0;} .kan-time view{margin-left: 5rpx;} .kan-btn{width: 150rpx;height: 50rpx;border-radius: 25rpx;text-align: center;line-height: 50rpx;font-size: 24rpx;color: #fff;} .cont{flex-wrap: wrap;font-size: 26rpx;} .cont .li{align-items: center;margin-right: 20rpx; color: #fff;margin-top: 5rpx;} .cont image{width: 30rpx; height: 30rpx;} .ss{padding-bottom:20rpx ;} .li3{width: 33% !important;text-align: center;font-size: 28rpx;margin-top: 30rpx !important;position: relative;} .li3 button{font-size: 28rpx !important;color: #333 !important;} .li5{width: 20% !important;text-align: center;font-size: 28rpx;margin-top: 30rpx !important;position: relative;} .li5 button{font-size: 28rpx !important;color: #333 !important;} .btn-tag{height: 27rpx;background: #F68461;border-radius: 10rpx 10rpx 10rpx 0rpx;font-size: 18rpx;color: #fff;padding: 0 8rpx;line-height: 27rpx;position: absolute;top: -13rpx;right: 0;} .nav .li3 image{width: 140rpx;height: 140rpx;margin: 0 auto 10rpx;} .nav .li5 image{width: 75rpx;height: 75rpx;margin: 0 auto 10rpx;} .swiper2{width: 100%;height: 240rpx;}/*一行三个*/ .swiper3{width: 100%;height: 432rpx;}/*两行三个*/ .swiper4{width: 100%;height: 200rpx;}/*一行四个*/ .swiper5{width: 100%;height: 160rpx;}/*一行五个*/ .kjpop{position: fixed;top: 50%;transform: translateY(-50%);left: 85rpx;right: 85rpx;background: #fff;border-radius: 20rpx;z-index: 100;overflow: hidden;} .kjpop .tops {height: 100rpx;} .kjpop .tops image{width: 100%;height: 100rpx;} .kjpop .cont{padding: 0rpx 44rpx;} .kjpop .cont text{font-size:24rpx ; color: #707070;} .kjpop .cont .title{text-align: center; font-size: 28rpx;color: #DC1515; font-weight: bold;margin: 30rpx 0 45rpx 0;} /* .kjpop .cont .btn{width: 430rpx; height: 60rpx;border-radius: 40rpx;border: 1rpx solid #DE1F20; color: #DE1E1F; font-size: 28rpx;text-align: center; line-height: 60rpx;margin: 0 auto;} */ .kjpop .bottom{ border-top: 1rpx solid #E4E4E4; } .botLeft,.botRight{ width: 50%; text-align: center; padding: 20rpx 0; } .botLeft{ border-right: 1rpx solid #E4E4E4; } .spinner { margin: 255px auto 0px auto ; width: 60rpx; height: 60rpx; position: relative; } .container1 > view, .container2 > view, .container3 > view { width: 15rpx; height: 15rpx; background-color: var(--mina); border-radius: 100%; position: absolute; -webkit-animation: bouncedelay 1.2s infinite ease-in-out; animation: bouncedelay 1.2s infinite ease-in-out; -webkit-animation-fill-mode: both; animation-fill-mode: both; } .spinner .spinner-container { position: absolute; width: 100%; height: 100%; } .container2 { -webkit-transform: rotateZ(45deg); transform: rotateZ(45deg); } .container3 { -webkit-transform: rotateZ(90deg); transform: rotateZ(90deg); } .circle1 { top: 0; left: 0; } .circle2 { top: 0; right: 0; } .circle3 { right: 0; bottom: 0; } .circle4 { left: 0; bottom: 0; } .container2 .circle1 { -webkit-animation-delay: -1.1s; animation-delay: -1.1s; } .container3 .circle1 { -webkit-animation-delay: -1.0s; animation-delay: -1.0s; } .container1 .circle2 { -webkit-animation-delay: -0.9s; animation-delay: -0.9s; } .container2 .circle2 { -webkit-animation-delay: -0.8s; animation-delay: -0.8s; } .container3 .circle2 { -webkit-animation-delay: -0.7s; animation-delay: -0.7s; } .container1 .circle3 { -webkit-animation-delay: -0.6s; animation-delay: -0.6s; } .container2 .circle3 { -webkit-animation-delay: -0.5s; animation-delay: -0.5s; } .container3 .circle3 { -webkit-animation-delay: -0.4s; animation-delay: -0.4s; } .container1 .circle4 { -webkit-animation-delay: -0.3s; animation-delay: -0.3s; } .container2 .circle4 { -webkit-animation-delay: -0.2s; animation-delay: -0.2s; } .container3 .circle4 { -webkit-animation-delay: -0.1s; animation-delay: -0.1s; } @-webkit-keyframes bouncedelay { 0%, 80%, 100% { -webkit-transform: scale(0.0) } 40% { -webkit-transform: scale(1.0) } } @keyframes bouncedelay { 0%, 80%, 100% { transform: scale(0.0); -webkit-transform: scale(0.0); } 40% { transform: scale(1.0); -webkit-transform: scale(1.0); } } .lond{ text-align: center; margin-top: 30rpx; font-size: 30rpx; } .roll-notice{height: 60rpx;background: rgba(0,0,0,.55);border-radius: 30rpx;padding: 0 30rpx 0 15rpx;font-size: 24rpx;color: #fff;position: fixed;left: 35rpx;align-items: center;animation: spin 5s ease-in-out infinite;animation-fill-mode: forwards;z-index: 20;max-width: 435rpx;overflow: hidden;} .roll-notice .flex{overflow: hidden;text-overflow: ellipsis;white-space: nowrap;overflow: hidden;} .roll-notice image{width: 40rpx;height: 40rpx;border-radius: 50%;margin-right: 11rpx;} @keyframes spin { 0% { top: 305rpx; opacity: 0; } 25% { top: 255rpx; opacity: 1; } 50% { top: 255rpx; opacity: 1; } 75% { top: 215rpx; opacity: 0; } 100%{ top: 215rpx; opacity: 0; } }