@media screen and (min-width: 1400px) {
    .nav-link {
        font-size: 16px;
    }

    .hero-tagline-title {
        font-size: 70px;
    }

    .hero-tagline-summary {
        margin-bottom: 40px;
        margin-top: 20px;
    }

    .logo-opcos {
        width: 90%;
    }

    .footer-left-wrapper {
        padding-left: 50px;
    }

    .footer-text-title {
        font-size: 52px;
    }

    .footer-horizontal-line {
        margin-left: 40px;
    }

    .footer-end-left-wrapper {
        padding-left: 50px;
    }

    .footer-social-media-icon a {
        margin: 0 25px;
    }

    .aboutus-mission-card,
    .aboutus-vision-card {
        max-width: 35%;
    }

    .esgstrategy-image {
        height: 920px;
    }

    .esggallery-content li {
        width: 300px;
        height: 300px;
    }

    .investorrelation-annual-report-card {
        width: 270px;
    }

    .investorrelation-annual-report-card-image-wrapper {
        height: 370px;
    }

    .investorrelation-tab-content-financial-presentation-detail-periode-content {
        gap: 0 60px;
    }

    .financial-presentation-file-wrapper {
        max-width: 350px;
    }

    .corporategovernance-tab-content-card {
        width: 400px;
    }

    .corporategovernance-tab-content-card-header {
        font-size: 25px;
    }

    .corporategovernance-tab-content-card-summary {
        font-size: 20px;
    }

    .corporategovernance-tab-content-image {
        width: 230px;
        height: 240px;
    }

    .our-leaders-modal-body-image {
        max-height: 700px;
    }

    .news-press-release-card {
        width: 395px;
    }

    .news-press-release-card-image {
        height: 200px;
    }

    .news-magazine-recent-card {
        min-width: 250px;
    }

    .news-magazine-recent-card-image {
        height: 220px;
    }

    .news-magazine-archive-detail-card {
        /* flex: 0 0 33.3333%; */
        width: 250px;
        height: 250px;
        background-color: transparent;
        border: 0px none;
    }

    .magazine-other-detail-card {
        width: 290px;
        height: 290px;
    }

    .magazine-carousel-button-wrapper {
        margin-right: 80px;
    }

    .career-program-image {
        width: 640px;
        height: 820px;
    }

    .career-apply-qualification-image {
        width: 675px;
        height: 645px;
    }

    .homepage-news-card img {
        width: 350px;
    }

    .hero-main-image {
        max-width: 800px!important;
    }

    #aboutus-ownership-group-organization {
        margin-bottom: 250px;
    }

    .esgprogram-card {
        width: 410px;
    }

    .esgprogram-card-image {
        height: 410px;
    }

    .esgprogram-category-btn {
        font-size: 20px;
    }

    .esgreport-card-wrapper {
        gap: 70px 100px;
    }

    .esgreport-card {
        max-width: 320px;
    }

    .career-apply-submit-detail-overlay {
        padding: 40px 80px;
        gap: 150px;
    }

    .ourbusiness-network-wrapper {
        gap: 40px;
    }

    .network-update {
        padding-left: 50px;
    }

    .footer-wrapper {
        padding: 0;
    }

    .error-content-text-wrapper {
        width: 850px;
        bottom: 25%;
    }

    .error-content-text-code {
        font-size: 150px;
        margin-bottom: 50px;
    }

    .error-content-text-sorry {
        font-size: 54px;
        line-height: 54px;
    }

    .error-content-text-no-worries {
        font-size: 24px;
    }

    .error-content-object-wrapper {
        right: 100px;
    }

    .error-content-object-image {
        height: 600px;
    }
}

@media screen and (min-width: 1200px) {
    .nav-link {
        white-space: nowrap;
    }

    .navbar .nav-item:hover .dropdown-menu {
        top: 65%!important;
    }

    .swiper-pagination-bullet {
        height: 10px !important;
        width: 33px !important;
    }
    
    .swiper-pagination-bullet-active {
        height: 10px !important;
        width: 85px !important;
    }

    .homepage-visit-newsroom-button {
        width: 25%;
    }

    .aboutus-submenu-link {
        white-space: nowrap;
    }
}

@media screen and (max-width: 1199px) {
    .navbar-logo {
        width: 120px;
    }

    .nav-bg-square {
        background-size: 180px 100px;
    }

    .nav-link {
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        max-width: 80px;
        display: inline-block;
    }

    .search-box {
        right: 200px;
    }

    .img-hero img {
        width: 55%;
        height: auto;
    }

    #shadow-motor-img {
        right: 200px !important;
    }

    #shadow-car-img {
        right: 80px !important;
    }

    .hero-tagline-title {
        font-size: 50px;
        width: 600px;
    }

    .hero-tagline-summary {
        font-size: 20px;
        width: 400px;
    }

    .play-button {
        height: 80px;
        width: 80px;
        bottom: 35%;
        right: 26%;
    }

    /* .swiper-container {
        height: 400px;
    } */

    .btn-view-more-slider {
        height: 40px;
        width: 200px;
        font-size: 12px;
    }

    #homepage-esg {
        padding-top: 60px;
    }
    
    .homepage-accordion-esg-content .homepage-accordion-esg-title {
        font-size: 20px!important;
        line-height: 28px!important;
    }

    .homepage-accordion-esg-content .homepage-accordion-esg-summary {
        font-size: 15px!important;
    }

    .homepage-accordion-esg-content .homepage-accordion-esg-btn {
        height: 50px!important;
        padding: 20px 50px!important;
        font-size: 12px!important;
    }

    /* #micrositeCarousel {
        height: 250px;
    } */

    .swiper-pagination-bullet {
        height: 8px !important;
        width: 23px !important;
    }

    .swiper-pagination-bullet-active {
        height: 8px !important;
        width: 75px !important;
    }

    #homepage-news {
        margin: -20% auto 0;
        /* height: 1000px; */
    }

    .homepage-visit-newsroom-button {
        width: 25%;
    }

    .footer-text-title {
        font-size: 42px;
    }

    /* .footer-text-summary {
        font-size: 20px;
    } */

    /* .footer-text-contact {
        font-size: 16px;
    }

    .footer-contact-number, .footer-contact-address {
        font-size: 14px;
    } */

    .footer-left-wrapper {
        padding-left: 10px;
        padding-right: 30px;
    }

    .footer-right-wrapper {
        padding-left: 60px;
    }

    .footer-horizontal-line {
        margin-left: 40px;
    }

    .footer-end-left-wrapper {
        padding-left: 50px;
    }

    /* .footer-logo {
        width: 120px;
    } */

    /* .footer-text-quick-link {
        font-size: 16px;
    }*/

    /* .footer-link-wrapper li a {
        font-size: 14px;
    } */

    /* .footer-copyright {
        font-size: 14px;
    }

    .footer-text-followus {
        font-size: 16px;
    } */

    .footer-social-media-icon a {
        font-size: 24px;
        margin: 0 10px;
    }

    #aboutus-header {
        max-height: 100%;
    }

    .aboutus-description-wrapper {
        margin-top: 200px;
    }

    .aboutus-submenu {
        padding: 0 30px;
    }

    .aboutus-description-title {
        font-size: 80px;
        padding: 0 30px;
    }

    .aboutus-description-summary {
        font-size: 20px;
        margin-bottom: 0;
    }

    .btn-read-more-aboutus {
        line-height: 10px;
        height: 50px;
        font-size: 15px;
    }

    /* .aboutus-milestone-title {
        font-size: 25px;
    } */

    .aboutus-mission-title,
    .aboutus-vision-title {
        font-size: 30px;
    }

    .aboutus-vision-mission-content {
        top: 50%;
    }

    .aboutus-mission-card,
    .aboutus-vision-card {
        max-width: 40%;
    }

    .aboutus-credo-title {
        font-size: 50px;
    }

    .aboutus-credo-belief-title {
        font-size: 50px;
    }

    .aboutus-our-leaders-title {
        font-size: 50px;
    }

    .aboutus-leaders-boc-wrapper,
    .aboutus-leaders-bod-wrapper {
        gap: 50px 30px;
    }

    #aboutus-ownership-group-organization {
        margin-bottom: 200px;
    }

    .our-leaders-modal-body-image {
        max-height: 500px;
    }

    .ourbusiness-network-wrapper {
        gap: 50px;
    }

    .network-update {
        padding-left: 70px;
    }

    .ourbusiness-unit-title {
        max-width: 200px;
    }

    .ourbusiness-network-title {
        font-size: 50px;
        margin: 80px 0;
    }

    .awards-card-wrapper {
        margin: 40px 0 80px;
    }

    .awards-card {
        max-width: 280px;
    }

    .awards-card-image {
        height: 300px;
    }

    .esgstrategy-image {
        height: 620px;
    }

    .esgperformance-category-description {
        gap: 40px 10px;
    }

    .esgperformance-category-description-card {
        width: 32%;
    }

    #esgreport-overview {
        margin: -15% auto 0;
    }

    .esgstrategy-header-text {
        font-size: 50px;
    }

    .esgperformance-header-text {
        font-size: 50px;
    }

    .esgreport-overview-header-text {
        font-size: 50px;
    }

    .esgreport-overview-card-wrapper {
        gap: 40px 40px;
    }

    .esgreport-overview-card {
        max-width: 280px;
    }

    .esgprogram-category-btn {
        padding: 15px 34px;
    }

    .esgprogram-card {
        width: 290px;
    }

    .esgprogram-card-image {
        height: 290px;
    }

    .esgprogram-modal-wrapper {
        max-width: 90%;
    }

    .esgprogram-modal-achievement {
        align-items: self-end;
    }

    .esgprogram-modal-achievement-image {
        padding-top: 50px;
    }

    .esgprogram-modal-achievement-detail-wrapper {
        padding: 20px 30px 20px 80px;
    }

    .esgreport-detail-wrapper {
        padding: 0 40px;
    }

    .esgreport-card-wrapper {
        gap: 50px 20px;
        padding-bottom: 150px;
    }

    .esgreport-card {
        max-width: 280px;
    }

    .esggallery-content li {
        width: 210px;
        height: 210px;
    }

    .esggallery-filter-wrapper {
        padding: 0;
    }

    .investorrelation-tab-content-body,
    .corporategovernance-tab-content-body {
        padding: 0 30px;
    }

    .investorrelation-tab-content-shareholder-detail {
        max-height: 300px;
        max-width: 200px;
        gap: 0 10px;
    }

    .investorrelation-annual-report-card {
        flex: 0 0 30%;
        width: 185px;
    }

    .investorrelation-annual-report-card-image-wrapper {
        height: 290px;
    }

    .investorrelation-annual-report-card-title {
        padding: 0 20px;
    }

    .gms-tab,
    .disclosure-tab,
    .financial-presentation-tab {
        gap: 20px;
    }

    .investorrelation-tab-link,
    .corporategovernance-tab-link {
        padding: 5px 5px 5px 0px;
    }

    .investorrelation-tab-content-financial-presentation-detail-periode-header {
        gap: 30px;
    }

    .investorrelation-tab-content-financial-presentation-detail-periode-content {
        padding-left: 80px;
        gap: 0 30px;
    }

    .financial-presentation-file-wrapper {
        max-width: 250px;
    }

    .investorrelation-tab-content-file-link-download,
    .corporategovernance-tab-content-file-link-download {
        margin-right: 0;
    }

    .corporategovernance-tab-content-card {
        width: 280px;
    }

    .corporategovernance-tab-content-card-header {
        font-size: 18px;
        margin-bottom: 30px;
    }

    .corporategovernance-tab-content-card-summary {
        font-size: 15px;
    }

    .corporategovernance-tab-content-member {
        gap: 50px 30px;
    }

    .corporategovernance-tab-content-image-wrapper {
        max-width: 180px;
    }

    .corporategovernance-tab-content-image {
        width: 170px !important;
        height: 180px !important;
    }

    .news-press-release-card {
        width: 280px;
    }

    .news-press-release-card-image {
        height: 150px;
    }

    .news-press-release-feature-image {
        width: 450px;
    }

    .news-magazine-recent-card-wrapper {
        gap: 20px;
    }

    .news-magazine-recent-card {
        /* max-width: 190px; */
        min-width: 180px;
    }

    .news-magazine-archive-detail-wrapper {
        gap: 20px;
    }

    .news-magazine-archive-detail-card {
        width: 180px;
        height: 180px;
    }

    .news-magazine-archive-detail-card-subtitle {
        font-size: 15px;
    }

    .news-magazine-archive-detail-card-title {
        font-size: 15px;
        line-height: 15px
    }

    .news-content-detail-other-card-wrapper {
        min-width: 220px;
        gap: 50px;
    }

    .magazine-other-detail-card {
        width: 270px;
        height: 270px;
    }

    .news-content-detail-other-card-image {
        height: 200px;
    }

    .news-content-image {
        height: 500px;
        border-radius: 120px;
    }

    .career-header-wrapper {
        margin: 150px 0 100px 0;
    }

    .career-program-image {
        width: 440px;
        height: 620px;
    }

    .career-program-detail-wrapper {
        padding: 30px;
    }

    .career-program-title {
        font-size: 30px;
    }

    .career-program-description {
        font-size: 18px;
    }

    .career-step-wrapper {
        padding: 0 30px;
        margin-top: 20px;
    }
    .career-step-text {
        font-size: 30px;
    }

    .career-step-card-wrapper {
        gap: 30px;
    }

    #career-apply {
        margin: -35% auto 0;
    }

    .career-apply-qualification {
        margin-top: 40%;
    }

    .career-apply-qualification-detail-wrapper {
        margin-top: 30px;
    }

    .career-apply-qualification-image {
        width: 485px;
        height: 445px;
    }

    .career-apply-qualification-title {
        font-size: 28px;
        margin-bottom: 30px;
    }

    .career-apply-qualification-text {
        font-size: 18px;
    }

    .career-apply-submit {
        padding: 0 50px;
    }

    .career-apply-submit-detail-wrapper {
        height: 290px;
    }

    .career-apply-submit-detail-overlay {
        padding: 35px 40px;
        gap: 120px;
    }

    .career-apply-submit-detail-title {
        font-size: 30px;
    }

    .career-apply-submit-detail-button {
        padding: 12px 34px;
    }

    .homepage-news-card img {
        width: 250px;
        height: 200px;
    }

    .error-content-text-wrapper {
        width: 600px;
        left: 14%;
    }

    .error-content-text-code {
        font-size: 80px;
    }

    .error-content-text-sorry {
        font-size: 40px;
        line-height: 40px;
    }

    .error-content-text-no-worries {
        font-size: 22px;
    }

    .error-content-button-wrapper {
        width: 295px;
    }

    .error-content-object-image {
        height: 450px;
    }

    .contactus-card {
        width: 370px;
    }

    .news-empty-title {
        font-size: 90px;
    }

    .magazine-carousel-button-wrapper {
        margin-right: 0;
    }
}

