.com-renew-form{ 
	width:100%;
	
	position:relative;
	.renew-form{
		width:90%;
		height:100%;
		min-height: 600px;
		
		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; 
				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;
		.list-items{
			display: flex;
			flex-direction: row;
			.item{
				width:290px;
				
				// 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:#666666;
					color:#FFF;
					width:100%;
					height:25px;
					line-height: 25px;
					overflow: hidden;
					left:0px;
					top:0px;
					position:absolute;
					
					z-index:99; 
				}
				.item-img{
				
					padding-top:40px;
					 .bottomBg{
						 border-bottom:1px dashed #a1a1a1;
					 }
					 .vip-list{
						 display:flex;
						 width:95%; 
						 margin-left:5px;
						 margin-right:5px;
						 flex-direction: column;
						 .vip-item{
							 display:flex;
							 flex-direction: row;
							 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{
								 min-height: 40px;
								 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:80%;
										 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:#666666;
					height:30px;
		            text-align: center;
					flex-direction: row;
					color:#FFF;
					position: absolute;
					width: 100%;
					bottom: 0px;
					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;
				}
				.tips{
					background:#b21c1c!important;
				}
			}
		}
	}
	
	.renew-btns{
		width:100%;
		display: flex;
		justify-content: center;
		align-items: center;
		margin-top:20px;
		.btn-pay{
			width:80px;
			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;
		}
	}
	
}

.RenewInfo{
	
	width: 90%;
	margin:0 auto;
    font-size: 12px;
	padding: 10px 0px 70px 0px;
	line-height: 20px;
}


.btncoup_date{
	position: absolute;
	left: 5px;
	bottom:35px;
	
	width: 100px;
	color: #b21c1c;
	text-align: center;
	border-radius: 5px;
	margin-left: 5px;
	line-height: 16px;
	font-size: 14px;
	
}
.btncoup{
									
									position: absolute;
									right: 5px;
									bottom:35px;
							        
									width: 100px;
									color: #b21c1c;
									text-align: center;
									border-radius: 5px;
									margin-left: 5px;
									line-height: 16px;
									font-size: 14px;
									
									
									
								}
								
								
								

			
	.vip_head{
		background-color: #593320;
		width: 100%;
		height: 40px;
		.vip-form-title{
			color:#FFF;
			font-size: 12px;
			line-height: 40px;
			padding-left: 30px;
			
		}
	}
	.txtred{
		color: #b21c1c;
	}
	.vip-form{
			width:95%;
			margin:auto;
			margin-top:5px;
			margin-bottom:40px;
			border-bottom: 2px solid #F0F0F0;
			padding: 10px;
		    max-height: 150px;
			min-height: 30px;
			overflow: auto;
			
			.vip-form-tab{
				
				
				.tab{
					width:100%;
					display: flex;
					flex-direction: row;
					justify-content: space-between;
					align-items: center;
					 min-height:20px;
					 font-size: 12px;
					.col1{
						width:10%;
						 height: 100%;
						display:flex;
						justify-content: left;
						align-items: center;
						
					
						
						.icon{
							width: 25px;
							height:25px;
							
						}
					}
					.col2{
						width:80%;
						height:100%; 
						text-align: left;
						margin-left: 0px;
						display:flex;
						justify-content: left;
						align-items: center;
					}
					.col3{
						width:10%;
						height:100%;
					
					
						display:flex;
						justify-content: left;
						align-items: center;
					}
					
				}
				.tab1{
					width:100%;
					display: flex;
					flex-direction: row;
					justify-content: space-between;
					align-items: center;
					height:120px;
					.col1{
						width:30%;
						
						 height:100%;
						display:flex;
						justify-content: center;
						align-items: center;
						border-left: 1px solid #593320;
						border-top: 1px solid #593320;
						border-right: 1px solid #593320;
						.icon{
							height:25px;
							
						}
					}
					.col-more{
						display: flex;
						width:70%;
						 height:100%;
						flex-direction: column;
						.item{
							display: flex;
							flex-direction: row;
							width:100%;
							height:40px;
							.col2{
								width:50%;  
								display: flex;
								justify-content: center;
								align-items: center;
								
							}
							.col3{
								width:50%;
								display: flex;
								justify-content: center;
								align-items: center;
								// border-left: 1px solid #593320;
								border-top: 1px solid #593320;
								border-right: 1px solid #593320;
							}
						}
					}
				}
				
			}
		}
	
	.cardcoup{
		
	font-size: 12px;
	color: #FFF;
width: 100px;
display: flex;
height: 20px;
line-height: 20px;
position: absolute;
right: 25px;
top:10px;
		
	}