.sld_my_coupon { width: 1007px; margin-left: 10px; float: left; .my_coupon_con { border: 1px solid #eeeeee; background: #ffffff; .nav_list { background-color: white; .con { border-bottom: 1px solid#EEEEEE; height: 42px; .nav_item { width: 145px; height: 42px; line-height: 42px; text-align: center; color: #444444; font-size: 14px; border: 1px solid #eeeeee; border-bottom: none; border-top: none; &:not(:first-child) { border-left: none; } &.active { color: $colorMain2; border: none; border-right: 1px solid #eeeeee; background: #ffffff; font-weight: 600; } &:hover { color: $colorMain2; } } } } .coupon_container { width: 100%; flex-wrap: wrap; .coupon_item { width: 228px; height: 268px; background-size: cover; position: relative; text-align: center; padding-top: 22px; margin: 20px 10px 0px 12px; .out_logo { width: 86px; height: 64px; position: absolute; top: 0; left: 0; } .price { color: white; line-height: 1; span:nth-child(1) { font-size: 18px; } span:nth-child(2) { font-size: 36px; } span:nth-child(3) { font-size: 25px; } } .content { margin-top: 16px; font-size: 14px; color: white; line-height: 1; } .time { margin-top: 13px; color: white; line-height: 1; } .type { margin-top: 31px; color: $colorMain; font-size: 14px; text-align: left; padding-left: 14px; &.used { color: #878787; } } .rules { color: #333333; width: 205px; text-align: left; padding-left: 14px; height: 30px; margin-top: 20px; line-height: 14px; .title { color: #999999; } } .btn { color: #878787; .normal { color: $colorMain2; } position: absolute; bottom: 17px; width: 100%; } } } .el-pagination { margin: 20px; } } }