.HotName { font-size: 50rpx; margin-left: 40rpx; margin-top: 30rpx; color: #293539; font-weight: 300; position: relative; } .HotName text { width: 14rpx; height: 14rpx; position: absolute; border: 4rpx solid #a78845; border-radius: 50%; } .HotMark { margin-left: 50rpx; color: #293539; font-size: 36rpx; margin-top: 10rpx; text-align: center; width: 350rpx; border-bottom: 1rpx solid #a78845; } .HotSwiper swiper { width: 100%; height: 800rpx; } .swiper-box { width: 520rpx; margin: 0 auto; position: relative; height: 700rpx; box-shadow: 0px 10rpx 30rpx 0px #cfc9ca; margin-top: 40rpx; border-radius: 20rpx; } .swiper-box image { width: 100%; height: 520rpx; background-color: #f5f5f5; border-top-left-radius: 10rpx; border-top-right-radius: 10rpx; } .swiper-box-info { position: absolute; width: 100%; height: 100rpx; top: 520rpx; background-color: #fff; border-bottom-right-radius: 10rpx; border-bottom-left-radius: 10rpx; } .swiper-box-info .name { width: 90%; margin: 0 auto; margin-top: 20rpx; font-size: 32rpx; margin-left: 35rpx; color: #293539; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .swiper-box-info .price { float: left; width: 60%; margin-top: 10rpx; margin-left: 30rpx; } .swiper-box-info .counterPrice { text-decoration: line-through; font-size: 30rpx; color: #999; } .swiper-box-info .retailPrice { font-size: 30rpx; color: #a78845; } .capsule-tag { float: right; padding-right: 20rpx; padding-top: 8rpx; } .zan-capsule + .zan-capsule { margin-left: 10px; } .a-section .h { display: flex; flex-flow: row nowrap; align-items: center; justify-content: center; height: 130rpx; } .a-section .h .title { display: flex; flex-flow: row nowrap; align-items: center; justify-content: center; background-color: #a78845; height: 75rpx; } .a-section .h .txt { padding-left: 50rpx; padding-right: 50rpx; height: 75rpx; color: #fff; font-size: 33rpx; } .a-brand .b { width: 750rpx; height: auto; overflow: hidden; position: relative; } .a-brand .wrap { position: relative; } .a-brand .img { position: absolute; left: 0; top: 0; } .a-brand .mt { position: absolute; z-index: 2; padding: 4rpx 12rpx; background-color: #a78845; right: 0; top: 0; } .a-brand .mt .brand { display: block; font-size: 24rpx; height: 33rpx; color: #fff; } .a-brand .mt .price, .a-brand .mt .unit { font-size: 25rpx; color: #fff; } .a-brand .item-1 { float: left; width: 375rpx; height: 252rpx; overflow: hidden; border-top: 1rpx solid #fff; margin-left: 1rpx; } .a-brand .item-1:nth-child(2n+1) { margin-left: 0; width: 374rpx; } .a-brand .item-1 .img { width: 375rpx; height: 253rpx; } .a-topic .b { height: 533rpx; width: 750rpx; padding: 0 0 48rpx 0; } .a-topic .b .list { height: 533rpx; width: 750rpx; white-space: nowrap; } .a-topic .b .item { display: inline-block; height: 533rpx; width: 680.5rpx; margin-left: 30rpx; overflow: hidden; } .a-topic .b .item:last-child { margin-right: 30rpx; } .a-topic .b .img { height: 387.5rpx; width: 680.5rpx; margin-bottom: 30rpx; } .a-topic .b .np { height: 35rpx; margin-bottom: 13.5rpx; color: #333; font-size: 30rpx; } .a-topic .b .np .price { margin-left: 20.8rpx; color: #a78845; } .a-topic .b .desc { display: block; height: 30rpx; color: #999; font-size: 24rpx; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .a-groupon { width: 750rpx; height: auto; overflow: hidden; } .a-groupon .b .item { border-top: 1px solid #d9d9d9; margin: 0 20rpx; height: 244rpx; width: 710rpx; } .a-groupon .b .img { margin-top: 12rpx; margin-right: 12rpx; float: left; width: 220rpx; height: 220rpx; } .a-groupon .b .right { float: left; height: 244rpx; width: 476rpx; display: flex; flex-flow: row nowrap; } .a-groupon .b .text { display: flex; flex-wrap: nowrap; flex-direction: column; justify-content: center; overflow: hidden; height: 244rpx; width: 476rpx; } .a-groupon .b .name { float: left; width: 330rpx; display: block; color: #333; line-height: 50rpx; font-size: 30rpx; } .a-groupon .capsule-tag { float: right; padding-right: 0rpx; padding-top: 8rpx; } .a-groupon .zan-capsule + .zan-capsule { margin-left: 10px; } .a-groupon .b .desc { width: 476rpx; display: block; color: #999; line-height: 50rpx; font-size: 25rpx; } .a-groupon .b .price { width: 476rpx; display: flex; color: #b4282d; line-height: 50rpx; font-size: 33rpx; } .a-groupon .b .counterPrice { text-decoration: line-through; font-size: 28rpx; color: #999; } .a-groupon .b .retailPrice { margin-left: 30rpx; font-size: 28rpx; color: #a78845; } .good-grid { width: 750rpx; height: auto; overflow: hidden; } .good-grid .h { display: flex; flex-flow: row nowrap; align-items: center; justify-content: center; height: 130rpx; font-size: 33rpx; color: #333; border: #a78845 1rpx; }