wxd / MShopWeApp

page {
	box-sizing: border-box;
	padding: 20rpx 20rpx 0;
	background-color: #f2f2f2;
	font-size: 28rpx;
}

.bdr12 {
	border-radius: 12rpx;
}

.w40 {
	width: 40%;
	box-sizing: border-box;
}

.btn-border {
	border: 2rpx solid #808080;
}


.bg-red {
	background-image: -webkit-linear-gradient(315deg,#f2140c,#f2270c 70%,#f24d0c);
	background-image: linear-gradient(135deg,#f2140c,#f2270c 70%,#f24d0c);
}

.bg-orange {
	background-image: -webkit-linear-gradient(315deg,#ffba0d,#ffc30d 69%,#ffcf0d);
	background-image: linear-gradient(135deg,#ffba0d,#ffc30d 69%,#ffcf0d);
}

.bg-gray {
 	background-image: -webkit-linear-gradient(315deg,#bfbfbf,#c3c3c3 70%,#d4d3d3);
 	background-image: linear-gradient(135deg,#bfbfbf,#c3c3c3 70%,#d4d3d3);
 }

.c-orange {
	color: #ff9000;
}

.main {
	padding-bottom: 134rpx;
}

.pic-box {
	width: 130rpx;
	height: 130rpx;
	border-radius: 12rpx;
	overflow: hidden;
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: pink;
}

.rmb::before {
	content: '￥';
}

.title {
	height: 88rpx;
}

.separator {
	position: relative;
}

.separator::before {
	content: '';
	position: absolute;
	width: 2rpx;
	height: 30%;
	background-color: #f8f8f8;
	left: 0;
	top: 0;
	bottom: 0;
	margin: auto;
}

.btn-bar {
	box-sizing: border-box;
	position: fixed;
	left: 0;
	bottom: 0;
	width: 100%;
	font-size: 26rpx;
	border-top: 2rpx solid #f2f2f2;
}

.btn {
	width: 50%;
	box-sizing: border-box;
	display: inline-block;
	height: 70rpx;
	line-height: 70rpx;
	padding: 0 40rpx;
	border-radius: 100rpx;
}

.btn-copy {
	display: block;
	color: #666;
	font-size: 22rpx;
	padding: 0 20rpx;
	border-radius: 6rpx;
	background-color: #f0f0f0;
}

.del {
	text-decoration: line-through;
}





.mask {
 	position: fixed;
 	width: 100%;
 	height: 100%;
 	top: 0;
	left: 0;
 	background-color: rgba(0,0,0,.7);
 	z-index: 1;
 }
 
 .popup-container {
	 position: fixed;
	 width: 70%;
	 border-radius: 12rpx;
	 top: 50%;
	 left: 50%;
	 transform: translate(-50%, -50%);
	 z-index: 3;
 }
 
 .popup {
	 text-align: center;
	 border-radius: 12rpx;
	 background-color: white;
	 overflow: hidden;
	 /* width: 80%; */
 }
 
 .popup-container .icon-close {
	 color: rgba(255,255,255,.6);
 }
 
 .popup-title {
	 padding: 40rpx 0;
	 color: #fe0000;
	 background-color: #FFD3D6;
	 position: relative;
 }
 
 .popup-title::after {
	 content: '';
	 position: absolute;
	 left: -20rpx;
	 bottom: -12rpx;
	 width: 130%;
	 height: 20rpx;
	 background: -webkit-radial-gradient(circle, #FFD3D6, #FFD3D6 20rpx, transparent 20rpx, transparent);
	 background: -moz-radial-gradient(circle, #FFD3D6, #FFD3D6 20rpx, transparent 20rpx, transparent);
	 background: -o-radial-gradient(circle, #FFD3D6, #FFD3D6 20rpx, transparent 20rpx, transparent);
	 background: radial-gradient(circle, #FFD3D6, #FFD3D6 20rpx, transparent 20rpx, transparent);
	 background-size: 40rpx 40rpx;
	 transform: rotate(180deg);
	 -webkit-transform: rotate(180deg);
 }
 
 
 .popup .rmb::before {
	 font-size: 40rpx;
 }
 
 .img-qr {
	 display: block;
	 width: 300rpx;
	 height: 300rpx;
	 margin: 0 auto;
	 background-color: pink;
 }
 
 .barcode {
	 width: 100%;
	 height: 140rpx;
 }
 
 .qrcode {
	 width: 300rpx;
	 height: 300rpx;
	 margin: 0 auto;
 }
 
 
 .noMore {
	 padding: 20rpx;
	 color: #bbb;
	 text-align: center;
	 font-size: 22rpx;
 }
 
 .breakall {
	 word-break: break-all;
 }
 
 .bar-container {
	 box-sizing: border-box;
	 padding: 30rpx 20rpx;
 }