
	.app {
		padding: 0;

		.close {
			width: 31rpx;
			height: 31rpx;
			position: absolute;
			top: 2%;
			right: 2%;
			z-index: 999;
		}

		.scroll-Y {
			height: 550rpx;
			background-color: #F4F5F7;
		}

		.mask {
			.couponmask {
				z-index: 999;
				height: 800rpx;
				position: fixed;
				bottom: 0;
				width: 100%;
				background: #FFFFFF;
				border-radius: 30rpx;

				.titles {
					width: 100%;
					height: 40rpx;
					font-size: 42rpx;
					margin: 20rpx auto;
					text-align: center;
				}

				.item {
					width: 94%;
					height: 240rpx;
					margin: 20rpx auto 0;
					border: 1rpx solid #f4f5f7;
					border-radius: 10rpx;

					.bottom {
						font-size: 22rpx;
						color: #969394;
						line-height: 60rpx;
						padding-left: 25rpx;
						border-radius: 0 0 10rpx 10rpx;
					}

					.top {
						width: 100%;
						height: 180rpx;
						background: #FDE9E8;
						position: relative;
						color: #F44B2F;
						border-radius: 10rpx 10rpx 0 0;

						.what {
							// width: 120rpx;
							padding: 0 10rpx;
							height: 40rpx;
							background: #FED1D2;
							border-radius: 16rpx;
							font-size: 20rpx;
							line-height: 40rpx;
							text-align: center;
							position: absolute;
							top: 120rpx;
							left: 20rpx;
						}

						.btn2 {
							width: 130rpx;
							height: 180rpx;
							background: #DFDEDE;
							position: absolute;
							top: 0;
							right: 0;
							text-align: center;
							line-height: 180rpx;
						}

						.btn {
							width: 98rpx;
							height: 50rpx;
							border: 2rpx solid #F44B2F;
							border-radius: 24rpx;
							font-size: 24rpx;
							position: absolute;
							top: 70rpx;
							right: 20rpx;
							text-align: center;
							line-height: 49rpx;
						}

						.time {
							font-size: 24rpx;
							position: absolute;
							top: 120rpx;
							left: 200rpx;
						}

						.texts {
							font-size: 32rpx;
							font-weight: 800;
							position: absolute;
							top: 44rpx;
							left: 200rpx;
						}

						.title {
							position: absolute;
							top: 30rpx;
							left: 10rpx;

							.price {
								font-size: 54rpx;
								font-weight: 700;
							}

							.text {
								font-weight: 600;
								font-size: 34rpx;
							}
						}
					}
				}
			}

			.information {
				width: 70%;
				height: 400rpx;
				margin: 50% auto;
				background: #FFFFFF;
				border-radius: 30rpx;
				text-align: center;
				color: #FFFFFF;
				position: relative;

				.determine,
				.cancel {
					width: 200rpx;
					height: 70rpx;
					border-radius: 26rpx;
					font-size: 34rpx;
					line-height: 70rpx;
					position: absolute;
					top: 74%;
				}

				.determine {
					background: #26A888;
					right: 36rpx;
				}

				.cancel {
					background: #C5BFBF;
					left: 36rpx;
				}

				.title {
					font-size: 42rpx;
					margin-top: 40rpx;
					color: #000000;
				}

				image {
					width: 100rpx;
					height: 100rpx;
					margin: 10% 0 0 0;
				}
			}
		}

		.mask {
			.PurchasePage {
				position: fixed;
				bottom: 0;
				height: 1000rpx;
				width: 100%;
				background: #FFFFFF;
				border-radius: 30rpx 30rpx 0px 0px;
				font-size: 36rpx;
				padding-bottom: 20rpx;
				z-index: 10;

				.bodys {
					background-color: #FFFFFF;
					width: 96%;
					margin: 10rpx auto 0;
					border-radius: 20rpx;
					padding: 15rpx 0 20rpx;
					position: relative;

					.addressinfo {
						font-size: 32rpx;
						line-height: 65rpx;
						margin-left: 90rpx;

						image {
							width: 40rpx;
							height: 50rpx;
							position: absolute;
							top: 50%;
							left: 20rpx;
							transform: translateY(-50%);
						}

						.address {
							padding-top: 10rpx;
							width: 92%;
							font-size: 30rpx;
							word-break: break-all;
							line-height: 45rpx;
						}

						.namephone {
							width: 70%;
							text-overflow: ellipsis;
							overflow: hidden;
							white-space: nowrap;
						}

						.picture2 {
							position: absolute;
							top: 50%;
							right: 20rpx;
							transform: translateY(-50%);

							image {
								width: 18rpx;
								height: 18rpx;
								color: #FFFFFF;
								margin-left: 20rpx;
							}
						}
					}
				}


				.topcontent {
					width: 96%;
					margin: 0 auto;
					padding-bottom: 15rpx;
					position: relative;

					.goodsStock {
						font-size: 24rpx;
						position: absolute;
						top: 55%;
						right: 10rpx;
					}

					.prices {
						position: absolute;
						top: 65%;
						left: 230rpx;

						.Paidinprice {
							font-size: 28rpx;
							margin-left: 10rpx;
							color: #fff;
							border-radius: 20rpx;
							display: inline-block;
							padding: 0 10rpx;
							background-color: #D43953;
						}

						.price {
							color: #D43953;
						}
					}

					.title {
						font-size: 36rpx;
						position: absolute;
						top: 3%;
						left: 230rpx;
						font-weight: 600;
						width: 58%;
						// height: 85rpx;
						overflow: hidden;
						text-overflow: ellipsis;
						display: -webkit-box;
						-webkit-box-orient: vertical;
						-webkit-line-clamp: 2;
						word-break: break-all;
					}

					.image {
						width: 200rpx;
						height: 200rpx;
						margin: 15rpx 0 0 0;

						image {
							width: 201rpx;
							height: 201rpx;
							margin: 7rpx 0 0 7rpx;
						}

					}
				}

				.buy {
					width: 60%;
					height: 71rpx;
					background: #26A888;
					color: #FFFFFF;
					text-align: center;
					line-height: 71rpx;
					border-radius: 26rpx;
					position: absolute;
					bottom: 30rpx;
					left: 20%;
				}

				.bottomcontent {
					margin-top: 10rpx;
					padding: 35rpx 0;
					background-color: #FFFFFF;
					border-radius: 15rpx;

					.coupon {
						display: inline-block;
						font-size: 30rpx;
						position: absolute;
						top: 50%;
						right: 70rpx;
						transform: translateY(-50%);
					}

					.chat {
						height: 130rpx;
						position: relative;

						span {
							font-size: 30rpx;
							position: absolute;
							left: 130rpx;
							top: 50%;
							transform: translateY(-50%);
						}

						image {
							position: absolute;
							left: 30rpx;
							top: 50%;
							transform: translateY(-50%);
							width: 65rpx;
							height: 55rpx;
						}
					}

					.img {
						position: absolute;
						top: 50%;
						right: 20rpx;
						transform: translateY(-50%);
					}

					.header {
						font-size: 32rpx;
						display: inline-block;
						vertical-align: middle;
						margin-left: 17rpx;
					}

					.number {
						display: inline-block;
						position: absolute;
						right: 10%;
					}
				}

				.centercontent {
					font-size: 32rpx;
					background-color: #FFFFFF;
					margin-top: 10rpx;
					padding-top: 20rpx;
					border-radius: 20rpx;

					.header {
						margin-bottom: 20rpx;
						margin-left: 17rpx;
					}

					.productmodel {
						border: 4rpx solid #FFFFFF;
					}

					.Productmodel {
						background: #ECF1FA;
						border: 4rpx solid #26A888;
						color: #26A888;
					}

					.productmodel,
					.Productmodel {
						background-color: #F6F6F6;
						height: 300rpx;
						text-align: center;
						width: 30%;
						font-size: 24rpx;
						border-radius: 10rpx;
						margin: 5rpx 1.5% 10rpx;
						padding: 0 0 10rpx;

						view {
							background-color: #F6F6F6;
							margin: 10rpx auto;
							width: 98%;
							// height: 90rpx;
							border-radius: 10rpx;
							font-size: 24rpx;
							text-overflow: -o-ellipsis-lastline;
							overflow: hidden;
							text-overflow: ellipsis;
							display: -webkit-box;
							-webkit-line-clamp: 2;
							line-clamp: 2;
							-webkit-box-orient: vertical;
						}

						image {
							border-radius: 10rpx;
							width: 100%;
							height: 200rpx;
						}
					}
				}
			}
		}

		.Purchasecolumn {
			width: 100%;
			height: 110rpx;
			background: #FFFFFF;
			position: fixed;
			bottom: 0;

			.buy {
				width: 263rpx;
				height: 80rpx;
				background: #26A888;
				border-radius: 25rpx;
				font-size: 38rpx;
				color: #FFFFFF;
				line-height: 80rpx;
				text-align: center;
				position: absolute;
				right: 5%;
				top: 15rpx;
			}
		}

		.common {
			padding-left: 5%;
		}

		.choice,
		.Discount,
		.service {
			height: 80rpx;
			background: #FFFFFF;
			box-shadow: 0px 9px 31px 9px rgba(0, 0, 0, 0.03);
			font-size: 34rpx;
			line-height: 80rpx;
			margin-bottom: 15rpx;
			position: relative;

			image {
				width: 17rpx;
				height: 26rpx;
				position: absolute;
				right: 5%;
				top: 50%;
				transform: translateY(-50%);
			}

			.content {
				width: 65%;
				display: inline-block;
				position: absolute;
				left: 25%;
				text-overflow: ellipsis;
				overflow: hidden;
				white-space: nowrap;
				color: #000111;
			}

			.selected {
				color: #969394;
				display: inline-block;
			}
		}

		.picture {
			background: #FFFFFF;
			box-shadow: 0px 9px 31px 9px rgba(0, 0, 0, 0.03);
			position: relative;
			padding-bottom: 110rpx;

			// ::v-deep p{
			// 	word-break:break-all;
			// 			text-indent: 2rem;
			// }
			.textInfo {
				word-break: break-all;
				font-size: 29rpx;
				text-indent: 2rem;
				line-height: 42rpx;
				// color: #666666;
				padding: 0 20rpx;

				/deep/ .richPic {
					width: 100% !important;
					height: 100% !important;
				}
			}

			.selected {
				padding: 20rpx 0 0 5%;
				color: #969394;
				display: inline-block;
				margin-bottom: 20rpx;
				font-size: 34rpx;
			}

			image {
				height: 750rpx;
				width: 100%;
				background-size: 100%;
			}
		}

		.service {
			height: 130rpx;
			line-height: 65rpx;

			.content {
				display: inline-block;
				position: absolute;
				left: 25%;
			}

			.selected {
				color: #969394;
				display: inline-block;
			}
		}

		.Commodity {
			background: #FFFFFF;
			margin: 15rpx 0 15rpx 0;
			box-shadow: 0rpx 9rpx 31rpx 9rpx rgba(0, 0, 0, 0.03);
			font-size: 36rpx;
			line-height: 60rpx;

			.name,
			.number {
				word-break: break-all;
				width: 100%;
				display: inline-block;
				line-height: 50rpx;
			}

			.price {
				color: #D43953;
				line-height: 70rpx;
			}

			.number {
				padding-left: 30rpx;
			}
		}
	}