@charset "UTF-8"; /* 需要放到文件最上面 */ /* 水平间距 */ /* 水平间距 */ /* 以下变量是默认值,如不需要修改可以不用给下面的变量重新赋值 */ /* 水平间距 */ .content { display: flex; flex-direction: column; align-items: center; justify-content: center; background: #fff; } .position-details { width: 100%; padding-bottom: 140rpx; } .banner { position: relative; width: 100%; } .banner-swiper { height: 650rpx; } .banner-swiper-img { height: 650rpx !important; } .swiper-item image { width: 100%; } .indicator-dots { position: absolute; bottom: 30rpx; left: 0; right: 0; display: flex; justify-content: center; align-items: center; } .indicator-dots text { font-size: 24rpx; color: #FFFFFF; background: rgba(0, 0, 0, 0.5); border-radius: 50rpx; width: 64rpx; text-align: center; } .uni-swiper-dot { width: 40rpx; height: 4rpx; border-radius: 20rpx; } wx-swiper .wx-swiper-dot { width: 40rpx; height: 4rpx; border-radius: 20rpx; } .info { position: relative; padding: 30rpx; border-top-left-radius: 20rpx; border-top-right-radius: 20rpx; background: #FFFFFF; margin-top: -20rpx; } .info .title { font-size: 38rpx; font-weight: bold; } .price { padding-top: 20rpx; color: red; } .price text { font-size: 40rpx; } .price .price-text { display: inline-block; font-size: 26rpx; scale: 0.8; } .information { padding-top: 30rpx; } .head-tilte { font-size: 30rpx; font-weight: bold; } .information-list { display: flex; flex-wrap: wrap; padding: 20rpx 30rpx 0; } .information-box { width: 50%; display: flex; padding: 20rpx 0; } .information-title { font-size: 26rpx; color: #b4b4b4; } .information-text { font-size: 26rpx; color: #2d2d2d; } .arrangement { padding-top: 30rpx; } .arrangement-list { display: flex; flex-wrap: wrap; padding: 20rpx 0; } .arrangement-box { width: 20%; padding-top: 20rpx; text-align: center; } .arrangement-icon { color: red; font-size: 64rpx; } .arrangement-text { padding-top: 6rpx; font-size: 24rpx; } .desc { padding-top: 20rpx; } .desc-text { padding: 30rpx 30rpx 20rpx 30rpx; } .desc-text text { line-height: 44rpx; font-size: 28rpx; } .map { padding: 30rpx 0 0 0; } .btn { position: fixed; bottom: 0; left: 0; right: 0; display: flex; justify-content: center; align-items: center; padding: 20rpx 1%; background: #fff; } .share { flex: 1; text-align: center; background: #4a55fd; border-radius: 8rpx; height: 90rpx; text-align: center; margin: 0 1%; display: flex; justify-content: center; align-items: center; } .share text { font-size: 26rpx; color: #fff; } .share button { padding: 0; margin: 0; color: #fff; font-size: 26rpx; border-radius: 8rpx; height: 90rpx; background: #4a55fd; line-height: 90rpx; } .color01 { background: linear-gradient(to right, #fea733, #feb34d, #fdc46b); } .color02 { background: linear-gradient(to right, #ff4761, #fe606e, #fc706f); } .bnt-box { position: fixed; right: 20rpx; bottom: 12%; } .bnt-box button { display: flex; justify-content: center; align-items: center; padding: 0; margin: 14rpx 0; width: 76rpx; height: 76rpx; border-radius: 50%; background: white; box-shadow: 0px 2px 4px #e9e9e9; } .bnt-box button text { color: #666666; } .bnt-box .kefunv { color: #666666; font-size: 40rpx; } .recommend-list { padding: 0 10rpx; }