page{ background-color: #f5f5f5; } .top-fixed{ position: fixed; top: 0; right: 0; left: 0; background-color: #fff; z-index: 101; } .search-box{ padding: 30rpx; background-color: #fff; } .search-text{ color: #999999; } .search-input{ height: 76rpx; line-height: 76rpx;; background: #F5F5F5; border-radius: 60rpx; padding: 0 26rpx; font-size: 24rpx; } .search-input input{ font-size: 24rpx; } .search-input image{ width: 34rpx; height: 34rpx; margin-right: 26rpx; } .search-all{ color: #2a82fd; font-size: 30rpx; margin-left: 46rpx; } .filter{ padding: 0 0 0 30rpx; text-align: center; font-size: 28rpx; color: #999999; line-height: 41rpx; } .filter-item-icon{ margin-left: 15rpx; width: 22rpx; height: 13rpx; } .filter-item{ justify-content: center; } .f-active{ color: var(--main); } /* 弹窗 */ /* 核销弹窗 */ .ceng{position: fixed;top: 0;left: 0;right: 0;bottom: 0;background-color: rgba(0,0,0,.5);z-index: 99;} .hx-pop{overflow: hidden;position: fixed;left: 0;right: 0;top: 0;background-color: #fff;border-radius: 0rpx 0rpx 0rpx 0rpx;z-index: 100;transition: all .3s ease;} .default{position: absolute;top: 55rpx;right: 60rpx;font-size: 28rpx;color: #999;} .default image{width: 36rpx;height: 36rpx;margin-right: 14rpx;} .pop-tit{font-size: 32rpx;color: #263343;font-weight: bold;margin-top: 60rpx;padding: 0 60rpx;} .pop-con{padding: 0 60rpx;max-height: 500rpx;overflow: scroll;} .pop-list{flex-wrap: wrap;} .pop-list .li{height: 70rpx;font-size: 30rpx;color: #333;text-align: left;line-height: 70rpx;margin: 30rpx 0;border-bottom: 2rpx solid #ebebeb;} .pop-list .li:last-child{border-bottom:none} .pop-list .li.active{color: var(--main);} .pop-list .opt{padding: 0 20rpx; height: 60rpx;background: #fff;border-radius: 10rpx;font-size: 30rpx;color: #999;text-align: center;line-height: 60rpx;align-items: flex-start;margin: 30rpx 30rpx 0 0;border: 2rpx solid #ebebeb;} /* .pop-list .opt:nth-child(3n){margin-right: 0;} */ .pop-list .opt.opt-active{color: var(--main);border: 2rpx solid var(--main);} .pop-time{margin-top: 30rpx;font-size: 30rpx;color: #333;} .pop-time text{margin: 0 25rpx;} .date-ipt{width: 262rpx;height: 70rpx;background: #F3F5F7;border-radius: 35rpx;box-sizing: border-box;padding: 0 30rpx;font-size: 28rpx;color: #A5A5A5;line-height: 70rpx;} .pop-btn{padding: 30rpx;} .pop-btn view{height: 90rpx;line-height: 90rpx;font-size: 32rpx;text-align: center;box-sizing: border-box;border-radius: 6rpx;} .pop-btn view:first-child{width: 250rpx; color: #fff;border-top: 1rpx solid #f5f5f5;line-height: 79rpx;background-color: #cccccc;margin-right: 30rpx;} .pop-btn view:last-child{color: #fff;background: var(--mina);} /* 列表*/ /* 开通项目 */ .card-pic{ width: 172rpx; height: 172rpx; border-radius: 10rpx 10rpx 10rpx 10rpx; opacity: 1; margin-right: 15rpx; } .card-info{ } .card-title{ line-height: 54rpx; font-size: 32rpx; font-weight: bold; } .card-time{ line-height: 36rpx; font-size: 24rpx; color: #999999; } .card-price{ margin-top: 43rpx; justify-content: space-between; } .card-price text:first-child{ font-size: 32rpx; font-weight: 500; color: #FF0000; } .card-price text:last-child{ font-size: 24rpx; font-weight: 500; color: #999999; } .register-option{ border-top: 1px solid #F5F5F5; justify-content: space-between; margin-top: 30rpx; padding: 20rpx 30rpx 0; } .order-time{ font-size: 24rpx; font-weight: 400; color: #999999; } .option-btn{ padding: 0 40rpx; line-height: 51rpx; border-radius: 27rpx 27rpx 27rpx 27rpx; opacity: 1; border: 2rpx solid #CCCCCC; font-size: 28rpx; } .bottom-btn{ background-color: #fff; padding: 30rpx 0; position: fixed; bottom: 0; left: 0; right: 0; } .btn-icon{ width: 29rpx; height: 32rpx; margin-right: 18rpx; } .bottom-btn .btn{ width: 690rpx; height: 96rpx; line-height: 96rpx; background: #2A82FD; border-radius: 48rpx 48rpx 48rpx 48rpx; opacity: 1; text-align: center; color: #FFFFFF; margin: auto; justify-content: center; font-size: 32rpx; } .review-btn{ padding: 6rpx 20rpx; font-size: 26rpx; background-color: var(--main); color: #fff; border-radius: 10rpx; } .ceng { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, 0.5); z-index: 99; } .pop{ width:100%; border-radius:16rpx 16rpx 0 0; background: #fff; position: fixed; bottom:-100%; left:0; right:0; padding:10rpx 0; z-index: 100; transition: all .3s ease; } .pop-item{ padding:30rpx; font-size:28rpx; text-align:center; margin:0 30rpx 30rpx; border-radius: 10rpx; } .pop-qx{ border-top:10rpx solid #f5f5f5; } .pop-scroll{ max-height: 750rpx; overflow: scroll; } .pop-scroll::-webkit-scrollbar { display: none; } .pop-textarea{ padding: 30rpx; border: 1px solid #E5E5E5; margin: 30rpx; } .pop-textarea textarea{ width: 100%; } .pop-title{ padding: 30rpx 30rpx 0; font-size: 32rpx; } /* 内容 */ .rec{ padding: 0 30rpx; background-color: #fff; } .rec .li{padding: 30rpx 0;border-bottom: 1rpx solid #EDEDED;align-items: center;} .rec-tit{font-size: 34rpx;color: #333;font-weight: bold;line-height: 47rpx;height: 141rpx;margin-bottom: 25rpx;} .author{font-size: 28rpx;color: #999;margin-right: 24rpx;} .author image{width: 32rpx;height: 32rpx;border-radius: 2rpx;margin-right: 10rpx;} .rec-time{font-size: 28rpx;color: #999;} .rec-img{width: 240rpx;height: 180rpx;margin-left: 55rpx;border-radius: 12rpx 12rpx 12rpx 12rpx;} .rec-association { padding: 0rpx 30rpx 0; opacity: 1; border-bottom: 1px solid #E8E8E8; position: fixed; width: 100%; box-sizing: border-box; height: 70rpx; z-index: 5; background: #fff; } .rec-association-nav{ position: relative; } .rec-association-nav-m{ position: absolute; right: 0; top: 0; bottom:0; width: 55rpx; background: linear-gradient(90deg, rgba(255,255,255,0) 0%, #FFFFFF 100%); /* background: #000; */ opacity: 1; } .rec-association-scroll { white-space: nowrap; overflow: hidden; height: 70rpx; } .rec-association-scroll ::-webkit-scrollbar { width: 0; height: 0; color: transparent; display: none; } .rec-association-scroll-item{ /* max-width: 128rpx; */ overflow: hidden; font-size: 32rpx; display: inline-block; margin-right:56rpx; color: #666; height: 100%; } .rec-association-scroll-item-active{ color: var(--main); font-size: 32rpx; font-weight: 500; position: relative; } .rec-association-scroll-item-active::after{ content: ''; position: absolute; bottom: 0px; left: 50%; transform: translateX(-50%); width: 50%; height: 6rpx; background: var(--main); } .rec-association-nav-icon{ width: 38rpx; height: 32rpx; margin-left: 40rpx; margin-top: 4rpx; }