:root {
    --accent: #F3BD72;
    --accent-dark: #C2975B;
    --track: #FFF8F2;
    --thumb-radius: 10px;
}

body {
    background: url(../images/bg1.jpg) no-repeat;
    background-size: cover;
    overflow: hidden;
    padding: 0;
    margin: 0;
}

.boxPri {
}

.boxHead {
}

.boxHeadx1 {
    text-align: center;
    padding-top: 10px;
}

    .boxHeadx1 img {
    }

.boxHeadx2 {
    text-align: center;
}

    .boxHeadx2 img {
    }

.logo1 {
    position: fixed;
    top: -2px;
    left: 34px;
}

    .logo1 img {
        max-width: 176px;
    }

.logo2 {
    position: fixed;
    top: 3px;
    right: 47px;
}

    .logo2 img {
        max-width: 150px;
    }

.boxScroll {
    height: calc(100vh - 160px);
    overflow-y: auto;
}

.pageMain {
    height: calc(100vh - 148px);
    overflow-y: auto;
}

.signOtherScoll {
    max-height: 460px;
    overflow-y: auto;
    outline: none;
}

.custom-scroll {
    scrollbar-width: thin;
    scrollbar-color: var(--accent) var(--track);
}

    .custom-scroll::-webkit-scrollbar {
        width: 12px;
        height: 12px;
    }

    .custom-scroll::-webkit-scrollbar-track {
        background: var(--track);
        border-radius: 12px;
    }

    .custom-scroll::-webkit-scrollbar-thumb {
        background: var(--accent);
        border-radius: var(--thumb-radius);
        border: 3px solid var(--track);
        min-height: 40px;
    }

        .custom-scroll::-webkit-scrollbar-thumb:hover {
            background: var(--accent-dark);
        }

.xCon1 {
    padding: 0px 0;
    height: 790px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.xCon1Avatar {
}

    .xCon1Avatar img {
    }

.xCon1BoxItem {
    position: absolute;
}

    .xCon1BoxItem:nth-child(1) {
    }

    .xCon1BoxItem:nth-child(2) {
        transform: translate(0px, -277px);
    }

    .xCon1BoxItem:nth-child(3) {
        transform: translate(418px, -164px);
    }

    .xCon1BoxItem:nth-child(4) {
        transform: translate(418px, 106px);
    }

    .xCon1BoxItem:nth-child(5) {
        transform: translate(0px, 280px);
    }

    .xCon1BoxItem:nth-child(6) {
        transform: translate(-410px, 106px);
    }

    .xCon1BoxItem:nth-child(7) {
        transform: translate(-418px, -164px);
    }



    .xCon1BoxItem:nth-child(2):after {
        content: "";
        width: 5px;
        height: 39px;
        position: absolute;
        bottom: 0;
        background: url(../images/line1.png) no-repeat;
        left: 0;
        right: 0;
        margin: auto;
        transform: translate(0px, 26px);
    }

    .xCon1BoxItem:nth-child(3):after {
        content: "";
        width: 288px;
        height: 53px;
        position: absolute;
        bottom: 0;
        background: url(../images/line2.png) no-repeat;
        left: 0;
        margin: auto;
        transform: translate(-127px, 39px);
    }

    .xCon1BoxItem:nth-child(4):after {
        content: "";
        width: 285px;
        height: 29px;
        position: absolute;
        bottom: 0;
        background: url(../images/line3.png) no-repeat;
        left: 0;
        margin: auto;
        transform: translate(-121px, 16px);
    }

    .xCon1BoxItem:nth-child(5):after {
        content: "";
        width: 5px;
        height: 38px;
        position: absolute;
        top: 0;
        background: url(../images/line4.png) no-repeat;
        left: 0;
        right: 0;
        margin: auto;
        transform: translate(3px, -36px);
        background-size: 100%;
        z-index: -1;
    }

    .xCon1BoxItem:nth-child(6):after {
        content: "";
        width: 279px;
        height: 29px;
        position: absolute;
        bottom: 0;
        background: url(../images/line5.png) no-repeat;
        left: 0;
        margin: auto;
        transform: translate(156px, 16px);
    }

    .xCon1BoxItem:nth-child(7):after {
        content: "";
        width: 289px;
        height: 54px;
        position: absolute;
        bottom: 0;
        background: url(../images/line6.png) no-repeat;
        left: 0;
        margin: auto;
        transform: translate(158px, 39px);
    }

.xCon2 {
    padding: 0 55px;
}

.xCon2Heading {
    text-align: center;
    background: url(../images/bg3.png) no-repeat;
    padding: 10px 0;
    background-size: 100%;
}

.xCon2Text {
}

.xCon2Video {
}

.xCon2VideoBox {
    padding: 30px;
    background-color: #99413F;
    border-radius: 5px;
    box-shadow: inset 0px 6px 2.8px rgba(255, 168, 168, 0.25), 0px 6px 2.8px rgba(53, 4, 4, 0.46), inset 0px -9px 4px rgba(63, 3, 3, 0.49);
    position: relative;
}

    .xCon2VideoBox img {
        width: 100%;
    }

    .xCon2VideoBox a {
        outline: none;
    }

        .xCon2VideoBox a:before {
            content: "";
            background: url(../images/playVideo.png) no-repeat;
            width: 137px;
            height: 137px;
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            margin: auto;
        }

.pad30 {
    padding: 30px;
}


.pageHead {
    background: url(../images/page1.png) no-repeat;
    background-size: contain;
    height: 108px;
    width: 1373px;
    margin: 0 auto;
}

.pageHeadBox {
    background: url(../images/page2.png) no-repeat;
    background-size: contain;
    width: 706px;
    height: 108px;
    margin: 0 auto;
    /*    transform: translate(0px, 28px);*/
    transform: translate(-12px, 28px);
    text-transform: uppercase;
    color: #FFD397;
    font-weight: bold;
    font-size: 36px;
    display: flex;
    align-items: start;
    justify-content: center;
}

    .pageHeadBox span {
        /* transform: translate(0px, -15px); */
        text-align: center;
        font-size: 28px;
        padding-top: 10px;
        display: flex;
        justify-content: center;
        align-items: center;
        line-height: 1.1;
        height: 55px;
    }

.pageMain {
    margin-top: 40px;
}


.pageSign1 {
    padding: 40px 0;
    background: rgb(175 151 106 / 30%);
}

.pageSign1Box {
    display: flex;
    gap: 100px;
    justify-content: center;
    align-items: center;
}

.pageSign1Image {
}

.pageSign1Cover {
    position: relative;
    width: 387px;
    padding-top: 138.02%;
}

    .pageSign1Cover img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        position: absolute;
        top: 0;
    }

