/* 下单状态 */ .state { background: #2e71e3; padding: 30rpx 60rpx; width: 100%; box-sizing: border-box; color: #fff; font-size: 26rpx; display: flex; } .state.active { padding: 30rpx 100rpx 60rpx; } .state-title { flex: 1; font-size: 32rpx; } .state-title text { opacity:.8; display: block; font-size: 28rpx; margin-top: 10rpx; } .state-img { width: 70rpx; height: 70rpx; margin-top: 10rpx; } /* 默认地址 */ .content { padding: 0 30rpx; box-sizing: border-box; width: 100%; border-bottom: solid transparent 120rpx; } .site { background-color: #fff; margin-top: -30rpx; border-radius: 10rpx; padding: 30rpx; box-sizing: border-box; box-shadow: 0 0 10rpx rgba(0, 0, 0, .1); } .siteTips { text-align: center; } .siteTips-tips { color: #2e71e3; border: #2e71e3 2rpx solid; display: inline-block; font-size: 28rpx; line-height: 70rpx; padding: 0 20rpx; text-align: center; margin: 0 auto; } .siteTips-tips image { width: 32rpx; height: 32rpx; vertical-align: -5rpx; padding-right: 10rpx; } .siteCont { display: flex; position: relative; } .siteCont-right { width: calc(100% - 70rpx); margin-left: 30rpx; } .state-arrow { position: absolute; right: 0; top: 24rpx; width: 34rpx; height: 34rpx; } .siteCont-site { width: 40rpx; height: 40rpx; margin-top: 24rpx; } .site-text { margin-bottom: 10rpx; } .site-text text { padding-left: 10rpx; color: #999; font-size: 28rpx; } .site-all { font-size: 26rpx; } .goods { width: 100%; background-color: #fff; border-radius: 10rpx; padding: 30rpx; box-sizing: border-box; box-shadow: 0 0 10rpx rgba(0, 0, 0, .1); margin: 30rpx 0; } .goods-content { position: relative; } .goods-cont { position: absolute; left: 0; top: 0; width: 100%; padding-left: 150rpx; box-sizing: border-box; } .goods-title { margin: 10rpx 0 20rpx; font-weight: 600; font-size: 30rpx; } .goods-qty { color: #999; font-size: 28rpx; } .goods-cover { position: relative; width: 130rpx; height: 130rpx; } .goods-image { position: absolute; left: 0; top: 0; width: 100%; height: 100%; } .goods-type { position: absolute; z-index: 2; left: 15rpx; top: 15rpx; font-size: 24rpx; background-color: #5d69fb; color: #fff; border-radius: 50rpx; height: 36rpx; line-height: 34rpx; padding: 0 6rpx; } .goods-type.active { background-color: #fb5d64; } .goods-type text { transform: scale(.9); display: inline-block; } /* 规格 */ .label { background-color: #fff; border-radius: 10rpx; padding: 10rpx 30rpx; width: 100%; box-sizing: border-box; box-shadow: 0 0 10rpx rgba(0, 0, 0, .1); margin-bottom: 30rpx; position: relative; } .labelList { display: flex; line-height: 80rpx; font-size: 28rpx; } .labelList-label { flex: 1; } .rightsLabel-range { display: flex; color: #000; } .rightsLabel-row { width: 38rpx; height: 38rpx; margin: 20rpx 0 0 6rpx; } .rightsAdd { display: flex; padding-top: 14rpx; } .rightsAdd-btn { background: #eaeaea; color: #535353; border-radius: 50%; text-align: center; width: 50rpx; height: 50rpx; line-height: 45rpx; font-size: 40rpx; font-weight: 600; } .rightsAdd-input { width: 60rpx; text-align: center; font-size: 28rpx; line-height: 50rpx; } /* 购买 */ .buy { position: fixed; width: 100%; left: 0; bottom: 0; height: 100rpx; line-height: 100rpx; background-color: #fff; } .buy-price { background-color: #f1cb4c; color: #8d5226; width: calc(100% - 240rpx); position: absolute; left: 0; top: 0; height: 100%; padding-left: 50rpx; box-sizing: border-box; font-weight: 600; font-size: 32rpx; } .buy-price text { font-size: 42rpx; } .buy .buy-btn { background-color: #2e71e3; color: #fff; position: absolute; right: 0; top: 0; width: 240rpx; text-align: center; height: 100%; } /* 购买须知 */ .notice { background: white; margin: 30rpx 0; border-radius: 10rpx; padding: 10rpx 0; box-sizing: border-box; box-shadow: 0 0 30rpx rgba(0,0,0,.15); padding: 20rpx; } .noticeTitle { display: flex; } .noticeTitle-flex { flex: 1; display: flex; font-size: 28rpx; line-height: 46rpx; } .noticeTitle-img { width: 46rpx; height: 46rpx; margin-right: 20rpx; } .noticeText { font-size: 26rpx; height: 0; overflow: hidden; } .noticeText.active { height: auto; } .noticeText-top { margin: 30rpx 0 10rpx; font-weight: 600; } .noticeText-cont { line-height: 60rpx; } .noticeTitle-row { width: 46rpx; height: 46rpx; } .noticeTitle-row.active { transform: rotate(90deg); } /* 选择收货地址 */ .addressBack { position: fixed; left: 0; bottom: 0; background: rgba(0, 0, 0, .4); z-index: 10; width: 100%; height: 100%; display: none; } .addressBack.active { display: block; } .addressCont { position: fixed; left: 0; bottom: -1000%; transition: .2s; background: #fff; z-index: 11; width: 100%; } .addressCont.active { bottom: 0; } .addressCont-title { height: 90rpx; line-height: 90rpx; display: flex; padding: 0 30rpx; box-sizing: border-box; font-size: 28rpx; font-weight: 600; } .addressCont-left { flex: 1; } .addressCont-right { color: #309ded; } .header-classify { white-space: nowrap; box-sizing: border-box; height: 600rpx; } .addressCont-list { padding: 30rpx 20rpx; box-sizing: border-box; font-size: 30rpx; overflow: hidden; position: relative; } .addressCont-top { display: flex; margin-bottom: 10rpx; } .addressCont-name { font-weight: 600; } .addressCont-text { color: #666; width: calc(100% - 160rpx); } .addressCont-list:last-child { border: none; } .address-tool { display: flex; float: right; } .address-tool-btn { font-size: 24rpx; margin-top: 20rpx; border: 2rpx solid #666; color: #666; border-radius: 6rpx; text-align: center; height: 50rpx; line-height: 50rpx; padding: 0 20rpx; margin-right: 20rpx; display: flex; } .address-tool-btn-del { color: #dfae2e; border-color: #dfae2e; } .address-tool-icon { width: 120rpx; height: 54rpx; line-height: 54rpx; border-radius: 4rpx; text-align: center; color: #fff; position: absolute; top: 45rpx; right: 10rpx; background: #dfae2e; transform: scale(.9, .9); font-size: 24rpx; }