
.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:20%; 
					display:flex;
					justify-content: center;
					align-items: center;
					.img{
						width:50px;
						height:50px;
						border-radius: 50%;
					}
				}
				.ticket-info{
					width:55%;
					.ticket-name{
						color:#000;
						font-size:14px;
						font-weight: bold;
					}
					.ticket-expire{
						font-size:12px;
						color:#593320;
						margin-top:5px;
						width: 100%;
						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:#F4F5F7;
				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:#F4F5F7;
				height:20px;
				width:10px;
				border-top-left-radius: 50%;
				border-bottom-left-radius: 50%;
			}
		}
		.ticket-other{
			background:#FFF;
			height:20px;
			.intro{
				font-size:12px;
				margin-left:20px;
				color:#593320;
			}
			.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

	}
}

