/* @font-face {
    font-family: 'Halyard Text';
    src: url(../css/megamenu-pro/fonts/HalyardDisplayBook.woff2)format("woff2"), url(../css/megamenu-pro/fonts/HalyardDisplayBook.woff)format("woff");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Halyard Text';
    src: url(../css/megamenu-pro/fonts/HalyardDisplayBook.woff2)format("woff2"), url(../css/megamenu-pro/fonts/HalyardDisplayBook.woff)format("woff");
    font-weight: 500;
    font-style: normal;
    font-display: swap;
} */

body {
    font-variant-numeric: normal;
    letter-spacing: normal;
}

.amount {
    padding: 40px;
}

.content__container .content-title {
    max-width: 100%;
}

.via-mail {
    font-family: 'Halyard Text', sans-serif;
    font-size: 16px;
    line-height: 24px;
    font-weight: 400;
    color: #222;

    display: flex;
    align-items: center;
    gap: 8px;
}

.via-mail img:hover {
    filter: invert(73%) sepia(91%) saturate(1607%) hue-rotate(342deg)
        brightness(102%) contrast(101%);
}

#main-content {
    font-variant-numeric: lining-nums proportional-nums;
}

.sidebar .sidebar__sections--item a {
    font-family: 'Halyard Text', sans-serif;
}

.j_btn-explore {
    margin-top: 24px;
}

.button-solid {
    font-size: 18px;
    line-height: 1;
    font-weight: 500;
    font-family: 'Halyard Text', sans-serif;
    color: #00196e;
    border: 1px solid #00196e;
    display: block;
    padding: 12px 20px;
    width: fit-content;
    transition: all 0.3s linear;
}

.button-solid:hover {
    background-color: #00196e;
    color: #ffad1d;
    transition: all 0.3s linear;
}

.content__container .content-subtitle {
    font-size: 24px;
    line-height: 28px;
    font-family: 'Halyard Text', sans-serif;
    font-weight: 400;
    margin-bottom: 24px;
    letter-spacing: -1.5px;
}

.content__container .content-title {
    margin-bottom: 24px;
    font-size: 48px;
    line-height: 54px;
    font-weight: 400;
}

.desc p {
    font-size: 16px;
    line-height: 24px;
    color: #222;
    margin-bottom: 8px;
    font-family: 'Halyard Text', sans-serif;
}

.hero .hero__banner {
    height: 320px;
    width: 100%;
    background-color: #ceedf6;
}

.hero .hero__banner::after {
    display: none;
}

.hero .hero__content .hero__heading {
    color: #00196e;
    text-shadow: unset;
}

.applying__breadcumb li a {
    color: #00196e;
}

/* .applying__breadcumb li:nth-child(2) {
    display: none;
} */

/* sidebar */

.sidebar .sidebar__scroll {
    overflow-y: auto;
    padding-bottom: 80px;
    height: 100%;
}

.sidebar .sidebar__scroll::-webkit-scrollbar {
    width: 0px;
    height: 0px;
}

.sidebar .sidebar__menu {
    list-style: none;
    padding-left: 20px;
}

.sidebar .sidebar__menu li a {
    display: block;
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    color: #8a8a8a;
    margin-bottom: 12px;
    cursor: pointer;
    width: fit-content;
    transition: all 0.3s linear;
}

.sidebar .sidebar__custom {
    position: relative;
    height: calc(100% - 150px);
}

.sidebar .sidebar__custom::after {
    background: linear-gradient(
        180deg,
        rgba(255, 255, 255, 0) 0%,
        rgba(255, 255, 255, 1) 100%
    );
    content: '';
    display: block;
    height: 80px;
    width: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
}

.sidebar .sidebar__custom .sidebar__custom-header {
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    color: #8a8a8a;
    margin-bottom: 16px;
    cursor: pointer;
    width: fit-content;
    transition: all 0.3s linear;

    display: flex;
    align-items: center;
    gap: 12px;
}

.sidebar .sidebar__custom .sidebar__custom-header img {
    display: none;
    transform: rotate(-90deg);
    transition: all 0.3s linear;
}

.sidebar .sidebar__custom .sidebar__custom-header.show img {
    display: block;
}

.sidebar .sidebar__custom .sidebar__custom-header.active img {
    transform: rotate(90deg);
    transition: all 0.3s linear;
}

.sidebar
    .sidebar__custom
    .sidebar__custom-item:not(:first-child)
    .sidebar__menu {
    display: none;
}

.sidebar .sidebar__sections {
    margin-bottom: 60px;
}

.sidebar .sidebar__sections--wrap .sidebar__sections--item a {
    color: #00196e;
    display: flex;
    align-items: center;
    gap: 8px;
}

.sidebar .sidebar__sections--wrap .sidebar__sections--item ul {
    list-style: none;
    padding-left: 20px;
}

.sidebar .sidebar__sections--wrap .sidebar__sections--item a img {
    display: none;
}

.sidebar .sidebar__sections--wrap .sidebar__sections--item.active a img {
    transform: rotate(-180deg);
    transition: all 0.3s linear;
}

.sidebar .sidebar__sections--wrap .sidebar__sections--item.show a img {
    display: block;
    transition: all 0.3s linear;
}

.sidebar::-webkit-scrollbar-thumb {
    background: #888;
}

.sidebar .sidebar__buttons {
    padding-top: 12px;
    border-top: 1px solid #e1e1e1;
}

