@charset "UTF-8"; .uni-load-more { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -webkit-flex-direction: row; flex-direction: row; height: 80rpx; -webkit-box-align: center; -webkit-align-items: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; justify-content: center } .uni-load-more__text { font-size: 28rpx; color: #999 } .uni-load-more__img { height: 24px; width: 24px; margin-right: 10px } .uni-load-more__img>.load { position: absolute } .uni-load-more__img>.load .item { width: 6px; height: 2px; border-top-left-radius: 1px; border-bottom-left-radius: 1px; background: #999; position: absolute; opacity: .2; -webkit-transform-origin: 50%; transform-origin: 50%; -webkit-animation: load 1.56s ease infinite; animation: load 1.56s ease infinite } .uni-load-more__img>.load .item:nth-child(1) { -webkit-transform: rotate(90deg); transform: rotate(90deg); top: 2px; left: 9px } .uni-load-more__img>.load .item:nth-child(2) { -webkit-transform: rotate(180deg); transform: rotate(180deg); top: 11px; right: 0 } .uni-load-more__img>.load .item:nth-child(3) { -webkit-transform: rotate(270deg); transform: rotate(270deg); bottom: 2px; left: 9px } .uni-load-more__img>.load .item:nth-child(4) { top: 11px; left: 0 } .load1, .load2, .load3 { height: 24px; width: 24px } .load2 { -webkit-transform: rotate(30deg); transform: rotate(30deg) } .load3 { -webkit-transform: rotate(60deg); transform: rotate(60deg) } .load1 .item:nth-child(1) { -webkit-animation-delay: 0s; animation-delay: 0s } .load2 .item:nth-child(1) { -webkit-animation-delay: .13s; animation-delay: .13s } .load3 .item:nth-child(1) { -webkit-animation-delay: .26s; animation-delay: .26s } .load1 .item:nth-child(2) { -webkit-animation-delay: .39s; animation-delay: .39s } .load2 .item:nth-child(2) { -webkit-animation-delay: .52s; animation-delay: .52s } .load3 .item:nth-child(2) { -webkit-animation-delay: .65s; animation-delay: .65s } .load1 .item:nth-child(3) { -webkit-animation-delay: .78s; animation-delay: .78s } .load2 .item:nth-child(3) { -webkit-animation-delay: .91s; animation-delay: .91s } .load3 .item:nth-child(3) { -webkit-animation-delay: 1.04s; animation-delay: 1.04s } .load1 .item:nth-child(4) { -webkit-animation-delay: 1.17s; animation-delay: 1.17s } .load2 .item:nth-child(4) { -webkit-animation-delay: 1.3s; animation-delay: 1.3s } .load3 .item:nth-child(4) { -webkit-animation-delay: 1.43s; animation-delay: 1.43s } @-webkit-keyframes load { 0% { opacity: 1 } 100% { opacity: .2 } } @charset "UTF-8"; /* 页面左右间距 */ /* 文字尺寸 */ /*文字颜色*/ /* 边框颜色 */ /*颜色*/ /* 图片加载中颜色 */ /* 行为相关颜色 */ /* 功能栏字体大小 */ /*功能栏左侧小图标*/ page { background: #f5f5f5; } .top_header { padding: 25rpx 0rpx; } .top_header .top-address { position: fixed; top: 0; width: 100% !important; z-index: 999; padding-bottom: 25rpx; } .top_header .top-address .header { width: 100%; padding: 0 4%; height: 100rpx; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; } .top_header .top-address .header .addr { height: 60rpx; -webkit-flex-shrink: 0; flex-shrink: 0; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; font-size: 36rpx; font-weight: bold; width: 90%; color: #ffffff; } .top_header .top-address .header .addr .icon { height: 60rpx; margin-right: 15rpx; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; font-size: 42rpx; color: #ffffff; } .top_header .top-address .header .config { width: 120rpx; height: 60rpx; -webkit-flex-shrink: 0; flex-shrink: 0; display: -webkit-box; display: -webkit-flex; display: flex; } .top_header .top-address .header .config .message { width: 65rpx; height: 65rpx; 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; font-size: 42rpx; color: #ffffff; } .top_header .zhanwei { width: 100% !important; height: 60rpx; } .search-box { height: 120rpx; } .input-box { width: 80%; margin-left: 25rpx; height: 70rpx; background-color: #ffffff; border-radius: 50rpx; position: relative; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; } .input-box .icon { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; position: absolute; top: 0; left: 35rpx; width: 60rpx; height: 70rpx; font-size: 34rpx; color: #c0c0c0; } .input-box input { padding-left: 100rpx; height: 28rpx; font-size: 28rpx; } .queding { color: #ffffff; font-size: 35rpx; padding: 25rpx 25rpx; } .swiper { width: 100%; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; justify-content: center; } .swiper .swiper-box { width: 100%; height: 346rpx; overflow: hidden; position: relative; z-index: 1; } .swiper .swiper-box swiper { width: 100%; height: 346rpx; } .swiper .swiper-box swiper swiper-item image { width: 100%; height: 346rpx; } .swiper .swiper-box .indicator { position: absolute; bottom: 20rpx; left: 20rpx; background-color: rgba(255, 255, 255, 0.4); width: 150rpx; height: 5rpx; border-radius: 3rpx; overflow: hidden; display: -webkit-box; display: -webkit-flex; display: flex; } .swiper .swiper-box .indicator .dots { width: 0rpx; background-color: white; -webkit-transition: all 0.3s ease-out; transition: all 0.3s ease-out; } .swiper .swiper-box .indicator .dots.on { width: 33.33333%; } .Live-list { margin-top: 25rpx; width: 100%; background-color: #ffffff; font-size: 24rpx; padding: 35rpx 35rpx; } .Live-list .list-name { padding-bottom: 35rpx; } .Live-list .list-name .list-tip { position: relative; padding-left: 25rpx; color: #6786fb; font-size: 32rpx; } .Live-list .list-name .list-tip .tip { position: absolute; left: 0rpx; width: 10rpx; height: 45rpx; background-color: #6786fb; border-radius: 25rpx; } .Live-list .list-name .list-more { color: #999999; font-size: 24rpx; } .scoll-wrapper { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: start; -webkit-align-items: flex-start; align-items: flex-start; } .scoll-wrapper .floor-item { width: 220rpx; font-size: 26rpx; margin-right: 25rpx; } .scoll-wrapper .floor-item .img-box { position: relative; } .scoll-wrapper .floor-item .img-box .list-image { width: 220rpx; height: 144rpx; border-radius: 15rpx; box-shadow: 0px 6px 10px 0px rgba(0, 0, 0, 0.04); } .scoll-wrapper .floor-item .img-box .tip { position: absolute; right: 15rpx; top: 0rpx; background: #ff6700; width: 45rpx; text-align: center; font-size: 18rpx; color: #ffffff; padding: 10rpx 0rpx; border-bottom-left-radius: 25rpx; border-bottom-right-radius: 25rpx; } .scoll-wrapper .floor-item .tip-box { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; padding-top: 5rpx; } .scoll-wrapper .floor-item .tip-box .tip { background: rgba(103, 134, 251, 0.18); color: #6786FB; margin-right: 15rpx; margin-top: 10rpx; padding: 2rpx 10rpx; } .scoll-wrapper .floor-item .title { font-size: 26rpx !important; font-weight: 500; } .scoll-wrapper .floor-item .info { color: #999999; font-size: 24rpx; padding-top: 15rpx; } /*公用边框样式*/ .guess-section { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; } .guess-section .guess-item { position: relative; overflow: hidden; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; flex-direction: column; width: 47%; margin-bottom: 2%; background-color: white; padding-bottom: 30rpx; } .guess-section .tip-box { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; padding-top: 5rpx; } .guess-section .tip-box .tip { background: rgba(103, 134, 251, 0.18); color: #6786FB; margin-right: 15rpx; margin-top: 10rpx; padding: 2rpx 10rpx; } .guess-section .imagewrapper { width: 100%; height: 204rpx; margin-bottom: 15rpx; } .guess-section .imagewrapper image { border-radius: 15rpx; width: 100%; height: 100%; } .guess-section .title { font-size: 30rpx; color: #303133; } .guess-section .info { color: #e73932; padding-top: 15rpx; font-size: 30rpx; } .preferred_centent { width: 100%; } .preferred_centent .preferred_item { width: 100%; height: 100%; border-top: 1px solid #f0f0f0; padding: 35rpx 0rpx; } .preferred_centent .preferred_item .goods_image image { width: 140rpx; height: 140rpx; border-radius: 100%; } .preferred_centent .preferred_item .goods_name { padding-left: 25rpx; width: 50%; } .preferred_centent .preferred_item .goods_name .goods_title { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 30rpx; font-weight: 400; } .preferred_centent .preferred_item .goods_name .goods_info { padding-top: 15rpx; font-size: 24rpx; color: #999999; } .preferred_centent .preferred_item .btn-tpl { margin-left: 10rpx; border: 2rpx solid #305cec; padding: 13rpx 20rpx; color: #6786fb; border-radius: 15rpx; } .preferred_centent .preferred_item .btn-tpl .tpl-img { padding-right: 10rpx; } .preferred_centent .preferred_item .btn-tpl .tpl-img image { margin-top: 8rpx; width: 35rpx; height: 35rpx; }