/* .chi-tiet-khoa-hoc {
    overflow: hidden;
} */

#detail-section-1 {
    position: relative;
    padding-top: 60px;
}


#detail-section-2 {
    margin-top: 90px;
}
#detail-section-3{
    margin-top: 40px;
}
#detail-section-1,
#detail-section-2,
#detail-section-3 {
    margin-bottom: 40px;
}

.chi-tiet-khoa-hoc .box-head-title {
    border-left: solid 3px #ED1C24;
    padding: 5px 20px;
    margin-bottom: 28px;
}

.chi-tiet-khoa-hoc .box-head-title .title {
    margin-bottom: 0;
}

.card-info-course {
    margin-top: 40px;
    border-radius: 20px;
    background: #FFF;
    box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.15);
    overflow: hidden;
    max-width: 456px;
    margin-left: auto;
    margin-right: 20px;
    position: sticky;
    top: 40px;
    z-index: 2;

}

.card-info-course .content {
    padding: 40px 40px 0 40px;

}

.box-info-gv {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 20px;
}

.box-info-gv span {

    color: var(--black-3, #555);
}

.box-info-gv h6 {
    font-size: 18px;
    color: var(--red-1, #ED1C24)
}
.box-info-gv img{
    border-radius: 50px;
}
.course-info ul {
    list-style: none;
}

.course-info ul li {
    position: relative;
    margin-bottom: 21px;
    font-size: 20px;
    color: var(--black-2, #333);
}

.course-info ul li::before {
    content: "";
    left: -32px;
    top: 6px;
    width: 24px;
    height: 24px;
    background-repeat: no-repeat;
    background-size: cover;
    position: absolute;
}

.course-info ul li.course-number::before {
    background-image: url(./images/icons/course-number.svg);
}

.course-info ul li.course-time::before {
    background-image: url(./images/icons/course-time.svg);
}

.course-info ul li.course-style::before {
    background-image: url(./images/icons/course-style.svg);
}

.course-info ul li.course-certificate::before {
    background-image: url(./images/icons/course-certificate.svg);
}

/* Section 3 */
.dac-diem-accordion .accordion-button:not(.collapsed) {
    background-color: #fff;
    box-shadow: none;
}

.dac-diem-accordion .accordion-item {
    border-radius: 12px;
    background: #FFF;
    box-shadow: 0 1px 8px 0 rgba(0, 0, 0, 0.16);
    margin-bottom: 28px;
    overflow: hidden;
}

.dac-diem-accordion .accordion-button {
    gap: 30px;
    font-weight: 600;
    color: #132456;
}
.dac-diem-accordion  .accordion-button:focus{
    box-shadow: none;
}
/* Lộ trình */

.lotrinh-title h2 {
    display: inline-block;
    background-size: contain;
    background-repeat: no-repeat;
    padding: 50px 162px 50px 84px;
    color: #fff;
    font-weight: bold;
    text-transform: uppercase;
    background-position: center;
    margin-bottom: 0;
}

.list-lotrinh {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    margin-right: 31px;
    /* margin-top: -150px; */
}

.head-item-lotrinh {
    background-size: cover;
    background-repeat: no-repeat;
    padding-left: 65px;
    padding-top: 44px;
    z-index: 2;
}

.head-item-lotrinh h3 {
    color: #fff;
    font-weight: bold;
    white-space: nowrap;
    font-size: 20px;
}

.short-desc-lotrinh {
    color: #273E8A;
    padding: 15px 20px 35px 0;
}

.short-desc-lotrinh p {
    margin: 5px 0;
}

.short-desc-lotrinh hr {
    margin: 10px 0;
    background-color: #fff;
    border: 0;
    border-top: 1px solid #ffff;
}

.icon-up-lotrinh {
    bottom: -24px;
    left: 50%;
    transition: .3s all;
    transform: rotateX(180deg);
}

.item-lotrinh:hover .icon-up-lotrinh {
    transform: none;
}

.item-lotrinh {
    position: relative;
}

.item-lotrinh .kylan1 {
    opacity: 0;
    transition: .3s all;
    transform: translateY(-10px);
    top: 50px;
    z-index: 1;
    position: relative;
    z-index: 3;
}

.item-lotrinh:hover .kylan1 {
    opacity: 1;
    transform: translateY(15px);
}

.item-lotrinh:last-child:hover::before {
    opacity: 0;
}

.list-lotrinh .item-lotrinh.mover:nth-child(1) .kylan1,
.list-lotrinh .item-lotrinh:nth-child(1) .kylan1 {
    opacity: 1;
    transform: translateY(15px);
}

.item-lotrinh:first-child:hover .kylan1,
.item-lotrinh:first-child .kylan1,
.mover-wrap .item-lotrinh::after,
.mover-wrap .kylan1 {
    opacity: 0 !important;
}

.mover-wrap .item-lotrinh:hover::after,
.item-lotrinh:hover .kylan1 {
    opacity: 1 !important;
}

/*//////////*/
@media only screen and (min-width: 960px) {
    .list-lotrinh .item-lotrinh:nth-child(1) {
        margin-top: 303px;
    }

    .list-lotrinh .item-lotrinh:nth-child(2) {
        margin-top: 243px;
    }

    .list-lotrinh .item-lotrinh:nth-child(3) {
        margin-top: 180px;
    }

    .list-lotrinh .item-lotrinh:nth-child(4) {
        margin-top: 120px;
    }

    .list-lotrinh .item-lotrinh:nth-child(5) {
        margin-top: 59px;
    }

    .list-lotrinh .item-lotrinh {
        margin-right: -31px;
    }

    .list-lotrinh .item-lotrinh:nth-child(1) .head-item-lotrinh {
        padding-bottom: 23px;
    }
}

.content-khoahoc {
    fill: #FFF;
    filter: drop-shadow(0px 2px 8px rgba(0, 0, 0, 0.12));
    background-color: #fff;
    padding: 30px;
    position: absolute;
    width: 150%;
    z-index: 1;
    opacity: 0;
    transition: .3s all;
    color: #000;
    visibility: hidden;
}

.item-lotrinh:hover .content-khoahoc {
    opacity: 1;
    visibility: visible;
}

.item-lotrinh:hover {
    z-index: 2;
}

.item-lotrinh:first-child::after {
    content: "";
    background-image: url(./images/icons/kylan1.png);
    width: 220px;
    height: 220px;
    display: block;
    position: absolute;
    top: 89px;
    z-index: 3;
    background-size: contain;
    left: 20px;
    background-repeat: no-repeat;
    transition: .3s all;
}

@media only screen and (max-width: 959px) {
    /* .hesinhthai__bg .icon-tt2 {
        top: -50px;
        width: 150px;
    }

    .hesinhthai__box h3 {
        font-size: 20px;
        background-size: 250px;
        padding: 7px 30px;
        margin-top: -35px;
    }

    .hesinhthai__box img {
        max-width: 200px;
    } */

    /*  */
    /* .taisao__box,
    .taisao__box_wrap {
        position: unset !important;
    }

    .taisao__box_wrap .uk-grid {
        display: flex;
        margin: 0;
        box-sizing: border-box;
        justify-content: space-between;
    }

    .taisao__box {
        width: 49%;
        padding: 20px;
        background-color: red;
        border-radius: 50px;
        box-sizing: border-box;
        margin-bottom: 10px !important;
        text-align: left;
    } */

    /* .taisao__box br {
        display: none;
    }

    .taisao__row2 {
        padding: 0 !important;
    }

    .taisao__box1 {
        background-color: #006681;
    }

    .taisao__box2 {
        background-color: #ffb90b;
    }

    .taisao__box3 {
        background-color: #00a9b9;
    }

    .taisao__box4 {
        background-color: #ff8d2a;
    }

    .taisao__box5 {
        background-color: #10be81;
    }

    .taisao__box6 {
        background-color: #f14258;
    } */

    /**/
    /* .about__sumenh__boxquote {
        padding-bottom: 80px;
    }

    .about__trietly {
        padding-top: 120px;
    }

    .about__trietly__title {
        margin: 0;
    }

    .icon-docquyen {
        width: 100px;
    } */

    /**/
    /* .item-content-taisao h3 {
        font-size: 22px;
    }

    .item-content-taisao p {
        font-size: 16px;
        line-height: 28px;
    }

    .tai_sao_box1 .uk-width-1-2 {
        width: 100%;
    }

    .tai_sao_box1>img {
        width: 80px;
    } */

    /* */
    /* .hinhthuchoc_block {
        margin-top: -62px;
        padding-top: 100px;
    }

    .hinhthuchoc_title {
        font-size: 28px;
        padding: 49px 95px 25px;
        margin-bottom: 20px;
    }

    .hinhthuchoc_block>.uk-position-relative>img {
        width: 80px;
    }

    .uk-grid .item-hinhthuchoc h3 {
        font-size: 18px;
        padding: 13px 28px 37px;
    }

    .content-hinhthuchoc h5 {
        font-size: 16px;
    } */

    /**/
    /* .khoahoccon-title h1 {
        font-size: 40px;
        line-height: 50px;
    } */

    /*Footer*/
    /* .blockForm__sectionContent {
        padding-bottom: 45px;
    }

    .blockForm__sectionContent .uk-width-expand img {
        max-width: 465px;
        margin: 0 auto;
        display: block;
    } */

    /**/
    /* .gioithieu-khoahoc .icon {
        width: 150px;
        bottom: -20px;
    }

    .gioithieu-khoahoc .uk-width-1-2 {
        width: 100%;
    }

    .right-gt-khoahoc {
        padding-left: 0;
        padding-top: 20px;
    }

    .khoahoc_con-dacdiem-wrap {
        padding: 50px;
    } */

    /**/
    .list-lotrinh {
        grid-template-columns: repeat(3, 1fr);
        margin-top: 0px;
        margin-right: 0;
    }

    .item-lotrinh {
        margin-bottom: 25px;
        z-index: unset !important;
    }

    .list-lotrinh .kylan1,
    .list-lotrinh .item-lotrinh:first-child::after,
    .list-lotrinh .item-lotrinh:last-child::before {
        display: none !important;
    }

    .head-item-lotrinh {
        padding-left: 0;
        padding-top: 0;
        z-index: unset;
        background-image: none !important;
    }

    .head-item-lotrinh h3 {
        font-size: 18px;
        background-color: #417ec3;
        text-align: center;
        margin-bottom: 0;
        padding: 10px;
    }

    .item-lotrinh:nth-child(1) .head-item-lotrinh h3 {
        background-color: #417ec3;
    }

    .item-lotrinh:nth-child(1) .short-desc-lotrinh {
        background-color: #d4e8ff;
    }

    .item-lotrinh:nth-child(2) .head-item-lotrinh h3 {
        background-color: #5acde2;
    }

    .item-lotrinh:nth-child(2) .short-desc-lotrinh {
        background-color: #cef0f9;
    }

    .item-lotrinh:nth-child(3) .head-item-lotrinh h3 {
        background-color: #9ede5d;
    }

    .item-lotrinh:nth-child(3) .short-desc-lotrinh {
        background-color: #e0f1ce;
    }

    .item-lotrinh:nth-child(4) .head-item-lotrinh h3 {
        background-color: #ffc44b;
    }

    .item-lotrinh:nth-child(4) .short-desc-lotrinh {
        background-color: #ffe7b6;
    }

    .item-lotrinh:nth-child(5) .head-item-lotrinh h3 {
        background-color: #f15455;
    }

    .item-lotrinh:nth-child(5) .short-desc-lotrinh {
        background-color: #ffe3e2;
    }

    .item-lotrinh:nth-child(6) .head-item-lotrinh h3 {
        background-color: #cf33a4;
    }

    .item-lotrinh:nth-child(6) .short-desc-lotrinh {
        background-color: #f8daef;
    }

    /**/
    .short-desc-lotrinh {
        color: #273E8A;
        padding: 20px 10px;
    }

    .icon-up-lotrinh {
        left: 50%;
        transform: rotateX(180deg) translateX(-50%);
        z-index: 2;
    }

    .item-lotrinh .content-khoahoc {
        width: 100%;
        z-index: 3;
        box-sizing: border-box;
        padding: 10px;
    }

}


@media only screen and (max-width: 640px) {
    .list-lotrinh {
        grid-template-columns: repeat(1, 1fr);
    }
}