/* office president */

.office-president .j_btn-explore {
    margin: 0 auto;
    cursor: pointer;
}

.office-president .j_btn-explore::after {
    transform: rotate(135deg) translateY(2px);
    transition: all 0.3s linear;
}

.office-president .j_btn-explore.active::after {
    transform: rotate(-45deg) translateY(0px);
    transition: all 0.3s linear;
}

.office-president .desc.custom {
    overflow-y: hidden;
    position: relative;
    transition: all 0.3s linear;
}

.office-president .desc.custom.hide::after {
    display: none;
}

.office-president .desc.custom::after {
    background: linear-gradient(
        180deg,
        rgba(255, 255, 255, 0) 0%,
        rgba(255, 255, 255, 1) 100%
    );
    content: '';
    display: block;
    height: 120px;
    width: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
    opacity: 1;
    visibility: visible;
    transition: all 0.3s linear;
}

.office-president .desc.expanded {
    transition: all 0.3s linear;
}

.office-president .desc.expanded::after {
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s linear;
}

/* president card */

.president__card {
    display: flex;
    align-items: center;
    gap: 36px;
    margin-top: 24px;
}

.president__card .fullname {
    font-family: 'Halyard Text', sans-serif;
    font-size: 16px;
    line-height: 24px;
    font-weight: 500;
    color: #222;
    margin-bottom: 8px;
    letter-spacing: normal;
}

.president__card .position {
    font-family: 'Halyard Text', sans-serif;
    font-size: 14px;
    line-height: 20px;
    font-weight: 400;
    color: #8a8a8a;
    letter-spacing: normal;
}

.president__card .avatar {
    width: 158px;
    height: 158px;
    border-radius: 50%;
}

.president__card .avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* meet presdient */

.meet-president .meet-president__img img {
    width: 100%;
    height: auto;
    object-fit: cover;
}

.meet-president .j_btn-explore {
    margin: 30px 0;
}

/* academic profile */

.academic-profile .button-solid {
    margin-top: 24px;
}

/* news */

.news .news__list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 36px;
    margin-top: 36px;
}

.news .news__list .news__item:hover .news__item-img img {
    transform: scale(1.04);
    transition: all 0.3s linear;
}

.news .news__list .news__item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: all 0.3s linear;
}

.news .news__list .news__item .news__item-img {
    width: 100%;
    height: 244px;
    overflow: hidden;
}

.news .news__list .news__item .title {
    font-family: 'Halyard Text', sans-serif;
    font-size: 22px;
    line-height: 28px;
    font-weight: 500;
    color: #00196e;
    margin: 20px 0 8px;
}

.news .news__list .news__item .date {
    font-family: 'Halyard Text', sans-serif;
    font-size: 14px;
    line-height: 20px;
    font-weight: 400;
    color: #222;
    font-variant-numeric: normal;
}

.news .button-solid {
    margin-top: 24px;
}

/* global-board */

.global-board .global-board__list {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 32px;
    margin-top: 32px;
}

.global-board .global-board__list .global-board__item .name {
    font-family: 'Halyard Text', sans-serif;
    font-size: 16px;
    line-height: 24px;
    font-weight: 500;
    color: #00196e;
}

.global-board .global-board__list .global-board__item .company {
    font-family: 'Halyard Text', sans-serif;
    font-size: 16px;
    line-height: 24px;
    font-weight: 500;
    color: #8a8a8a;
}

.via__list {
    margin-top: 26px;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 36px;
}

.via__list .via__item .name {
    font-family: 'Halyard Text', sans-serif;
    font-size: 16px;
    line-height: 24px;
    font-weight: 500;
    color: #222;
}

.via__list .via__item .position {
    font-family: 'Halyard Text', sans-serif;
    font-size: 16px;
    line-height: 24px;
    font-weight: 400;
    color: #222;
    margin: 8px 0;
}

.via__list .via__item a {
    font-family: 'Halyard Text', sans-serif;
    font-size: 14px;
    line-height: 20px;
    font-weight: 500;
}

@media screen and (max-width: 991px) {
    .sidebar .scroll-mb {
        max-height: calc(454px - 66px);
        overflow-y: auto;
        overflow-x: hidden;
    }

    .sidebar .sidebar__sections {
        max-height: fit-content;
        overflow-y: unset;
        margin-bottom: 0px;
        border-top: 0px;
    }

    .sidebar__sections--title {
        margin-bottom: 0px;
        padding-bottom: 0px;
    }

    .sidebar .sidebar__buttons {
        padding-bottom: 24px;
        padding-top: 24px;
    }

    .applying__breadcumb li a {
        color: #8a8a8a;
    }

    /* .applying__breadcumb li:nth-child(2) {
        display: flex;
    } */

    .content__container .content-title {
        font-size: 40px;
        line-height: 48px;
    }
}

@media screen and (max-width: 576px) {
    .content__container .content-title {
        font-size: 36px;
        line-height: 40px;
    }

    .president__card {
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }

    .president__card .infor {
        text-align: center;
    }

    .president__card .position a {
        text-decoration: underline;
    }

    .news .news__list {
        grid-template-columns: repeat(1, 1fr);
    }

    .global-board .global-board__list {
        grid-template-columns: repeat(2, 1fr);
    }

    .via__list {
        grid-template-columns: repeat(1, 1fr);
        gap: 24px;
    }

    .sidebar.active {
        top: calc(100% - 454px);
    }
}