.page-equity{
	min-height: 100vh;
	width:100vw;
	background:#ebeaea;
	display:flex;
	.equity-header{
		display:flex;
		background:#FFF;  
		position: fixed;
		width:100%;
		flex-direction: column;
		z-index:999;
		.header-caption{  
			height:40px;
			margin-left:20px;
			margin-right:20px;
			display:flex;
			flex-direction: row;
			justify-content: flex-start;
			align-items: center;
			border-bottom:1px solid #d5d5d5;
			.text{
				font-size:14px;
				padding-left:10px;
				padding-right:10px;
				
			}
			.active{
				color:#593320;
				font-weight: 900;
				font-size: 16px;
				
			}
		}
		.header-sub{
			margin-left:20px;
			margin-right:20px;
			height:40px;
			display:flex;
			flex-direction: row;
			justify-content: flex-start;
			align-items: center;
			.text{
				font-size:14px;
				padding-left:10px;
				padding-right:10px;
			}
			.active{
				color:#593320;
				font-weight: 900;
				font-size: 16px;
			}
		}
	}
	
	.ticket-list{
		width:100%;
		margin-top:80px;
		margin-left:10px;
		margin-right:10px; 
		.list-item{
			
			.item{
				margin-top:10px;
				.ticket-content{
					background:#FFF;
					.content{
						display:flex;
						flex-direction: row;
						padding-top:10px;
						padding-bottom:10px;
						position: relative;
						.ticket-img{
							width:30%; 
							display:flex;
							justify-content: center;
							align-items: center;
							.img{
								width:50px;
								height:50px;
								border-radius: 50%;
							}
						}
						.ticket-info{
							width:70%;
							.ticket-name{
								color:#000;
								font-size:14px;
								font-weight: bold;
							}
							.ticket-expire{
								font-size:12px;
								color:#593320;
								margin-top:5px;
								width: 70%;
								line-height: 20px;
							} 
						}
						
						.ticket-status{
							position: absolute;
							right:0px;
							top:0px; 
							height:80px;
							width:80px;
							overflow: hidden;
							.ticket-text{ 
								width:80px;
								height:20px;
								margin-top:10px;
								margin-left:20px;
								transform: rotate(45deg); 
								display:flex;
								flex-direction: column;
								justify-content: center;
								align-items: center;
								font-size:12px; 
							}  
							
						}
						.ticket-status-st{
							position: absolute;
							right:20px;
							top:20px; 
							
							width:80px;
							overflow: hidden;
						    
							
							.ticket-st{
								
								width:80px;
								height:80px;
								
								line-height: 30px;
								border-radius: 50%;
								
								
								display:flex;
								flex-direction: column;
								justify-content: center;
								align-items: center;
								font-size:18px; 
								background: #FFF;
								color: #ccc;
								border: 2px dotted  #cccccc;
							
							}
						}
						.used{
							.ticket-text{
								background:#593320;
								color:#FFFFFF;
							}
						}
						
					}
				}
				.ticket-splite{
					display: flex;
					flex-direction: row;
					background:#FFF;
					justify-content:space-evenly;
					align-items: center;
					.left{ 
						background:#ebeaea;
						height:20px;
						width:10px; 
						border-top-right-radius: 60%;
						border-bottom-right-radius: 60%;
					}
					.mid{
						height:1px;
						width:100%;
						
						border-bottom: 2px dotted #cccccc;
					}
					
					.right{
						background:#ebeaea;
						height:20px;
						width:10px;
						border-top-left-radius: 50%;
						border-bottom-left-radius: 50%;
					}
				}
				.ticket-other{
					background:#FFF;
					height:20px;
					.other-txt{
						display:flex;
						flex-direction:row;
						justify-content: flex-end;
						align-items: center;
						font-size:12px;
						
						.btn{
							width:20%;
							margin: 0 auto;
							
							.btn-user{
								height:20px;
								background-color: #593320;
								color: #EDEDED;
								line-height: 20px;
								font-size:12px;
								border-radius: 7px;
								
							}
						}
						
					}
				}
			}
			.shadow{
				 box-shadow: 0px 2px 5px 0px #bababa

			}
		}
	}
	
	.more-ticket{
		background:#ebeaea;
		width:100%;
		height:100%;
		border-top-left-radius: 10px;
		border-top-right-radius: 10px;
		overflow: hidden;
		.more-ticket-title{
			height:40px;
			width:100%;
			text-align:center;
			line-height:40px;
			font-size:14px;
			background:#593320;
			color: #EDEDED;
			
		}
		
		.more-items{
			height:500px; 
			overflow: hidden;
			overflow-y: auto;
			padding-bottom: 30px;
			
			.item{
				margin-top:10px;
				margin-left: 10px;
				margin-right: 10px; 
				 box-shadow: 0px 2px 5px 0px #bababa;
				.ticket-content{
					background:#FFF;
					.content{
						display:flex;
						flex-direction: row;
						padding-top:10px;
						padding-bottom:10px;
						position: relative;
						.ticket-img{
							width:30%; 
							display:flex;
							justify-content: center;
							align-items: center;
							.img{
								width:50px;
								height:50px;
								border-radius: 50%;
							}
						}
						.ticket-info{
							width:70%;
							.ticket-name{
								color:#000;
								font-size:14px;
								font-weight: bold;
							}
							.ticket-expire{
								font-size:12px;
								color:#593320;
								margin-top:5px;
							} 
						}
						
						.ticket-status{
							position: absolute;
							right:0px;
							top:0px; 
							height:80px;
							width:80px;
							overflow: hidden;
							.ticket-text{ 
								width:80px;
								height:20px;
								margin-top:10px;
								margin-left:20px;
								transform: rotate(45deg); 
								display:flex;
								flex-direction: column;
								justify-content: center;
								align-items: center;
								font-size:12px; 
							}  
						}
						.used{
							.ticket-text{
								background:#593320;
								color:#FFFFFF;
							}
						}
						
					}
				}
				.ticket-splite{
					display: flex;
					flex-direction: row;
					background:#FFF;
					justify-content:space-evenly;
					align-items: center;
					.left{ 
						background:#ebeaea;
						height:10px;
						width:10px; 
						border-top-right-radius: 70%;
						border-bottom-right-radius: 70%;
					}
					.mid{
						height:1px;
						width:100%;
						border-bottom: 2px dotted #cccccc;
					}
					
					.right{
						background:#ebeaea;
						height:10px;
						width:10px; 
						border-top-right-radius: 70%;
						border-bottom-right-radius: 70%;
					}
				}
				.ticket-other{
					background:#FFF;
					height:20px;
					padding-top: 5px;
					.other-txt{
						display:flex;
						flex-direction:row;
						
						align-items: center;
						font-size:12px;
						
						.btn{
							width:20%;
							margin: 0 auto;
							.btn-user{
								height:20px;
								line-height: 20px;
								background-color: #593320;
								color: #EDEDED;
								font-size:12px;
								border-radius: 5px;
								
							.shadow{
								 box-shadow: 0px 2px 20px 0px #bababa
							
							}	
							}
							
						}
						
					}
				}
			}
			
			
		}
	
		
	}
	
	.qr-code{
		background:#FFF;
		border-radius: 10px;
		overflow: hidden;
		.qr-box{
			 display:flex;
			 justify-content: center;
			 align-items: center;
			 padding:20px;
		}
		.qr-text{
			text-align:center;
			font-size:12px;
			padding-bottom:20px;
		}
	}
}
.ticket-status-st{
							position: absolute;
							right:20px;
							top:20px; 
							
							width:80px;
							overflow: hidden;
						    
							
							
							.ticket-st{
								
								width:80px;
								height:80px;
								
								line-height: 30px;
								border-radius: 50%;
								background-color: #FFF;
								
								display:flex;
								flex-direction: column;
								justify-content: center;
								align-items: center;
								font-size:18px; 
								color: #ccc;
								border: 2px dotted  #cccccc;
							
							}
						}
						
						.shadow{
							 box-shadow: 0px 2px 5px 0px #bababa;
						
						}
						
						.ticket-expire-rule{
							font-size:12px;
							color:darkred;
							margin-top:5px;
							width: 60%;
							line-height: 20px;
						} 