@media screen and (min-width: 992px) {
    .hero-image-wrapper {
        display: flex;
        justify-content: flex-end;
        align-items: center;
    }

    .hero-main-image {
        max-width: 700px;
        /* transform: translateX(30px); Adjust spacing */
        height: auto;
        position: absolute;
        right: 0;
        top: 50px;
    }

	.navbar .dropdown-menu-end { 
        right: 0;
        left: auto;
    }

	.navbar .nav-item .dropdown-menu {
        display: block;
        opacity: 0; 
        visibility: hidden;
        transition:.3s;
        margin-top: 0;
        left: auto;
        background-color: var(--tango);
        border: 0;
        border-radius: 25px;
        padding: 15px;
        width: 300px;
    }

    .navbar .nav-item .dropdown-menu .dropdown-item {
        font-family: var(--font-family-henju-semibold);
        font-size: 12px;
        /* font-weight: 600; */
        color: var(--lightsystem-backgroundprimary) !important;
        margin: 5px 0 5px 0;
    }

    .navbar .nav-item .dropdown-menu .dropdown-item .dropdown-item-logo {
        max-height: 10px;
        float: right;
    }

	.navbar .dropdown-menu.fade-down {
        top: 80%;
        transform: rotateX(-75deg);
        transform-origin: 0% 0%;
    }

	.navbar .dropdown-menu.fade-up {
        top: 100%;
    }

	.navbar .nav-item:hover .dropdown-menu {
        transition: .3s;
        opacity: 1;
        visibility: visible;
        top: 75%;
        transform: rotateX(0deg);
    }

    .navbar .nav-item .dropdown-menu .dropdown-item:hover,
    .navbar .nav-item .dropdown-menu .dropdown-item:focus,
    .navbar .nav-item .dropdown-menu .dropdown-item:active {
        background-color: transparent;
    }
}

