.com-renew-form{ 
	width:100%;
	min-height:500px;
	position:relative;
	.renew-form{
		width:90%;
		height:100%;
		min-height:500px;
		margin:auto;
		border-top-right-radius: 10px;
		border-top-left-radius: 10px;
		background:#FFF;
		overflow: hidden;
		.renew-top{
			height:40px;
			background:#a07c5a;
			display:flex;
			flex-direction: row;
			.renew-top-header{
				height:100%;
				width:20%;
				display:flex; 
				justify-content: center;
				align-items: center;
				.icon{
					width:30px;
					height:30px;
					border-radius: 50%;
				}
			}
			.renew-top-name{
				height:100%;
				width:80%;
				display:flex; 
				padding-left:10px;
				justify-content: flex-start;
				align-items: center;
				color:#FFF;
			}
		}
	}
	.renew-tips{
		height:30px;
		display: flex;
		justify-content: flex-start;
		align-items: center;
		margin-top:20px;
		.text{
			margin-left:20px;
			font-weight: bold;
			color:#593320;
			.txt{
				color:#b21c1c;
			}
		}
	}
	.renew-list{
	 
		margin-left:10px;
		margin-right: 10px; 
		display: flex;
		flex-direction: row;
		overflow-y: auto;
		overflow-x: auto;
		padding-top:20px;
		height:240px;
		.list-items{
			display: flex;
			flex-direction: row;
			.item{
				width:180px;
				// height:220px;
				border:1px solid #CCC; 
				margin-right:10px;
				border-radius: 10px;
				position:relative;
				background:#faf9fa;
				display:flex;
				overflow: hidden;
				flex-direction: column;
				.active{
					position:absolute;
					right:0px;
					top:0px;
					z-index:999;
					background:#FFF;
					border-radius: 50%;;
				}
				
				.tips{
					display: flex;
					justify-content: center;
					align-items: center; 
					background:#b21c1c;
					border-bottom-right-radius: 20px;
					color:#FFF;
					width:100px;
					height:25px;
					line-height: 25px;
					overflow: hidden;
					left:0px;
					top:0px;
					position:absolute; 
					z-index:99; 
				}
				.item-img{
					padding-top:30px;
					.package-img{ 
						width:100%;
						height:160px;
					} 
					 .bottomBg{
						 border-bottom:1px dashed #a1a1a1;
					 }
					 .vip-list{
						 display:flex;
						 width:95%; 
						 margin-left:5px;
						 margin-right:5px;
						 flex-direction: column;
						   border:1px solid red;
						 .vip-item{
							 display:flex;
							 flex-direction: row;
							 border:1px solid red;
							 min-height:30px;
							 line-height: 30px;
							 font-size:12px; 
							 .vip-img{
								 display:flex;
								 width:10%;
								 height:100%;
								
								 justify-content:center;
								 align-items: center;
								 
								 .img{
									 width:24px;
									 height:18px; 
									 margin-top:10px;
								 }
								 
							 }
							 .vip-content{
								 display:flex;
								 width:90%;
								 height:100%;
								 flex-direction: column; 
								 justify-content: flex-start;
								 align-items: center;
									 
								 .content-item{
									 display:flex;
									 flex-direction: row;
									 width:100%;
									 height:100%;
									 justify-content: flex-start;
									 align-items: center; 
									 
									 .vip-item-cap{
										 display:flex;
										 width:50%;
										 height:100%;
										 justify-content: flex-start;
										 align-items: center;
										 margin-left:10px;
									 }
									 .vip-item-text{
										 display:flex;
										 width:70%;
										 height:100%;
										 margin-right: 10px;
										 justify-content: flex-end;
										 align-items: center;
									 }
								 }
								 
								 
								 
							 }
							 
							 
						 }
					 }
					 
					 
				}
				.item-price{
					background:#CCC;
					height:40px;
					display: flex;
					flex-direction: row;
					justify-content: center;
					align-items: center;
					color:#FFF;
					border-bottom-left-radius: 10px;
					border-bottom-right-radius: 10px;
					.price{
						font-size:18px;
						.sign{
							font-size:12px;
						}
					}
				}
			}
			
			.actived{
				border:1px solid #b21c1c!important;
				.item-price{
					background:#b21c1c!important;
				}
			}
		}
	}
	
	.renew-btns{
		width:100%;
		display: flex;
		justify-content: center;
		align-items: center;
		margin-top:20px;
		.btn-pay{
			width:200px;
			height:30px;
			display: flex;
			justify-content: center;
			align-items: center;
			border-radius: 10px;
			background:#b21c1c;
			padding:0px;
			border:none;
			color:#FFF;
			line-height: 30px;
			font-size:14px;
		}
	}
	.letter{
		background: url(/static/images/letter.png) no-repeat;
		height:120px;
		position:absolute;
		width:100%;
		bottom:0px;
		left:0px;
	}
}