.news-home .max-2-lines, .news-home .max-3-lines, .news-home .max-8-lines {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden
}

:root {
    --job-item-xanh-nhat: #4caf506a;
    --job-item-xanh: #4CAF50;
    --job-item-tim: #602ACB;
    --job-item-tim-nhat: #b797f8;
    --job-item-span-bg: #e1fae2af
}

.slide-container {
    padding: 0;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    /*    border-left: 1px solid #602acb44;
    border-right: 1px solid #602acb44;
    border-bottom: 1px solid #602acb44;*/
    overflow: hidden
}

    .slide-container .grid {
        margin: 0 !important
    }

.slide-heading-grid {
    padding: 0 20px !important;
    background: linear-gradient(103.05deg,rgb(74 86 255 / 40%) -7.56%,rgb(194 137 255 / 40%) 106.5%),linear-gradient(0deg,rgb(139 63 205),rgb(116 70 157));
    height: 45px;
    margin: 2em 0 0 !important;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px
}

    .slide-heading-grid .column {
        padding: 0 !important
    }

/*.slick-container {
    padding: 1em
}*/

.hotp-title, .slide-title {
    color: #fff;
    font-size: 20px;
    font-weight: 500
}

.slide-button {
    background: #fff !important;
    border: 1px solid #c3b9df !important;
    width: 25px !important;
    height: 25px !important;
    padding: 0 !important;
    color: #794aff !important;
    margin-right: 0 !important
}

    .hotp-button.disabled, .slide-button.disabled {
        background: #dfdddd !important;
        color: #96959a !important;
        border: 1px solid #b0aeae !important
    }

    .slide-button:hover {
        background: #7f57f1 !important;
        color: #fff !important
    }

.slide-job-item-wrapper {
    padding: 8px !important
}