@media screen and (max-width: 991px) {
    .nav-bg-square {
        background-size: 180px 80px;
    }

    .navbar-logo {
        width: 100px;
    }

    .navbar-wrapper {
        height: 80px;
        padding-bottom: 0;
        padding-top: 0;
    }

    .openSearch .nav-link {
        opacity: 1;
        pointer-events: auto;
    }

    .search-box {
        right: 200px;
        max-width: calc(70% - 10px);
        position: fixed;
    }

    .search-inner input {
        font-size: 14px;
    }

    .active-home,
    .nav-link.show,
    .nav-link:focus,
    .nav-link:hover {
        color: var(--tango)!important;
    }

    .top-menu {
        position: fixed;
        inset: 0;
        background-color: var(--lightsystem-backgroundprimary);
        /* display: flex;
        justify-content: center; */
        align-items: center;
        padding: 30px 40px;
        border-top: 2px solid var(--tango);
        transform: translateY(-100%);
        transition: transform .3s ease-in-out;
        z-index: -1;
    }
    
    .top-menu-opened {
        top: 80px;
        transform: translateY(0);
    }

    .menu {
        align-items: flex-start;
    }
    
    /* .navbar-collapse {
        padding: 10px 0;
    } */

    /* .navbar-collapse .menu {
        padding: 20px;
        background-color: var(--lightsystem-backgroundprimary);
        border-radius: 15px;
    } */

    .navbar-toggler span {
        transition: .5s;
    }

    .navbar-toggler .fa-x {
        transform: rotate(360deg);
        transition: .5s;
    }

    .navbar .nav-item {
        width: 100%;
    }

    .nav-link {
        font-size: 16px;
        color: #000000;
        padding-right: 15px;
        max-width: 100%;
    }

    .nav-dropdown-icon {
        float: right;
        font-size: 14px;
        margin-top: 5px;
    }

    .navbar .nav-item .dropdown-menu {
        margin-top: 0;
        left: 0;
        background-color: var(--tango);
        border: 0;
        border-radius: 0;
        max-height: 0;
        opacity: 0;
        visibility: hidden;
        transition: max-height 0.3s ease, opacity 0.3s ease, visibility 0.3s ease;
        overflow: hidden;
    }

    .navbar .nav-item .dropdown-menu.show {
        visibility: visible;
        opacity: 1;
        max-height: 300px;
    }

    .navbar .nav-item .dropdown-menu .dropdown-item {
        /* font-weight: 600; */
        color: var(--lightsystem-backgroundprimary) !important;
        margin: 5px 0 5px 0;
        font-size: 16px;
        font-family: var(--font-family-henju-semibold);
    }

    .navbar .nav-item .dropdown-menu .dropdown-item .dropdown-item-logo {
        max-height: 10px;
        float: right;
        margin-top: 5px;
    }

    .navbar .nav-item .dropdown-menu .dropdown-item:hover,
    .navbar .nav-item .dropdown-menu .dropdown-item:focus,
    .navbar .nav-item .dropdown-menu .dropdown-item:active {
        background-color: transparent;
    }

    .tools-wrapper {
        /* display: contents; */
        position: absolute;
        bottom: 5%;
        right: 5%;
    }

    .hero-content-wrapper {
        margin: 40px 0;
    }

    #hero {
        height: auto;
        /* padding-top: 80px; */
    }

    .hero-description-wrapper {
        width: 100%!important;
        max-width: none!important;
    }

    .hero-image-wrapper {
        width: 100%;
        padding: 0 15px;
        margin-top: 30px;
        display: flex;
        justify-content: center;
    }

    .hero-main-image {
        /* transform: translateX(50px); */
        max-width: 100vw;
        width: auto;
    }

    .hero-img {
        max-width: 100%;
    }

    .hero-tagline-title {
        /* line-height: 80px; */
        margin-bottom: 20px;
        width: 100%;
        font-size: 60px;
    }

    .hero-tagline-summary {
        margin-bottom: 50px;
        width: 100%;
        font-size: 18px;
    }

    .img-hero img {
        width: 55%;
        height: auto;
    }

    #shadow-motor-img {
        right: 150px !important;
    }

    #shadow-car-img {
        right: 50px !important;
    }

    .play-button {
        height: 60px;
        width: 60px;
        bottom: 28%;
        right: 26%;
    }

    .logo-opcos {
        background-color: transparent;
        width: 100%;
    }

    /* .play-button {
        background-color: transparent;
        height: 60px;
        width: 60px;
        position: absolute;
        bottom: 0;
        top: 0;
        left: 0;
        right: 0;
        margin: auto;
    } */

    .homepage-about-us-summary-wrapper {
        padding-left: 30px;
    }

    .homepage-about-us-summary {
        font-size: 30px;
    }

    .homepage-about-us-achievement {
        margin: 50px 0 40px;
    }

    .net-revenue-value, .total-network-value, .social-investment-value {
        font-size: 24px;
    }

    .net-revenue-label, .total-network-label, .social-investment-label {
        font-size: 14px;
    }

    .homepage-our-business-text h1 {
        font-size: 65px;
    }

    .homepage-our-business-text h3 {
        font-size: 25px;
    }

    .homepage-our-business-text p {
        font-size: 18px;
    }

    /* .swiper-container {
        height: 450px;
    } */

    #ourBusinessCarousel {
        width: 70%;
    }

    .btn-view-more-slider {
        height: 40px;
        width: 200px;
        font-size: 12px;
    }

    #homepage-last-report {
        border-radius: 120px 120px 0 0;
    }

    .homepage-last-report-ar img,
    .homepage-last-report-sr img {
        width: 100%;
    }

    .last-report-ar-text, .last-report-sr-text {
        font-size: 22px;
    }

    .homepage-esg-title {
        font-size: 34px;
    }
    
    .homepage-accordion-esg-content .homepage-accordion-esg-title {
        font-size: 16px!important;
        line-height: 24px!important;
    }

    .homepage-accordion-esg-content .homepage-accordion-esg-summary {
        font-size: 13px!important;
    }

    .homepage-accordion-esg-content .homepage-accordion-esg-btn {
        height: 46px!important;
        padding: 18px 40px!important;
        font-size: 12px!important;
    }

    .esg-item-expanded .homepage-accordion-esg-content .homepage-accordion-esg-summary {
        width: 100%;
    }

    #homepage-microsite {
        margin: 80px 0;
    }

    /* #micrositeCarousel {
        height: 200px;
    } */

    .swiper-pagination-bullet {
        height: 7px !important;
        width: 22px !important;
    }

    .swiper-pagination-bullet-active {
        height: 7px !important;
        width: 74px !important;
    }

    #homepage-stock {
        border-radius: 120px 120px 0 0;
    }

    .stock-text {
        font-size: 50px;
    }

    #homepage-news {
        margin: -30% auto 0;
        border-radius: 120px 120px 0 0;
    }

    .homepage-news-header-wrapper {
        margin-top: 60px;
    }

    .homepage-news-header-text {
        font-size: 50px;
    }

    .homepage-news-card-content-wrapper {
        padding: 0 10px;
    }

    .homepage-card-news-button, .homepage-visit-newsroom-button {
        font-size: 12px;
    }

    .homepage-visit-newsroom-button {
        width: auto;
        margin-bottom: 0;
    }

    .homepage-news-card-wrapper {
        margin: 60px 0;
    }

    .homepage-card-news-title {
        font-size: 16px;
    }

    #footer {
        border-radius: 120px 120px 0 0;
    }

    .footer-text-title {
        font-size: 45px;
        /* white-space: nowrap; */
        line-height: 45px;
    }

    .footer-text-summary {
        font-size: 20px;
    }

    .footer-contact-wrapper {
        gap: 50px;
    }

    .footer-right-wrapper {
        padding-left: 20px;
    }

    .footer-horizontal-line {
        margin-left: 20px;
    }

    .footer-end-left-wrapper {
        padding-left: 30px;
    }

    .footer-copyright {
        font-size: 15px;
    }

    .footer-logo {
        width: 100px;
    }

    .footer-social-media-icon a {
        font-size: 18px;
        margin: 0 5px;
    }

    #aboutus-header {
        height: auto;
    }

    .aboutus-container {
        margin: 0;
    }

    .aboutus-content-wrapper {
        flex-direction: column;
    }

    .aboutus-description-wrapper {
        margin-top: 150px;
        width: 100%;
        position: static;
    }

    .aboutus-image-wrapper img {
        width: 100%;
        height: auto;
        position: static;
    }

    #aboutus-submenu,
    .aboutus-submenu-wrapper {
        top: 80px;
    }

    .aboutus-submenu {
        padding: 0 10px;
    }

    .aboutus-submenu-item {
        padding: 0 5px;
        display: contents;
    }

    .aboutus-description-title {
        font-size: 70px;
        padding: 20px 30px 10px;
    }

    .aboutus-description-summary {
        font-size: 18px;
    }

    .btn-read-more-aboutus {
        font-size: 15px;
    }

    .aboutus-milestone-wrapper {
        flex-direction: column;
    }

    .aboutus-milestone-image-wrapper {
        width: 100%;
    }

    .aboutus-milestone-description-wrapper {
        width: 100%;
        padding: 40px 40px 0 40px;
    }

    .aboutus-milestone-title {
        font-size: 30px;
    }

    .aboutus-milestone-year-item {
        font-size: 20px;
    }

    .aboutus-milestone-content h5,
    .aboutus-milestone-content p {
        font-size: 14px;
    }

    .aboutus-milestone-content.bigger h5,
    .aboutus-milestone-content.bigger p {
        font-size: 18px;
    }

    .aboutus-vision-mission-wrapper {
        display: block;
    }

    .aboutus-vision-mission-content {
        position: relative;
        top: 0;
    }

    .aboutus-mission-card,
    .aboutus-vision-card {
        border-radius: 0;
        max-width: 50%;
        padding: 20px;
    }

    .aboutus-mission-title,
    .aboutus-vision-title {
        font-size: 25px;
    }

    .aboutus-vision-description {
        font-size: 20px;
    }

    .aboutus-mission-description {
        font-size: 14px;
    }

    .aboutus-credo-wrapper {
        flex-direction: column;
        margin: 80px 0;
        padding: 0 30px;
    }

    .aboutus-credo {
        margin-right: 0;
        flex: 0;
        margin-bottom: 30px;
    }

    .aboutus-credo-title {
        font-size: 45px;
    }

    .aboutus-credo-description {
        font-size: 17px;
    }

    .aboutus-credo-values-title {
        font-size: 16px;
    }

    .aboutus-credo-values-description {
        font-size: 15px;
    }

    .aboutus-credo-belief {
        padding: 0 30px;
    }

    .aboutus-credo-belief-title {
        font-size: 45px;
        margin-bottom: 40px;
    }

    .aboutus-our-leaders-title {
        font-size: 45px;
        margin: 100px 0 40px 0;
    }

    .aboutus-leaders-boc-title,
    .aboutus-leaders-bod-title {
        font-size: 20px;
    }

    .aboutus-leaders-boc-wrapper,
    .aboutus-leaders-bod-wrapper {
        gap: 30px 50px;
        margin-bottom: 80px;
    }

    .aboutus-leaders-boc-image,
    .aboutus-leaders-bod-image {
        max-height: 250px;
    }

    .aboutus-leaders-boc-image-name,
    .aboutus-leaders-bod-image-name {
        font-size: 18px;
    }

    .aboutus-leaders-boc-image-title,
    .aboutus-leaders-bod-image-title {
        font-size: 14px;
    }

    /* .our-leaders-modal-wrapper {
        max-width: var(--bs-modal-width);
    } */

    .our-leaders-modal-container {
        max-height: 100%;
    }

    .our-leaders-modal-header {
        padding: 20px 0 20px 80px;
    }

    .our-leaders-modal-header-name {
        font-size: 45px;
        margin-bottom: 15px;
        line-height: 1;
    }

    .our-leaders-modal-header-title {
        font-size: 28px;
        line-height: 1;
    }

    .our-leaders-modal-close-button {
        width: 25px;
        height: 25px;
    }

    .our-leaders-modal-body {
        flex-direction: column-reverse;
        padding: 0 20px;
    }

    .our-leaders-modal-body-description {
        font-size: 17px;
        margin-right: 0;
    }

    .our-leaders-modal-body-image {
        top: 0;
        height: auto;
        width: 50%;
        margin-left: auto;
        margin-right: auto;
    }

    #aboutus-ownership-group-organization {
        margin-bottom: 150px;
    }

    .aboutus-accordion-button {
        font-size: 25px;
    }

    .aboutus-accordion-button::after,
    .aboutus-accordion-button:not(.collapsed)::after {
        height: 20px;
        width: 38px;
    }

    #ourbusiness-hero {
        top: 80px;
        border-radius: 120px 120px 0 0;
    }

    .ourbusiness-header-title {
        font-size: 75px;
        line-height: 75px;
        margin-bottom: 30px;
    }

    .ourbusiness-header-text {
        font-size: 23px;
    }

    .ourbusiness-unit-card {
        max-width: 45%;
    }

    .ourbusiness-unit-title {
        font-size: 18px;
    }

    .ourbusiness-unit-button-image-wrapper {
        width: 50px;
        height: 50px;
    }

    .ourbusiness-unit-button-image {
        height: 12px;
        width: 12px;
    }

    .ourbusiness-unit-description {
        font-size: 13px;
        margin-top: 30px;
    }

    #ourbusiness-network {
        border-radius: 120px 120px 0 0;
    }

    .ourbusiness-network-wrapper {
        /* margin-bottom: 300px; */
        justify-content: space-evenly;
    }

    .ourbusiness-network-title {
        font-size: 45px;
        margin: 60px 0;
    }

    .ourbusiness-network-image {
        width: 90px;
        height: 90px;
    }

    .ourbusiness-network-total {
        font-size: 25px;
    }

    .ourbusiness-network-location {
        font-size: 13px;
    }

    .network-update {
        margin-bottom: 300px;
        padding-left: 0;
        text-align: center;
    }

    #awards {
        border-radius: 120px 120px 0 0;
        top: 80px;
        /* height: 2200px; */
    }

    .awards-header-title {
        font-size: 75px;
        line-height: 75px;
        margin-bottom: 30px;
    }

    .awards-header-text {
        font-size: 23px;
    }

    .awards-select-wrapper {
        max-width: 350px;
    }

    .awards-select-wrapper .select2-container--default .select2-selection--single {
        font-size: 18px;
        background-size: 21px 11px;
    }

    .awards-select-wrapper .select2-container--open .select2-selection--single {
        background-size: 21px 11px;
    }

    .awards-select-wrapper .select2-results__option {
        font-size: 16px;
    }

    .awards-card {
        max-width: 300px;
        flex: 0 0 50%;
    }

    .awards-card-title {
        font-size: 18px;
    }

    .awards-load-more-wrapper {
        padding-bottom: 0;
    }

    .awards-load-more-button {
        height: 50px;
        font-size: 14px;
        line-height: 10px;
    }

    #esgoverview-hero {
        top: 80px;
        border-radius: 120px 120px 0 0;
    }

    .esgoverview-header-wrapper {
        margin: 50px 0 50px 0;
        padding: 0 60px;
    }

    .esgoverview-header-title {
        font-size: 75px;
        line-height: 75px;
        margin-bottom: 30px;
    }

    .esgoverview-header-text {
        font-size: 23px;
        padding-bottom: 100px;
    }

    #esgstrategy {
        border-radius: 120px 120px 0 0;
    }

    .esgstrategy-image-wrapper {
        justify-content: center;
        flex-wrap: wrap;
    }

    .esgstrategy-image {
        flex: 0 0 35%;
        height: 920px;
    }

    .esgstrategy-header-wrapper {
        margin-top: 60px;
    }

    .esgstrategy-header-text {
        font-size: 45px;
    }

    #esgperformance {
        margin: -15% auto 0;
        border-radius: 120px 120px 0 0;
        /* max-height: 3000px; */
    }

    .esgperformance-header-wrapper {
        margin-top: 60px;
    }

    .esgperformance-header-text {
        font-size: 45px;
    }

    .esgperformance-description-wrapper {
        /* margin: 60px 0 300px 0; */
        margin-top: 60px;
        padding-bottom: 300px;
    }

    .esgperformance-category-icon {
        width: 50px;
    }

    .esgperformance-category-title {
        font-size: 25px;
    }

    .esgperformance-category-description-card {
        width: 49%;
    }

    .esgperformance-category-description-title {
        font-size: 18px;
    }

    .esgperformance-category-description-value-text {
        font-size: 30px;
    }

    .esgperformance-category-description-value-icon {
        width: 45px;
    }

    .esgperformance-category-description-summary {
        font-size: 15px;
    }

    #esgreport-overview {
        margin: -25% auto 0;
        border-radius: 120px 120px 0 0;
        /* max-height: 2000px; */
    }

    .esgreport-overview-header-wrapper {
        margin-top: 60px;
    }

    .esgreport-overview-header-text {
        font-size: 45px;
    }

    .esgreport-overview-header-summary {
        font-size: 18px;
    }

    /* .esgreport-overview-detail-wrapper {
        margin-bottom: 300px;
    } */

    .esgreport-overview-card-wrapper {
        gap: 60px 80px;
    }

    .esgreport-overview-card {
        flex: 0 0 50%;
        max-width: 280px;
    }

    .esgreport-overview-card-body {
        padding: 30px 0 20px;
    }

    .esgreport-overview-card-title {
        font-size: 18px;
    }

    .esgreport-overview-see-more-button {
        height: 50px;
        padding: 22px 44px;
        font-size: 14px;
        line-height: 10px;
        margin-bottom: 100px;
    }

    #esgprogram-hero {
        top: 80px;
        border-radius: 120px 120px 0 0;
    }

    .esgoverview-header-wrapper {
        padding: 0 60px;
    }

    .esgprogram-header-wrapper {
        margin: 50px 0 50px 0;
        padding: 0 60px;
    }

    .esgprogram-header-title {
        font-size: 75px;
        line-height: 75px;
        margin-bottom: 30px;
    }

    .esgprogram-header-text {
        font-size: 23px;
        padding-bottom: 100px;
    }

    #esgprogram {
        border-radius: 120px 120px 0 0;
    }

    .esgprogram-category-btn {
        padding: 15px 12px;
        font-size: 18px;
    }

    .esgprogram-card {
        width: 330px;
    }

    .esgprogram-card-image {
        height: 330px;
    }

    .esgprogram-card-title {
        font-size: 18px;
    }

    .esgprogram-card-subtitle-date,
    .esgprogram-card-subtitle-type {
        font-size: 13px;
    }

    .esgprogram-card-summary {
        font-size: 14px;
    }

    .esgprogram-card-btn {
        font-size: 14px;
    }

    .esgprogram-modal-wrapper {
        max-width: 80%;
    }

    .esgprogram-modal-header-description {
        font-size: 18px;
    }

    .esgprogram-modal-close-button {
        font-size: 18px;
    }

    .esgprogram-modal-achievement-wrapper {
        padding-left: 1rem;
        padding-bottom: 1rem;
    }

    .esgprogram-modal-achievement {
        flex-direction: column;
        align-items: center;
    }

    .esgprogram-modal-achievement-image {
        padding-top: 0;
        max-height: 400px;
    }

    .esgprogram-modal-achievement-detail-wrapper {
        padding: 40px;
    }

    .esgprogram-modal-achievement-detail-title {
        font-size: 25px;
    }

    .esgprogram-modal-achievement-detail-summary-value {
        font-size: 40px;
    }

    .esgprogram-modal-achievement-detail-summary-text {
        font-size: 18px;
    }

    .esgprogram-card-wrapper {
        padding-bottom: 0;
    }

    #esgreport-hero {
        top: 80px;
        border-radius: 120px 120px 0 0;
    }

    .esgreport-header-wrapper {
        margin: 50px 0 50px 0;
        padding: 0 60px;
    }

    .esgreport-header-title {
        font-size: 75px;
        line-height: 75px;
        margin-bottom: 30px;
    }

    .esgreport-header-text {
        font-size: 23px;
        padding-bottom: 100px;
    }

    #esgreport {
        border-radius: 120px 120px 0 0;
    }

    .esgreport-detail-wrapper {
        margin-top: 60px;
        padding: 0 50px;
    }

    .esgreport-card-wrapper {
        gap: 40px 60px;
        padding-bottom: 150px;
    }

    .esgreport-card {
        flex: 0 0 50%;
        max-width: 280px;
    }

    .esgreport-card-body {
        padding: 30px 0 20px;
    }

    .esgreport-card-title {
        font-size: 18px;
    }

    .esgreport-overview-see-more-wrapper {
        padding-bottom: 100px;
    }

    #esggallery-hero {
        top: 80px;
        border-radius: 120px 120px 0 0;
    }

    .esggallery-header-wrapper {
        padding: 0 60px;
    }

    .esggallery-header-title {
        font-size: 75px;
        line-height: 75px;
        margin-bottom: 30px;
    }

    .esggallery-header-text {
        font-size: 23px;
        padding-bottom: 100px;
    }

    #esggallery {
        border-radius: 120px 120px 0 0;
    }

    .esggallery-category-btn {
        font-size: 15px;
    }

    .esggallery-detail-wrapper {
        padding-bottom: 50px;
    }
    
    .esggallery-content li {
        width: 235px;
        height: 235px;
    }

    .esggallery-content-wrapper .easyPaginateNav a {
        font-size: 15px;
    }

    .esggallery-filter-search-input {
        font-size: 15px;
    }

    .esggallery-filter-search-btn {
        height: 45px;
        font-size: 15px;
    }

    .esggallery-filter-search {
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        gap: 5px;
    }

    .esggallery-filter-search-input {
        font-size: 15px;
        width: 100%!important;
        height: 45px;
    }

    .esggallery-filter-search .input-group-btn.input-space {
        padding-left: 0;
    }

    .esggallery-filter-search-btn {
        height: 45px;
        font-size: 15px;
        width: 100%;
    }

    .esggallery-filter-category-btn,
    .esggallery-filter-year-btn {
        font-size: 15px;
    }

    .esggallery-filter-category-item-value,
    .esggallery-filter-year-item-value {
        font-size: 15px;
    }

    #investorrelation-hero {
        top: 80px;
        border-radius: 120px 120px 0 0;
    }

    .investorrelation-header-wrapper {
        padding: 0 60px;
    }

    .investorrelation-header-title {
        font-size: 75px;
        line-height: 75px;
        margin-bottom: 30px;
    }

    .investorrelation-header-text {
        font-size: 23px;
        padding-bottom: 100px;
    }

    .investorrelation-tab-wrapper {
        border: 0;
        padding: 0;
        position: absolute;
        width: 100%;
        left: 0;
    }

    .investorrelation-tab {
        display: none;
    }

    .investorrelation-dropdown {
        position: relative;
        display: block;
        /* margin-top: -60px; */
        width: 100vw;
    }

    .investorrelation-dropdown-toggle {
        display: flex;
        height: 52px;
        width: 100%;
        align-items: center;
        justify-content: space-between;
        background-color: rgba(18, 18, 18, 0.8);
        padding: 20px 50px 20px 60px;
        border-radius: 45px 45px 0px 0px;
    }

    .investorrelation-dropdown-toggle span {
        color: rgba(255, 255, 255, 1);
        font-size: 16px;
        letter-spacing: 0px;
        line-height: 16px;
        text-align: left;
        white-space: pre-line;
    }

    .investorrelation-dropdown-toggle svg.rotate {
        -moz-transition: rotate(180deg);
        -webkit-transition: rotate(180deg);
        transition: rotate(180deg);
        transform: translateX(0) translateY(0) rotate(180deg) skewX(0) skewY(0) scaleX(1) scaleY(1);
    }

    .investorrelation-dropdown-content.show {
        /* display: block; */
        visibility: visible;
        opacity: 1;
    }

    .investorrelation-dropdown-content-item {
        padding: 15px 0px 15px 20px;
        font-size: 16px;
        color: var(--lightsystem-backgroundprimary);
        letter-spacing: 0px;
        line-height: 16px;
        white-space: pre-line;
        text-decoration: none;
        margin-left: 35px;
        margin-right: 50px;
        border-bottom: 1px solid rgba(255, 255, 255, 0.2);
    }

    .investorrelation-dropdown-content-item.active {
        border-left: 5px solid var(--tango);
        color: var(--tango);
    }

    .investorrelation-content-wrapper {
        margin-top: 60px;
        width: 100%;
    }

    .investorrelation-tab-content-header {
        padding: 20px;
    }

    .investorrelation-tab-content-header-title {
        font-size: 20px;
    }

    .investorrelation-tab-content-header-line {
        margin: 0 20px;
    }

    .investorrelation-tab-content-body {
        padding: 0 20px;
        margin: 30px 0 100px;
    }

    .investorrelation-tab-content-file-link-title-text {
        font-size: 18px;
    }

    .investorrelation-tab-content-file-link-pdf {
        width: 25px;
    }

    .investorrelation-tab-content-file-link-download {
        width: 24px;
    }

    .investorrelation-tab-content-shareholder-investor-value {
        font-size: 23px;
    }

    .investorrelation-tab-content-shareholder-investor-name {
        font-size: 13px;
    }

    .investorrelation-tab-content-shareholder-info-text {
        font-size: 15px;
    }

    .investorrelation-annual-report-card {
        flex: 0 0 50%;
        width: 270px;
    }

    .investorrelation-annual-report-card-image-wrapper {
        height: 370px;
    }

    .investorrelation-annual-report-card-title {
        padding: 0 40px;
    }

    .investorrelation-tab-content-header#financial-presentation-header {
        padding: 20px;
        padding-bottom: 0;
    }

    .investorrelation-tab-content-body#financial-presentation-body {
        padding: 0 20px;
        margin: 30px 0 100px;
    }

    .financial-presentation-tab-link {
        font-size: 20px;
    }

    .financial-presentation-detail-quarter-title {
        font-size: 35px;
    }

    .financial-presentation-detail-title {
        font-size: 18px;
    }

    .investorrelation-tab-content-investor-contact-image {
        max-width: 400px;
    }

    .investorrelation-tab-content-investor-contact-text {
        font-size: 20px;
    }

    .investorrelation-tab-content-investor-contact-btn {
        padding: 22px 100px;
        font-size: 20px;
    }

    #corporategovernance-hero {
        top: 80px;
        border-radius: 120px 120px 0 0;
    }

    .corporategovernance-header-wrapper {
        padding: 0 60px;
    }

    .corporategovernance-header-title {
        font-size: 75px;
        line-height: 75px;
        margin-bottom: 30px;
    }

    .corporategovernance-header-text {
        font-size: 23px;
        padding-bottom: 100px;
    }

    .corporategovernance-tab-wrapper {
        border: 0;
        padding: 0;
        position: absolute;
        width: 100%;
        left: 0;
    }

    .corporategovernance-tab {
        display: none;
    }

    .corporategovernance-dropdown {
        position: relative;
        display: block;
        /* margin-top: -60px; */
        width: 100vw;
    }

    .corporategovernance-dropdown-toggle {
        display: flex;
        height: 52px;
        width: 100%;
        align-items: center;
        justify-content: space-between;
        background-color: rgba(18, 18, 18, 0.8);
        padding: 20px 50px 20px 60px;
        border-radius: 45px 45px 0px 0px;
    }

    .corporategovernance-dropdown-toggle span {
        color: rgba(255, 255, 255, 1);
        font-size: 16px;
        letter-spacing: 0px;
        line-height: 16px;
        text-align: left;
        white-space: pre-line;
    }

    .corporategovernance-dropdown-toggle svg.rotate {
        -moz-transition: rotate(180deg);
        -webkit-transition: rotate(180deg);
        transition: rotate(180deg);
        transform: translateX(0) translateY(0) rotate(180deg) skewX(0) skewY(0) scaleX(1) scaleY(1);
    }

    .corporategovernance-dropdown-content.show {
        /* display: block; */
        visibility: visible;
        opacity: 1;
    }

    .corporategovernance-dropdown-content-item {
        padding: 15px 0px 15px 20px;
        font-size: 16px;
        color: var(--lightsystem-backgroundprimary);
        letter-spacing: 0px;
        line-height: 16px;
        white-space: pre-line;
        text-decoration: none;
        margin-left: 35px;
        margin-right: 50px;
        border-bottom: 1px solid rgba(255, 255, 255, 0.2);
    }

    .corporategovernance-dropdown-content-item.active {
        border-left: 5px solid var(--tango);
        color: var(--tango);
    }

    .corporategovernance-content-wrapper {
        margin-top: 60px;
        width: 100%;
    }

    .corporategovernance-tab-content-header {
        padding: 20px;
    }

    .corporategovernance-tab-content-document-header {
        padding: 20px 0;
    }

    .corporategovernance-tab-content-header-title,
    .corporategovernance-tab-content-document-header-title {
        font-size: 20px;
    }

    .corporategovernance-tab-content-header-line {
        margin: 0 20px;
    }

    .corporategovernance-tab-content-body {
        padding: 0 20px;
        margin: 30px 0 100px;
    }

    .corporategovernance-tab-content-file-link-title-text {
        font-size: 18px;
    }

    .corporategovernance-tab-content-file-link-pdf {
        width: 25px;
    }

    .corporategovernance-tab-content-file-link-download {
        width: 24px;
    }

    .corporategovernance-tab-content-card {
        width: 280px;
    }

    .corporategovernance-tab-content-summary-value {
        font-size: 16px;
    }

    .corporategovernance-tab-content-member {
        gap: 50px;
    }

    .corporategovernance-tab-content-image-wrapper {
        max-width: 300px;
    }

    .corporategovernance-tab-content-image {
        width: 170px !important;
        height: 180px !important;
    }

    .corporategovernance-tab-content-image-name {
        font-size: 18px;
    }

    .corporategovernance-tab-content-image-job {
        font-size: 14px;
    }

    #news-hero {
        top: 80px;
        border-radius: 120px 120px 0 0;
    }

    .news-header-wrapper {
        padding: 0 60px;
    }

    .news-header-title {
        font-size: 75px;
        line-height: 75px;
        margin-bottom: 30px;
    }

    .news-header-text {
        font-size: 23px;
        padding-bottom: 100px;
    }

    #news,
    #magazine-other
    {
        border-radius: 120px 120px 0 0;
    }

    .news-category-wrapper {
        gap: 20px;
    }

    .news-category-link {
        gap: 10px;
        height: 55px;
        padding: 22px 54px;
        font-size: 14px;
        line-height: 15px;
    }

    .news-detail-wrapper {
        margin-top: 80px;
    }

    .news-press-release-feature-wrapper {
        flex-direction: column;
    }

    .news-press-release-feature-subtitle {
        font-size: 16px;
    }

    .news-press-release-feature-title {
        font-size: 28px;
        margin-top: 0;
    }

    .news-press-release-feature-image {
        width: 100%;
    }

    .news-press-release-card-wrapper {
        gap: 40px 30px;
    }

    .news-press-release-card {
        flex: 0 0 50%;
        width: 300px;
    }

    .news-press-release-card-title {
        font-size: 18px;
    }

    .news-press-release-load-more-wrapper {
        padding-bottom: 0;
    }

    .news-press-release-load-more-button {
        height: 55px;
        padding: 22px 54px;
        font-size: 14px;
        line-height: 14px;
    }

    .news-magazine-recent-text,
    .news-magazine-all-text {
        font-size: 40px;
    }

    .news-magazine-recent-text-line,
    .news-magazine-all-text-line {
        width: 40%;
    }

    .news-magazine-recent-card-wrapper {
        gap: 40px 20px;
    }

    .news-magazine-recent-card {
        /* max-width: 200px; */
        flex: 1 1 calc(50% - 20px);
        max-width: calc(50% - 20px);
        min-width: 180px;
    }

    .news-magazine-recent-card-subtitle {
        font-size: 15px;
    }

    .news-magazine-recent-card-title {
        font-size: 20px;
    }

    .news-magazine-recent-card-button {
        height: 45px;
        font-size: 14px;
    }

    .news-magazine-archive-detail-card {
        width: 190px;
        height: 190px;
    }

    .news-magazine-archive-text {
        font-size: 28px;
    }

    .news-magazine-archive-list-item {
        font-size: 18px;
    }

    #news-content {
        top: 80px;
    }

    .news-content-image {
        height: 400px;
        border-radius: 80px;
    }

    .news-content-wrapper {
        margin-top: 60px;
    }

    .news-content-detail-wrapper {
        padding: 0 60px;
    }

    .news-content-detail-back-button {
        height: 50px;
        width: 280px;
        font-size: 14px;
    }

    .news-content-detail-title {
        font-size: 50px;
    }

    .news-content-detail-date,
    .news-content-detail-share-text {
        font-size: 18px;
    }

    .news-content-detail-share-socmed-whatsapp,
    .news-content-detail-share-socmed-email,
    .news-content-detail-share-socmed-facebook,
    .news-content-detail-share-socmed-linkedin {
        font-size: 30px;
    }

    .news-content-detail-value {
        font-size: 18px;
    }

    .news-content-detail-other-title {
        font-size: 35px;
    }

    .news-content-detail-other-card-wrapper {
        flex: 1 1 50%;
        max-width: calc(50% - 20px);
        gap: 30px;
    }

    .news-content-detail-other-card-subtitle {
        font-size: 16px;
    }

    .news-content-detail-other-card-title {
        font-size: 20px;
    }

    .news-content-detail-other-card-button {
        font-size: 14px;
    }

    .magazine-header-wrapper {
        flex-direction: column;
        justify-content: center;
        margin: 60px 0 40px 0;
    }

    .magazine-carousel-button-wrapper {
        justify-content: end;
        margin-right: 0;
        margin-top: 40px;
    }

    .magazine-other-detail-card {
        width: 250px;
        height: 250px;
    }

    .magazine-other-detail-card-subtitle {
        font-size: 18px;
        line-height: 18px;
    }

    .magazine-other-detail-card-title {
        font-size: 25px;
        line-height: 26px;
    }

    .magazine-carousel-button {
        width: 69px;
        height: 69px;
    }

    .magazine-carousel-button-arrow {
        width: 15px;
        height: 28px;
        object-fit: contain;
    }

    #career-hero {
        top: 80px;
        border-radius: 120px 120px 0 0;
    }

    .career-header-wrapper {
        margin: 100px 0 100px 0;
        padding: 0 60px;
    }

    .career-header-title {
        font-size: 75px;
        line-height: 75px;
        margin-bottom: 30px;
    }

    .career-header-text {
        font-size: 23px;
        padding-bottom: 100px;
    }

    #career {
        border-radius: 120px 120px 0 0;
    }

    .career-program-wrapper {
        flex-direction: column;
    }

    .career-program-image-wrapper {
        text-align: center;
        margin: -10% auto 0;
    }

    .career-program-image {
        width: 100%;
        height: 620px;
    }

    .career-program-detail-wrapper {
        padding: 20px;
    }

    .career-program-title {
        font-size: 28px;
        margin-bottom: 25px;
        text-align: center;
    }

    .career-program-description {
        font-size: 17px;
    }

    .career-step-wrapper {
        padding: 0 20px;
    }

    .career-step-text {
        font-size: 28px;
        margin-bottom: 30px;
        text-align: center;
    }

    .career-step-card-wrapper {
        gap: 20px;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }

    .career-step-card {
        flex: 0 0 100%;
    }

    .career-step-card-body {
        padding: 40px 30px;
    }

    .career-step-circle-outer {
        width: 90px;
        height: 90px;
    }

    .career-step-circle-inner {
        width: 60px;
        height: 60px;
    }

    .career-step-circle-text {
        font-size: 20px;
    }

    .career-step-title {
        font-size: 19px;
    }

    .career-step-name {
        font-size: 17px;
    }

    .career-step-summary {
        font-size: 14px;
    }

    #career-apply {
        margin: -45% auto 0;
        border-radius: 120px 120px 0 0;
    }

    .career-apply-qualification {
        margin-top: 55%;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        margin-bottom: 50px;
        gap: 10%;
    }

    .career-apply-qualification-image-wrapper {
        text-align: center;
    }

    .career-apply-qualification-image {
        width: 100%;
        height: auto;
    }

    .career-apply-qualification-detail-wrapper {
        margin-top: 40px;
        margin-right: 0;
        padding: 0 60px;
    }

    .career-apply-qualification-title {
        font-size: 28px;
        text-align: center;
        margin-bottom: 30px;
    }

    .career-apply-qualification-description-wrapper {
        gap: 20px;
    }

    .career-apply-qualification-description-detail {
        gap: 20px;
    }

    .career-apply-qualification-description-image {
        max-height: 27px;
    }

    .career-apply-qualification-text {
        font-size: 17px;
    }

    .career-apply-submit {
        padding: 0 20px;
        margin-bottom: 200px;
    }

    .career-apply-submit-detail-wrapper {
        height: 240px;
    }

    .career-apply-submit-detail-overlay {
        padding: 27px 30px;
        gap: 30px;
        justify-content: center;
    }

    .career-apply-submit-detail-title {
        font-size: 28px;
        line-height: 28px;
    }

    .career-apply-submit-detail-summary {
        font-size: 17px;
        line-height: 1;
    }

    .career-apply-submit-detail-text-wrapper {
        width: 60%;
    }

    .career-apply-submit-detail-button {
        height: 55px;
        font-size: 17px;
        line-height: 30px;
    }

    .homepage-news-card img {
        width: 200px;
        height: 200px;
    }

    .footer-wrapper {
        padding: 0 20px;
    }

    .error-content-text-wrapper {
        width: 600px;
        bottom: 18%;
        left: 11%;
    }

    .error-content-text-code {
        font-size: 80px;
        margin-bottom: 30px;
    }

    .error-content-text-sorry {
        font-size: 40px;
    }

    .error-content-text-no-worries {
        width: 450px;
    }

    .error-content-button-wrapper {
        width: 300px;
    }

    .error-content-object-wrapper {
        right: 50px;
        bottom: 0;
    }

    .error-content-object-image {
        height: 300px;
    }

    #contactus-hero {
        top: 80px;
        border-radius: 120px 120px 0 0;
    }

    .contactus-header-wrapper {
        margin: 100px 0 100px 0;
        padding: 0 60px;
    }

    .contactus-header-title {
        font-size: 75px;
        line-height: 75px;
        margin-bottom: 30px;
    }

    .contactus-header-text {
        font-size: 23px;
        padding-bottom: 100px;
    }

    .contactus-form-wrapper {
        flex-direction: column;
        padding: 0;
    }

    .contactus-form-card-wrapper {
        margin-bottom: 0;
    }

    .contactus-card {
        width: 100%;
        height: 500px;
    }

    .contactus-card .card-body {
        padding: 50px 80px 50px 50px;
    }
    
    .contactus-card-info-title {
        font-size: 33px;
    }

    .contactus-card-address-title,
    .contactus-card-phone-title {
        font-size: 26px;
    }

    .contactus-card-address-text,
    .contactus-card-phone-text,
    .contactus-card-fax-text
    {
        font-size: 18px;
    }

    #searchnews-hero {
        top: 80px;
        border-radius: 120px 120px 0 0;
    }

    .searchnews-header-wrapper {
        margin: 100px 0 100px 0;
        padding: 0 60px;
    }

    .searchnews-header-title {
        font-size: 45px;
        line-height: 45px;
        padding-bottom: 0;
    }

    #searchnewsresults {
        border-radius: 120px 120px 0 0;
    }

    .news-container-wrapper {
        margin-top: 20px;
    }

    .news-empty-wrapper {
        padding: 0 30px;
    }

    .news-empty-title {
        font-size: 70px;
        line-height: 1;
        margin-bottom: 20px;
    }

    .news-empty-summary {
        font-size: 22px;
    }

    .news-search-btn {
        margin-bottom: 50px;
    }

    .loader-bg {
        object-fit: contain;
        transform: scale(1.5);
    }
}

