H5_module/leaflet/detail/index.css

page{background: #fff;}
.top-fixed{position: fixed;left: 0;top: 0;right: 0;z-index: 50;}
.bgcolor {background: #fff;position: absolute;top: 0;left: 0;right: 0;transition: .3s all ease;opacity: 0;}
.opacity{opacity: 1;}
.top-fixed-c{position: relative;}
.back{position: absolute;top: 50%;transform: translateY(-50%);left: 0;padding-left: 30rpx;}
.back image{width: 24rpx;height: 39rpx;}
.top-title{font-size: 34rpx;color: #000;font-weight: bold;padding-left: 75rpx;max-width: 60%;}
.top{background: #fff;padding: 20rpx 30rpx;}
.logos{font-size: 22rpx;color: #666;}
.logo-img{width: 185rpx;height: 39rpx;margin-right: 15rpx;}
.logo-r{position: relative;padding-left: 10rpx;}
.logo-r:before{content: '';display: block;width: 1rpx;height: 39rpx;background-color: #D1D1D1;position: absolute;top: 50%;transform: translateY(-50%);left: 0;}
.logo-r .ddflex{font-size: 20rpx;color: #999;margin-bottom: 5rpx;}
.logo-r .ddflex image{width: 17rpx;height: 24rpx;margin-right: 5rpx;}
.tel{width: 210rpx;height: 70rpx;border: 1rpx solid #FA9350;border-radius: 8rpx;}
.tel-t{height: 32rpx;background-color: #FA9350;font-size: 20rpx;color: #fff;justify-content: center;}
.tel-t image{width: 20rpx;height: 20rpx;margin-right: 7rpx;}
.call{font-size: 26rpx;color: #FA9350;font-weight: bold;text-align: center;line-height: 38rpx;}
/* 轮播图 */
.ban{height: 400rpx;position: relative;background: #fff;}
.swiper{width: 100%;height: 400rpx;}
.swiper image{width: 100%;height: 100%;}
.swiper-img{width: 750rpx;height: 400rpx;}
.dots{position: absolute;left: 50%;transform: translateX(-50%);bottom: 30rpx;z-index: 3;justify-content: center;}
.dot{width: 12rpx;height: 12rpx;background: rgba(255,255,255,.4);margin: 0 3rpx;border-radius: 6rpx;}
.dot.active{background: #fff;width: 28rpx;}
/* 表单 */
.form{padding: 40rpx 30rpx;background: #fff;}
.form-title{font-size: 38rpx;color: #000;font-weight: bold;text-align: center;}
.form-list{margin-top: 40rpx;}
.form-list .li{margin-bottom: 30rpx;border-bottom: 1rpx solid #D1D1D1;}
.label{font-size: 28rpx;color: #666;}
.ipt{font-size: 28rpx;color: #333;padding: 25rpx 0;}
.textarea{font-size: 28rpx;color: #333;padding: 25rpx 0;height: 140rpx;width: 100%;box-sizing: border-box;}
.phone-ipt{font-size: 28rpx;color: #333;text-align: left;padding: 25rpx 0 !important;}
.placeholder{color: #ccc;}
.form-btn{margin-top: 60rpx;background: var(--mina);font-size: 30rpx;color: #fff;text-align: center;line-height: 90rpx;border-radius: 10rpx;}
/* 文本 */
.richText{background: #fff;padding: 40rpx 30rpx;font-size: 34rpx;color: #333;line-height: 1.7;margin: 20rpx 0;}
/* 商品 */
.product{margin: 20rpx 0;padding: 0 30rpx;background: #fff;}
.product .li{border-bottom: 1rpx solid #e9e9e9;padding: 30rpx 0;align-items: flex-start;}
.product .li:last-child{border-bottom: none;}
.pro-img{width: 200rpx;height: 200rpx;border-radius: 15rpx;margin-right: 20rpx;}
.pro-info{height: 200rpx;position: relative;}
.pro-name{font-size: 30rpx;color: #333;line-height: 40rpx;height: 85rpx;overflow: hidden;}
.pro-bri{font-size: 24rpx;color: #999;}
.pro-opt{justify-content: space-between;position: absolute;left: 0;right: 0;bottom: 0;}
.money{font-size: 36rpx;color: #C5020B;font-weight: bold;}
.money text{font-size: 22rpx;color: #252A3B;margin-left: 5rpx;font-weight: normal;}
.pro-btn{background: var(--mina);height: 50rpx;border-radius: 25rpx;padding: 0 20rpx;font-size: 28rpx;color: #fff;text-align: center;line-height: 50rpx;}
.product2{margin: 20rpx 0;padding: 30rpx;}
.product2 .li{width: 330rpx;margin-right: 30rpx;background: #fff;border-radius: 15rpx;}
.product2 .li:nth-child(2n){margin-right: 0;}
.product2 .pro-img{width: 330rpx;height: 330rpx;border-radius: 15rpx 15rpx 0 0;}
.product2 .li .pro-info{padding: 20rpx;height: auto;}
.product2 .li .pro-opt{position: inherit;margin-top: 10rpx;}
.pro-cart image{width: 42rpx;height: 42rpx;}
.product3{margin: 20rpx 0;padding: 20rpx 0;background: none;height: 260rpx;overflow: hidden;}
.product3 scroll-view{white-space: nowrap;padding-bottom: 20rpx;}
.product3 .li{width: 600rpx;margin-right: 30rpx;border: none;display: inline-block;padding: 30rpx;background: #fff;border-radius: 20rpx;}
.product3 .li:first-child{margin-left: 30rpx;}
/* 图片 */
.images image{width: 100%;}
/* 客服 */
.contact{position: fixed;bottom: 20%;right: 30rpx;z-index: 50;background: rgba(255,255,255,.9);box-shadow: 0 0 10rpx rgba(0,0,0,.1);justify-content: center;font-size: 24rpx;color: #333;flex-direction: column;width: 100rpx;height: 100rpx;border-radius: 50%;}
.contact image{width: 40rpx;height: 34rpx;margin: 0 auto 5rpx;}
/* 分享 */
.share{position: fixed;bottom: 30%;right: 30rpx;z-index: 50;background: rgba(255,255,255,.9);box-shadow: 0 0 10rpx rgba(0,0,0,.1);justify-content: center;font-size: 24rpx;color: #333;flex-direction: column;width: 100rpx;height: 100rpx;border-radius: 50%;}
.share image{width: 34rpx;height: 34rpx;margin: 0 auto 5rpx;}