.slide-job-item {
    background: #fff;
    width: 100%;
    border-radius: 5px;
    padding: 13px;
    cursor: pointer;
    outline: rgba(183,151,248,.3) solid .5px;
    transition: .3s ease-in-out;
    border-radius: 12px;
}

    .slide-job-item .company-vip {
        position: absolute;
        top: 0;
        left: 10px;
        width: 40px;
        height: 40px;
        z-index: 1
    }

    .slide-job-item .company-vip-no-logo {
        position: absolute;
        top: 0;
        right: 0;
        width: 40px;
        height: 40px;
        z-index: 1
    }

    .slide-job-item:hover {
        outline: 1px solid var(--job-item-tim);
        box-shadow: 0 1px 7px var(--job-item-tim-nhat)
    }

        .slide-job-item:hover .title {
            color: var(--job-item-tim)
        }

    /*    .slide-job-item .logo {
        width: 64px;
        height: 64px;
        object-fit: contain;
        float: left;
        margin-right: 12px;
        background: #fff
        background: #fff
    }*/

    .slide-job-item .logo {
        width: 64px;
        height: 64px;
        object-fit: contain;
        float: left;
        margin-right: 12px;
        padding: 5px;
        border: 1px solid #dde4ec;
        background: #fff !important;
        border-radius: 12px;
    }


    .slide-job-item .main-info {
        height: 4em
    }

    .slide-job-item .title {
        max-height: 3em;
        color: #000;
        font-weight: 500;
        font-size: 14px
    }

    .slide-job-item .company {
        max-height: 1.5em;
        color: #454545;
        font-size: 12px;
        margin-top: 2px
    }

    .slide-job-item .salary-location {
        clear: both;
        font-size: 12px;
        color: #333;
        margin-top: 20px
    }

        .slide-job-item .salary-location span:not(.save) {
            background: #80cbc41c;
            padding: 4px 8px;
            border-radius: 15px;
            border: .5px solid rgba(183,151,248,.3);
            color: #000;
            margin-right: 4px
        }

        .slide-job-item .salary-location .save {
            float: right;
            display: inline-flex;
            justify-content: center;
            width: 28px;
            height: 28px;
            border: .5px solid rgba(183,151,248,.3);
            border-radius: 50%;
            align-items: center;
            transform: translateY(-5px)
        }

        .slide-job-item .salary-location .apply {
            float: right;
            display: inline-flex;
            justify-content: center;
            height: 28px;
            font-size: 12px;
            transform: translateY(-5px);
            margin-right: 10px
        }

        .slide-job-item .salary-location .save:hover {
            cursor: pointer;
            background: #d5c1fe
        }

        .slide-job-item .salary-location .save i {
            line-height: 15px;
            font-size: 14px;
            margin: 0;
            padding: 0;
            color: #602acb
        }

    .slide-job-item.red-title .main-info .title {
        color: #b50104 !important;
        font-weight: 700
    }

    .slide-job-item.green {
        border-left: 8px solid #048e81;
        background: #f1fefd
    }

        .slide-job-item.green .logo {
            background: #f1fefd
        }

    .slide-job-item.purple {
        border-left: 8px solid #7158e2;
        background: #efebff
    }

        .slide-job-item.purple .logo {
            background: #efebff
        }

        .slide-job-item.purple .title {
            color: #7e0305
        }

        .slide-job-item.purple:hover .title {
            color: #794aff
        }

    .slide-job-item .main-info span {
        font-size: 12px;
        color: #fff;
        /*        font-weight: 400;*/
        font-weight: 500;
        padding: 3px 8px;
        text-transform: uppercase;
        border-radius: 15px;
        margin: 0 1px;
    }

        .slide-job-item .main-info span.new {
            background: linear-gradient(90deg, #2DF187 0%, #52BB82 100%);
        }

        .slide-job-item .main-info span.urgent {
            background: linear-gradient(331deg, #FD824E 14.59%, #F94B41 85.59%);
        }

        .slide-job-item .main-info span.hot {
            color: #fff;
            margin-right: 5px;
            background: linear-gradient(87deg, #FF64B7 0.92%, #FE0130 99.19%);
        }

.slick-dotted.slick-slider {
    margin-block: 0 !important
}

.slick-dots {
    position: unset !important;
    bottom: unset !important
}

    .slick-dots li button:before {
        font-family: unset;
        font-size: 20px;
        color: #d9d9d9;
        opacity: 1;
        content: '●'
    }

    .slick-dots li.slick-active button:before {
        font-family: unset;
        font-size: 20px;
        color: var(--job-item-tim);
        content: '●'
    }

.navigation-wrapper .view-all {
    color: #fff;
    margin-right: .5em;
    font-size: 14px;
    text-underline-offset: 5px;
    font-weight: 500;
}

    .navigation-wrapper .view-all:hover {
        text-decoration: underline
    }

.topc-container {
    background: #fff
}

/*.topc-wrapper {
    border-left: 1px solid #602acb44;
    border-right: 1px solid #602acb44;
    border-bottom: 1px solid #602acb44;
    overflow: hidden;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px
}*/

.topc-heading {
    margin-top: 2em;
    padding: 0 20px;
    background: linear-gradient(103.05deg,rgb(74 86 255 / 40%) -7.56%,rgb(194 137 255 / 40%) 106.5%),linear-gradient(0deg,rgb(139 63 205),rgb(116 70 157));
    height: 45px;
    align-content: center;
    color: #fff;
    font-size: 20px;
    font-weight: 500;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px
}

/*.topc-wrapper > .ui.grid {
    padding: 1em;
    margin: 0
}*/

.topc-wrapper .topc-item {
    width: 100%;
    border-radius: 10px;
    border: .5px solid rgba(183,151,248,.3);
    padding: 1em;
    cursor: pointer;
    transition: .3s
}

    .topc-wrapper .topc-item:hover {
        border: 1px solid #602acb;
        box-shadow: 0 1px 7px #b797f8
    }

        .hotp-item:hover .field-name, .news-home .new-page-type a:hover, .news-home .new-title:hover, .topc-wrapper .topc-item:hover .main-info .company-name {
            color: #602acb
        }

.topc-item .logo {
    width: 6em;
    height: 6em;
    object-fit: contain;
    float: left;
    border-radius: 5px;
    background: #fff;
    margin-right: 1em
}

.topc-item .main-info {
    height: 6em;
    align-content: center
}

    .topc-item .main-info .company-name {
        font-size: 16px;
        color: #000;
        font-weight: 700;
        margin-bottom: 5px
    }

.hotp-container {
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    border-left: 1px solid #602acb44;
    border-right: 1px solid #602acb44;
    border-bottom: 1px solid #602acb44;
    overflow: hidden
}

.hotp-button {
    background: #fff !important;
    border: 1px solid #c3b9df !important;
    width: 35px !important;
    height: 35px !important;
    padding: 0 !important;
    color: #794aff !important;
    margin-right: 0 !important
}

.hotp-item {
    display: block;
    width: 100%;
    text-align: center;
    border: .5px solid rgba(183,151,248,.3);
    border-radius: 12px;
    cursor: pointer;
    padding: 15px 0;
    transition: .5s;
    background: #f0f0f0;
}

    .hotp-item:hover {
        border: 1px solid #602acb;
        background: #fff;
        box-shadow: 0 1px 7px #b797f8
    }

    .hotp-item img {
        width: 100px;
        height: 100px;
        display: inline-block;
        object-fit: contain
    }

    .hotp-item .field-name {
        color: #000;
        font-size: 16px;
        font-weight: 500;
        margin: 5px
    }

    .hotp-item .job-count {
        color: #652cd4;
        font-size: 14px;
        font-weight: 400
    }

.hotp-heading {
    padding: 0 20px;
    background: linear-gradient(103.05deg,rgb(74 86 255 / 40%) -7.56%,rgb(194 137 255 / 40%) 106.5%),linear-gradient(0deg,rgb(139 63 205),rgb(116 70 157));
    height: 45px;
    align-content: center;
    margin-top: 2em;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px
}

.hotp-container .grid, .hotp-slick {
    padding: 2em
}

.news-home {
    margin: 1em 0
}

    .news-home .new-view-more {
        text-align: end;
        margin-top: 10px
    }

        .news-home .new-view-more a {
            color: #4183c4
        }

    .news-home p {
        margin-bottom: .3rem
    }

    .news-home .new-page-type {
        font-weight: 500;
        padding-bottom: 10px;
        margin-bottom: .5em
    }

        .news-home .new-page-type a {
            color: #333;
            text-transform: uppercase;
            font-size: 15px;
            font-weight: 700;
            text-decoration: underline solid #80CBC4;
            text-decoration-thickness: 2px;
            text-underline-offset: 8px
        }

    .news-home .new-image {
        width: 100%;
        margin-bottom: .5em;
        height: 95px
    }

    .news-home .new-title {
        font-weight: 500;
        color: #333;
        height: 40px
    }

    .news-home .new-description, .news-home .new-publish-date {
        color: #00000099;
        font-size: .9em
    }

    .news-home .new-description {
        height: 55px
    }

    .news-home .max-8-lines {
        -webkit-line-clamp: 8
    }

    .news-home .feature-column .info {
        height: 160px
    }

    .news-home .max-3-lines {
        -webkit-line-clamp: 3
    }

    .news-home .max-2-lines {
        -webkit-line-clamp: 2
    }

@media only screen and (min-width:768px) {
    .news-home > .heading {
        font-size: 20px;
        font-weight: 700;
        color: #000 !important;
        border-left: 6px solid #7d41f6;
        padding-left: .8em;
        line-height: 1.2em;
        margin-top: 1em;
        margin-bottom: 1em
    }
}

@media only screen and (max-width:767px) {
    .topc-wrapper .topc-item {
        box-shadow: 0 4px 6px 0px rgba(0,0,0,.1)
    }

    .slide-button {
        display: none !important
    }

    .navigation-wrapper .view-all {
        color: #333;
        font-size: 15px;
        text-transform: uppercase
    }

    .slide-job-item {
        box-shadow: 0 4px 6px 0 rgba(0,0,0,.1)
    }

        .slide-job-item .company-vip {
            top: 0;
            left: 0
        }

        .slide-job-item .company-vip-no-logo {
            top: 0
        }

    .slide-container .slick-slide {
        padding-left: 2px;
        padding-right: 2px
    }

    .hotp-title, .slide-title {
        font-size: 20px;
        color: #333
    }

    .slide-container .ui.stackable.grid > .column:not(.row) {
        padding: 1px 1px 15px !important
    }

    .slide-container {
        border: none;
        margin-top: 0
    }

    .slide-heading-grid {
        background: 0 0;
        padding: 0 !important;
        margin-bottom: .5em !important;
        margin-top: .5em !important
    }

    .slick-container {
        padding: 0
    }

    .slide-job-item .salary-location .apply {
        display: none
    }

    .topc-slides .ui.grid {
        margin-top: 0 !important
    }

    .topc-wrapper {
        border: none
    }

    .topc-heading {
        background: 0 0;
        padding: 0;
        color: #333;
        margin-top: .5em
    }

    .topc-wrapper > .ui.grid {
        padding: 0;
        margin: 0
    }

    .topc-wrapper .ui.stackable.grid > .column:not(.row) {
        padding: 1em 0 0 !important
    }

        .topc-wrapper .ui.stackable.grid > .column:not(.row):last-child {
            padding: 1em 0 !important
        }

    .hotp-container {
        border: none;
        margin-top: 1em
    }

    .hotp-heading {
        padding: 0 !important;
        background: 0 0;
        margin-top: .5em
    }

    .hotp-container .grid {
        padding: calc(1em - 5px)
    }

        .hotp-container .grid .column {
            padding: 8px !important
        }

    .hotp-item .field-name {
        font-size: 13px
    }

    .hotp-item {
        box-shadow: 0 4px 6px 0px rgba(0,0,0,.1)
    }

    .news-home > .heading {
        font-size: 20px;
        font-weight: 500;
        color: #333;
        margin-bottom: 1em
    }

    .news-home .normal-column {
        padding-top: 0 !important
    }

    .news-home .feature-column {
        padding-bottom: 0 !important
    }

    .news-home .new-title {
        font-size: 15px;
        font-weight: 700
    }

    .news-home .feature-column .info, .news-home .new-image {
        height: auto
    }
}

@media (max-width:1200px) and (min-width:768px) {
    .news-home .new-image {
        height: auto
    }

    .news-home .feature-column .info {
        height: auto
    }
}