.pageSign1Name {
    background: rgb(22 13 4 / 70%);
    border-bottom: 6px solid #F8C300;
}

    .pageSign1Name span {
        color: #F8C300;
        font-size: 36px;
        font-weight: bold;
        text-align: center;
        display: flex;
        align-items: center;
        justify-content: center;
        height: 140px;
    }

.pageSign1Text {
}

    .pageSign1Text ul {
        padding: 0;
        margin: 0;
    }

        .pageSign1Text ul li {
            font-size: 38px;
            list-style: none;
            padding: 0;
            margin: 0;
        }

            .pageSign1Text ul li strong {
                color: #591810;
            }


.pageSign2 {
}

.pageSign2Heading {
    background: url(../images/bgHeading.png);
    height: 92px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #FFD397;
    font-size: 32px;
    font-weight: bold;
    text-transform: uppercase;
    margin-bottom: 23px;
}

.pageSign2Content {
    padding: 45px 45px 45px;
    background: rgb(175 151 106 / 30%);
    line-height: 1.1;
}

.pageSign2Relate {
}

.pageSign2Item {
}

.pageSign2Image {
}

.pageSign2Content p {
    margin: 0 0 5px;
    font-size: 32px;
    font-family: 'Times New Roman';
    font-weight: 400;
}


.btnBack {
    position: fixed;
    bottom: 0;
    left: 0;
    background: url(../images/btnBack.png) no-repeat;
    width: 196px;
    height: 46px;
    display: block;
    z-index: 999;
    cursor: pointer;
}


.pageSign3 {
    padding: 45px;
    background: rgb(175 151 106 / 30%);
}

.pageSignOther {
}

.signOtherItem {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 0px 40px;
}

.signOtherContent {
}

.signOtherHeading {
    display: block;
    position: relative;
    padding-bottom: 11px;
    margin-bottom: 11px;
}

    .signOtherHeading span {
        font-size: 26px;
        color: #591810;
        font-weight: bold;
        overflow: hidden;
        text-overflow: ellipsis;
        -webkit-line-clamp: initial;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        height: auto;
        position: relative;
    }

    .signOtherHeading:after {
        content: "";
        width: 100%;
        max-width: 369px;
        height: 2px;
        background: #591810;
        position: absolute;
        left: 0;
        bottom: 0;
    }

.signOtherScoll {
    display: block;
    padding-right: 40px;
}

.signOtherText {
}

    .signOtherText p {
        margin:0 0 25px 0;
        font-size: 24px;
        /* text-align: justify; */
    }

.signOtherImage {
    padding-top: 12px;
}

    .signOtherImage img {
        width: 100%;
    }

.signOtherItem {
    margin-bottom: 40px;
}

    .signOtherItem:nth-child(2n) {
    }

        .signOtherItem:nth-child(2n) .signOtherContent {
            order: 2;
        }

        .signOtherItem:nth-child(2n) .signOtherImage {
            order: 1;
        }

.pageSign2RelateBox {
    padding: 0 45px 45px;
}

.pageSign2Relate {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 40px;
}

.pageSign2Item {
}

.pageSign2Image {
}

.pageSign2Cover {
    position: relative;
    padding-top: 63.636%;
    overflow: hidden;
}

    .pageSign2Cover img {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        transition: all 500ms;
    }

.pageSign2Content {
}

.pageSign2Title {
    font-weight: bold;
    font-size: 17.5px;
    text-overflow: ellipsis;
    -webkit-line-clamp: 6;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.pageSign2Item:hover {
}

    .pageSign2Item:hover .pageSign2Cover img {
        transform: scale(1.1);
    }

.pageRelateContent {
    background: url(../images/bghinhanh.png) bottom center no-repeat;
    height: 142px;
    display: flex;
    align-items: center;
    padding: 0 21px;
    text-align: center;
    color: white;
    text-decoration: none;
    justify-content: center;
}


.pageSign2Item {
}

    .pageSign2Item a {
        text-decoration: none;
    }


.f-caption {
    font-size: 28px;
    font-weight: bold;
    color: #FFD397;
}