.search-box { position: sticky; top: 0; display: flex; align-items: center; width: 100%; height: 56rpx; padding: 0 30rpx; background: #fff; z-index: 99; border-bottom: 1rpx solid #eff0f1; box-sizing: border-box; } .search-box .main { flex: 1; display: flex; align-items: center; height: 60rpx; padding-left: 30rpx; color: #939393; font-size: 14px; text-align: left; background-color: #eff0f1; border-radius: 30rpx; } .banner { padding: 29rpx 30rpx 0; background-color: #fff; } .banner image { width: 100%; display: block; height: 300rpx; border-radius: 15rpx; } .menu { padding-top: 28rpx; background-color: #fff; } .menu .in1 { height: 180rpx; } .menu .in2 { height: 430rpx; } .menu .in3 { height: 160rpx; } .menu .in4 { height: 400rpx; } .menu .li { width: 20%; float: left; text-align: center; height: 190rpx; overflow: hidden; } .menu .li-menu { float: left; text-align: center; height: 190rpx; overflow: hidden; } .menu .image { width: 80rpx; height: 80rpx; display: block; margin: 20rpx auto; border-radius: 50%; } .menu .text { display: block; width: 100%; overflow: hidden; margin-bottom: 20rpx; text-overflow: -o-ellipsis-lastline; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; } .menu .text-menu { display: block; line-height: 40rpx; overflow: hidden; margin-bottom: 20rpx; } .hp-li { border: 1px solid #e5e5e5; display: block; background: #fff; margin: 5px auto 5px; height: 90px; padding: 5px; width: 96% !important; } .hp-line { height: 40px; font-size: 14px; color: #333; line-height: 20px; /* text-overflow: -o-ellipsis-lastline; */ overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } .headline { display: flex; } .headline .img { width: 15%; padding: 12rpx; margin-right: 20rpx; } .headline .img image { width: 100%; } .headline .content { width: 85%; height: 120rpx; padding-top: 10rpx; } .headline .content swiper { height: 100%; } .headline .content swiper .li { display: flex; align-content: center; padding: 30rpx 0; } .headline .content swiper .li .left { color: #f15353; border: solid 2rpx #f15353; padding: 0 8rpx; border-radius: 4rpx; margin-right: 20rpx; } .headline .content swiper .li .right { text-align: left; width: 480rpx; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .loadMore { background: #ffffff; width: 100%; height: 80rpx; line-height: 80rpx; text-align: center; clear: both; } .fe-floatico { min-height: 20rpx; width: 120rpx; position: absolute; z-index: 1000; } .fe-floatico-right { right: 0; } /* ============= */ .cover .fullScreen { position: fixed; top: 0; bottom: 0; left: 0; right: 0; z-index: 9999; } .cover .fullScreen .full-image { position: relative; width: 100%; height: 100%; } .cover .fullScreen .full-image image { width: 100%; height: 100%; } .cover .fullScreen .close { position: absolute; right: 32rpx; top: 32rpx; color: #fff; font-size: 16px; } .cover .fullScreen .close .skip { margin-right: 16rpx; } .cover .mask { position: fixed; top: 0; bottom: 0; right: 0; left: 0; z-index: 500; } .cover .mask .mask-blank { width: 100%; height: 100%; position: relative; } .cover .mask-blank .pop { width: 65%; /* height: 50%; */ position: fixed; /* background-size: 100% 100%; */ /* background-repeat: no-repeat; */ /* z-index: 9999; */ left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 11; } .cover .mask-blank .pop image { position: relative; width: 100%; height: 100%; } .cover .mask-blank .pop .icon_close { float: right; background-color: #333; width: 48rpx; height: 48rpx; border-radius: 50%; position: absolute; right: 0; top: 0; display: flex; align-items: center; justify-content: center; z-index: 200; margin-top: -24rpx; margin-right: -24rpx; } .cover .mask-blank .pop .icon_close { color: #fff; } .cover .modal-mask { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 10; height: 100%; } #brand-box { padding: 0 29rpx; padding-top: 27rpx; background-color: #fff; } #brand-box .title { display: flex; align-items: center; text-align: left; } #brand-box .title .icon-fontclass-xingpinle { font-size: 24px; color: #46adfc; } #brand-box .title .title-text { flex: 1; padding-left: 10rpx; font-weight: bold; font-size: 38rpx; color: #2c2c2c; } #brand-box .title .more { margin-right: 9rpx; font-size: 24rpx; color: #767676; } #brand-box .title .fa-angle-right { color: #727272; } #brand-box .ul { background-color: #fff; display: flex; flex-wrap: wrap; padding-top: 30rpx; } #brand-box .ul .li:nth-child(4n) { margin: 0; } #brand-box .ul .li { width: 157rpx; margin-bottom: 20rpx; margin-right: 20rpx; overflow: hidden; } #brand-box .ul .li .img { width: 157rpx; height: 157rpx; border-radius: 10rpx; } #brand-box .ul .li .img image { width: 100%; height: 100%; border-radius: 10rpx; } #brand-box .ul .li .span { display: inline-block; width: 100%; text-align: center; font-size: 14px; color: #252525; margin-top: 12rpx; } #goods-image { padding: 20rpx 30rpx; background-color: #fff; background-color: #fff; } #goods-image image { border-radius: 10rpx; } /* #goods-image li { background-color: #f2bbbb; display: block; } */ #goods-image .top { display: flex; } #goods-image .top .left { flex: 1; height: 282rpx; margin-right: 12rpx; } #goods-image .top .left .li { height: 100%; } #goods-image .top .right { flex: 1; max-width: 50%; display: flex; flex-direction: column; } #goods-image .top .right .li { height: 135rpx; } #goods-image .top .right .li:first-child { margin-bottom: 12rpx; } #goods-image .bottom_img { margin-top: 10rpx; } #goods-image .bottom_img .ul { display: flex; } #goods-image .bottom_img .ul .li { width: 223rpx; height: 260rpx; margin-right: 10rpx; } #goods-image .bottom_img .ul .li:last-child { margin: 0; } #limit-time { padding: 0 29rpx; padding-top: 27rpx; background-color: #fff; } #limit-time .title-box { display: flex; align-items: center; text-align: left; } #limit-time .title-box .icon-fontclass-xianshi { font-size: 36rpx; color: #ff593f; } #limit-time .title-box .title-text { flex: 1; padding-left: 10rpx; font-weight: bold; font-size: 38rpx; color: #2c2c2c; } #limit-time .title-box .more { margin-right: 9rpx; font-size: 24rpx; color: #767676; } #limit-time .title-box .fa-angle-right { color: #727272; } #limit-time .goods-box { display: flex; padding-top: 30rpx; padding-bottom: 46rpx; overflow: auto; } #limit-time .goods-box .adv_img { flex-shrink: 0; width: 223rpx; height: 260rpx; margin-right: 30rpx; border-radius: 10rpx; } #limit-time .goods-box .adv_img image { border-radius: 10rpx; } #limit-time .goods-box .goods { height: 260rpx; width: 185rpx; margin-right: 30rpx; text-align: left; } #limit-time .goods-box .goods .goods-cover { position: relative; width: 185rpx; height: 185rpx; border-radius: 10rpx; } #limit-time .goods-box .goods .goods-cover image { width: 185rpx; height: 185rpx; border-radius: 10rpx; } #limit-time .goods-box .goods .goods-cover .goods-time { position: absolute; bottom: 0; left: 0; right: 0; display: flex; align-items: center; justify-content: center; height: 30rpx; text-align: center; color: #fff; font-size: 24rpx; background-color: rgba(0, 0, 0, 0.5); border-radius: 0 0 10rpx 10rpx; } #limit-time .goods-box .goods .goods-cover .goods-time .van-count-down { display: flex; align-items: center; line-height: 100%; color: #fff; font-size: 22rpx; } #limit-time .goods-box .goods .goods-name { width: 185rpx; padding-left: 3rpx; margin-top: 6rpx; font-size: 24rpx; color: #2c2c2c; } #limit-time .goods-box .goods .goods-price { padding-left: 3rpx; margin-top: 3rpx; font-size: 22rpx; color: #fe5e56; } .b-goodsList { padding-top: 17rpx; background-color: #fff; } .b-goodsList .title { display: flex; align-items: center; padding: 0 29rpx; text-align: left; } .b-goodsList .title .icon-fontclass-tuijian1 { font-size: 18px; color: #ffa846; } .b-goodsList .title .title-text { flex: 1; padding-left: 10rpx; font-weight: bold; font-size: 38rpx; color: #2c2c2c; } .b-goodsList .goodsList { padding-top: 16rpx; } .noPowerShow { width: 100vw; height: 100vh; overflow: hidden; background: #999; position: relative; } .noPowerShow .warnTestBox { position: absolute; display: inline-block; top: 50%; left: 50%; margin-top: -48rpx; margin-left: -160rpx; color: #fff; width: 320rpx; height: 96rpx; line-height: 96rpx; border-radius: 16rpx; background: #333; text-align: center; } #newcomer_award { width: 580rpx; box-sizing: border-box; } #newcomer_award .newcomer_award_templet1 { position: relative; width: 580rpx; height: 900rpx; background-image: url('https://mini-app-img-1251768088.cos.ap-guangzhou.myqcloud.com/newcomer/popupbg_1@3x.png'); background-size: 100% 100%; padding: 0 28rpx; margin-bottom: 96rpx; } #newcomer_award .newcomer_award_templet1 .close_btn { position: absolute; bottom: -140rpx; left: 0; width: 100%; text-align: center; } #newcomer_award .newcomer_award_templet1 .close_btn { z-index: 9999; } #newcomer_award .newcomer_award_templet { box-sizing: border-box; } #newcomer_award .newcomer_award_templet .close_btn i { font-size: 96rpx; color: #fff; font-weight: 400; } #newcomer_award .newcomer_award_templet .title { padding-top: 140rpx; font-size: 56rpx; color: #fff; text-align: left; overflow: hidden; /* 超出部分隐藏 */ text-overflow: ellipsis; /* 超出部分显示省略号 */ white-space: nowrap; /* 规定段落中的文本不进行换行 */ } #newcomer_award .newcomer_award_templet .cupcon_list { margin-top: 60rpx; height: 464rpx; overflow: scroll; } #newcomer_award .newcomer_award_templet .cupcon_list .cupcon_child { height: 124rpx; width: 100%; border-radius: 12rpx; display: flex; margin-bottom: 32rpx; position: relative; } #newcomer_award .newcomer_award_templet1 .cupcon_list .cupcon_child { background: radial-gradient(circle at right top, transparent 10rpx, #fffeed 0) top left / 160rpx 51% no-repeat, radial-gradient(circle at right bottom, transparent 10rpx, #fffeed 0) bottom left / 160rpx 51% no-repeat, radial-gradient(circle at left top, transparent 10rpx, #fffeed 0) 160rpx 0/460rpx 51% no-repeat, radial-gradient(circle at left bottom, transparent 10rpx, #fffeed 0) 160rpx 62rpx/460rpx 50% no-repeat, radial-gradient(circle at 10rpx 62rpx, transparent 10rpx, #fffeed 0) 580rpx 0/20rpx 200rpx no-repeat; filter: drop-shadow(4rpx 4rpx 4rpx rgba(0, 0, 0, 0.2)); } #newcomer_award .newcomer_award_templet1 .cupcon_list .cupcon_child::after { content: ''; height: 80rpx; border: 1rpx dashed #595959; position: absolute; left: 160rpx; top: 0; bottom: 0; margin: auto; } #newcomer_award .newcomer_award_templet .cupcon_list .cupcon_child .c_left_1 { width: 160rpx; display: flex; align-items: center; justify-content: center; flex-wrap: wrap; color: #d12820; } #newcomer_award .newcomer_award_templet .cupcon_list .cupcon_child .c_left_1 .currency { font-size: 28rpx; /* height: 30rpx; */ } #newcomer_award .newcomer_award_templet .cupcon_list .cupcon_child .c_left_1 .price { font-size: 36rpx; } #newcomer_award .newcomer_award_templet .cupcon_list .cupcon_child .c_right_1 { padding: 0 32rpx; display: flex; text-align: left; flex-direction: column; justify-content: center; flex: 1; overflow: hidden; } #newcomer_award .newcomer_award_templet .cupcon_list .cupcon_child .c_right_1 .c_name_1 { font-size: 32rpx; font-weight: bold; color: #f23a56; overflow: hidden; /* 超出部分隐藏 */ text-overflow: ellipsis; /* 超出部分显示省略号 */ white-space: nowrap; /* 规定段落中的文本不进行换行 */ } #newcomer_award .newcomer_award_templet .cupcon_list .cupcon_child .c_right_1 .c_condition_1 { font-size: 28rpx; color: #feb669; } #newcomer_award .newcomer_award_templet .liqun_btn { width: 448rpx; height: 96rpx; line-height: 96rpx; font-size: 40rpx; color: #fff; background-color: #f29736; border-radius: 48rpx; margin: 32rpx auto 0; text-align: center; } #newcomer_award .newcomer_award_templet2, #newcomer_award .newcomer_award_templet4 { position: relative; width: 580rpx; height: 824rpx; background-image: url('https://mini-app-img-1251768088.cos.ap-guangzhou.myqcloud.com/newcomer/popupbg_2@3x.png'); background-size: 580rpx 824rpx; padding: 0 28rpx; } #newcomer_award .newcomer_award_templet2 .title { padding-top: 52rpx; color: #b07e54; } #newcomer_award .newcomer_award_templet2 .currency, #newcomer_award .newcomer_award_templet2 .price, #newcomer_award .newcomer_award_templet2 .cupcon_list .cupcon_child .c_right_1 .c_name_1, #newcomer_award .newcomer_award_templet2 .cupcon_list .cupcon_child .c_right_1 .c_condition_1 { color: #ae784b; } #newcomer_award .newcomer_award_templet2 .cupcon_list .cupcon_child { background-image: linear-gradient(90deg, #f0e0c8 0%, #ebc8a7 47%, #e5af86 100%), linear-gradient(#fff, #fff); box-shadow: 0rpx 0rpx 16rpx 0rpx rgba(101, 57, 24, 0.29); } #newcomer_award .newcomer_award_templet2 .cupcon_list .cupcon_child::after { content: ''; height: 80rpx; border: 1rpx dashed #fff; position: absolute; left: 160rpx; top: 0; bottom: 0; margin: auto; } #newcomer_award .newcomer_award_templet2 .liqun_btn { background-color: #653918; } #newcomer_award .newcomer_award_templet2 .close_btn, #newcomer_award .newcomer_award_templet4 .close_btn { position: absolute; top: 8rpx; right: 8rpx; } #newcomer_award .newcomer_award_templet2 .close_btn i, #newcomer_award .newcomer_award_templet4 .close_btn i { font-size: 40rpx; } #newcomer_award .newcomer_award_templet3 { position: relative; width: 580rpx; height: 1024rpx; background-image: url('https://mini-app-img-1251768088.cos.ap-guangzhou.myqcloud.com/newcomer/popupbg_3@3x.png'); background-size: 580rpx 1024rpx; padding: 0 28rpx; margin-bottom: 64rpx; } #newcomer_award .newcomer_award_templet3 .title { padding-top: 312rpx; text-align: center; } #newcomer_award .newcomer_award_templet3 .cupcon_list { padding: 0 48rpx; height: 480rpx; box-sizing: border-box; } #newcomer_award .newcomer_award_templet3 .cupcon_list .cupcon_child { background: #fff8ef; padding: 8rpx; box-sizing: border-box; } #newcomer_award .newcomer_award_templet3 .cupcon_list .cupcon_child:first-child { height: 172rpx; margin-top: -12rpx; } #newcomer_award .newcomer_award_templet3 .cupcon_list .cupcon_child .border_box { border: solid 2rpx #ffd5d5; display: flex; border-radius: 16rpx; width: 100%; } #newcomer_award .newcomer_award_templet3 .cupcon_list .cupcon_child .c_left_1 { width: 50%; color: #ff1556; } #newcomer_award .newcomer_award_templet3 .cupcon_list .cupcon_child .c_left_1 .price { font-size: 48rpx; } #newcomer_award .newcomer_award_templet3 .cupcon_list .cupcon_child .c_right_1 { padding: 0 20rpx; } #newcomer_award .newcomer_award_templet3 .cupcon_list .cupcon_child .c_right_1 .c_name_1, #newcomer_award .newcomer_award_templet3 .cupcon_list .cupcon_child .c_right_1 .c_condition_1 { font-size: 28rpx; color: #ff1556; } #newcomer_award .newcomer_award_templet3 .liqun_btn { margin-top: 28rpx; background-color: #ffde66; color: #ff1556; } #newcomer_award .newcomer_award_templet3 .cupcon_list .cupcon_child::after { content: ''; height: 80rpx; border: 2rpx solid #ffa8a2; position: absolute; left: 50%; top: 0; bottom: 0; margin: auto; } #newcomer_award .newcomer_award_templet3 .close_btn { position: absolute; top: 8rpx; right: 0rpx; } #newcomer_award .newcomer_award_templet4 { background-image: url('https://mini-app-img-1251768088.cos.ap-guangzhou.myqcloud.com/newcomer/popupbg_4@3x.png'); height: 876rpx; background-size: 580rpx 876rpx; } #newcomer_award .newcomer_award_templet4 .title { padding-top: 52rpx; line-height: 96rpx; color: #fff; font-weight: bold; position: relative; } #newcomer_award .newcomer_award_templet4 .title::after { content: ''; width: 192rpx; height: 10rpx; position: absolute; left: 0; bottom: 0; background: rgba(255, 255, 255, 0.5); } #newcomer_award .newcomer_award_templet4 .cupcon_list { margin-top: 112rpx; } #newcomer_award .newcomer_award_templet4 .cupcon_list .cupcon_child { background-color: #fcb906; } #newcomer_award .newcomer_award_templet4 .currency, #newcomer_award .newcomer_award_templet4 .price, #newcomer_award .newcomer_award_templet4 .cupcon_list .cupcon_child .c_right_1 .c_name_1, #newcomer_award .newcomer_award_templet4 .cupcon_list .cupcon_child .c_right_1 .c_condition_1 { color: #fff; } #newcomer_award .newcomer_award_templet4 .cupcon_list .cupcon_child .c_left_1 { width: auto; flex: 1; box-sizing: border-box; } #newcomer_award .newcomer_award_templet4 .cupcon_list .cupcon_child .c_right_1 { width: 348rpx; height: 124rpx; flex: none; box-sizing: border-box; } #newcomer_award .newcomer_award_templet4 .cupcon_list .cupcon_child { background: radial-gradient(circle at right top, transparent 10rpx, #fcb906 0) top left / 348rpx 51% no-repeat, radial-gradient(circle at right bottom, transparent 10rpx, #fcb906 0) bottom left / 348rpx 51% no-repeat, radial-gradient(circle at left top, transparent 10rpx, #fcb906 0) 348rpx 0/460rpx 51% no-repeat, radial-gradient(circle at left bottom, transparent 10rpx, #fcb906 0) 348rpx 62rpx/460rpx 50% no-repeat, radial-gradient(circle at 10rpx 62rpx, transparent 10rpx, #fcb906 0) 580rpx 0/20rpx 200rpx no-repeat; filter: drop-shadow(4rpx 4rpx 4rpx rgba(0, 0, 0, 0.2)); } #newcomer_award .newcomer_award_templet4 .cupcon_list .cupcon_child::after { content: ''; height: 80rpx; border: 1rpx dashed #fff; position: absolute; left: 348rpx; top: 0; bottom: 0; margin: auto; } #newcomer_award .newcomer_award_templet4 .liqun_btn { margin-top: 28rpx; background-color: #05c676; color: #fff; }