@media screen and (max-width: 767px) {

    .last-report-line {
        background-color: #D1D5DB;
        transform: rotate(90deg);
        height: 300px;
    }

    #homepage-last-report {
        border-radius: 80px 80px 0 0;
    }

    .homepage-last-report-sr img {
        top: 20% !important;
    }

    .last-report-sr-text {
        bottom: 25% !important;
    }

    .btn-view-all-sr-report {
        bottom: 15% !important;
    }

    #homepage-esg {
        padding-top: 50px;
    }

    .homepage-esg-title {
        font-size: 30px;
    }

    .homepage-accordion-esg {
        flex-direction: column;
    }

    .homepage-accordion-esg-content .homepage-accordion-esg-title {
        position: absolute;
        top: 90px;
    }
    
    .homepage-accordion-esg-content .homepage-accordion-esg-title {
        font-size: 16px!important;
        line-height: 24px!important;
        top: -40%!important;
    }

    .homepage-accordion-esg-content .homepage-accordion-esg-summary {
        font-size: 12px!important;
    }

    .homepage-accordion-esg-content .homepage-accordion-esg-btn {
        height: 46px!important;
        padding: 18px 40px!important;
        font-size: 12px!important;
    }

    #homepage-stock {
        border-radius: 80px 80px 0 0;
    }

    .stock-text {
        font-size: 45px;
    }

    #homepage-news {
        border-radius: 80px 80px 0 0;
        /* height: 2000px; */
    }

    .homepage-news-header-text {
        font-size: 45px;
    }

    #footer {
        border-radius: 80px 80px 0 0;
    }

    .footer-left-wrapper {
        padding-right: 10px;
    }

    .footer-text-title {
        font-size: 40px;
        text-align: center;
        white-space: normal;
        line-height: 40px;
    }

    .footer-text-summary {
        font-size: 18px;
        text-align: center;
    }

    .footer-text-contact {
        font-size: 16px;
        text-align: center;
    }

    .footer-contact-wrapper {
        gap: 20px;
        flex-direction: column;
    }

    .footer-contact-number, .footer-contact-address {
        font-size: 14px;
        text-align: center;
    }

    .footer-right-wrapper {
        text-align: center;
        margin-top: 3rem;
    }

    .footer-right-wrapper img {
        margin-bottom: 40px;
    }

    .footer-text-quick-link {
        font-size: 16px;
        text-align: center;
    }

    .footer-link-wrapper li a {
        font-size: 14px;
    }

    .footer-horizontal-line {
        margin-top: 2rem;
    }

    .footer-end-wrapper {
        flex-direction: column-reverse;
        gap: 30px;
    }

    .footer-end-right-wrapper {
        flex-direction: column;
        gap: 10px;
    }

    .footer-copyright {
        font-size: 14px;
        text-align: center;
    }

    .footer-text-followus {
        font-size: 16px;
    }

    .footer-social-media-icon a {
        margin: 0 10px;
        font-size: 18px;
    }

    #ourbusiness-hero,
    #awards,
    #esgoverview-hero,
    #esgstrategy,
    #esgperformance,
    #esgreport-overview,
    #esgprogram-hero,
    #esgprogram,
    #esgreport-hero,
    #esgreport,
    #esggallery-hero,
    #esggallery,
    #investorrelation-hero,
    #corporategovernance-hero,
    #news-hero,
    #news,
    #magazine-other,
    #career-hero,
    #career,
    #career-apply,
    #contactus-hero,
    #searchnews-hero,
    #searchnewsresults {
        border-radius: 80px 80px 0 0;
    }
}

