_coupons.css 2.7 KB
.my-coupon-page {
    .employ{
    	width: 100%;
    	height: 90px;

    	border-bottom:1px solid #e0e0e0;
    	position: relative;
    	span{
    		width: 49%;
    		height: 48px;
    		line-height: 48px;
    		overflow: hidden;
    		border-right: 2px solid #e0e0e0;
    		margin: 21px 0;
    		float: left;
    		text-align: center;
    		font-size: 32px;
    		color: #b0b0b0;
    		&:last-of-type{
    			border:none;
    		}
    		&.active{
    			color: #444444;
    		}
    	}
    }
    .coupon-list{
    	width:100%;
    	height: auto;
    	overflow:hidden;
    	.employ-main{
            display: block;
    		width: 90.625%;
    		height: 180px;
    		overflow: hidden;
    		margin: 30px auto;
    		background-image: resolve('me/employ/employ.jpg');
    		background-position: top center;
    		background-repeat:no-repeat;
    		background-size: 100% 100%;
    		color: #fff;
    		position: relative;
            &.focus {
                background-image: resolve('me/employ/employ-red.jpg');
            }
    		span{
    			width: 34.482759%;
    			height: 100%;
    			float: left;
    			text-align: center;
    			line-height: 180px;
    			font-size: 100px;
    		}
    		p{
    			width: 59.517241%;
    			height: auto;
    			margin: 0 3% 12px;
    			float: left;
    			&:first-of-type{
    				margin-top: 0.75rem;
    				font-size: 32px;
    				height: auto;
    				min-height: 82px;
    				display: -webkit-box;
        			-webkit-line-clamp: 2;
        			-webkit-box-orient: vertical;
        			overflow: hidden;
    			}
    		}
    		i{
    			width: 100%;
    			height: 100%;
    			overflow: hidden;
    			display: block;
    			position: absolute;
    			top: 0;
    			left: 0;
    			background: resolve('me/employ/employsy.png') right top no-repeat;
    			background-size:auto 100%;
    		}
    	}
    	.null{
    		width: 100%;
    		height:auto;
    		overflow: hidden;
    		position: absolute;
    		left: 0;
    		top:50%;
            transform: translateY(-50%);

    		i{
    			width: 100%;
    			height: 120px;
    			overflow: hidden;
    			display: block;
    			background: resolve('me/employ/not.png') center top no-repeat;
    			background-size:auto 100%;
    		}
    		p{
    			width: 100%;
    			height: auto;
    			overflow: hidden;
    			padding:20px 0 0;
    			font-size: 48px;
    			text-align: center;
    			color: #444;
    		}
    		a{
    			width: 73.75%;
    			height: 80px;
    			overflow: hidden;
    			font-size: 56px;
    			line-height: 80px;
    			display: block;
    			background: #444444;
    			color: #fff;
    			text-align: center;
    			margin: 60px auto 0;
                border-radius: .2rem

    		}
    	}

    }
    .none{
    	display: none;
    }
}