.container { width: 100%; height: 100%; background-color: #F7F7F7; } .container .shop-info, .container .product-desc, .container .order-time, .container .product-mobile { width: 93%; margin: 15rpx auto; background-color: #fff; } .container .shop-info { position: relative; height: 180rpx; width: 93%; margin: 10rpx auto; background-color: #fff; } .container .shop-info .address-icon { width: 50rpx; height: 53rpx; position: absolute; top: 50%; transform: translateY(-50%); left: 70rpx; } .container .shop-info .shop { height: 180rpx; text-align: left; margin-left: 180rpx; display: flex; flex-direction: column; justify-content: center; } .container .shop-info .shop .shop-name { font-size: 17px; color: #000; font-weight: 500; letter-spacing: 2rpx; } .container .shop-info .shop .address { font-size: 13px; color: #999; font-weight: 400; margin-top: 20rpx; letter-spacing: 1rpx; } .container .product-desc { display: flex; flex-direction: column; } .container .product-desc .product { display: flex; justify-content: flex-start; height: 200rpx; padding: 20rpx; border-bottom: 1rpx solid #ECECEC; } .container .product-desc .product .product-img { width: 270rpx; } .container .product-desc .product .product-img image { width: 100%; height: 100%; } .container .product-desc .product .product-name { margin-left: 20rpx; position: relative; padding-top: 10rpx; } .container .product-desc .product .product-name .title { font-size: 17px; } .container .product-desc .product .product-name .price { font-size: 18px; position: absolute; bottom: 0; left: 0; display: flex; justify-content: flex-start; } .container .product-desc .product .product-name .price :first-child { font-size: 12px; color: #424242; padding-top: 25rpx; margin-right: 10rpx; } .container .people-num { display: flex; justify-content: space-between; height: 90rpx; background-color: #fff; line-height: 90rpx; align-items: center; margin-bottom: 10rpx; padding-left: 20rpx; } .container .people-num .num-box { width: 250rpx; display: flex; justify-content: space-around; } .container .people-num .num-box > view { width: 40rpx; height: 40rpx; margin: 5rpx 0; background-color: #fff; } .container .people-num .num-box > view > image { width: 30rpx; height: 30rpx; margin-left: 10rpx; } .container .people-num .num-box .num-text { width: 50rpx; height: 90rpx; line-height: 90rpx; text-align: center; } .container .desc-title { width: 100%; text-align: center; color: #646464; line-height: 100rpx; letter-spacing: 4rpx; } .container .order-time { background-color: #fff; margin-bottom: 20rpx; display: flex; justify-content: flex-start; position: relative; } .container .order-time .weui-tabs { width: 100%; } .container .order-time .weui-tabs .weui-tabs-bar__wrp .weui-tabs-bar__content { height: 95rpx; line-height: 94rpx; white-space: nowrap; display: flex; justify-content: space-around; border-bottom: 1rpx solid #ECECEC; } .container .order-time .weui-tabs .weui-tabs-bar__wrp .weui-tabs-bar__content .weui-tabs-bar__item { width: 14.2857%; } .container .order-time .weui-tabs .weui-tabs-bar__wrp .weui-tabs-bar__content .weui-tabs-bar__item .weui-tabs-bar__title { width: 100rpx; text-align: center; border-bottom-width: 6rpx; font-size: 13px; } .container .order-time .weui-tabs .weui-tabs-swiper { height: 800rpx; } .container .order-time .tab-content .orders { display: flex; flex-wrap: wrap; background-color: #fff; margin-top: 15rpx; } .container .order-time .tab-content .orders .time-info { width: 166rpx; height: 80rpx; line-height: 80rpx; background-color: #F5F5F5; margin: 5rpx 5rpx; text-align: center; } .container .order-time .tab-content .orders .select-time { background-color: #BA9D6E; color: #fff; } .container .order-time .tab-content .orders .out-time { color: #acacac; } .container .product-mobile { height: 200rpx; position: relative; margin-bottom: 50rpx; display: flex; flex-direction: column; } .container .product-mobile button { background-color: transparent; color: #202020; font-weight: 400; height: 100rpx; line-height: 100rpx; padding: 0; /* margin: 0; */ position: absolute; left: 60rpx; top: 0; } .container .product-mobile .phone { display: flex; position: relative; height: 100rpx; line-height: 100rpx; } .container .product-mobile .phone .phone-icon { position: absolute; width: 50rpx; height: 50rpx; top: 50%; transform: translateY(-50%); left: 40rpx; } .container .product-mobile .phone .desc-text { margin-left: 140rpx; letter-spacing: 4rpx; } .container .product-mobile :first-child { border-bottom: 1px solid #ECECEC; } .container .appointment { width: 100%; height: 100rpx; display: flex; justify-content: flex-start; } .container .appointment .price { flex: 1; background-color: #222224; color: #fff; padding-left: 36rpx; line-height: 100rpx; font-weight: 300; letter-spacing: 2rpx; } .container .appointment .btn { width: 300rpx; background-color: #BA9D6E; text-align: center; line-height: 100rpx; }