@media screen and (max-width: 576px) {
    .scrollToTop {
        bottom: 50px;
        right: 30px;
    }
    
    .nav-bg-square {
        background-size: 130px 60px;
    }

    .navbar-logo {
        width: 80px;
    }

    .navbar-wrapper {
        height: 60px;
    }

    .search-box {
        right: 170px;
        max-width: calc(55% - 20px);
    }

    .search-inner input {
        font-size: 12px;
    }

    .top-menu {
        padding: 28px 20px;
    }

    .top-menu-opened {
        top: 60px;
    }

    /* .navbar-collapse {
        padding: 10px 0;
    } */

    /* .navbar-collapse .menu {
        padding: 20px;
        background-color: var(--lightsystem-backgroundprimary);
        border-radius: 15px;
    } */

    .navbar-toggler span {
        transition: .5s;
    }

    .nav-toggle-icon {
        font-size: 18px;
    }

    .navbar-toggler .fa-x {
        transform: rotate(360deg);
        transition: .5s;
    }

    .nav-link {
        font-size: 15px;
        color: #000000
    }

    .navbar .nav-item .dropdown-menu .dropdown-item {
        font-size: 14px;
    }

    .hero-description-wrapper {
        padding-right: 5px;
        padding-left: 5px;
    }

    .hero-tagline {
        margin-top: 40% !important;
    }

    .hero-tagline-title {
        font-size: 40px;
        /* line-height: 50px; */
        letter-spacing: -3px;
        width: 100%;
    }

    .hero-tagline-summary {
        font-size: 16px;
        margin-bottom: 40px;
        width: 100%;
    }

    .img-hero img {
        width: 100%;
        height: auto;
    }

    .img-hero-component {
        bottom: 5%;
    }

    .play-button {
        height: 50px;
        width: 50px;
        bottom: 22%;
        right: 49%;
    }

    /* .play-button {
        background-color: transparent;
        height: 50px;
        width: 50px;
        position: absolute;
        bottom: 0;
        top: 0;
        left: 0;
        right: 0;
        margin: auto;
    } */

    .homepage-about-us-photo {
        height: 300px;
    }

    .homepage-about-us-summary {
        font-size: 25px;
        margin-top: 5px;
    }

    .homepage-about-us-achievement {
        margin: 40px 0 40px;
    }

    .net-revenue-value, .total-network-value, .social-investment-value {
        font-size: 20px;
    }

    .net-revenue-label, .total-network-label, .social-investment-label {
        font-size: 12px;
    }

    .achievement-update {
        font-size: 12px;
    }

    .homepage-our-business-text h1 {
        font-size: 50px;
        line-height: 1;
    }

    .homepage-our-business-text h3 {
        font-size: 23px;
    }

    .homepage-our-business-text p {
        font-size: 16px;
        width: 80%;
        margin: 0 auto 10px;
    }

    /* .swiper-container {
        height: 350px;
    } */

    #ourBusinessCarousel {
        width: 100%;
    }

    .btn-view-more-slider {
        height: 30px;
        width: 150px;
        font-size: 10px;
    }

    #homepage-esg {
        padding-top: 20px;
    }

    .homepage-esg-title {
        font-size: 28px;
    }

    .homepage-accordion-esg-item:not(.esg-item-expanded) .homepage-accordion-esg-content .homepage-accordion-esg-title {
        position: absolute!important;
        top: 80px!important;
    }
    
    .esg-item-expanded .homepage-accordion-esg-content .homepage-accordion-esg-title {
        font-size: 16px!important;
        line-height: 24px!important;
        top: -40%!important;
    }

    .esg-item-expanded .homepage-accordion-esg-content .homepage-accordion-esg-summary {
        font-size: 12px!important;
        line-height: 13px!important;
        /* width: 90%; */
        left: 0!important;
    }

    .esg-item-expanded .homepage-accordion-esg-content .homepage-accordion-esg-btn {
        height: 40px!important;
        padding: 15px 40px!important;
        font-size: 12px!important;
        left: 10%!important;
    }

    .accordion-esg-expand-button {
        visibility: hidden!important;
    }

    #homepage-microsite {
        margin: 60px 0;
    }

    /* #micrositeCarousel {
        height: 120px;
    } */

    .swiper-pagination-bullet {
        height: 6px !important;
        width: 21px !important;
    }

    .swiper-pagination-bullet-active {
        height: 6px !important;
        width: 53px !important;
    }

    .homepage-stock-container {
        padding: 0 30px;
    }

    .homepage-stock-wrapper {
        margin-top: 40px;
    }

    #homepage-news {
        margin: -40% auto 0;
        /* height: 2000px; */
    }

    .homepage-news-header-wrapper {
        margin-top: 40px;
    }

    .homepage-visit-newsroom-button {
        width: 90%;
    }

    .footer-horizontal-line {
        margin-left: 0;
    }

    .footer-logo {
        width: 80px;
    }

    #aboutus-submenu,
    .aboutus-submenu-wrapper {
        top: 60px;
        height: 80px;
    }

    .aboutus-submenu {
        height: 80px;
        padding: 0;
    }

    .aboutus-submenu-list {
        display: block;
        padding: 0 10px;
    }

    .aboutus-submenu-item {
        padding: 0 5px;
    }

    .aboutus-submenu-link {
        white-space: nowrap;
    }

    .aboutus-description-wrapper {
        margin-top: 170px;
    }

    .aboutus-description-title {
        font-size: 50px;
        padding: 10px;
        margin-bottom: 0;
    }

    .aboutus-description-summary {
        font-size: 16px;
        padding: 10px;
    }

    .btn-read-more-aboutus-wrapper {
        padding: 10px;
    }

    .btn-read-more-aboutus {
        line-height: 8px;
        font-size: 14px;
    }

    .aboutus-milestone-description-wrapper {
        padding: 30px 30px 0 30px;
    }

    .aboutus-milestone-title {
        font-size: 25px;
    }

    .aboutus-milestone-year-wrapper .slick-prev,
    .aboutus-milestone-year-wrapper .slick-next {
        font-size: 20px;
    }

    .aboutus-milestone-year-item {
        font-size: 18px;
    }

    .aboutus-milestone-content h5,
    .aboutus-milestone-content p {
        font-size: 12px;
    }

    .aboutus-milestone-content.bigger h5,
    .aboutus-milestone-content.bigger p {
        font-size: 16px;
    }

    .aboutus-vision-mission-content {
        position: relative;
        top: 0;
    }

    .aboutus-mission-card,
    .aboutus-vision-card {
        border-radius: 0;
        max-width: 50%;
        padding: 20px;
    }

    .aboutus-mission-title,
    .aboutus-vision-title {
        font-size: 20px;
        line-height: 30px;
    }

    .aboutus-vision-description {
        font-size: 16px;
        line-height: 20px;
    }

    .aboutus-mission-description {
        font-size: 12px;
        line-height: 15px;
    }

    .aboutus-credo-wrapper {
        margin: 60px 0;
        padding: 0 20px;
    }

    .aboutus-credo-title {
        font-size: 40px;
    }

    .aboutus-credo-description {
        font-size: 15px;
    }

    .aboutus-credo-values-title {
        font-size: 15px;
    }

    .aboutus-credo-values-description {
        font-size: 14px;
    }

    .aboutus-credo-belief {
        padding: 0 20px;
    }

    .aboutus-credo-belief-title {
        font-size: 40px;
        margin-bottom: 30px;
        line-height: 1;
    }

    .aboutus-our-leaders-title {
        font-size: 40px;
        margin: 60px 0 40px 0;
    }

    .aboutus-leaders-boc-title,
    .aboutus-leaders-bod-title {
        font-size: 18px;
    }

    .aboutus-leaders-boc-wrapper,
    .aboutus-leaders-bod-wrapper {
        margin-bottom: 60px;
    }

    .aboutus-leaders-boc-image,
    .aboutus-leaders-bod-image {
        margin-bottom: 20px;
    }

    .aboutus-leaders-boc-image-name,
    .aboutus-leaders-bod-image-name {
        font-size: 16px;
        text-align: center;
    }

    .aboutus-leaders-boc-image-title,
    .aboutus-leaders-bod-image-title {
        font-size: 12px;
        text-align: center;
    }

    .our-leaders-modal-header {
        padding: 15px 0 15px 60px;
    }

    .our-leaders-modal-header-name {
        font-size: 40px;
        margin-bottom: 10px;
    }

    .our-leaders-modal-header-title {
        font-size: 20px;
    }

    .our-leaders-modal-close-button {
        width: 20px;
        height: 20px;
    }

    .our-leaders-modal-body {
        padding: 0 10px;
    }

    .our-leaders-modal-body-description {
        font-size: 15px;
    }

    .our-leaders-modal-body-image {
        max-height: 100%;
        width: 100%
    }

    #aboutus-ownership-group-organization {
        margin-bottom: 100px;
    }

    .aboutus-accordion-button {
        height: 100px;
        padding: 40px 30px;
        font-size: 18px;
    }

    .aboutus-accordion-button::after,
    .aboutus-accordion-button:not(.collapsed)::after {
        height: 15px;
        width: 28px;
    }

    #ourbusiness-hero {
        top: 60px;
    }

    .ourbusiness-header-title {
        font-size: 45px;
        line-height: 45px;
        margin-bottom: 20px;
    }

    .ourbusiness-header-text {
        font-size: 21px;
    }

    .ourbusiness-unit-card {
        max-width: 90%;
    }

    .ourbusiness-unit-title {
        font-size: 16px;
    }

    .ourbusiness-unit-button-image-wrapper {
        width: 40px;
        height: 40px;
    }

    .ourbusiness-unit-button-image {
        height: 10px;
        width: 10px;
    }

    .ourbusiness-unit-description {
        font-size: 12px;
        margin-top: 20px;
    }

    #ourbusiness-network {
        border-radius: 80px 80px 0 0;
    }

    .ourbusiness-network-wrapper {
        /* margin-bottom: 200px; */
        gap: 50px;
    }

    .ourbusiness-network-item {
        justify-content: stretch;
        width: 150px;
    }

    .ourbusiness-network-title {
        font-size: 40px;
    }

    .ourbusiness-network-image {
        width: 80px;
        height: 80px;
    }

    .ourbusiness-network-total {
        font-size: 20px;
    }

    .ourbusiness-network-location {
        font-size: 12px;
    }

    .network-update {
        font-size: 12px;
        margin-bottom: 200px;
    }

    #awards {
        top: 60px;
        /* height: 3300px; */
    }

    .awards-header-wrapper {
        margin: 60px 0 80px 0;
    }

    .awards-header-title {
        font-size: 45px;
        line-height: 45px;
        margin-bottom: 20px;
    }

    .awards-header-text {
        font-size: 21px;
    }

    .awards-select-wrapper {
        max-width: 300px;
    }

    .awards-select-wrapper .select2-container--default .select2-selection--single {
        font-size: 16px;
        background-size: 19px 9px;
    }

    .awards-select-wrapper .select2-container--open .select2-selection--single {
        background-size: 19px 9px;
    }

    .awards-select-wrapper .select2-results__option {
        font-size: 14px;
    }

    .awards-card {
        max-width: 300px;
        flex: 0 0 100%;
    }

    .awards-card-title {
        font-size: 16px;
    }

    .awards-load-more-wrapper {
        padding-bottom: 0;
    }

    .awards-load-more-button {
        font-size: 12px;
        line-height: 8px;
    }

    #esgoverview-hero {
        top: 60px;
        border-radius: 80px 80px 0 0;
        /* height: 700px; */
    }

    .esgoverview-header-wrapper {
        padding: 0 30px;
    }

    .esgoverview-header-title {
        font-size: 45px;
        line-height: 45px;
        margin-bottom: 20px;
    }

    .esgoverview-header-text {
        font-size: 21px;
    }

    #esgstrategy {
        margin: -15% auto 0;
        border-radius: 80px 80px 0 0;
    }

    .esgstrategy-header-text {
        font-size: 40px;
    }

    .esgstrategy-image-wrapper {
        /* margin-top: 40px; */
        padding-bottom: 150px;
    }

    #esgperformance {
        border-radius: 80px 80px 0 0;
    }

    .esgperformance-header-text {
        font-size: 40px;
    }

    .esgperformance-category-header {
        gap: 20px;
    }

    .esgperformance-category-icon {
        width: 40px;
    }

    .esgperformance-category-title {
        font-size: 20px;
    }

    .esgperformance-category-description {
        gap: 30px;
        padding: 0 10px;
    }

    .esgperformance-category-description-card {
        width: 100%;
    }

    .esgperformance-category-description-title {
        font-size: 16px;
    }

    .esgperformance-category-description-value-text {
        font-size: 25px;
    }

    .esgperformance-category-description-value-icon {
        width: 40px;
    }

    .esgperformance-category-description-summary {
        font-size: 14px;
    }

    #esgreport-overview {
        margin: -45% auto 0;
        border-radius: 80px 80px 0 0;
        /* max-height: 2500px; */
    }

    .esgreport-overview-header-wrapper {
        padding: 0 40px;
    }

    .esgreport-overview-header-text {
        font-size: 40px;
    }

    .esgreport-overview-header-summary {
        font-size: 16px;
    }

    .esgreport-overview-detail-wrapper {
        margin-bottom: 200px;
    }

    .esgreport-overview-card-wrapper {
        gap: 60px 0px;
    }
    
    .esgreport-overview-card {
        flex: 0 0 100%;
        max-width: 300px;
    }

    .esgreport-overview-card-title {
        font-size: 16px;
    }

    .esgreport-overview-see-more-wrapper {
        padding-bottom: 0;
    }

    .esgreport-overview-see-more-button {
        height: 40px;
        padding: 16px 40px;
        font-size: 12px;
        line-height: 8px;
        margin-bottom: 0;
    }

    #esgprogram-hero {
        top: 60px;
        border-radius: 80px 80px 0 0;
    }

    .esgprogram-header-wrapper {
        padding: 0 30px;
    }

    .esgprogram-header-title {
        font-size: 45px;
        line-height: 45px;
        margin-bottom: 30px;
    }

    .esgprogram-header-text {
        font-size: 21px;
    }

    #esgprogram {
        border-radius: 80px 80px 0 0;
        margin: -15% auto 0;
    }

    .esgprogram-category-wrapper {
        margin-top: 60px;
    }

    .esgprogram-category-btn {
        padding: 5px;
        font-size: 12px;
        line-height: 15.5px;
    }

    .esgprogram-detail-wrapper {
        margin: 60px 0 200px 0;
    }

    .esgprogram-card-wrapper {
        padding-bottom: 0;
    }

    .esgprogram-card {
        width: 100%;
    }

    .esgprogram-card-image {
        height: 300px;
    }

    .esgprogram-card-title {
        font-size: 16px;
    }

    .esgprogram-card-subtitle-date,
    .esgprogram-card-subtitle-type {
        font-size: 12px;
    }

    .esgprogram-card-summary {
        font-size: 13px;
    }

    .esgprogram-card-btn {
        font-size: 13px;
    }

    .esgprogram-modal-wrapper {
        max-width: 100%;
    }

    .esgprogram-modal-header-wrapper {
        padding: 30px;
    }

    .esgprogram-modal-header-description {
        font-size: 16px;
    }

    .esgprogram-modal-close-button {
        font-size: 16px;
        top: 15px;
        right: 25px;
    }

    .esgprogram-modal-achievement-wrapper {
        margin: -10% 0 auto;
    }

    .esgprogram-modal-achievement-image {
        padding: 30px 10px;
        max-height: 350px;
    }

    .esgprogram-modal-achievement-detail-wrapper {
        padding: 20px 10px;
    }

    .esgprogram-modal-achievement-detail-title {
        font-size: 20px;
        margin-bottom: 20px;
    }

    .esgprogram-modal-achievement-detail-card-body {
        padding-left: 20px;
    }

    .esgprogram-modal-achievement-detail-summary-value {
        font-size: 35px;
    }

    .esgprogram-modal-achievement-detail-summary-text {
        font-size: 16px;
    }

    #esgreport-hero {
        top: 60px;
    }

    .esgreport-header-wrapper {
        padding: 0 30px;
    }

    .esgreport-header-title {
        font-size: 45px;
        line-height: 45px;
        margin-bottom: 20px;
    }

    .esgreport-header-text {
        font-size: 21px;
    }

    #esgreport {
        margin: -15% auto 0;
    }

    .esgreport-card-wrapper {
        gap: 60px 0px;
        padding-bottom: 100px;
    }

    .esgreport-card {
        flex: 0 0 100%;
        max-width: 350px;
    }

    .esgreport-card-title {
        font-size: 16px;
    }

    #esggallery-hero {
        top: 60px;
    }

    .esggallery-header-wrapper {
        margin: 50px 0 50px;
        padding: 0px 30px;
    }

    .esggallery-header-title {
        font-size: 45px;
        line-height: 45px;
        margin-bottom: 20px;
    }

    .esggallery-header-text {
        font-size: 21px;
    }

    #esggallery {
        margin: -15% auto 0px;
    }

    .esggallery-category-wrapper {
        margin-top: 60px;
    }

    .esggallery-category-btn {
        font-size: 14px;
    }

    .esggallery-detail-wrapper {
        margin: 60px 0 200px 0;
        padding-bottom: 0;
    }

    .esggallery-content {
        justify-content: center;
    }

    .esggallery-content li {
        width: 300px;
        height: 300px;
    }

    .esggallery-content-wrapper .easyPaginateNav {
        text-align: center;
    }

    .esggallery-content-wrapper .easyPaginateNav a {
        font-size: 14px;
    }

    .esggallery-filter-wrapper {
        padding: 10px;
    }

    .esggallery-filter-search {
        gap: 10px;
    }

    .esggallery-filter-search {
        margin-bottom: 30px;
    }

    .esggallery-filter-search-input {
        font-size: 14px;
    }

    .esggallery-filter-search-btn {
        font-size: 14px;
    }

    .esggallery-filter-category-btn,
    .esggallery-filter-year-btn {
        font-size: 14px;
    }

    .esggallery-filter-category-body li,
    .esggallery-filter-year-body li {
        margin: 10px 0;
    }

    .esggallery-filter-category-item-value,
    .esggallery-filter-year-item-value {
        font-size: 14px;
    }

    .esggallery-detail-wrapper {
        display: flex;
        flex-direction: column-reverse;
    }

    esggallery-content-wrapper {
        margin-top: 60px;
    }

    #investorrelation-hero {
        top: 60px;
    }

    .investorrelation-header-wrapper {
        margin: 50px 0 50px 0;
        padding: 0 30px;
    }

    .investorrelation-header-title {
        font-size: 45px;
        line-height: 45px;
        margin-bottom: 20px;
    }

    .investorrelation-header-text {
        font-size: 21px;
    }

    #investorrelation {
        margin: -15% auto 0px;
    }

    .investorrelation-wrapper {
        padding-right: 0;
    }

    .investorrelation-tab-content-header-title {
        font-size: 18px;
    }

    .investorrelation-tab-content-file-link-pdf {
        width: 23px;
        margin-right: 20px;
    }

    .investorrelation-tab-content-file-link-title-text {
        font-size: 16px;
        line-height: normal;
    }

    .investorrelation-tab-content-file-link-download {
        width: 22px;
    }

    .investorrelation-tab-content-shareholder-chart-wrapper {
        flex-direction: column;
        align-items: center;
        gap: 20px;
    }

    .investorrelation-tab-content-shareholder-chart {
        transform: scaleX(-1) translateX(0px);
    }

    .investorrelation-tab-content-shareholder-detail {
        flex-direction: column;
        flex-wrap: nowrap;
        max-height: 400px;
        max-width: 250px;
        gap: 0 10px;
    }

    .investorrelation-tab-content-shareholder-investor-value {
        font-size: 21px;
    }

    .investorrelation-tab-content-shareholder-investor-name {
        font-size: 12px;
    }

    .investorrelation-tab-content-shareholder-info-wrapper {
        padding: 0 20px;
        max-width: 100%;
    }

    .investorrelation-tab-content-shareholder-info-text {
        font-size: 14px;
    }

    .investorrelation-annual-report-card-wrapper {
        justify-content: center;
    }

    .investorrelation-annual-report-card {
        flex: 0 0 100%;
        /* width: 300px; */
    }

    .investorrelation-annual-report-card-title {
        padding: 0 50px;
    }

    .investorrelation-annual-report-btn {
        font-size: 14px;
    }

    .financial-presentation-tab-link {
        font-size: 18px;
        white-space: nowrap;
    }

    .gms-tab,
    .disclosure-tab,
    .financial-presentation-tab {
        gap: 10px;
        overflow-x: auto;
        overflow-y: hidden;
    }

    .investorrelation-tab-content-header#financial-presentation-header {
        padding: 20px;
        padding-bottom: 0;
    }

    .investorrelation-tab-content-body#financial-presentation-body {
        padding: 0 20px;
        margin: 30px 0 100px;
    }

    .investorrelation-tab-content-financial-presentation-detail-periode-header {
        gap: 10px;
    }

    .financial-presentation-detail-quarter-title {
        font-size: 30px;
    }

    .financial-presentation-detail-title {
        font-size: 16px;
        text-align: left;
    }

    .investorrelation-tab-content-financial-presentation-detail-periode-content {
        padding-left: 50px;
    }

    .financial-presentation-file-wrapper {
        flex: calc(100%);
    }

    .gms-tab-link,
    .disclosure-tab-link {
        font-size: 16px;
        white-space: nowrap;
        padding: 10px;
    }

    .investorrelation-tab-content-investor-contact-image {
        max-width: 300px;
    }

    .investorrelation-tab-content-investor-contact-text {
        font-size: 18px;
    }

    .investorrelation-tab-content-investor-contact-btn {
        padding: 22px 70px;
        font-size: 18px;
    }

    #corporategovernance-hero {
        top: 60px;
    }

    .corporategovernance-header-wrapper {
        margin: 50px 0 50px 0;
        padding: 0 30px;
    }

    .corporategovernance-header-title {
        font-size: 45px;
        line-height: 45px;
        margin-bottom: 20px;
    }

    .corporategovernance-header-text {
        font-size: 21px;
    }

    #corporategovernance {
        margin: -15% auto 0px;
    }

    .corporategovernance-wrapper {
        padding-right: 0;
    }

    .corporategovernance-tab-content-header-title,
    .corporategovernance-tab-content-document-header-title {
        font-size: 18px;
    }

    .corporategovernance-tab-content-file-link-pdf {
        width: 23px;
        margin-right: 20px;
    }

    .corporategovernance-tab-content-file-link-title-text {
        font-size: 16px;
        line-height: normal;
    }

    .corporategovernance-tab-content-file-link-download {
        width: 22px;
    }

    .corporategovernance-tab-content-card {
        width: 300px;
    }

    .corporategovernance-tab-content-summary-value {
        font-size: 14px;
    }

    .corporategovernance-tab-content-member {
        gap: 30px;
        justify-content: center;
    }

    .corporategovernance-tab-content-image {
        width: 230px !important;
        height: 240px !important;
    }

    .corporategovernance-tab-content-image-name {
        font-size: 16px;
        text-align: center;
    }

    .corporategovernance-tab-content-image-job {
        font-size: 13px;
        text-align: center;
    }

    #news-hero {
        top: 60px;
    }

    .news-header-wrapper {
        margin: 50px 0 50px 0;
        padding: 0 30px;
    }

    .news-header-title {
        font-size: 45px;
        line-height: 45px;
        margin-bottom: 20px;
    }

    .news-header-text {
        font-size: 21px;
    }

    #news
    {
        border-radius: 80px 80px 0 0;
        margin: -15% auto 0;
    }

    #magazine-other
    {
        border-radius: 80px 80px 0 0;
        margin: -15% auto 0;
    }

    .news-container-wrapper {
        padding: 0 20px;
    }

    .news-category-wrapper {
        gap: 10px;
        flex-direction: column;
    }

    .news-category-link {
        height: 50px;
    }

    .news-detail-wrapper {
        margin-top: 50px;
    }

    .news-press-release-feature-image {
        height: 200px;
    }

    .news-press-release-feature-subtitle {
        font-size: 14px;
    }

    .news-press-release-feature-title {
        font-size: 26px;
    }

    .news-press-release-card-wrapper {
        gap: 25px;
        justify-content: center;
    }

    .news-press-release-card {
        flex: 0 0 100%;
        width: 330px;
    }

    .news-press-release-card-subtitle {
        font-size: 13px;
    }

    .news-press-release-card-title {
        font-size: 16px;
    }

    .news-press-release-load-more-button {
        height: 50px;
        font-size: 13px;
        line-height: 5px;
    }

    .news-magazine-recent-wrapper,
    .news-magazine-all-wrapper {
        flex-direction: column;
        gap: 40px;
    }

    .news-magazine-recent-text,
    .news-magazine-all-text {
        font-size: 35px;
        text-align: center;
        margin-bottom: 0;
    }

    .news-magazine-recent-text br,
    .news-magazine-all-text br {
        display: none;
    }

    .news-magazine-recent-text-line,
    .news-magazine-all-text-line {
        width: 100%;
    }

    .news-magazine-recent-card-wrapper {
        gap: 30px;
        margin-bottom: 100px;
        justify-content: center;
    }

    .news-magazine-recent-card {
        max-width: 100%;
        flex: 0 0 100%;
    }

    .news-magazine-recent-card-title {
        font-size: 18px;
    }

    .news-magazine-recent-card-button {
        font-size: 13px;
        max-width: 100%;
    }

    .news-magazine-archive-wrapper {
        margin-top: 50px;
    }

    .news-magazine-archive-text {
        font-size: 26px;
        text-align: center;
    }

    .news-magazine-archive-list {
        padding-left: 0;
        margin-bottom: 0;
        display: flex;
        flex-wrap: wrap;
        gap: 0;
    }

    .news-magazine-archive-list-item {
        font-size: 18px;
        display: inline;
        padding: 10px;
    }

    .news-magazine-archive-detail-wrapper {
        justify-content: center;
    }

    .news-magazine-archive-detail-card {
        width: 200px;
        height: 200px;
    }

    .news-magazine-archive-detail-card-subtitle {
        font-size: 17px;
    }

    .news-magazine-archive-detail-card-title {
        font-size: 25px;
        line-height: 25px;
    }

    #news-content {
        top: 60px;
    }

    .news-content-image {
        height: 200px;
        border-radius: 50px;
    }

    .news-content-wrapper {
        margin-top: 40px;
    }

    .news-content-detail-wrapper {
        padding: 0 30px;
    }

    .news-content-detail-back-button {
        height: 40px;
        width: 250px;
        font-size: 13px;
        margin-bottom: 30px;
    }

    .news-content-detail-title {
        font-size: 35px;
        line-height: 45px;
    }

    .news-content-detail-date-share {
        flex-direction: column;
        justify-content: flex-start;
        align-items: flex-start;
    }

    .news-content-detail-date,
    .news-content-detail-share-text {
        font-size: 16px;
        margin-bottom: 0;
    }

    .news-content-detail-share-socmed-whatsapp,
    .news-content-detail-share-socmed-email,
    .news-content-detail-share-socmed-facebook,
    .news-content-detail-share-socmed-linkedin {
        font-size: 25px;
    }

    .news-content-detail-value {
        font-size: 16px;
    }

    .news-content-detail-other-wrapper {
        margin-bottom: 100px;
    }

    .news-content-detail-other-title {
        font-size: 30px;
        margin: 15px 0;
    }

    .news-content-detail-other-card-wrapper {
        flex: 1 1 100%;
        max-width: calc(100% - 20px);
        gap: 20px;
        justify-content: center;
    }

    .news-content-detail-other-card {
        max-width: 100%;
    }

    .news-content-detail-other-card-subtitle {
        font-size: 15px;
    }

    .news-content-detail-other-card-title {
        font-size: 18px;
    }

    .news-content-detail-other-card-button {
        max-width: 100%;
    }

    .magazine-header-wrapper {
        padding: 0 20px;
    }

    .magazine-carousel-button-wrapper {
        justify-content: center;
    }

    .magazine-carousel-button {
        width: 59px;
        height: 59px;
    }

    .magazine-carousel-button-arrow {
        width: 13px;
        height: 26px;
        object-fit: contain;
    }

    #career-hero {
        top: 60px;
    }

    .career-header-wrapper {
        margin: 50px 0 50px 0;
        padding: 0 30px;
    }

    .career-header-title {
        font-size: 45px;
        line-height: 45px;
        margin-bottom: 20px;
    }

    .career-header-text {
        font-size: 21px;
    }

    #career {
        margin: -15% auto 0;
    }

    .career-program-image-wrapper {
        margin: -12% auto 0;
    }

    .career-program-image {
        width: 100%;
        height: 520px;
    }

    .career-program-title {
        font-size: 24px;
    }

    .career-program-description {
        font-size: 16px;
    }

    .career-step-text {
        font-size: 24px;
    }

    .career-step-circle-outer {
        width: 80px;
        height: 80px;
    }

    .career-step-circle-inner {
        width: 50px;
        height: 50px;
    }

    .career-step-circle-text {
        font-size: 18px;
    }

    .career-step-title {
        font-size: 18px;
    }

    .career-step-name {
        font-size: 16px;
    }

    .career-step-summary {
        font-size: 13px;
    }

    #career-apply {
        margin: -95% auto 0;
    }

    .career-apply-qualification {
        margin-top: 105%;
    }

    .career-apply-qualification-detail-wrapper {
        padding: 0 20px;
    }

    .career-apply-qualification-title {
        font-size: 24px;
    }

    .career-apply-qualification-description-image {
        max-height: 24px;
    }

    career-apply-qualification-text {
        font-size: 16px;
    }

    .career-apply-submit {
        margin-bottom: 100px;
    }

    .career-apply-submit-detail-wrapper {
        height: 100%;
    }

    .career-apply-submit-detail-overlay {
        padding: 40px 30px;
        gap: 20px;
        flex-direction: column;
    }

    .career-apply-submit-detail-text-wrapper {
        width: 100%;
    }

    .career-apply-submit-detail-title {
        font-size: 24px;
    }

    .career-apply-submit-detail-summary {
        font-size: 16px;
        line-height: 25px;
    }

    .career-apply-submit-detail-button-wrapper {
        margin-right: auto;
    }

    .career-apply-submit-detail-button {
        height: 50px;
        font-size: 16px;
        line-height: 25px;
    }

    .homepage-news-card img {
        width: 100%;
    }

    .error-content-text-wrapper {
        width: 100%;
        bottom: 15%;
        left: 5%;
    }

    .error-content-text-code {
        font-size: 80px;
    }

    .error-content-text-sorry {
        font-size: 35px;
        line-height: 51px;
    }

    .error-content-text-no-worries {
        font-size: 20px;
    }

    .error-content-button-wrapper {
        width: 250px;
        height: 60px;
    }

    .error-content-back-button {
        font-size: 15px;
    }

    .error-content-object-wrapper {
        right: -50px;
        bottom: -200px;
    }

    .error-content-object-image {
        height: 300px;
    }

    #contactus-hero {
        top: 60px;
    }

    .contactus-header-wrapper {
        margin: 50px 0 50px 0;
        padding: 0 30px;
    }

    .contactus-header-title {
        font-size: 45px;
        line-height: 45px;
        margin-bottom: 20px;
    }

    .contactus-header-text {
        font-size: 21px;
        padding-bottom: 50px;
    }

    .contactus-card {
        height: auto;
    }

    .contactus-card .card-body {
        padding: 30px 40px 40px 30px;
    }

    .contactus-card-info-title {
        font-size: 30px;
        margin-bottom: 30px;
    }

    .contactus-card-address-title,
    .contactus-card-phone-title {
        font-size: 24px;
        margin-bottom: 15px;
    }

    .contactus-card-address-text {
        font-size: 16px;
        margin-bottom: 30px;
    }

    .contactus-card-phone-text,
    .contactus-card-fax-text {
        font-size: 16px;
    }

    .contactus-submit-btn {
        width: 100%;
    }

    #searchnews-hero {
        top: 60px;
    }

    .searchnews-header-wrapper {
        margin: 50px 0 50px 0;
        padding: 0 30px;
    }

    .searchnews-header-title {
        font-size: 40px;
        line-height: 40px;
    }

    #searchnewsresults {
        margin: -15% auto 0;
    }

    .news-empty-wrapper {
        padding: 10px;
    }

    .news-empty-title {
        font-size: 60px;
        margin-bottom: 10px;
    }

    .news-empty-summary {
        font-size: 20px;
    }

    .searchnews-detail-wrapper {
        margin-top: 30px;
    }

    .news-empty-wrapper form {
        flex-direction: column;
        gap: 10px;
    }

    .news-search-input {
        width: 100%;
        font-size: 15px;
        margin-right: 0;
    }

    .news-search-btn {
        width: 100%;
        font-size: 15px;
        margin-bottom: 0;
    }

    .loader-bg {
        transform: scale(2.5);
    }
}

