.card{
  overflow:hidden;
}

.card-reveal .card-body {
    display: flex;
    align-items: center;
    /* justify-content: center; */
    position: absolute;
    top: 0;
    height: auto;
    width: 100%;
    text-align: center;
}
.xhe{position:absolute;top:0;right:20px;width:85px;padding: 0;margin: 0;}
.xhe img{width:100%;vertical-align:bottom;display: block;}
.card-reveal .card-body .card-title {
    font-size: 12px;
    margin: 0;
    text-transform: uppercase;
    font-weight: bolder;
    color: #fff;
    background: rgba(0,0,0,.5);
   
    padding: 0 8px;
    border-radius: 20px;
    line-height: 22px;
}

.card-reveal .card-body .card-title .Card_line__sQEa1{    width: 1px;
    height: 22px;
    opacity: .25;
    background: #fff;
    box-shadow: inset -0.6px 0 0 0 #000;
    margin: 0 6px;}

.card01{ overflow:hidden;}

.absolute{
    background-image: linear-gradient(to top, #000000a1,transparent);
    height: 100px;
    position: absolute;
    left: 0px !important;
    width: 100%;
    bottom: 0;
}
.sie{ position:absolute; bottom:0; left:0; width:100%;}

@media (min-width: 992px) {
    .card-reveal .card-body {
    }

    .card-reveal .card-img-top {
        -webkit-transition: -webkit-transform .5s ease-in-out;
        transition: -webkit-transform .5s ease-in-out;
        transition: transform .5s ease-in-out;
        transition: transform .5s ease-in-out, -webkit-transform .5s ease-in-out;
    }

    .card-reveal:hover .card-body {
        /* bottom: 0; */
        /* background-color: rgba(255, 255, 255, 0.7); */
    }

    .card-reveal:hover .card-img-top {
        -webkit-transform: scale(1.1);
        transform: scale(1.1);
    }
}

.sie{ padding:10px;}
.sue{ display: flex;   align-items: center; font-size:16px; color:#fff;   overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
}
.sue img{ height:18px; margin-right:4px}
.sie01{ display: flex;  justify-content: space-between;  align-items: center; margin-top:10px;}
.sie01-l{ display: flex;  align-items: center; font-size:12px; color:#fff;}
.sie01-l img{ width:18px; height:18px; border-radius:50%; margin-right:5px;}
.sie01-r{ display: flex;  align-items: center;}
.sie01-r em{ font-style:normal; font-size:12px; color:#fff; margin-right:4px}
.sie01-r em img{ width:14px; margin-right:4px}

.card-columns .card:hover .absolute{    background-image: linear-gradient(to top, #000, transparent);}

@media (min-width: 576px) and (max-width: 1199.98px) {
    .card-columns {
        -webkit-column-count: 2;
        -moz-column-count: 2;
        column-count: 2;
    }
}