@media screen and (max-width: 350px) {
    .scrollToTop {
        bottom: 40px;
        right: 20px;
    }

    .nav-bg-square {
        background-size: 120px 60px;
    }

    .top-menu {
        padding: 26px 18px;
    }

    /* .navbar-collapse {
        padding: 10px 0;
    }

    .navbar-collapse .menu {
        padding: 20px;
        background-color: var(--lightsystem-backgroundprimary);
        border-radius: 15px;
    } */

    .navbar-toggler span {
        transition: .5s;
    }

    .navbar-toggler .fa-x {
        transform: rotate(360deg);
        transition: .5s;
    }

    .search-box {
        right: 150px;
        max-width: calc(55% - 10px);
    }

    .search-inner input {
        font-size: 10px;
    }

    .hero-tagline {
        margin-top: 50% !important;
    }

    .hero-tagline-title {
        font-size: 30px;
        letter-spacing: -1px;
        /* width: 300px; */
    }

    .hero-tagline-summary {
        font-size: 14px;
    }

    .img-hero img {
        width: 100%;
        height: auto;
    }

    .play-button {
        height: 40px;
        width: 40px;
        bottom: 20%;
        right: 48%;
    }

    /* .play-button {
        background-color: transparent;
        height: 50px;
        width: 50px;
        position: absolute;
        bottom: 0;
        top: 0;
        left: 0;
        right: 0;
        margin: auto;
    } */

    .homepage-about-us-summary {
        font-size: 20px;
    }

    .homepage-about-us-achievement {
        margin: 30px 0 30px;
    }

    .net-revenue-value, .total-network-value, .social-investment-value {
        font-size: 16px;
    }

    .net-revenue-label, .total-network-label, .social-investment-label {
        font-size: 10px;
    }

    .achievement-update {
        font-size: 10px;
    }

    .homepage-our-business-text h1 {
        font-size: 40px;
    }

    .homepage-our-business-text h3 {
        font-size: 21px;
    }

    .homepage-our-business-text p {
        font-size: 15px;
    }

    /* .swiper-container {
        height: 250px;
    } */

    .btn-view-more-slider {
        height: 10px;
        width: 120px;
        font-size: 8px;
        padding: 12px 40px;
    }

    .last-report-ar-text, .last-report-sr-text {
        font-size: 20px;
    }

    #homepage-esg {
        padding-top: 0px;
    }

    .homepage-esg-title {
        font-size: 24px;
    }

    .homepage-accordion-esg-item:not(.esg-item-expanded)
    .homepage-accordion-esg-content .homepage-accordion-esg-title {
        position: absolute!important;
        top: 80px!important;
    }
    
    .homepage-accordion-esg-content .homepage-accordion-esg-title {
        font-size: 12px!important;
        line-height: 18px!important;
        top: -40%!important;
    }

    .homepage-accordion-esg-content .homepage-accordion-esg-summary {
        font-size: 12px!important;
        line-height: 13px!important;
        /* width: 100%; */
        left: 0!important;
    }

    .homepage-accordion-esg-content .homepage-accordion-esg-btn {
        height: 40px!important;
        padding: 15px 40px!important;
        font-size: 12px!important;
        left: 15%!important;
    }

    /* #micrositeCarousel {
        height: 100px;
    } */

    .swiper-pagination-bullet {
        height: 5px !important;
        width: 11px !important;
    }

    .swiper-pagination-bullet-active {
        height: 5px !important;
        width: 33px !important;
    }

    #homepage-last-report {
        border-radius: 50px 50px 0 0;
    }

    #homepage-stock {
        border-radius: 50px 50px 0 0;
    }

    .homepage-stock-container {
        padding: 0 10px;
    }

    .stock-text {
        font-size: 40px;
    }

    #homepage-news {
        margin: -50% auto 0;
        border-radius: 50px 50px 0 0;
    }

    .homepage-news-header-text {
        font-size: 40px;
    }

    .homepage-visit-newsroom-button {
        margin-bottom: 0;
    }

    #footer {
        border-radius: 50px 50px 0 0;
    }

    .footer-text-title {
        font-size: 30px;
        white-space: normal;
        line-height: 30px;
    }

    .footer-text-summary {
        font-size: 16px;
    }

    .whistleblower-button {
        height: 20px;
        padding: 15px 15px;
    }

    .aboutus-description-summary {
        font-size: 14px;
    }

    .btn-read-more-aboutus {
        font-size: 12px;
    }

    .aboutus-submenu-item {
        display: contents;
    }

    .aboutus-description-title {
        font-size: 40px;
    }

    .aboutus-milestone-description-wrapper {
        padding: 20px 20px 0 20px;
    }

    .aboutus-milestone-title {
        font-size: 20px;
    }

    .aboutus-milestone-year-wrapper .slick-prev,
    .aboutus-milestone-year-wrapper .slick-next {
        font-size: 18px;
    }

    .aboutus-milestone-year-item {
        font-size: 16px;
    }

    .aboutus-milestone-content.bigger h5,
    .aboutus-milestone-content.bigger p {
        font-size: 14px;
    }

    .aboutus-mission-title,
    .aboutus-vision-title {
        font-size: 18px;
    }

    .aboutus-credo-title {
        font-size: 35px;
    }

    .aboutus-credo-belief-title {
        font-size: 35px;
    }

    .aboutus-our-leaders-title {
        font-size: 35px;
        margin: 60px 0 30px 0;
    }

    .aboutus-leaders-boc-title,
    .aboutus-leaders-bod-title {
        font-size: 16px;
        margin-bottom: 30px;
    }

    .aboutus-leaders-boc-wrapper,
    .aboutus-leaders-bod-wrapper {
        gap: 20px 50px;
        margin-bottom: 50px;
    }

    .aboutus-leaders-boc-image,
    .aboutus-leaders-bod-image {
        max-height: 200px;
    }

    .aboutus-leaders-boc-image-name,
    .aboutus-leaders-bod-image-name {
        font-size: 14px;
    }

    .our-leaders-modal-header {
        padding: 10px 0 10px 45px;
    }

    .our-leaders-modal-header-name {
        font-size: 35px;
        margin-bottom: 5px;
    }

    .our-leaders-modal-header-title {
        font-size: 16px;
    }

    .our-leaders-modal-close-button {
        width: 15px;
        height: 15px;
        top: 20px;
    }

    .our-leaders-modal-body {
        padding: 0;
    }

    #aboutus-ownership-group-organization {
        margin-bottom: 50px;
    }

    .aboutus-accordion-button {
        height: 80px;
        padding: 10px 20px;
        font-size: 16px;
    }

    .aboutus-accordion-button::after,
    .aboutus-accordion-button:not(.collapsed)::after {
        height: 10px;
        width: 18px;
    }

    #ourbusiness-hero {
        border-radius: 50px 50px 0 0;
    }

    .ourbusiness-header-title {
        font-size: 40px;
        margin-bottom: 20px;
        line-height: 40px;
    }

    .ourbusiness-header-text {
        font-size: 19px;
    }

    .ourbusiness-unit-title {
        font-size: 14px;
    }

    .ourbusiness-unit-button-image-wrapper {
        width: 35px;
        height: 35px;
    }

    .ourbusiness-unit-description {
        margin-top: 10px;
    }

    #ourbusiness-network {
        border-radius: 50px 50px 0 0;
        /* height: 1000px; */
    }

    .ourbusiness-network-title {
        font-size: 35px;
    }

    .network-update {
        font-size: 10px;
    }

    #awards {
        border-radius: 50px 50px 0 0;
    }

    .awards-header-title {
        font-size: 40px;
        line-height: 40px;
        margin-bottom: 20px;
    }

    .awards-header-text {
        font-size: 19px;
    }

    .awards-select-wrapper {
        max-width: 100%;
    }

    .awards-select-wrapper .select2-container--default .select2-selection--single {
        font-size: 14px;
        background-size: 17px 7px;
    }

    .awards-select-wrapper .select2-container--open .select2-selection--single {
        background-size: 17px 7px;
    }

    .awards-select-wrapper .select2-results__option {
        font-size: 12px;
    }

    .awards-card-title {
        font-size: 14px;
    }

    #esgoverview-hero {
        border-radius: 50px 50px 0 0;
    }

    .esgoverview-header-wrapper {
        padding: 0 20px;
    }

    .esgoverview-header-title {
        font-size: 40px;
        line-height: 40px;
        margin-bottom: 20px;
    }

    .esgoverview-header-text {
        font-size: 19px;
    }

    #esgstrategy {
        border-radius: 50px 50px 0 0;
    }

    .esgstrategy-image {
        height: 820px;
    }

    .esgstrategy-header-wrapper {
        margin-top: 40px;
    }

    .esgstrategy-header-text {
        font-size: 35px;
    }

    #esgperformance {
        border-radius: 50px 50px 0 0;
    }

    .esgperformance-header-wrapper {
        margin-top: 40px;
    }

    .esgperformance-header-text {
        font-size: 35px;
    }

    .esgperformance-description-wrapper {
        margin: 60px 0 250px 0;
        padding-bottom: 0;
    }

    .esgperformance-category-icon {
        width: 35px;
    }

    .esgperformance-category-title {
        font-size: 18px;
    }

    .esgperformance-category-description-value {
        align-items: center;
    }

    .esgperformance-category-description-value-text {
        font-size: 20px;
    }

    .esgperformance-category-description-value-icon {
        width: 35px;
    }

    #esgreport-overview {
        margin: -55% auto 0;
        border-radius: 50px 50px 0 0;
    }

    .esgreport-overview-header-wrapper {
        margin-top: 40px;
        padding: 0 30px;
    }

    .esgreport-overview-card-wrapper {
        gap: 40px 0px;
    }

    .esgreport-overview-header-text {
        font-size: 35px;
    }

    .esgreport-overview-header-summary {
        font-size: 14px;
    }

    .esgreport-overview-card {
        max-width: 250px;
    }

    .esgreport-overview-card-title {
        font-size: 15px;
    }

    .esgreport-overview-see-more-button {
        margin-bottom: 0;
    }

    #esgprogram-hero {
        border-radius: 50px 50px 0 0;
    }

    .esgprogram-header-wrapper {
        padding: 0 20px;
    }

    .esgprogram-header-title {
        font-size: 40px;
        line-height: 40px;
        margin-bottom: 20px;
    }

    .esgprogram-header-text {
        font-size: 19px;
    }

    #esgprogram {
        border-radius: 50px 50px 0 0;
    }

    .esgprogram-category-wrapper {
        margin-top: 40px;
    }

    .esgprogram-category-btn {
        font-size: 10px;
    }

    .esgprogram-detail-wrapper {
        margin: 40px 0 200px 0;
    }

    .esgprogram-card-wrapper {
        padding: 5px;
        padding-bottom: 0;
    }

    .esgprogram-card-title {
        font-size: 14px;
    }

    .esgprogram-card-subtitle-date,
    .esgprogram-card-subtitle-type {
        font-size: 11px;
    }

    .esgprogram-card-summary {
        font-size: 12px;
    }

    .esgprogram-card-btn {
        font-size: 12px;
    }

    .esgprogram-modal-header {
        margin-bottom: 20px;
    }

    .esgprogram-modal-header-description {
        font-size: 14px;
    }

    .esgprogram-modal-close-button {
        font-size: 16px;
        top: 13px;
        right: 23px;
    }

    .esgprogram-modal-achievement-image {
        padding: 20px 10px;
        max-height: 300px;
    }

    .esgprogram-modal-achievement-detail-title {
        font-size: 18px;
    }

    .esgprogram-modal-achievement-detail-summary-value {
        font-size: 30px;
    }

    .esgprogram-modal-achievement-detail-summary-text {
        font-size: 14px;
    }

    #esgreport-hero {
        border-radius: 50px 50px 0px 0px;
    }

    .esgreport-header-wrapper {
        padding: 0px 20px;
    }

    .esgreport-header-title {
        font-size: 40px;
        line-height: 40px;
        margin-bottom: 20px;
    }

    .esgreport-header-text {
        font-size: 19px;
    }

    #esgreport {
        border-radius: 50px 50px 0px 0px;
    }

    .esgreport-detail-wrapper {
        margin-top: 40px;
        padding: 0 40px;
    }

    .esgreport-card-wrapper {
        gap: 40px 0px;
        padding-bottom: 50px;
    }

    .esgreport-card-title {
        font-size: 15px;
    }

    #esggallery-hero {
        border-radius: 50px 50px 0 0;
    }

    .esggallery-header-wrapper {
        padding: 0px 20px;
    }

    .esggallery-header-title {
        font-size: 40px;
        line-height: 40px;
        margin-bottom: 20px;
    }

    .esggallery-header-text {
        font-size: 19px;
    }

    #esggallery {
        border-radius: 50px 50px 0 0;
    }

    .esggallery-category-wrapper {
        margin-top: 40px;
    }

    .esggallery-category-btn {
        font-size: 13px;
    }

    .esggallery-detail-wrapper {
        margin: 40px 0 200px 0;
    }

    .esggallery-content li {
        width: 250px;
        height: 250px;
    }

    .esggallery-content-wrapper .easyPaginateNav a {
        font-size: 13px;
    }

    .esggallery-content-wrapper {
        margin-top: 30px;
        padding: 0 5px;
    }

    .esggallery-filter-wrapper {
        padding: 5px;
    }

    .esggallery-filter-search-input {
        font-size: 13px;
    }

    .esggallery-filter-search-btn {
        font-size: 13px;
    }

    .esggallery-filter-category-btn,
    .esggallery-filter-year-btn {
        font-size: 13px;
    }

    .esggallery-filter-category-item-value,
    .esggallery-filter-year-item-value {
        font-size: 13px;
    }

    #investorrelation-hero {
        border-radius: 50px 50px 0 0;
    }

    .investorrelation-header-wrapper {
        padding: 0 20px;
    }

    .investorrelation-header-title {
        font-size: 40px;
        line-height: 40px;
        margin-bottom: 20px;
    }

    .investorrelation-header-text {
        font-size: 19px;
    }

    .investorrelation-dropdown-toggle span {
        font-size: 14px;
    }

    .investorrelation-dropdown-content-item {
        font-size: 14px;
    }

    .investorrelation-tab-content-header {
        padding: 10px;
    }

    .investorrelation-tab-content-header-title {
        font-size: 16px;
    }

    .investorrelation-tab-content-header-line {
        margin: 0 10px;
    }

    .investorrelation-tab-content-body {
        padding: 0 10px;
    }

    .investorrelation-tab-content-file-link-title-text {
        font-size: 14px;
    }

    .investorrelation-tab-content-file-link-pdf {
        width: 21px;
        margin-right: 10px;
    }

    .investorrelation-tab-content-file-link-download {
        width: 20px;
    }

    .investorrelation-tab-content-shareholder-investor-value {
        font-size: 20px;
    }

    .investorrelation-tab-content-shareholder-info-wrapper {
        padding: 0;
    }

    .investorrelation-annual-report-card-title {
        font-size: 18px;
    }

    .investorrelation-tab-content-header#financial-presentation-header {
        padding: 10px;
    }

    .financial-presentation-tab-link {
        font-size: 16px;
    }

    .investorrelation-tab-content-body#financial-presentation-body {
        padding: 0 10px;
    }

    .financial-presentation-detail-quarter-title {
        font-size: 25px;
    }

    .financial-presentation-detail-title {
        font-size: 14px;
    }

    .investorrelation-tab-content-financial-presentation-detail-periode-content {
        padding-left: 40px;
    }

    .gms-tab-link,
    .disclosure-tab-link {
        font-size: 14px;
    }

    .investorrelation-tab-content-investor-contact-image {
        max-width: 250px;
    }

    .investorrelation-tab-content-investor-contact-text {
        font-size: 16px;
    }

    .investorrelation-tab-content-investor-contact-btn {
        padding: 22px 50px;
        font-size: 16px;
    }

    #corporategovernance-hero {
        border-radius: 50px 50px 0 0;
    }

    .corporategovernance-header-wrapper {
        padding: 0 20px;
    }

    .corporategovernance-header-title {
        font-size: 40px;
        line-height: 40px;
        margin-bottom: 20px;
    }

    .corporategovernance-header-text {
        font-size: 19px;
    }

    .corporategovernance-dropdown-toggle span {
        font-size: 14px;
    }

    .corporategovernance-dropdown-content-item {
        font-size: 14px;
    }

    .corporategovernance-tab-content-header {
        padding: 10px;
    }

    .corporategovernance-tab-content-document-header {
        padding: 10px 0;
    }

    .corporategovernance-tab-content-header-title,
    .corporategovernance-tab-content-document-header-title {
        font-size: 16px;
    }

    .corporategovernance-tab-content-header-line {
        margin: 0 10px;
    }

    .corporategovernance-tab-content-body {
        padding: 0 10px;
    }

    .corporategovernance-tab-content-file-link-title-text {
        font-size: 14px;
    }

    .corporategovernance-tab-content-file-link-pdf {
        width: 21px;
        margin-right: 10px;
    }

    .corporategovernance-tab-content-file-link-download {
        width: 20px;
    }

    .corporategovernance-tab-content-card-header {
        font-size: 16px;
    }

    .corporategovernance-tab-content-card-summary {
        font-size: 12px;
    }

    .corporategovernance-tab-content-summary-value {
        font-size: 12px;
    }

    .corporategovernance-tab-content-image-name {
        font-size: 14px;
    }

    .corporategovernance-tab-content-image-job {
        font-size: 12px;
    }

    #news-hero {
        border-radius: 50px 50px 0 0;
    }

    .news-header-wrapper {
        padding: 0 20px;
    }

    .news-header-title {
        font-size: 40px;
        line-height: 40px;
        margin-bottom: 20px;
    }

    .news-header-text {
        font-size: 19px;
    }

    #news,
    #magazine-other
    {
        border-radius: 50px 50px 0 0;
    }

    .news-category-link {
        font-size: 13px;
    }

    .news-press-release-feature-subtitle {
        font-size: 13px;
    }

    .news-press-release-feature-title {
        font-size: 24px;
    }

    .news-press-release-card {
        width: 280px;
    }

    .news-press-release-card-subtitle {
        font-size: 12px;
    }

    .news-press-release-card-title {
        font-size: 14px;
    }

    .news-press-release-load-more-button {
        font-size: 12px;
    }

    .news-magazine-recent-text,
    .news-magazine-all-text {
        font-size: 30px;
    }

    .news-magazine-recent-card-wrapper {
        gap: 20px;
    }

    .news-magazine-recent-card-subtitle {
        font-size: 14px;
    }

    .news-magazine-recent-card-title {
        font-size: 16px;
    }

    .news-magazine-recent-card-button {
        font-size: 12px;
    }

    .news-magazine-archive-text {
        font-size: 24px;
    }

    .news-magazine-archive-list-item {
        font-size: 17px;
    }

    .news-magazine-archive-detail-card-subtitle {
        font-size: 15px;
    }

    .news-magazine-archive-detail-card-title {
        font-size: 20px;
        line-height: 20px;
    }

    .news-content-image {
        height: 150px;
        border-radius: 40px;
    }

    .news-content-wrapper {
        margin-top: 35px;
    }

    .news-content-detail-wrapper {
        padding: 0 20px;
    }

    .news-content-detail-back-button {
        width: 230px;
    }

    .news-content-detail-title {
        font-size: 30px;
    }

    .news-content-detail-date,
    .news-content-detail-share-text {
        font-size: 14px;
    }

    .news-content-detail-share-socmed-whatsapp,
    .news-content-detail-share-socmed-email,
    .news-content-detail-share-socmed-facebook,
    .news-content-detail-share-socmed-linkedin {
        font-size: 23px;
    }

    .news-content-detail-value {
        font-size: 14px;
    }

    .news-content-detail-other-title {
        font-size: 25px;
    }

    .news-content-detail-other-card-subtitle {
        font-size: 14px;
    }

    .news-content-detail-other-card-title {
        font-size: 16px;
    }

    .news-content-detail-other-card-button {
        font-size: 13px;
    }

    #career-hero {
        border-radius: 50px 50px 0 0;
    }

    .career-header-wrapper {
        padding: 0 20px;
    }

    .career-header-title {
        font-size: 40px;
        line-height: 40px;
        margin-bottom: 20px;
    }

    .career-header-text {
        font-size: 19px;
    }

    #career {
        border-radius: 50px 50px 0 0;
    }

    .career-program-image-wrapper {
        margin: -15% auto 0;
    }

    .career-program-image {
        width: 100%;
        height: 420px;
    }

    .career-program-detail-wrapper {
        padding: 10px;
    }

    .career-program-title {
        font-size: 20px;
        margin-bottom: 15px;
    }

    .career-program-description {
        font-size: 15px;
    }

    .career-step-wrapper {
        padding: 0 10px;
        margin-top: 20px;
    }

    .career-step-text {
        font-size: 20px;
        margin-bottom: 20px;
    }

    .career-step-card-body {
        padding: 30px;
    }

    .career-step-circle-outer {
        width: 70px;
        height: 70px;
    }

    .career-step-circle-inner {
        width: 40px;
        height: 40px;
    }

    .career-step-circle-text {
        font-size: 16px;
    }

    .career-step-title {
        font-size: 17px;
    }

    .career-step-name {
        font-size: 15px;
    }

    .career-step-summary {
        font-size: 12px;
    }

    #career-apply {
        margin: -115% auto 0;
        border-radius: 50px 50px 0 0;
    }

    .career-apply-qualification {
        margin-top: 125%;
    }

    .career-apply-qualification-title {
        font-size: 20px;
        margin-bottom: 15px;
    }

    .career-apply-qualification-description-image {
        max-height: 21px;
    }

    .career-apply-qualification-text {
        font-size: 16px;
    }

    .career-apply-submit {
        padding: 0 10px;
    }

    .career-apply-submit-detail-title {
        font-size: 20px;
    }

    .career-apply-submit-detail-summary {
        font-size: 15px;
    }

    .career-apply-submit-detail-button {
        height: 45px;
        font-size: 15px;
        line-height: 20px;
    }

    .error-content-text-wrapper {
        width: 400px;
        bottom: 15%;
    }

    .error-content-text-sorry {
        line-height: 35px;
    }

    .error-content-text-no-worries {
        width: 400px;
    }

    .error-content-object-wrapper {
        right: -80px;
        bottom: -250px;
        left: 15px;
    }

    .error-content-object-image {
        height: 350px;
    }

    #contactus-hero {
        border-radius: 50px 50px 0 0;
    }

    .contactus-header-wrapper {
        padding: 0 20px;
    }

    .contactus-header-title {
        font-size: 40px;
        line-height: 40px;
        margin-bottom: 20px;
    }

    .contactus-header-text {
        font-size: 19px;
    }

    #searchnews-hero {
        border-radius: 50px 50px 0 0;
    }

    .searchnews-header-wrapper {
        padding: 0 20px;
    }

    .searchnews-header-title {
        font-size: 35px;
        line-height: 35px;
    }

    #searchnewsresults {
        border-radius: 50px 50px 0 0;
    }

    .news-container-wrapper {
        padding: 0 10px;
    }

    .news-empty-title {
        font-size: 50px;
    }

    .news-empty-summary {
        font-size: 18px;
    }

    .news-search-input {
        font-size: 14px;
    }

    .news-search-btn {
        font-size: 14px;
    }
}