@import url('https://fonts.googleapis.com/css2?family=Amatic+SC:wght@400;700&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Staatliches&display=swap');
@font-face {
    font-family: heading;
    src: url(../font/Heading-Pro-Heavy-trial.ttf);
}
@font-face {
    font-family: heading-extra;
    src: url(../font/Heading-Pro-ExtraBold-trial.ttf);
}
*{
    padding: 0;
    margin: 0;
    box-sizing: border-box;
    font-family: "Poppins", sans-serif;
    scroll-behavior: smooth;
}
body{
    overflow-x: hidden;
    width: 100%;
}
.banner{
    position: relative;
    width: 100%;
    height: 50.7vw;
}
.banner_page{
    height: 30vw;
}
.bg_banner{
    width: 87.5vw;
    position: absolute;
    left: 0;
    top: 0;
    object-fit: cover;
    z-index: 2;
    display: block;
}
.banner_page .bg_banner{
    width: 78vw !important;
}
.bg_banner_mobile{
    display: none;
}
.heading_page{
    font-size: 6vw !important;
}
.slide_banner{
    width: 48%;
    display: block;
    margin-left: auto;
    background-color: green;
}
.banner_img{
    width: 100%;
    height: 50.8vw;
    overflow: hidden;
    position: relative;
}
.banner_page .banner_img{
    height: 30vw;
}
.banner_img_overlay{
    z-index: 3;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.644) 0%, rgba(0, 0, 0, 0) 100%);
}
.banner_img img{
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    z-index: 2;
}
.content_banner{
    position: absolute;
    left: 7.3vw;
    top: 58%;
    transform: translateY(-50%);
    z-index: 3;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
}
.banner_page .content_banner {
    top: 19.6vw;
    left: 9.7vw;
}
.content_banner h1{
    font-family: heading;
    color: #0CC663;
    font-size: 4vw;
    line-height: 1;
    width: 44vw;
}
.heading_banner{
    width: 43.7vw;
    margin-left: 0;
    margin-bottom: 1.4vw;
 }
 .banner_page .heading_banner{
    width: 39vw;
 }
.content_banner h3{
    font-size: 1.66vw;
    margin-bottom: 1.4vw;
    font-family: heading-extra;
    color: #0CC663;
}
.kab_heading{
    width: 27vw;
    margin-top: 1.3vw;
    margin-left: .2vw;
    border-radius: 1vw;
}
.content_banner button{
    font-size: 1.5vw;
    font-family: heading-extra;
    color: #0CC663;
    background-color: transparent;
    outline: none;
    display: flex;
    align-items: center;
    gap: .3vw;
    border: .2vw solid #0CC663;
    padding: .7vw 1.53vw;
    margin-left: .2vw;
    margin-top: 2.5vw;
    cursor: pointer;
    border-radius: .7vw;
}
.content_banner button iconify-icon{
    font-size: 1.6vw;
    margin-bottom: .11vw;
    transition: .4s all;
}
.content_banner button:hover iconify-icon{
    transform: translateX(.5vw);
}
a{
    text-decoration: none;
}
.heading_home{
    margin-bottom: 1.7vw;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1vw;
}
.heading_home_left{
    align-items: flex-start;
}
.heading_home h1{
    font-family: heading-extra;
    font-size: 3.2vw;
    color: #0CC663;
}
.heading_home p{
    font-size: 1.01vw;
    color: #626262;
}
.content_p p{
    text-align: start;
    font-size: .91vw;
    color: #626262;
    margin-bottom: 1.1vw;
}
.content_p ul{
    margin-bottom: 2.3vw;
}
.content_p ul li{
    font-size: .9vw;
    list-style: none;
    display: flex;
    align-items: center;
    gap: .2vw;
    margin-bottom: .6vw;
    color: #626262;
}
.content_p ul li::before{
    padding-right: .4vw;
    content: '';
    display: inline-block;
    width: 1em;
    height: 1em;
    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' fill-rule='evenodd' d='M12 21a9 9 0 1 0 0-18a9 9 0 0 0 0 18m-.232-5.36l5-6l-1.536-1.28l-4.3 5.159l-2.225-2.226l-1.414 1.414l3 3l.774.774z' clip-rule='evenodd'/%3E%3C/svg%3E");
    background-color: #07AF55;
    -webkit-mask-image: var(--svg);
    mask-image: var(--svg);
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
}

.event_kormi{
    background: url(../images/bg_overlay.png), #ffffff6b;
    background-blend-mode: overlay;
    background-position: center;
    background-size: cover;
    width: 100%;
    padding-top: 6vw;
    padding-bottom: 1vw;
}
.event-layout {
    padding: 0 2rem;
}

@media (min-width: 1024px) {
    .event-layout {
        padding: 0 8rem;
    }
}

.eventSlide .swiper-button-next, .eventSlide .swiper-rtl .swiper-button-prev{
    left: auto;
    right: 6vw;
}
.eventSlide .swiper-button-prev, .eventSlide .swiper-rtl .swiper-button-next{
    right: auto;
    left: 6vw;
}
.eventSlide .swiper-button-next:after, .eventSlide .swiper-button-prev:after{
    font-size: 1.7vw !important;
}
.eventSlide .swiper-button-next, .eventSlide .swiper-button-prev{
    color: #07AF55;
}
.event_layout{
    width: 100%;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    padding: 0 10vw;
    padding-top: 1vw;
    grid-gap: 4vw;
    align-items: center;
}
.event_content h1{
    font-size: 2vw;
    font-weight: 600;
    margin-bottom: .9vw;
    border-bottom: .1vw solid #07AF55;
    padding-bottom: .6vw;
    color: #07AF55;
}
.event_content p{
    font-size: .9vw;
    margin-bottom: 1vw;
    color: #626262;
}
.event_content button{
    outline: none;
    border: none;
    font-size: .9vw;
    border-radius: .4vw;
    padding: .6vw 1.3vw;
    cursor: pointer;
    margin-top: 1vw;
    background-color: #07AF55;
    color: white;
    transition: .4s all;
}
.event_content button:hover{
    transform: scale(.9);
}
.event_image img{
    width: 100%;
}

.about_home{
    width: 100%;
    background: url(../images/bg_overlay.png), #ffffff6b;
    background-blend-mode: overlay;
    background-position: center;
    background-size: cover;
    text-align: start;
    padding: 5vw 10vw;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    align-items: center;
    grid-gap: 2vw;
}
.about_home_image{
    width: 100%;
}
.about_home_img{
    width: 100%;
    height: 20vw;
    position: relative;
    border-radius: .6vw;
    overflow: hidden;
    border-left: .6vw solid #07AF55;
    border-bottom: 1.1vw solid #07AF55;
}
.about_home_img img{
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
}
.section_inorga{
    width: 100%;
    padding: 6vw 10vw;
    background: url(../images/bg_overlay.png), #ffffff6b;
    background-blend-mode: overlay;
    background-position: center;
    background-size: cover;
}
.inorga_layout{
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    margin-top: 4vw;
}
.inorgaSlider{
    margin-top: 4vw;
}
.inorgaSlider .swiper-horizontal>.swiper-pagination-bullets, .inorgaSlider .swiper-pagination-bullets.swiper-pagination-horizontal, .inorgaSlider .swiper-pagination-custom, .swiper-pagination-fraction{
    bottom: 2vw;
    z-index: 12;
}
.inorgaSlider .swiper-pagination-bullet{
    width: 2.6vw;
    height: .45vw;
    background: #07AF55;
    margin: 0 .3vw !important;
    transition: .6s all;
    border-radius: 100vw;
}
.inorgaSlider .swiper-pagination-bullet-active{
    width: 2.6vw;
    border-radius: 100vw;
}
.inorga_box{
    text-align: center;
    padding: 0 1vw;
}
.inorga_image{
    width: 7vw;
    display: block;
    margin: auto;
    position: relative;
    height: 7vw;
    margin-bottom: 1vw;
}
.inorga_image img{
    position: absolute;
    width: 100%;
    height: 100%;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.inorga_box h1{
    font-size: .75vw;
    font-weight: 500;
    display: block;
}

.btn_primary{
    background-color: #07AF55;
    color: white;
    font-size: .9vw;
    padding: .54vw 1.1vw;
    border-radius: .4vw;
    cursor: pointer;
    border: none;
    outline: none;
    transition: .4s all;
}
.btn_primary:hover{
    transform:scale(0.96);
}
.article_home{
    width: 100%;
    padding: 5vw 10vw;
    background: url(../images/overlay_green.png), #039F4C1A;
    background-blend-mode: overlay;
    background-position: bottom center;
    background-size: contain;
    background-repeat: repeat-y;
    border-radius: 6vw 6vw 0 0;
}
.article_home_layout{
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-gap: 1vw;
    margin-top:2.5vw;
}
.article_home_box{
    padding: 1vw;
    background-color: white;
    border-radius: .8vw;
    border: .12vw solid #07af5550;
}
.article_home_image{
    width: 100%;
    height: 14vw;
    position: relative;
    margin-bottom: .9vw;
    overflow: hidden;
    border-radius: .6vw;
}
.article_home_image img{
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    object-fit: cover;
    object-position: center;
    transition: .4s all;
}
.article_home_box:hover .article_home_image img{
    transform: scale(1.1);
}
.article_home_content span{
    font-size: .8vw;
    color: #07AF55;
}
.article_home_content h1{
    font-size: 1.2vw;
    margin-top: .23vw;
    margin-bottom: .3vw;
    color: #004621;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 1;
}
.article_home_content p{
    font-size: .85vw;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    margin-bottom: 1.3vw;
}

.cta_home{
    width: 100%;
    height: 14vw;
    position: relative;
    overflow: hidden;
    background-image: url(../images/bg_fixed.png);
    background-size: cover;
    background-attachment: fixed;
}
.bg_cta{
    position: absolute;
    left: 0;
    top: 0;
    width: 84%;
}
.slide_cta{
    position: absolute;
    right: 0;
    top: 0;
    width: 21%;
}
.cta_image{
    width: 100%;
    height: 15vw;
    position: relative;
}
.cta_image img{
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    object-fit: cover;
    object-position: center;
    z-index: 1;
}
.cta_image_overlay{
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background: linear-gradient(180deg, rgba(6, 172, 84, 0.52) 0%, rgba(6, 172, 84, 0.52) 164.51%);
    z-index: 2;
}
.heading_gabung{
    width: 35vw;
    margin-bottom: .5vw;
    margin-left: -.2vw;
}
.cta_home_layout{
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: absolute;
    z-index: 3;
    left: 0;
    top: 53%;
    transform: translateY(-50%);
    width: 100%;
    padding: 0 10vw;
}
.cta_home_content h1{
    font-size: 2.4vw;
    color: white;
    margin-bottom: .3vw;
}
.cta_home_content p{
    font-size: 1.2vw;
    color: white;
    font-weight: 300;
}
.cta_home_button button{
    outline: none;
    border: none;
    color: #0DCA65;
    padding: .7vw 2.4vw;
    font-size: 1.8vw;
    cursor: pointer;
    border-radius: .1vw;
    font-family: heading-extra;
    border: .12vw solid #0DCA65;
    transition: .4s all;
    box-shadow: 0px 4px 4px 0px #00000040;
    background: linear-gradient(180deg, #FFFFFF 0%, #DFDFDF 100%);
}
.cta_home_button button:hover{
    transform: scale(.9);
}

.about_home_content{
    text-align: start !important;
    padding: 1.7vw;
    padding-right: 0;
}

.header{
    display: flex;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
    background-position: center;
    background-size: cover;
    padding: .6vw 0;
    padding-left: 7.1vw;
    padding-top: 2vw;
    gap: 3vw;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 10;
}
.logo{
    text-align: end;
    margin-right: 4vw;
}
.logo img{
    width: 7vw;
}
.logo_mobile{
    display: none;
}
nav{
    width: max-content;
}
nav ul{
    display: flex;
    justify-content: center;
    list-style: none;
    align-items: center;
    gap: 2.7vw;
    margin-bottom: -.5vw;
}
nav ul li{
    position: relative;
}
nav ul li a{
    text-decoration: none;
    color: #004621;
    font-size: 1.2vw;
    font-weight: 400;
    transition: .3s all;
}
nav ul li a:hover{
    color: #0CC663;
}
.has-submenu .submenu {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease-out;
    position: absolute;
    top: 2vw;
    left: 0;
    background-color: white;
    list-style: none;
    border: none;
    /* padding: 1.1vw 1vw; */
    border-radius: .9vw;
    z-index: 1;
    box-shadow: 0px 2px 14px -3px rgba(0, 0, 0, 0.281);
    -webkit-box-shadow: 0px 2px 14px -3px rgba(0,0,0,0.281);
    -moz-box-shadow: 0px 2px 14px -3px rgba(0,0,0,0.281);
    z-index: 20;
    display: block;
    opacity: 0;
    transition: .4s all;
}

.has-submenu .submenu li a {
    white-space: nowrap;
    padding: .9vw 1vw;
    border-bottom: .1vw solid #0CC663;
    width: 100%;
    display: block;
    color: #008F45;
    font-size: 1vw;
}
/* .has-submenu .submenu li:first-child a{
    padding-top: 0;
} */
.has-submenu .submenu li:last-child a{
    border-bottom: 0;
}
.submenu-toggle{
    display: flex;
    align-items: center;
    gap: .2vw;
}
.has-submenu .submenu-toggle.active + .submenu {
    max-height: 300px; /* Sesuaikan dengan tinggi submenu */
    transition: max-height 0.3s ease-in;
    opacity: 1;
}
.hamburger{
    display: none;
}
.close_btn{
    display: none;
}
.btn_header button{
    outline: none;
    border: none;
    font-size: 1.1vw;
    background-color: white;
    color: #0CC663;
    font-weight: 500;
    padding: .4vw 2.4vw;
    border-radius: .7vw;
    cursor: pointer;
    margin-left: 2vw;
    margin-top: .4vw;
    box-shadow: 0px 3px 4px 0px #00000040;
    display: flex;
    align-items: center;
    gap: .5vw;
    border: .12vw solid #0CC663;
    transition: .4s all;
}
.btn_header button:hover{
    transform: scale(1.1);
}
.btn_header_mobile{
    display: none;
}
.slider{
    width: 100%;
    position: relative;
    height: max-content;
}
.slide_overlay{
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    bottom: 0;
    z-index: 10;
    background: linear-gradient(180deg, rgba(4, 50, 25, 0.67) 0%, rgba(1, 57, 27, 0.83) 100%);

}
/* .heading_banner{
    position: absolute;
    left: 50%;
    top: 38%;
    transform: translate(-50%, -50%);
    z-index: 13;
    text-align: center;
} */

.heading_banner_home{
    top: 50%;
}
.heading_banner span{
    color: white;
    font-family: rubik;
    text-transform: uppercase;
    font-weight: 400;
    font-size: 1.2vw;
    letter-spacing: .2vw;
}
.heading_banner h3{
    font-family: "Over the Rainbow", cursive;
    font-size: 3vw;
    font-weight: 400;
    color: white;
}
.heading_banner button{
    background: linear-gradient(90deg, #DF1C20 0%, #D61115 100%);
    color: white;
    font-family: rubik;
    outline: none;
    border: none;
    font-size: 1.3vw;
    border-radius: .5vw;
    padding: .7vw 1.7vw;
    margin-top: 1.1vw;
    cursor: pointer;
}
.heading_banner_dekstop{
    width: 70vw;
    display: block;
    margin-top: 1.7vw;
}
.heading_banner_mobile{
    display: none;
}
.mySwiper{
    margin-bottom: -.7vw;
}
.slide_img_banner{
    width: 100%;
    height: 44vw;
    position: relative;
}
.slide_img{
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    object-fit: cover;
    object-position: center;
}
.swiper-horizontal>.swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal, .swiper-pagination-custom, .swiper-pagination-fraction{
    bottom: 2vw;
    z-index: 12;
}
.swiper-pagination-bullet{
    width: 2.6vw;
    height: .45vw;
    background: white;
    margin: 0 .3vw !important;
    transition: .6s all;
    border-radius: 100vw;
}
.swiper-pagination-bullet-active{
    width: 2.6vw;
    border-radius: 100vw;
}
.icon_slide_1{
    position: absolute;
    left: 0;
    z-index: 12;
    bottom: -2.1vw;
    width: 12vw;
}
.icon_slide_2{
    position: absolute;
    right: 0;
    bottom: -3.2vw;
    z-index: 12;
    width: 11vw;
}

.section_2{
    width: 100%;
    position: relative;
    background-image: url(../images/section_2_bg.png);
    background-position: bottom center;
    background-size: cover;
    height: 37vw;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding-bottom: 2.6vw;
}
.heading_section_2{
    width: 65vw;
}
.stand_section_2{
    width: max-content;
    height: max-content;
    position: relative;
    background: linear-gradient(91.65deg, #DF1C20 -1.72%, #A7070A 102.02%);
    border: .07vw solid white;
    padding: 1.78vw 2.5vw;
    padding-bottom: 1.65vw;
    border-radius: .7vw;
    margin-top: 2vw;
    margin-bottom: 3.6vw;
}
.stand_section_2 span{
    text-transform: uppercase;
    font-size: 2vw;
    color: white;
    font-family: "Rubik", sans-serif;
    font-weight: 400;
}
.section_2 button{
    background: linear-gradient(180deg, #FFFFFF 0%, #E9E9E9 100%);
    outline: none;
    border: .12vw solid #DF1C20;
    font-family: "Rubik", sans-serif;
    color: #00954A;
    text-transform: uppercase;
    font-size: 1.17vw;
    font-weight: 700;
    padding: 1.2vw 4.1vw;
    box-shadow: 0px 3px 4px 0px #00000040;
    cursor: pointer;
    transition: .4s all;
}
.section_2 button:hover{
    transform: scale(1.04);
}
.section_3_content a{
    text-decoration: none;
}

.section_4{
    width: 100%;
    background: url(../images/overlay_green.png), #039F4C1A;
    background-blend-mode: overlay;
    background-position: bottom center;
    background-size: contain;
    background-repeat: repeat-y;
    padding: 5vw 10vw;
    border-radius: 6vw 6vw 0 0;
}
.contact_layout{
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    justify-content: center;
    grid-gap: 2vw;
    margin: 3vw 0;
}
.iframe_wrapper{
    width: 100%;
    height: 24vw;
    position: relative;
    border-radius: 1vw;
    overflow: hidden;
    border: .12vw solid #07af5550;
}
.iframe_wrapper iframe{
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
}
.contact_box{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1.2vw;
    padding: 2vw 1vw;
    background-color: white;
    border-radius: 1vw;
    transition: .4s all;
    border: .12vw solid #07af5550;
}
.contact_box:hover{
    /* background: linear-gradient(89.64deg, #FFC609 -11.16%, #039D4C 45.13%, #0298D8 101.42%); */
    background-image: url(../images/bg_cta.png);
    background-position: center;
}
.contact_box img{
    width: 5.6vw;
}
.contact_box:hover img{
    filter: brightness(0) invert(1);
}
.contact_box span{
    color: #004621;
    font-size: 1vw;
    font-weight: 500;
}
.contact_box:hover span{
    color: white;
}
.contact_layout a{
    text-decoration: none;
}

.footer{
    width: 100%;
    background-color: #094019;
    padding: 4.5vw 10vw;
    padding-bottom: 2.6vw;
}
.footer_first{
    display: flex;
    justify-content: space-between;
}
.footer_identity img{
    width: 6.6vw;
    filter: brightness(0) invert(1);

    margin-bottom: .5vw;
}
.footer_identity p{
    color: white;
    width: 42%;
    font-size: .85vw;
    margin-bottom: 1.3vw;
}
.social_media_footer{
    display: flex;
    gap: 1vw;
}
.social_media_box{
    width: 2.5vw;
    height: 2.5vw;
    position: relative;
    border-radius: 100vw;
    border: .1vw solid white;
}
.social_media_box iconify-icon{
    font-size: 1.3vw;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    columns: white;
}
.social_media_footer a{
    color: #FFC609;
}
.menu_footer{
    display: flex;
    gap: 7vw;
    align-items: flex-start;
    margin-top: 3vw;
}
.menu_footer_box{
    width: max-content;
}
.menu_footer_box h3{
    color: white;
    font-size: 1.1vw;
    font-weight: 600;
    margin-bottom: 1vw;
}
.menu_footer_box ul li{
    list-style: none;
    font-size: 1vw;
    color: white;
    margin-bottom: .9vw;
}
.menu_footer_box ul li a{
    text-decoration: none;
    color: white;
    width: max-content;
}
.footer_second{
    display: flex;
    justify-content: space-between;
    padding: 2.2vw 0;
    align-items: center;
    border-top: .1vw solid rgba(255, 255, 255, 0.377);
    border-bottom: .1vw solid rgba(255, 255, 255, 0.377);
    margin: 2.5vw 0;
    margin-bottom: 1.8vw;
}
.footer_second ul{
    display: flex;
    list-style: none;
    gap: 1.7vw;
}
.footer_second ul li a{
    text-decoration: none;
    font-size: 1vw;
    color: white;
}
.footer_second span{
    color: white;
    text-transform: uppercase;
    font-size: 1vw;
    display: block;
}
.footer_third p{
    font-size: .9vw;
    color: white;
    margin-bottom: 2.7vw;
}
.footer_third p span{
    font-weight: 600;
}
.company_data{
    display: flex;
    gap: 2vw;
}
.company_data_box{
    display: flex;
    gap: .66vw;
    align-items: flex-start;
}
.company_data_box iconify-icon{
    font-size: 1.4vw;
    color: white;
}
.company_data_box h5{
    font-size: 1vw;
    color: white;
    margin-bottom: .4vw;
    font-weight: 600;
}
.company_data_box p{
    margin-bottom: 0;
}

.event_home{
    position: relative;
    width: 100%;
    background-image: url(../images/bg_green.png);
    background-position: bottom center;
    background-size: cover;
    height: 58vw;
    padding-top: 4vw;
}
.heading_event{
    text-align: center;
}
.heading_event img{
    width: 52vw;
}
.event_home_bg{
    position: absolute;
    width: 100%;
    bottom: 0;
    left: 0;
    z-index: 1;
    display: block;
}
.content_event{
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 14.2vw;
    width: 73%;
    z-index: 3;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 2vw;
}
.content_event img{
    width: 6vw;
}
.outcoming_event h3{
    font-family: "Nothing You Could Do", cursive;
    font-size: 3vw;
    font-weight: 600;
    color: #363636;
    margin-bottom: 1vw;
}
.outcoming_event_layout{
    display: flex;
    flex-direction: column;
    gap: 1vw;
    height: 21vw;
    overflow-y: scroll;
}
.outcoming_event_image{
    position: relative;
    width: 100%;
    height: 21vw;
    border: .2vw solid #363636;
}
.outcoming_event_image img{
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    z-index: 2;
    object-fit: cover;
    object-position: center;
}
.outcoming_event_content{
    z-index: 3;
    position: absolute;
    bottom: 0;
    left: 0;
    padding: .8vw;
    padding-top: 2.3vw;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.340955) 25.5%, rgba(0, 0, 0, 0.595) 44.5%, rgba(0, 0, 0, 0.762838) 67.5%, rgba(0, 0, 0, 0.886892) 84.5%, #000000 100%);
    width: 100%;
}
.incoming_event_layout{
    width: 100%;
    height: 21vw;
    overflow-y: scroll;
}
.incoming_event_layout a{
    text-decoration: none;
}
.outcoming_event_content h1{
    font-size: 1.2vw;
    font-family: rubik;
    color: white;
    font-weight: 500;
    margin-bottom: .5vw;
}
.outcoming_event_content span{
    color: white;
    font-size: .83vw;
    font-family: rubik;
    font-weight: 400;
}
.outcoming_event_content p{
    color: white;
    font-size: .83vw;
    font-family: rubik;
    margin-top: .4vw;
}
.heading_incoming_event h3{
    font-family: "Nothing You Could Do", cursive;
    font-size: 3vw;
    font-weight: 600;
    color: #363636;
    margin-bottom: 1vw;
}
.incoming_event_box{
    display: flex;
    margin-bottom: 1.5vw;
    gap: 1.2vw;
}
.incoming_event_image{
    width: 40%;
    height: 7vw;
    position: relative;
    border: .12vw solid #363636;
}
.incoming_event_image img{
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    object-fit: cover;
    object-position: center;
}
.incoming_event_content{
    padding-top: .7vw;
    padding-right: 6vw;
}
.incoming_event_content h1{
    font-size: 1.1vw;
    font-family: rubik;
    font-weight: 500;
    color: #363636;
    margin-bottom: .45vw;
    transition: .4s all;
}
.incoming_event_content h1:hover{
    color: #00954A;
}
.incoming_event_box:hover h1{
    color: #00954A;
}
.incoming_event_content span{
    font-family: rubik;
    font-size: .85vw;
    color: #363636;
}
.incoming_event_content p{
    font-size: .9vw;
    font-family: rubik;
    color: #363636;
    margin-top: .3vw;
}
.event_home_bg_mobile{
    display: none;
}

/* .banner{
    width: 100%;
    position: relative;
    background-image: url(../images/bg_banner.png);
    background-position: center bottom;
    background-size: cover;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 23vw;
    padding-bottom: 7vw;
    text-align: center;
}
.heading_banner h1{
    color: white;
    -webkit-text-fill-color: white;
    -webkit-text-stroke-width: .4vw;
    -webkit-text-stroke-color: #EF4E47;
    font-family: rubik;
    font-size: 6.5vw;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 0vw;
    width: max-content;
}
.banner img{
    width: 100%;
} */
.grid-2{
    width: 100%;
    display: grid;
    align-items: center;
    grid-template-columns: repeat(2, 1fr);
    position: relative;
    grid-gap: 2vw;
}
.image_about{
    width: 100%;
    height: 34vw;
    position: relative;
}
.image_about img{
    width: 100%;
    position: absolute;
    height: 100%;
    top: 0;
    left: 0;
    object-fit: cover;
    object-position: center;
}
.content_layout_about{
    width: 100%;
    padding: 4vw 10vw;
    background-color: #039F4C1A;
    background-image: url(../images/about_bg_content.png);
    background-position: 50vw -13vw;
    background-size: 53vw auto;
    background-repeat: no-repeat;
}
.content_layout_sejarah{
    width: 100%;
    padding: 4vw 10vw;
    background-color: #039F4C1A;
    background-image: url(../images/sejarah_bg.png);
    background-position: 4vw -4vw;
    background-size: 45.7vw auto;
    background-repeat: no-repeat;
}
.content_layout_sejarah{
    text-align: end;
}
.content_about h1{
    font-size: 2.7vw;
    margin-bottom: 1vw;
    font-weight: 700;
    color: #0CC663;
}
.content_about p{
    font-size: .91vw;
    margin-bottom: .8vw;
    color: #626262;
}
.content_about a{
    text-decoration: none;
    color: #cf0a0d;
    font-weight: 700;
}

.struktur_page{
    width: 100%;
    padding: 5vw 0;
    background: url(../images/overlay_green.png), #039F4C1A;
    background-blend-mode: overlay;
    background-position: bottom center;
    background-size: contain;
    background-repeat: repeat-y;
    position: relative;
}

.organisasi_image{
    position: relative;
    width: max-content;
    margin-bottom: .5vw;
}
.organisasi_image_overlay{
    width: 9vw;
    height: 9vw;
    position: absolute;
    top: -1vw;
    right: -1.4vw;
    border-radius: 1.5vw;
    background: linear-gradient(314.86deg, #00954A -21.35%, #FFFFFF 107.46%);

}
.diamond_box{
    width: 10vw;
    height: 12vw;
    position: relative;
    overflow: hidden;
    border-radius: 1.6vw;
    border: .24vw solid white;
}
.diamond_box_overlay{
    border-radius: 1.1vw;
    width: 100%;
    height: 12vw;
    position: absolute;
    left: 0;
    top: 0;
    box-shadow: 0px 0px .3vw 0px rgba(0,0,0,0.22) inset;
-webkit-box-shadow: 0px 0px .3vw 0px rgba(0,0,0,0.22) inset;
-moz-box-shadow: 0px 0px .3vw 0px rgba(0,0,0,0.22) inset;
z-index: 2;
}
.diamond_box img{
    position: absolute;
    left:0;
    bottom: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    z-index: 1;
}

.slideBtnStruktur{
    padding: 0 5vw;
    padding-top: 4vw;
}
.slideBtnStruktur .swiper-wrapper{
    padding-bottom: 2vw;
    padding-top: 2vw;
    /* overflow: hidden; */
}
.slideBtnStruktur .swiper-slide{
    /* padding: 0 3vw; */
    width: max-content;
}
.slideBtnStruktur .swiper-button-next, .slideBtnStruktur .swiper-button-prev{
    top: 3vw !important;
}
.slideBtnStruktur .swiper-button-next, .slideBtnStruktur .swiper-rtl .swiper-button-prev{
    right: 88.9vw !important;
}
.swiper-button-prev, .swiper-rtl .swiper-button-next {
    left: 5vw;
    right: auto;
}

.slideBtnStruktur .swiper-button-next:after, .slideBtnStruktur .swiper-button-prev:after {
    font-family: swiper-icons;
    font-size: 1.4vw !important;
    text-transform: none !important;
    letter-spacing: 0;
    font-variant: initial;
    line-height: 1;
}
.slideBtnStruktur .swiper-button-next, .slideBtnStruktur .swiper-button-prev{
    color: white !important;
    background-color: #0CC663;
    padding: 0 1vw;
    border-radius: .3vw;
}
.heading_struktur{
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.heading_struktur h1{
    font-size: 2.2vw;
    text-transform: uppercase;
    color: #094019;
    font-weight: 700;
    margin-bottom: .6vw;
}
.heading_struktur span{
    font-size: .9vw;
    margin-bottom: .3vw;
}
.table_struktur{
    width: 100%;
    position: relative;
}
.heading_content_struktur{
    text-align: center;
    
}
.heading_content_struktur h1{
    font-family: heading;
    font-size: 4vw;
    color: #0CC663;
    text-transform: uppercase;
}
.layout_content_struktur_fix{
    display: flex;
    align-items: flex-start;
    justify-content: center;
    flex-wrap: wrap;
    gap: 2vw;
    margin-top: 2vw;
}
.content_struktur_fix{
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    gap: .6vw;
    text-align: center;
    width: 17vw;
}
/* .content_struktur_fix img{
    width: 15.3vw;
} */
.content_struktur_fix h3{
    font-size: 1vw;
    font-weight: 600;
}
.content_struktur_fix p{
    text-transform: uppercase;
    font-size: .85vw;
}
.layout_btn_struktur{
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    grid-template-columns: repeat(6, 1fr);
    grid-gap: 1vw;
}
.tabButton{
    background-color:#0CC663 ;
    outline: none;
    border: none;
    font-size: 1vw;
    color: white;
    border-radius: 1vw;
    padding: .6vw 1.4vw;
    cursor: pointer;
    transition: .4s all;
}
.tabButton:hover{
    transform: scale(1.06);
}
.angka_banner{
    font-family: "Staatliches", sans-serif;
    font-weight: 400;
}
.content_struktur{
    border-bottom: none;
    overflow: hidden;
    width: 100%;
    margin: auto;
    height: max-content;
    display: none;
    grid-gap: 2.6vw;
    padding: 3vw;
}
.content_struktur_simple{
    height: max-content;
    width: 100%;
}
.heading_struktur_data{
    font-family: rubik;
    font-size: 1vw;
    color: #008F45;
}
.content_struktur_image{
    width: 100%;
    height: 34vw;
    border: .12vw solid #008F45;
    border-radius: .85vw;
    overflow: hidden;
    position: relative;
}
.content_struktur_image img{
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    object-fit: cover;
    object-position: center;
}
.content_struktur_data{
    display: flex;
    flex-direction: column;
    gap: 1.1vw;
    height: 34vw;
    overflow-y: auto;
    border-radius: .8vw;
}
.content_struktur_simple .content_struktur_data{
    height: max-content;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
}
/* .content_struktur_data::-webkit-scrollbar{
    display: none;
} */
.content_struktur_box{
    border: .12vw solid #008F45;
    background-color: #008f4521;
    padding: 1.2vw 1.5vw;
    border-radius: .8vw;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: .4vw;
}
.content_struktur_box span{
    color: #008F45;
    font-size: 1.1vw;
    font-family: rubik;
}
.content_struktur_box h3{
    font-size: 1.4vw;
    color: #008F45;
    font-family: rubik;
    font-weight: 500;
}
.content_struktur table{
    margin: auto;
    background-color: white;
}
.content_struktur table,.content_struktur table tr, .content_struktur table tr td{
    border: .1vw solid #00954A;
    border-collapse: collapse;
}
.content_struktur table tr td{
    padding: 1vw 2vw;
    color: #094019;
    font-weight: 600;
    font-size: 1vw;
    font-family: rubik;
    font-weight: 400;
}
.content_struktur table tr td:nth-child(1){
    padding: 1vw 1.2vw;
}
.content_struktur table tr td:nth-child(2){
    padding: 1vw 1.2vw;
    width: 20vw;
}

  .select_tab_layout{
    display: flex;
    justify-content: space-between;
    background-color: white;
    align-items: center;
    width: max-content;
    margin: auto;
    margin-top: 2.4vw;
    position: relative;
    border-radius: 100vw;
    border: .12vw solid #007C3D;
    
  }
  #tabSelect {
    display: block;
    font-size: 1.1vw;
    font-family: rubik;
    font-weight: 400;
    -webkit-appearance: none;
    background-color: transparent;
    outline: none;
    border: none;
    color: #094019;
    padding: .8vw 1.5vw;
    padding-right: 2.5vw;
    cursor: pointer;
  }
  #tabSelect option{
    font-family: rubik;
  }
  .select_tab_layout iconify-icon{
    font-size: 1.2vw; 
    color: #007C3D;
    position: absolute;
    right: 1vw;
    top: 50%;
    transform: translateY(-50%);
  }
  
.content_struktur.active {
display: grid;
}

.section-4-visi{
    position: relative;
    width: 100%;
    height: max-content;
    /* background: url(../images/bg_overlay.png), #ffffff6b;
    background-blend-mode: overlay;
    background-position: center;
    background-size: cover; */
    width: 100%;
    background: url(../images/overlay_green.png), #039F4C1A;
    background-blend-mode: overlay;
    background-position: bottom center;
    background-size: contain;
    background-repeat: repeat-y;
    padding: 0 10vw;
    padding-bottom: 4vw;
    padding-top: 4vw;
    z-index: 2;
    overflow: hidden;
}
.layout-section-4-visi{
    width: 100%;
    display: grid;
    margin: auto;
    align-items: flex-start;
    grid-template-columns: repeat(1, 1fr);
    grid-gap: 0;
}
.box-section-4{
    width: 100%;
    z-index: 5;
    transition: .6s all;
}
@keyframes cardMove {
    0% {
        transform: translateY(-2%);
    }
    
    100% {
        transform: translateY(0%);
    }
}
.card-section-4{
    text-align: end;
    padding: 1vw 0;
    z-index: 3;
    padding-top: 1.6vw;
    padding-left: 9vw;
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    gap: 2vw;
}
.card-section-4-max{
    height: max-content;
    text-align: start;
    padding-bottom: 2vw;
    padding-right: 13vw;
    padding-left: 0;
    display: flex;
    flex-direction: row;
}
.card-section-4 img{
    width: 14vw;
}

.list-section-4 h3{
    font-size: 3vw;
    color: #0CC663;
    font-weight: 500;
    margin-bottom: 1vw;
    position: relative;
    font-family: heading-extra;
    text-transform: uppercase;
}
.price-section-4{
    width: 100%;
    margin: auto;
    margin-top: .7vw;
    background: #2EA386;
    padding: .4vw 1vw;
    padding-bottom: .34vw;
}
.price-section-4 span{
    color: #EFEFEF;
    font-weight: 500;
    font-size: 1.5vw;
    letter-spacing: .1vw;
}
.list-section-4{
    margin-top: 1vw;
}
.list-section-4 ul{
    list-style: none;
    width: 100;
    text-align: end;
    padding-left: 5vw;
}
.list-section-4 ul li{
    font-size: 1vw;
    text-align: end;
    list-style: none;
    margin-bottom: .6vw;
    color: #626262;
    font-weight: 400;
}
.list-section-4 ul li:last-child{
    border: none;
}
.list-section-4 p{
    font-size: 1vw;
    font-weight: 400;
    padding: 0 0;
    color: #626262;
}
.gantungan{
    display: flex;
    justify-content: space-between;
    margin: auto;
    width: 65%;
    align-items: center;
}
.gantung-mobile{
    display: none;
}
.gantungan .gantung{
    display: block;
    width: 2.9vw;
    margin-right: -1vw;
}
.gantungan-btn .gantung{
    z-index: -1 !important;
    margin-top: -6.7vw;
    display: block;
}
.btn-section-4{
    margin-top: -4vw;
}
.btn-section-4 button{
    width: 100%;
    border: .4vw solid #FBA417;
    background: #FBA417;
    font-size: 2vw;
    color: #af5003;
    font-weight: 300;
    padding: .4vw 0;
    box-shadow: .5vw .5vw .9vw 0px rgba(0, 0, 0, 0.25);
    outline: none;
    cursor: pointer;
    transition: .3s all;
}
.btn-section-4 button:hover{
    transform: translateX(2%);
}
.left_archer{
    position: absolute;
    left: 0;
    bottom: 0;
    width: 13vw;
}
.right_archer{
    position: absolute;
    right: 0;
    bottom: 0;
    width: 13vw;
}


.proker_section{
    width: 100%;
    background: url(../images/bg_overlay.png), #ffffff6b;
    background-blend-mode: overlay;
    background-position: center;
    background-size: cover;
    position: relative;
    padding: 5vw 10vw;
}
.proker_container{
    width: 100%;
}
.proker_container::-webkit-scrollbar{
    display: none;
}
.proker_layout{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.7vw;
}
.proker_box{
    background-color: #fff;
    width: 100%;
    padding: 1vw;
    position: relative;
    border-radius: .6vw;
    box-shadow: 0px 0px 33px 0px rgba(0, 0, 0, 0.075);
-webkit-box-shadow: 0px 0px 33px 0px rgba(0,0,0,0.075);
-moz-box-shadow: 0px 0px 33px 0px rgba(0,0,0,0.075);
}
.proker_image{
    width: 100%;
    height: 20vw;
    position: relative;
    overflow: hidden;
    border-radius: .5vw;
}
.proker_image img{
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition: .4s all;
}
.proker_box:hover .proker_image img{
    transform: scale(1.1);
}
.proker_content{
    padding-top: 1.1vw;
}
.proker_content h1{
    font-size: 1.1vw;
    font-weight: 600;
    color: #282B36;
    margin-bottom: .5vw;
}
.proker_content span{
    font-size: .9vw;
    color: #0CC663;
    font-weight: 400;
}
.proker_bg{
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
}

.artikel_section{
    width: 100%;
    background: url(../images/bg_overlay.png), #ffffff6b;
    background-blend-mode: overlay;
    background-position: center;
    background-size: contain;
    display: grid;
    grid-template-columns: 70% 30%;
    padding: 4vw 10vw;
  }
  .artikel_section_list{
    display: flex;
    flex-direction: column;
    padding-right: 2vw;
  }
  .artikel_section_box{
    display: grid;
    grid-template-columns: 26% 74%;
    padding: 1vw 0;
    border-bottom: .1vw solid #0CC663;
  }
  .artikel_section_image{
    position: relative;
    width: 100%;
    height: 9vw;
    overflow: hidden;
  }
  .artikel_section_image img{
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition: .4s all;
  }
  .artikel_section_box:hover .artikel_section_image img{
    transform: scale(1.1);
  }
  .artikel_section_content{
    padding:1vw 1.2vw;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
  }
  .artikel_section_content a{
    text-decoration: none;
  }
  .artikel_section_content h1{
    font-size: 1.3vw;
    font-weight: 500;
    color: black;
    margin-bottom: .9vw;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
  }
  .artikel_section_content span{
    display: flex;
    align-items: center;
    gap: .3vw;
    text-transform: uppercase;
    font-size: .85vw;
    color: #0CC663;
    width: 100%;
    padding-bottom: .6vw;
  }

  .artikel_section_sidebar{
    display: block;
  }
  .artikel_section_sidebar_container{
    position: sticky;
    top: 3.5vw;
    width: 100%;
    left: 0;
    display: flex;
    flex-direction: column;
    gap: 1.3vw;
  }

  .artikel_section_sidebar_box{
    /* background: url(../images/papper_texture.png) #052833;
    background-position: center;
    background-size: cover;
    background-blend-mode: overlay; */
    background-color: #0CC663;
    width: 100%;
    padding: 1.5vw;
    border-radius: .8vw;
  }
  .artikel_section_sidebar_box h3{
    color: white;
    font-size:1.1vw;
    margin-bottom: .9vw;
    font-weight: 500;
  }
  .search_sidebar{
    background-color: white;
    border: .1vw solid white;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 1vw;
    border-radius: .6vw;
  }
  .search_sidebar input{
    width: 100%;
    padding: .7vw 0;
    outline: none;
    border: none;
    background-color: transparent;
    font-size: .86vw;
  }
  .search_sidebar iconify-icon{
    font-size: 1.1vw;
    color: #0CC663;
  }
  .artikel_section_recent ul li{
    color: #fff;
    list-style: none;
    
  }
  .artikel_section_recent ul li a{
    color: #fff;
    display: flex;
    font-size: .83vw;
    align-items: flex-start;
    text-decoration: none;
    gap: .4vw;
    border-bottom: .1vw solid #fff;
    padding-bottom: .7vw;
    margin-bottom: .7vw;
  }
  .artikel_section_recent ul li a iconify-icon{
    font-size: .9vw;
    margin-top: .1vw;
    color:#fff;
  }
  .artikel_section_recent ul li a:hover{
    color: #fff;
  }

  .artikel_section_sidebar_btn{
    display: flex;
    flex-wrap: wrap;
    gap: .7vw;
  }
  .artikel_section_sidebar_btn button{
    outline: none;
    border: .1vw solid #FFD400;
    font-size: .83vw;
    color: white;
    padding: .4vw .7vw;
    border-radius: .4vw;
    background-color: transparent;
    cursor: pointer;
  }
  .artikel_section_sidebar_btn button:hover{
    background-color: #FFD400;
    color: #052833;
  }
  .search_artikel_mobile .artikel_section_sidebar_box{
    display: none;
  }
  .artikel_section_sidebar_box_dekstop{
    display: block;
  }
  .search_artikel_mobile{
    display: none;
  }

  .artikel_section_detail{
    background: url(../images/overlay_green.png), #039F4C1A;
    background-blend-mode: overlay;
    background-position: bottom center;
    background-size: contain;
    background-repeat: repeat-y;
  }

  .artikel_detail_layout{
    border-radius: 0;
  }
  .artikel_detail_heading h1{
    font-size: 2vw;
    color: #000e18;
    font-weight: 700;
    line-height: 1.4;
    margin-bottom: 1vw;
    color: #0CC663;
  }
  .artikel_detail_image{
    width: 100%;
    height: 24vw;
    position: relative;
    overflow: hidden;
    border-radius: .8vw;
    margin-bottom: 1vw;
  }
  .artikel_detail_image img{
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }
  .artikel_detail_content p{
    margin-bottom: .8vw;
    font-size: .91vw;
    color: #626262;
  }
  .artikel_detail_content h1, .artikel_detail_content h2, .artikel_detail_content h3, .artikel_detail_content h4, .artikel_detail_content h5, .artikel_detail_content h6{
    font-size: 1vw;
    font-weight: 600;
    color: #000e18;
    margin-bottom: .8vw;
  } 
  .artikel_detail_content img{
    max-width: 100%;
    margin-bottom: 1vw;
    margin-top: .4vw;
    border-radius: 1vw;
  }

  .artikel_detail_share{
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    border-top: .1vw solid #000e18;
    border-bottom: .1vw solid #000e18;
    padding: 1vw 1vw;
    margin-top: 2.5vw;
}
.artikel_detail_share h3{
    font-size: 1.2vw;
    color:#000e18;
}
.artikel_detail_share_layout{
    display: flex;
    gap: .8vw;
}
.artikel_detail_share_box{
    width: 2.5vw;
    height: 2.5vw;
    position: relative;
    border-radius: 100vw;
    border: .12vw solid #000e18;
}
.artikel_detail_share_box iconify-icon{
    font-size: 1.4vw;
    color: #0CC663;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}


.berita_section{
    width: 100%;
    position: relative;
    background-image: url(../images/section_2_bg.png);
    background-position: top center;
    background-size: cover;
    background-color: linear-gradient(180deg, rgba(0, 164, 76, 0.09) 0%, rgba(0, 164, 76, 0.57) 100%);
    display: grid;
    align-items: flex-end;
    grid-template-columns: 60% 40%;
    padding: 0 8.5vw;
    padding-top: 5.5vw;
    padding-bottom: 3vw;
}
.newspapper_1{
    position: absolute;
    right: 0;
    top: -11vw;
    z-index: 10;
    width: 15vw;
}
.newspapper_2{
    position: absolute;
    left: 0;
    bottom: 0;
    width: 16vw;
    z-index: 10;
}
.berita_bg{
    width: 100%;
}
.hanger_berita{
    width: 100%;
    display: block;
}
.hanger_berita_detail{
    width: 100%;
    display: block;
}
.hanger_berita_mobile{
    display: none;
}
.berita_container{
    position: relative;
}
.berita_layout{
    position: absolute;
    top:7.2vw;
    left: 9vw;
}
.berita_detail_layout{
    position: absolute;
    left: 3.37vw;
    top: 0;
    height: 55vw;
    padding: 2vw 0;
    width: 86.3%;
    overflow-y: scroll;
    border-radius: 1vw;
}
.papper_overlay{
    position: absolute;
    bottom: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 10;
}
.berita_detail_layout::-webkit-scrollbar{
    display: none;
}
.berita_box{
    width: 38.6vw;
    display: grid;
    grid-template-columns: 31% 69%;
    background-color: white;
    padding: .8vw;
    position: relative;
    margin-top: .9vw;
}
.berita_box_detail{
    width: 100%;
    background-color: white;
    padding: .8vw;
    position: relative;
    border-radius: .8vw;
    background-image: url(../images/papper_overlay.png);
    background-size: cover;
    background-position: center;
}
.berita_box:first-child{
    margin-top: 1.7vw;
}
.berita_box:first-child:before{
    position: absolute;
    content: '';
    width: .41vw;
    height: 2.2vw;
    background-color: #4E4E4E;
    bottom: 97%;
    left: 9vw;
    border-radius: .5vw;
}
.berita_box:first-child:after{
    position: absolute;
    content: '';
    width: .41vw;
    height: 2.2vw;
    background-color: #4E4E4E;
    bottom: 97%;
    right: 9vw;
    border-radius: .5vw;
}
.berita_box:before{
    position: absolute;
    content: '';
    width: .41vw;
    height: 1.27vw;
    background-color: #4E4E4E;
    bottom: 97%;
    left: 9vw;
    border-radius: .5vw;
}
.berita_box:after{
    position: absolute;
    content: '';
    width: .41vw;
    height: 1.27vw;
    background-color: #4E4E4E;
    bottom: 97%;
    right: 9vw;
    border-radius: .5vw;
}
.berita_image{
    width: 100%;
    height: auto;
    position: relative;
    overflow: hidden;
}
.berita_image img{
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition: .4s all;
}
.berita_image_detail img{
    width: 100%;
    margin-bottom: .9vw;
}
.berita_image:hover img{
    transform: scale(1.1);
}
.berita_content{
    padding: .8vw 1.2vw;
}
.berita_content_detail{
    padding: 0;
}
.berita_content_detail a{
    text-decoration: none;
}
.berita_content a{
    text-decoration: none;
}
.berita_content h2{
    font-size: 1.44vw;
    font-weight: 600;
    color: #094019;
    font-family: rubik;
    margin-bottom: 1vw;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    transition: .4s all;
}
.berita_content_detail h2{
    font-size: 1.8vw;
    font-weight: 600;
    color: #007C3D;
    font-family: rubik;
    margin-bottom: .8vw;
    transition: .4s all;
}
.berita_content_detail p{
    font-size: 1vw;
    color: #939090;
    font-family: rubik;
    margin-bottom: .8vw;
    font-weight: 300;
}
.berita_content h2:hover{
    color: #007C3D;
}
.berita_content span{
    font-size: 1vw;
    color: #007C3D;
    font-family: rubik;
    font-weight: 400;
}
.pagination_layout{
    display: flex;
    width: 100%;
    margin: auto;
    margin-top: 1.5vw;
    background-color: white;
    position: relative;
    justify-content: center;
    width: max-content;
    padding: .2vw .6vw;
}
.pagination_layout button{
    background-color: white;
    font-size: 1.3vw;
    outline: none;
    border: none;
    width: 3vw;
    height: 2.4vw;
    position: relative;
    cursor: pointer;
    font-weight: 600;
    font-family: rubik;
    color: #00954A;
}
.pagination_layout::before{
    position: absolute;
    content: '';
    width: .41vw;
    height: 1.8vw;
    background-color: #4E4E4E;
    bottom: 95%;
    left: 50%;
    transform: translateX(-50%);
    border-radius: .5vw;
}

.berita_recents_container{
    padding-left: 5.5vw;
    width: 100%;
    padding-bottom: 7.5vw;
}
.berita_recents{
    width: 100%;
    background-color: white;
    padding: .78vw;
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 1vw;
}
.stand_wood{
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    width: 2.5vw;
}
.berita_recents_layout{
    background: linear-gradient(227.03deg, #007C3D -18.11%, #42B47A 104.05%);
    padding: 1.4vw;
    width: 100%;
    height: max-content;
}
.berita_recents_layout::-webkit-scrollbar{
    display: none;
}
.berita_recents_layout h2{
    color: white;
    font-family: rubik;
    font-size: 1.3vw;
    font-weight: 500;
    margin-bottom: 1.1vw;
}
.berita_recents_box{
    display: flex;
    flex-direction: column;
    gap: 1.4vw;
}
.berita_recents_box a{
    text-decoration: none;
}
.berita_recents_box_content{
    display: flex;
    align-items: flex-start;
    gap: .45vw;
}
.berita_recents_box_content iconify-icon{
    color: white;
    font-size: 1.1vw;
}
.berita_recents_box_content span{
    color: white;
    font-size: 1vw;
    font-family: rubik;
}

.berita_recents_kategori_container{
    width: 100%;
    background: linear-gradient(227.03deg, #007C3D -18.11%, #42B47A 104.05%);
    padding: 1.4vw;
}
.berita_recents_kategori_container h2{
    color: white;
    font-family: rubik;
    font-size: 1.3vw;
    font-weight: 500;
    margin-bottom: 1.1vw;
}
.berita_recents_kategori{
    display: flex;
    flex-wrap: wrap;
    gap: .7vw;
}
.berita_recents_kategori button{
    background-color: transparent;
    border: .1vw solid white;
    outline: none;
    font-size: 1vw;
    font-family: rubik;
    padding: .6vw 1.1vw;
    color: white;
    cursor: pointer;
}

.video_media{
    background-color: white;
    padding: .8vw;
}
.video_style{
    width: 100%;
}
.galeri_section{
    width: 100%;
    padding: 0 0;
}
.swiperGaleriPage .swiper-pagination-bullet{
    background: #07AF55;
}
.galeri_slide_page{
    padding: 4vw 10vw;
    padding-bottom: 2vw;
    background: url(../images/overlay_green.png), #039F4C1A;
    background-blend-mode: overlay;
    background-position: bottom center;
    background-size: cover;
    background-repeat: repeat-y;
   border-radius: 0 0 5vw 5vw;
    width: 100%;
    height: max-content;
}
.swiperGaleriPage{
    margin-top: 2.5vw !important;
}
.swiperGaleriPage .swiper-wrapper{
    padding-bottom: 5vw;
}
.blank_bg{
    width: 100%;
    height: 17.8vw;
    background-color: #00A44C;
    position: relative;
}
.galeri_container{
    background: url(../images/bg_overlay.png), #ffffff6b;
    background-blend-mode: overlay;
    background-position: center;
    background-size: contain;
    width: 100%;
    padding: 4vw 10vw;
}
.galeri_layout{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 1vw;
    
}
.galeri_layout img{
    width: 100%;
}
.galeri_layout_box{
    width: 100%;
    height: 22vw;
    position: relative;
    overflow: hidden;
}
.galeri_layout_box img{
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition: .4s all;
}
.galeri_layout_box:hover img{
    transform: scale(1.1);
}

/* .kontak_section{
    padding: 3.5vw 10vw;
    width: 100%;
    background: url(../images/overlay_green.png), #039F4C1A;
    background-blend-mode: overlay;
    background-position: bottom center;
    background-size: cover;
    background-repeat: repeat-y;
}
.maps_layout{
    width: 100%;
    height: 26vw;
    position: relative;
}
.maps_layout iframe{
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

.kontak_content{
    width: 100%;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    justify-content: center;
    position: relative;
}
.kontak_content_text{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-direction: column;
    text-align: center;
}
.kontak_content_text img{
    width: 6.6vw;
    margin-bottom: 1.4vw;
}
.kontak_content_detail h3{
    font-size: 1.6vw;
    color: #094019;
    font-weight: 600;
    margin-bottom: .6vw;
}
.kontak_content_detail p{
    font-size: 1vw;
    color: #094019;
    font-family: rubik;
}

.contact_icon_1{
    position: absolute;
    left: -4vw;
    top: -5vw;
    width: 14.4vw;
}
.contact_icon_2{
    position: absolute;
    right: -3vw;
    bottom: -2vw;
    width: 12.3vw;
} */

#tsparticles{
    z-index:11; 
    position:absolute; 
    top:0; 
    left:0;
}

.berita_share_detail{
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-top: 1vw;
    border-top: .12vw solid #007C3D;
    padding-top: 1vw;
}
.berita_share_detail h3{
    font-weight: 500;
    font-size: 1.1vw;
    font-family: rubik;
    color: #007C3D;
}
.berita_share_detail_layout{
    display: flex;
    gap: .6vw;
}
.berita_share_detail_box{
    width: 2.1vw;
    height: 2.1vw;
    position: relative;
    border-radius: 100vw;
    border: .12vw solid #007C3D;
}
.berita_share_detail_box iconify-icon{
    font-size: 1.1vw;
    color: #007C3D;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.contact_container{
    width: 100%;
    position: relative;
    background: url(../images/bg_overlay.png), #ffffff6b;
    background-blend-mode: overlay;
    background-position: center;
    background-size: contain;
}
.contact_page{
    display: grid;
    padding: 4vw 10vw;
    grid-template-columns: 58% 42%;
}
.contact_page_content h1{
    color: #000e18;
    font-size: 3vw;
    font-weight: 600;
    margin-bottom: .8vw;
}
.contact_page_content p{
    font-size: .85vw;
    color: #000e18;
    padding-right: 13vw;
}
.contact_list{
    display: grid;
    grid-template-columns: 7% 93%;
    grid-gap: .6vw;
    align-items: flex-start;
    justify-content: flex-start;
    margin-top: 1.4vw;
}
.contact_list_icon{
    width: 2.8vw;
    height: 2.8vw;
    position: relative;
    border-radius: 100vw;
    background-color: #0CC663;
}
.contact_list_icon iconify-icon{
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    font-size: 1.4vw;
    color: white;
}
.contact_list_text{
    padding-right: 11vw;
}
.contact_list_text h3{
    font-size: .95vw;
    color: #0CC663;
    font-weight: 500;
    margin-bottom: .2vw;
}
.contact_list_text span{
    font-size: .85vw;
    color: #000e18;
}
.divider_contact{
    width: 88%;
    height: .12vw;
    background-color: #000e18;
    margin: 1.8vw 0;
}
.social_media_contact_layout h3{
    color: #000e18;
    font-size: 1.3vw;
}
.social_media_contact{
    margin-top: 1vw;
    display: flex;
    gap: 1.4vw;
}
.social_media_contact_box{
    position: relative;
    width: 2.8vw;
    height: 2.8vw;
    background-color: #0CC663;
    border-radius: 100vw;
    transition: .3s all;
}
.social_media_contact_box iconify-icon{
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    font-size: 1.4vw;
    color: #fff;
}

.contact_page_form{
    background-color: #039F4C1A;
    border-radius: 1.5vw;
    padding: 2.2vw;
}
.contact_page_form h3{
    font-size: 2.1vw;
    color:#0CC663;
    font-weight: 700;
}
.contact_page_form form{
    display: flex;
    flex-direction: column;
    margin-top: 1.4vw;
}
.contact_page_form form input{
    background-color: transparent;
    font-size: 1vw;
    border: none;
    border-bottom: .1vw solid #0CC663;
    margin-bottom: 1.8vw;
    padding-bottom: .6vw;
    outline: none;
    color:#0C3541;
}
.contact_page_form form input::placeholder{
    color: #0c35416b;
}
.contact_page_form form textarea{
    background-color: transparent;
    font-size: 1vw;
    color: #0C3541;
    height: 4vw;
    border: none;
    border-bottom: .1vw solid #0CC663;
    margin-bottom: 1.8vw;
    padding-bottom: .6vw;
    outline: none;
}
.contact_page_form form textarea::placeholder{
    color: #0c35416b;
}
.contact_page_form form p{
    font-size: .85vw;
    color: #000e18;
    margin-bottom: 2vw;
}
.contact_page_form form button{
    outline: none;
    border: none;
    background-color: #0CC663;
    color: white;
    font-size: .9vw;
    padding: .9vw 1.1vw;
    border-radius: 1vw;
    cursor: pointer;
}
.contact_map{
    margin-top: .5vw;
    padding-bottom: 4vw;
}
.contact_map iframe{
    width: 80%;
    margin: auto;
    display: block;
    height: 26vw;
    border-radius: 1.5vw;
}

@media (max-width:768px) {
    .content_layout_about {
        width: 100%;
        padding: 4vw 5vw;
        padding-top: 100vw;
        background-color: #039F4C1A;
        background-image: url(../images/about_bg_content.png);
        background-position: 4vw -11vw;
        background-size: 129vw auto;
        background-repeat: no-repeat;
    }

    .content_layout_sejarah {
        width: 100%;
        padding: 4vw 5vw;
        padding-top: 83vw;
        background-color: #039F4C1A;
        background-image: url(../images/sejarah_bg.png);
        background-position: -17vw -10vw;
        background-size: 110vw auto;
        background-repeat: no-repeat;
    }

    .event_kormi{
        padding-top: 13vw;
        padding-bottom: 4vw;
    }
    .event_layout{
        display: flex;
        flex-direction: column-reverse;
        padding: 0 5vw;
        padding-top: 2vw;
        grid-gap: 4vw;
        align-items: center;
    }

    .eventSlide .swiper-button-next, .eventSlide .swiper-rtl .swiper-button-prev{
        left: auto;
        right: -1vw;
    }
    .eventSlide .swiper-button-prev, .eventSlide .swiper-rtl .swiper-button-next{
        right: auto;
        left: -1vw;
    }
    .eventSlide .swiper-button-next:after, .eventSlide .swiper-button-prev:after{
        font-size: 4vw !important;
    }

    .event_content h1{
        font-size: 4.5vw;
        margin-bottom: 3.5vw;
        border-bottom: .1vw solid #07AF55;
        padding-bottom: 1.6vw;
    }
    .event_content p{
        font-size: 3.5vw;
        margin-bottom: 2.5vw;
    }

    .event_content button{
        font-size: 3.5vw;
        border-radius: 1.5vw;
        padding: 1.4vw 4vw;
        margin-top: 2.5vw;
    }

    .article_home{
        padding: 13vw 5vw;
        border-radius: 8vw 8vw 0 0;
    }

    .article_home_layout{
        grid-template-columns: repeat(1, 1fr);
        grid-gap: 4vw;
        margin-top:6vw;
    }
    .article_home_box{
        padding: 3vw;
        border-radius: 3vw;
    }
    .article_home_image{
        height: 40vw;
        margin-bottom: 2.4vw;
        border-radius: 1.7vw;
    }
    .article_home_content span{
        font-size: 3vw;
    }
    .article_home_content h1{
        font-size: 4.5vw;
        margin-top: .7vw;
        margin-bottom: 1.5vw;
    }
    .article_home_content p{
        font-size: 3.5vw;
        margin-bottom: 5.3vw;
    }

    .cta_home{
        height: max-content;
    }
    .cta_home_layout{
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        align-items: start;
        position: relative;
        z-index: 3;
        left: inherit;
        top: inherit;
        transform: inherit;
        padding: 12vw 5vw;
        padding-bottom: 10.8vw;
    }
    .cta_home_content h1{
        font-size: 4vw;
        margin-bottom:1.5vw;
    }
    .heading_gabung{
        width: 79vw;
        margin-bottom: 2vw;
        margin-left: 0;
    }
    .cta_home_content p{
        font-size: 3.7vw;
    }
    .cta_home_button button{
        padding: 1.7vw 4.5vw;
        font-size: 5vw;
        margin-top: 4vw;
        border-radius: 2vw;
    }

    .section_inorga{
        padding: 13vw 5vw;
        padding-bottom: 10vw;
    }
    .inorgaSlider{
        margin-top: 8vw;
    }
    .inorga_image{
        width: 12vw;
        height: 12vw;
        margin-bottom: 3vw;
    }
    .inorga_box h1{
        font-size: 3.55vw;
        display: none;
    }

    .section_4{
        padding: 11vw 5vw;
        border-radius: 9vw 9vw 0 0;
    }

    .banner{
        height: 213vw;
    }
    .banner_page{
        height: max-content;
        background-image: url(../images/banner_mobile_page.png);
        background-position: top;
        background-size: cover;
        position: relative;
        border-bottom: .8vw solid #08ce649c;
    }
    .bg_banner{
        width: 87.9%;
        position: absolute;
        left: 0;
        top: 0;
        object-fit: cover;
        z-index: 2;
        display: none;
    }
    .banner_page .bg_banner_mobile{
        width: 100% !important;
    }
    .bg_banner_mobile{
        display: block;
        width: 100%;
        position: absolute;
        top: 0;
        left: 0;
        z-index: 5;
    }
    .slide_banner{
        width: 100%;
        position: absolute;
        bottom: 0;
        left: 0;
        display: block;
        margin-top: auto;
        background-color: green;
        z-index: 3;
    }
    .banner_img{
        height: 89.8vw;
    }
    .content_banner{
        position: absolute;
        left: 0;
        top: 35%;
        transform: translateY(-50%);
        z-index: 7;
        width: 100%;
        padding: 0 5vw;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        justify-content: flex-start;
        text-align: start;
    }
    .content_banner h3{
        font-size: 5vw;
        margin-bottom: 2vw;
    }
    .content_banner h1{
        font-size: 10vw;
        line-height: 1;
        width: 100%;
    }
    .kab_heading{
        width: 65%;
        margin-top: 4vw;
        margin-left: 0;
        border-radius: 2.5vw;
    }
    .content_banner button{
        font-size: 3.5vw;
        gap: 1vw;
        border: .2vw solid #0CC663;
        padding: 2.1vw 4vw;
        margin-left: 0;
        margin-top: 5vw;
        cursor: pointer;
        border-radius: 1.4vw;
    }
    .content_banner button iconify-icon{
        font-size: 5.5vw;
        margin-bottom: .11vw;
        transition: .4s all;
    }
    .banner_img_overlay{
        z-index: 3;
        width: 100%;
        height: 100%;
        position: absolute;
        left: 0;
        top: 0;
        background: linear-gradient(180deg, rgba(255, 255, 255, 0.801) 0%, rgba(0, 0, 0, 0) 100%);
    }

    .banner_page .banner_img{
        height: 75vw;
    }
    .banner_page .content_banner {
        top: inherit;
        left: inherit;
        transform: inherit;
        position: relative !important;
        text-align: center;
        align-items: center;
        justify-content: center;
        padding: 8vw 5vw;
        padding-top: 31vw;
    }
    .banner_page .slide_banner{
        display: none;
    }
    .heading_page{
        font-size: 10vw !important;
    }

    .about_home{
        grid-template-columns: repeat(1, 1fr);
        padding: 14.8vw 5vw;
        padding-top: 10vw;
        grid-gap:6vw;
    }
    .about_home_img{
        height: 60vw;
        border-radius: 1.5vw;
        border-left: 1.4vw solid #07AF55;
        border-bottom: 2.4vw solid #07AF55;
    }
    .about_home_content{
        text-align: start !important;
        padding: 0;
        padding-right: 0;
    }
    .heading_home{
        margin-bottom: 3vw;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        text-align: center;
        gap: 2vw;
    }
    .heading_home_left{
        align-items: flex-start;
    }
    .heading_home h1{
        font-size: 7vw;
    }
    .heading_home p{
        font-size: 3.5vw;
    }
    .content_p p{
        font-size: 3.5vw;
        margin-bottom: 3vw;
    }
    .content_p ul{
        margin-bottom: 6.5vw;
    }
    .content_p ul li{
        font-size: 3.5vw;
        gap: 1.3vw;
        margin-bottom: .6vw;
    }
    .btn_primary{
        font-size: 3.5vw;
        padding: 1.9vw 3.7vw;
        border-radius: 1.7vw;
    }

    .heading_banner span{
        font-size: 4.2vw;
        letter-spacing: .6vw;
    }
    .heading_banner h3{
        font-size: 7vw;
    }
    .heading_banner button{
        font-size: 4.3vw;
        border-radius: 1.5vw;
        padding: 1.6vw 3.7vw;
        margin-top: 4.1vw;
    }
    .heading_banner_dekstop{
        width: 130vw;
        margin-top: 1.7vw;
        display: none;
    }
    .heading_banner_mobile{
        display: block;
        width: 86vw;
        margin: 3vw auto;
        margin-bottom: 1vw;
    }

    #tsparticles{
        z-index:11; 
        position:absolute; 
        top:0; 
        left:0;
        opacity: .1;
    }

    .kontak_section{
        padding-top: 1vw;
    }
    .maps_layout{
        height: 76vw;
    }


    .artikel_section_list{
        padding-right: 0;
        gap: 4vw;
    }
    .artikel_section{
        grid-template-columns: 100%;
        padding: 7vw 5vw;
    }
    .artikel_section_box{
        grid-template-columns: 100%;
        padding-bottom: 3vw;
        border-bottom: .12vw solid #07af559c;
    }
    .artikel_section_image{
        height: 35vw;
        border-radius: 1.8vw;
        margin-bottom: 3vw;
    }
    .artikel_section_content h1{
        font-size: 3.8vw;
        line-height: 1.3;
        margin-bottom: 3vw;
    }
    .artikel_section_content span{
        font-size: 3.2vw;
        gap: 1.8vw;
    }
    .artikel_section_sidebar{
        display: none;
    }
    .search_artikel_mobile{
        display: block;
    }
    .search_sidebar{
        background-color: white;
        border: .1vw solid #07AF55;
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 1vw 4vw;
        border-radius: 1.2vw;
        margin-bottom: 4vw;
    }
    .search_sidebar input{
        width: 100%;
        padding: .7vw 0;
        outline: none;
        border: none;
        background-color: transparent;
        font-size: 3.7vw;
    }
    .search_sidebar iconify-icon{
        font-size: 4.8vw;
        color: #0CC663;
    }

    
    .kontak_content{
        grid-template-columns: repeat(1, 1fr);
        grid-gap: 8vw;
        justify-content: center;
        padding: 10vw 13vw;
        position: relative;
    }
    .kontak_content_text img{
        width: 18vw;
        margin-bottom:3.4vw;
    }
    .kontak_content_detail h3{
        font-size: 4.5vw;
        margin-bottom: 1.6vw;
    }
    .kontak_content_detail p{
        font-size: 3.5vw;
    }
    
    .contact_icon_1{
        position: absolute;
        left: -8vw;
        top: -11vw;
        width: 28.4vw;
    }
    .contact_icon_2{
        position: absolute;
        right: -3vw;
        bottom: -7vw;
        width: 20.3vw;
    }

    .video_style{
        border-radius: 4vw 0 4vw 0;
    }
    .galeri_slide_page{
        padding: 10vw 5vw;
        padding-bottom: 4vw;
        height: max-content;
        border-radius: 0 0 8vw 8vw;
    }
    .swiperGaleriPage{
        margin-top: 4.5vw !important;
    }
    .swiperGaleriPage .swiper-wrapper{
        padding-bottom: 11vw;
    }
    .swiperGaleriPage .swiper-pagination-bullet{
        background: #07AF55;
    }
    .blank_bg{
        height: 35vw;
    }
    .galeri_container{
        padding: 10vw 5vw;
    }
    .galeri_layout{
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        margin-top: 5vw;
        grid-gap: 2.5vw;
    }
    .galeri_layout img{
        width: 100%;
    }
    .galeri_layout_box{
        border-radius: 2vw;
        height: 35vw;
    }


    .artikel_detail_heading h1{
        font-size: 4.5vw;
        margin-bottom: 3.8vw;
    }
    .artikel_detail_image {
        width: 100%;
        height: 48vw;
        position: relative;
        overflow: hidden;
        border-radius: 2vw;
        margin-bottom: 4vw;
    }
    .artikel_detail_content p {
        margin-bottom: 3.8vw;
        font-size: 3.3vw;
        color: #626262;
    }
    .artikel_detail_share {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        border-top: .1vw solid #000e18;
        border-bottom: .1vw solid #000e18;
        padding: 4vw 1.8vw;
        margin-top: 6.5vw;
    }
    .artikel_detail_share h3 {
        font-size: 3.2vw;
        color: #000e18;
    }
    .artikel_detail_share_box {
        width: 9.5vw;
        height: 9.5vw;
        position: relative;
        border-radius: 100vw;
        border: .12vw solid #000e18;
    }
    .artikel_detail_share_box iconify-icon {
        font-size: 5.4vw;
        color: #0CC663;
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
    }
    .artikel_detail_share_layout {
        display: flex;
        gap: 2.8vw;
    }


    .contact_page {
        padding: 9vw 5vw;
        grid-template-columns: 100%;
        grid-gap: 7vw;
    }
    .contact_page_content h1 {
        color: #000e18;
        font-size: 5vw;
        font-weight: 600;
        margin-bottom: 2.6vw;
    }
    .contact_page_content p {
        font-size: 3.5vw;
        padding-right: 0;
        color: #626262;
    }
    .contact_list {
        display: grid;
        grid-template-columns: 15% 88%;
        grid-gap: 2.6vw;
        align-items: flex-start;
        justify-content: flex-start;
        margin-top: 6vw;
    }
    .contact_list_icon {
        width: 11.8vw;
        height: 11.8vw;
        position: relative;
        border-radius: 100vw;
        background-color: #0CC663;
    }
    .contact_list_icon iconify-icon {
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        font-size: 6.4vw;
        color: white;
    }
    .contact_list_text h3 {
        font-size: 4vw;
        color: #0CC663;
        font-weight: 500;
        margin-bottom: 1.2vw;
    }
    .contact_list_text span {
        font-size: 3.55vw;
        color: #000e18;
    }
    .divider_contact{
        width: 100%;
        margin: 5.8vw 0;
    }
    .social_media_contact_layout h3 {
        color: #000e18;
        font-size: 5vw;
        font-weight: 600;
    }
    .social_media_contact {
        margin-top: 3vw;
        display: flex;
        gap: 3.4vw;
    }
    .social_media_contact_box iconify-icon {
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        font-size: 6.4vw;
        color: #fff;
    }
    .social_media_contact_box {
        position: relative;
        width: 11.8vw;
        height: 11.8vw;
        background-color: #0CC663;
        border-radius: 100vw;
        transition: .3s all;
    }
    .contact_page_form h3 {
        font-size: 4.1vw;
        color: #0CC663;
        font-weight: 600;
    }
    .contact_page_form {
        background-color: #039F4C1A;
        border-radius: 1.5vw;
        padding: 4.2vw;
    }
    .contact_page_form form input {
        background-color: transparent;
        font-size: 3.5vw;
        border: none;
        border-bottom: .1vw solid #0CC663;
        margin-bottom: 4.8vw;
        padding-bottom: 2.6vw;
        outline: none;
        color: #0C3541;
    }
    .contact_page_form form textarea {
        background-color: transparent;
        font-size: 3.5vw;
        color: #0C3541;
        height: 11vw;
        border: none;
        border-bottom: .1vw solid #0CC663;
        margin-bottom: 4.8vw;
        padding-bottom: 2.6vw;
        outline: none;
    }
    .contact_page_form form {
        display: flex;
        flex-direction: column;
        margin-top: 3.4vw;
    }
    .contact_page_form form p {
        font-size: 3.2vw;
        color: #626262;
        margin-bottom: 4vw;
    }
    .contact_page_form form button {
        outline: none;
        border: none;
        background-color: #0CC663;
        color: white;
        font-size: 3.7vw;
        padding: 1.9vw 1.1vw;
        border-radius: 2vw;
        cursor: pointer;
    }
    .contact_map {
        width: 100%;
        padding: 0 5vw;
        padding-bottom: 4vw;
    }
    .contact_map iframe {
        width: 100%;
        margin: auto;
        display: block;
        height: 46vw;
        border-radius: 1.5vw;
    }

    .berita_image_detail img{
        margin-bottom: 2.6vw;
    }
    .berita_content_detail h2{
        font-size: 4.5vw;
        margin-bottom: 2.8vw;
    }
    .berita_content_detail p{
        font-size: 3.7vw;
        margin-bottom: 2.5vw;
    }
    .berita_detail_layout{
        left: inherit;
        top: 0;
        height: max-content;
        padding: 4vw 0;
        padding-top: 4vw;
        width: 90%;
        margin: auto;
        position: relative;
        border-radius: 5vw;
    }
    .berita_detail_layout::before{
        position: absolute;
        content: '';
        width: 1.4vw;
        height: 7vw;
        background-color: #4E4E4E;
        bottom: 99%;
        left: 9vw;
        border-radius: .5vw;
        z-index: 10;
    }
    .berita_detail_layout::after{
        position: absolute;
        content: '';
        width: 1.4vw;
        height: 7vw;
        background-color: #4E4E4E;
        bottom: 99%;
        right: 9vw;
        border-radius: .5vw;
    }
    .berita_box_detail{
        padding: 2.8vw;
        border-radius: 2.8vw;
    }

    .berita_section{
        width: 100%;
        position: relative;
        background-image: url(../images/section_2_bg.png);
        background-position: top center;
        background-size: cover;
        background-color: linear-gradient(180deg, rgba(0, 164, 76, 0.09) 0%, rgba(0, 164, 76, 0.57) 100%);
        display: grid;
        align-items: flex-end;
        grid-template-columns: 100%;
        grid-gap: 9vw;
        padding: 0 0;
        padding-top: 7.6vw;
        padding-bottom: 6vw;
    }
    .newspapper_1{
        position: absolute;
        right: 0;
        top: -11vw;
        z-index: 10;
        width: 15vw;
    }
    .newspapper_2{
        position: absolute;
        left: 0;
        bottom: 0;
        width: 16vw;
        z-index: 10;
    }
    .berita_bg{
        width: 100%;
    }
    .hanger_berita{
        width: 100%;
        display: none;
    }
    .hanger_berita_detail{
        display: none;
    }
    .hanger_berita_mobile{
        display: block;
        width: 100%;
    }
    .berita_container{
        position: relative;
    }
    .berita_layout{
        position: relative;
        top:inherit;
        left: inherit;
        padding: 0 4vw;
    }
    .berita_box{
        width:100%;
        display: grid;
        grid-template-columns: 100%;
        background-color: white;
        padding: 3vw;
        position: relative;
        margin-top: 4vw;
    }
    .berita_box:first-child{
        margin-top: 5vw;
    }
    .berita_box:first-child:before{
        position: absolute;
        content: '';
        width: 1.4vw;
        height: 7vw;
        background-color: #4E4E4E;
        bottom: 98%;
        left: 9vw;
        border-radius: .5vw;
    }
    .berita_box:first-child:after{
        position: absolute;
        content: '';
        width: 1.4vw;
        height: 7vw;
        background-color: #4E4E4E;
        bottom: 98%;
        right: 9vw;
        border-radius: .5vw;
    }
    .berita_box:before{
        position: absolute;
        content: '';
        width: 1vw;
        height: 6vw;
        background-color: #4E4E4E;
        bottom: 98%;
        left: 9vw;
        border-radius: .5vw;
    }
    .berita_box:after{
        position: absolute;
        content: '';
        width: 1vw;
        height: 6vw;
        background-color: #4E4E4E;
        bottom: 98%;
        right: 9vw;
        border-radius: .5vw;
    }
    .berita_image{
        height: 45vw;
    }
    .berita_content{
        padding: 3vw 0;
    }
    .berita_content h2{
        font-size: 4.5vw;
        margin-bottom: 3.5vw;
    }
    .berita_content span{
        font-size: 3.5vw;
    }
    .pagination_layout{
        margin-top: 5vw;
        padding: .2vw .6vw;
    }
    .pagination_layout button{
        font-size: 4.5vw;
        width: 9vw;
        height: 7.7vw;
    }
    .pagination_layout::before{
        position: absolute;
        content: '';
        width: 1.1vw;
        height: 5.5vw;
        background-color: #4E4E4E;
        bottom: 95%;
        left: 50%;
        transform: translateX(-50%);
        border-radius: .5vw;
    }
    
    .berita_recents_container{
        padding-left: 5vw;
        padding-right: 5vw;
        padding-bottom: 7.5vw;
    }
    .berita_recents{
        padding: 2.8vw;
        gap: 2.8vw;
    }
    .stand_wood{
        position: absolute;
        top: 100%;
        left: 50%;
        transform: translateX(-50%);
        width: 2.5vw;
    }
    .berita_recents_layout{
        padding: 4.7vw;
        width: 100%;
        height: max-content;
    }
    .berita_recents_layout h2{
        font-size: 4.5vw;
        margin-bottom: 3vw;
    }
    .berita_recents_box{
        display: flex;
        flex-direction: column;
        gap: 3.5vw;
    }
    .berita_recents_box_content{
        gap: 1.5vw;
    }
    .berita_recents_box_content iconify-icon{
        font-size: 3.5vw;
    }
    .berita_recents_box_content span{
        font-size: 3.5vw;
    }
    
    .berita_recents_kategori_container{
        padding: 4.7vw;
    }
    .berita_recents_kategori_container h2{
        font-size: 4.5vw;
        margin-bottom: 3vw;
    }
    .berita_recents_kategori{
        gap: 3vw;
    }
    .berita_recents_kategori button{
        font-size: 3.5vw;
        padding: 1.1vw 3.1vw;
    }


    .proker_section{
        padding: 0 5vw;
        padding-bottom: 21vw;
        padding-top: 12vw;
    }
    .proker_container{
        width: 100%;
    }
    .proker_container::-webkit-scrollbar{
        display: none;
    }
    .proker_hanger{
        width: 100%;
        position: absolute;
        top: 17.6vw;
        left: 0;
        height: 1.5vw;
        background-color: #F6F6F6;
    }
    .proker_layout{
        display: grid;
        grid-template-columns: repeat(1, 1fr);
        width: 100%;
        gap: 4.7vw;
    }
    .proker_box{
        width: 100%;
        padding: 3.5vw;
    }
    .jepit_img{
        position: absolute;
        top: -9.5vw;
        left: 7vw;
        z-index: 10;
        width: 3vw;
    }
    .jepit_img_right{
        position: absolute;
        top: -9.5vw;
        right: 7vw;
        z-index: 10;
        width: 3vw;
    }
    .proker_image{
        height: 47vw;
    }
    .proker_content{
        padding-top: 3.5vw;
    }
    .proker_content h1{
        font-size: 4vw;
        margin-bottom: 2.5vw;
    }
    .proker_content span{
        font-size: 3.2vw;
    }
    .proker_bg{
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
    }


    .roll{
        bottom: -11%;
        width: 12vw;
    }
    .gantungan .gantung{
        display: none;
    }
    .gantung-mobile{
        width:102vw;
        display: block;
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
        top: 0;
    }
    .gantungan-btn .gantung{
        z-index: -1 !important;
        margin-top: -5vw;
        display: block;
    }
    .section-4-visi{
        width: 100%;
        padding: 7vw 5vw;
        background-size: cover;
    }
    .layout-section-4-visi{
        width: 100%;
        display: grid;
        margin: auto;
        align-items: flex-start;
        grid-template-columns: repeat(1, 1fr);
        grid-gap: 9vw;
    }
    .box-section-4{
        margin-top: 0;
        position: relative;
    }
    .card-section-4{
        text-align: center;
        padding: 1vw 0;
        height: max-content;
        flex-direction: column;
        z-index: 3;
    }
    .card-section-4-max{
        height: max-content;
        padding-top: 5vw;
        padding-bottom: 5vw;
    }
    .list-section-4 ul{
        list-style: none;
        width: 100;
        text-align: center;
        padding-left: 0;
    }
    .card-section-4 h3{
        font-size: 10vw;
    }
    .price-section-4{
        width: 87%;
        padding: .9vw 0;
        padding-bottom: .9vw;
    }
    .price-section-4 span{
        font-size: 5vw;
        letter-spacing: .1vw;
    }
    .list-section-4{
        margin-top: 3vw;
    }
    .list-section-4 ul{
        width: 100%;
        padding: 0 0;
    }
    .list-section-4 ul li{
        font-size: 3.5vw;
        width: 100%;
        padding: 2vw 0;
        border-bottom: .1vw solid #07AF55;
        text-align: center;
    }
    .list-section-4 p{
        font-size: 3.5vw;
        padding: 0 2vw;
    }
    .btn-section-4{
        margin-top: -3vw;
    }
    .btn-section-4 button{
        border: .4vw solid #FBA417;
        font-size: 6vw;
        padding: 2vw 0;
        box-shadow: .5vw .5vw .9vw 0px rgba(0, 0, 0, 0.25);
    }
    .left_archer{
        width: 30vw;
    }
    .right_archer{
        width: 30vw;
    }

    .bola_inorga{
        position: absolute;
        left: 3.7vw;
        bottom: .2vw;
        width: 16vw;
        display: none;
    }
    .basket_inorga{
        position: absolute;
        right: 4.5vw;
        bottom: 2vw;
        width: 16.5vw;
        display: none;
    }
    .grid-2{
        display: flex;
        flex-direction: column;
    }
    .grid-2-mobile{
        flex-direction: column-reverse;
    }
    .image_about{
        height: 50vw;
    }
    .content_about{
        padding: 0;
        padding-bottom: 0;
        height: max-content;
        padding-right: 0;
    }
    .content_about h1{
        font-size: 7vw;
        margin-bottom: 3vw;
    }
    .content_about p{
        font-size: 3.5vw;
        margin-bottom: 2.6vw;
    }
    .content_about a{
        text-decoration: none;
        color: #cf0a0d;
        font-weight: 700;
    }

    .incoming_event_layout{
        height: 27vw;
        overflow-y: inherit;
    }
    .incoming_event_box{
        margin-bottom: 3vw;
        padding-bottom: 1.7vw;
        gap: 2.7vw;
        flex-direction: column;
    }
    .incoming_event_image{
        width: 100%;
        height: 22vw;
        border: .12vw solid #363636;
    }
    .incoming_event_image img{
        width: 100%;
        height: 100%;
        position: absolute;
        left: 0;
        top: 0;
        object-fit: cover;
        object-position: center;
    }
    .incoming_event_content{
        padding-top: .8vw;
    }
    .incoming_event_content h1{
        font-size: 3.1vw;
        margin-bottom: 1vw;
    }
    .incoming_event_content span{
        font-size: 2.8vw;
    }
    .incoming_event_content p{
        font-size: 2.8vw;
    }
    .outcoming_event_content{
        padding: 2.8vw;
    }
    .outcoming_event_content h1{
        font-size: 3.3vw;
        margin-bottom: .8vw;
    }
    .outcoming_event_content span{
        font-size: 2.8vw;
    }
    .outcoming_event_content p{
        font-size: 2.8vw;
    }
    .outcoming_event_layout{
        height: max-content;
        overflow-y: inherit;
        gap: 3vw;
    }
    .outcoming_event_image{
        height: 48vw;
        border: .3vw solid #363636;
    }
    .outcoming_event h3{
        font-size: 6vw;
        margin-bottom: 1.4vw;
    }
    .heading_incoming_event h3{
        font-size: 6vw;
        margin-bottom: 1.4vw;
    }
    .content_event{
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
        bottom: 28.6vw;
        width: 66%;
        z-index: 3;
        display: grid;
        grid-template-columns: repeat(1, 1fr);
        grid-gap: 5vw;
        height: 99vw;
        overflow-y: scroll;
    }
    .event_home{
        height: 165vw;
        padding-top: 10vw;
    }
    .heading_event img{
        width: 82vw;
    }
    .event_home_bg{
        display: none;
    }
    .event_home_bg_mobile{
        display: block;
        width: 100%;
        left: 0;
        position: absolute;
        bottom: 0;
    }
    .btn_header{
        display: none;
    }
    .btn_header_mobile{
        display: block;
        width: 100%;
    }
    .header{
        display: flex;
        justify-content: space-between;
        padding: 2.5vw 5vw;
        background-size: contain;
    }
    nav{
        position: fixed;
        top: 0;
        left: 0;
        background-color: #0AA24E;
        width: 100%;
        height: 100%;
        z-index: 50;
        transform: translateX(-100%);
        display: flex;
        align-items: flex-start;
        justify-content: flex-start;
        flex-direction: column;
        padding: 4vw 5vw;
        transition: .4s all;
    }
    .active-menuMobilePopup{
        transform: translateX(0);
    }
    .logo{
        text-align: start;
    }
    .logo img{
        width: 19vw;
    }
    .logo_mobile{
        display: block;
    }
    .logo_mobile img{
        width: 20vw;
        filter: brightness(0) invert(1);

    }
    .hamburger{
        display: flex;
        align-items: center;
        justify-content: center;
        outline: none;
        border: none;
        background-color: transparent;
    }
    .hamburger iconify-icon{
        font-size: 10vw;
        color: #00954A;
    }
    nav ul{
        flex-direction: column;
        gap: 5vw;
        padding-bottom: 11vw;
        align-items: flex-start;
        justify-content: flex-start;
        margin-top: 8vw;
        width: 100%;
        /* margin-bottom: 14vw;
        margin-top: 13vw; */
    }
    nav ul li{
        width: 100%;
    }
    nav ul li a{
        font-size: 4.5vw;
        text-transform: capitalize;
        color: white;
        width: 100%;
        display: block;
        border-bottom: .1vw solid white;
        padding-bottom: 2vw;
    }
    .submenu-toggle{
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: .2vw;
    }

    .has-submenu .submenu {
        position: relative;
        top:inherit;
        left: inherit;
        background-color: #007C3D;
        list-style: none;
        padding: 0;
        border-radius: .6vw;
        z-index: 1;
        box-shadow: none;
        -webkit-box-shadow: none;
        -moz-box-shadow: none;
        z-index: 20;
        margin-top: 0;
    }

    .has-submenu .submenu li a {
        white-space: nowrap;
        padding: 3.7vw 2vw;
        border-bottom: .1vw solid white;
        font-size: 4.2vw;
        color: white;
    }
    .has-submenu .submenu li:first-child a{
        padding-top: 3.7vw;
    }
    .has-submenu .submenu li:last-child a{
        border-bottom: 0;
        padding-bottom: 3.7vw;
    }
    nav ul li a:hover{
        color: white;
    }

    .btn_header button{
        font-size: 4.5vw;
        padding: 1.4vw 4vw;
        border-radius: 2vw;
        margin-left: 0;
        width: 90%;
        background-color: #FFE101;
        color: #007C3D;
        position: absolute;
        bottom: 6vw;
        left: 50%;
        transform: translateX(-50%);
        justify-content: center;
        text-transform: uppercase;
    }
    .btn_header_mobile a{
        display: block;
        text-align: center;
        width: 100%;
    }

    .slide_img_banner{
        height: 170vw;
    }
    /* .banner{
        height: 43vw;
        padding-bottom: 12vw;
    } */
    /* .heading_banner h1{
      -webkit-text-stroke-width: .8vw;
      font-size: 9vw;
      letter-spacing: 0vw;
    } */
    .icon_slide_1{
        z-index: 12;
        bottom: -3.3vw;
        width: 18vw;
    }
    .icon_slide_2{
        bottom: -4.4vw;
        z-index: 12;
        width: 17vw;
    }
    .swiper-horizontal>.swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal, .swiper-pagination-custom, .swiper-pagination-fraction{
        bottom: 4vw;
    }
    .swiper-pagination-bullet{
        width: 6vw;
        height: 1.3vw;
        margin: 0 1vw !important;
    }
    .swiper-pagination-bullet-active{
        width: 6vw;
    }
    .close_btn{
        position: absolute;
        right: 6vw;
        top: 7vw;
        outline: none;
        border: .12vw solid white;
        background-color: transparent;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 1.4vw;
        border-radius: 100vw;
    }
    .close_btn iconify-icon{
        color: white;
        font-size: 6vw;
    }

    .section_2{
        height: 60vw;
        padding-bottom: 2.3vw;
    }
    .heading_section_2{
        width: 86vw;
    }
    .stand_section_2{
        border: .07vw solid white;
        padding: 1.7vw 2.5vw;
        padding-bottom: 2vw;
        border-radius: .7vw;
        margin-top: 4vw;
        margin-bottom: 5vw;
    }
    .stand_section_2 span{
        font-size: 2.67vw;
    }
    .section_2 button{
        font-size: 3.8vw;
        padding: 1.8vw 4.1vw;
    }
    .wood_left{
        left: 5vw;
        width: 2.47vw;
    }
    .wood_right{
        right: 5vw;
        width: 2.47vw;
    }
    .divider{
        height: 2vw;
    }
    .section_3{
        grid-template-columns: repeat(1, 1fr);
        align-items: flex-start;
    }

    .section_3_content{
        padding: 6.8vw;
        padding-right: 6.8vw;
        padding-top: 8vw;
    }
    .section_3_content h1{
        font-size: 4.8vw;
        margin-bottom: 2.8vw;
    }
    .section_3_content p{
        font-size: 3.5vw;
        margin-bottom: 3.4vw;
        padding-right: 0;
        text-align: start;
    }
    .section_3_content button{
        font-size: 3.7vw;
        padding: 2.1vw 4vw;
        border-radius:1.1vw;
        margin-top: 6.7vw;
        gap: 1.4vw;
    }

    .galeri_slide{
        height: 68vw;
    }

    .contact_layout{
        display: flex;
        justify-content: center;
        flex-direction: column;
        align-items: center;
        gap: 4.5vw;
        padding: 8vw 0;
        padding-top: 3vw;
    }
    .contact_layout a{
        display: block;
        width: 100%;
    }
    .iframe_wrapper{
        height: 83vw;
    }
    .contact_box{
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 3vw;
        padding: 5.5vw 2vw;
        width: 100%;
        border-radius: 3vw;
    }
    .contact_box img{
        width: 14vw;
    }
    .contact_box span{
        font-size: 4vw;
    }
    .footer{
        padding: 13vw 5vw;
        padding-bottom: 11vw;
        grid-template-columns: 100%;
        grid-gap: 7vw;
    }
    .footer_first{
        display: grid;
        grid-template-columns: repeat(1, 1fr);
        width: 100%;
        grid-gap: 8vw;
    }
    
    .footer_identity img{
        width: 30vw;
        margin-bottom: 3vw;
    }
    .footer_identity p{
        font-size: 3.5vw;
        margin-bottom: 4.8vw;
        padding-right: 4vw;
        width: 100%;
    }

    .social_media_footer{
        gap: 3.5vw;
        margin-top: 5vw;
    }
    .social_media img{
        width: 26vw;
        border: .1vw solid #009E96;
    }
    .social_media_box{
        border: .12vw solid white;
        width: 8.5vw;
        height: 8.5vw;
    }
    .social_media_box iconify-icon{
        font-size: 4vw;
    }

    .menu_footer_box h3{
        font-size: 4.5vw;
        margin-bottom: 5vw;
    }
    .menu_footer_box h3{
        font-size: 3.6vw;
    }
    .divider_list{
        width: 12vw;
        height: .75vw;
        border-radius: 100vw;
        margin: 3.6vw 0;
    }
    .menu_footer{
        display: flex;
        align-items: flex-start;
        justify-content: flex-start;
        gap: 10.4vw;
        margin-right: 2.2vw;
        margin-top: 1.2vw;
     }
    .menu_footer_box ul li{
        font-size: 3.7vw;
        margin-bottom: 3vw;
    }
    .footer_contact p{
        font-size: 3.7vw;
        margin-bottom: 2.3vw;
        text-align: start;
    }

    .footer_second{
        display: flex;
        justify-content: space-between;
        flex-direction: column;
        align-items: center;
        padding: 5.8vw 0;
        margin-top: 6.5vw;
        border-top: .12vw solid #dac2a86c;
        border-bottom: .12vw solid #dac2a86c;
    }
    .footer_second span{
        display: none;
    }
    .footer_second ul{
        gap: .2vw;
        justify-content: space-between;
        width: 100%;
    }
    .footer_second ul li a{
        font-size: 3.2vw;
    }

    .footer_third{
        margin: 6vw 0;
    }
    .footer_third p{
        font-size: 3.4vw;
    }

    .company_data{
        display: flex;
        gap: 4vw;
        flex-direction: column;
    }

    .company_data_box{
        display: flex;
        align-items: flex-start;
        gap: 2vw;
        margin-top: 3vw;
    }
    .company_data_box iconify-icon{
        font-size: 4vw;
    }
    .company_data_box h5{
        font-size: 3.7vw;
        margin-bottom: 1.1vw;
    }
    .company_data_box p{
        font-size: 3.1vw;
    }

    .copyrightMobile{
        display: block;
        text-align: center;
        margin-top: 12vw;
    }

    .copyrightMobile span{
        font-size: 3.7vw;
        color: white;
    }

    .copyright{
        width: 100%;
        padding: 4.6vw 0;
    }
    .copyright span{
        font-size: 3.8vw;
    }

    .struktur_page{
        width: 100%;
        padding: 9vw 0;
        padding-bottom: 0;
        background: linear-gradient(180deg, rgba(0, 164, 77, 0) 0%, #00a44d6e 100%);
        position: relative;
    }
    .heading_struktur h1{
        font-size: 4.5vw;
        margin-bottom: 2vw;
    }
    .heading_struktur span{
        font-size: 2.5vw;
        margin-bottom: .7vw;
    }
    .table_struktur{
        margin-top: 3.5vw;
        padding: 2vw 4vw;
        padding-bottom: 5vw;
    }
    .content_struktur{
        border-radius: 0 0 0 0;
        border:none;
        border-bottom: none;
        overflow: hidden;
        overflow-y: scroll;
        overflow-x: scroll;
        width: 100%;
        padding: 0 6vw;
        margin: auto;
        height: 80vw;
    }
    .content_struktur table{
        width: max-content;
        margin: auto;
        background-color: white;
    }
    .content_struktur table,.content_struktur table tr, .content_struktur table tr td{
        border: .1vw solid #00954A;
        border-collapse: collapse;
    }
    .content_struktur table tr td{
        padding: 1.9vw 2.6vw;
        color: #094019;
        font-weight: 600;
        font-size: 3vw;
        font-family: rubik;
        font-weight: 400;
    }
    .content_struktur table tr td:nth-child(1){
        padding: 1.9vw 1vw;
        text-align: center;
    }
    .content_struktur table tr td:nth-child(3){
        padding: 1.9vw 2.6vw;
        text-align: center;
    }
    .content_struktur table tr td:nth-child(2){
        padding: 1.9vw 2.6vw;
        width: 30%;
    }

    .content_struktur{
        height: max-content;
        display: none;
        grid-template-columns: repeat(1, 1fr);
        grid-gap: 4vw;
    }
    .slideBtnStruktur{
        padding-top: 14vw;
    }
    .tabButton {
        background-color: #0CC663;
        outline: none;
        border: none;
        font-size: 3.1vw;
        color: white;
        border-radius: 2vw;
        padding: 1.5vw 3.6vw;
        cursor: pointer;
        transition: .4s all;
    }
    .slideBtnStruktur .swiper-button-next, .slideBtnStruktur .swiper-button-prev{
        top: 9.6vw !important;
        height: max-content !important;
    }
    .slideBtnStruktur .swiper-button-next, .slideBtnStruktur .swiper-rtl .swiper-button-prev{
        right: 80vw !important;
        height: max-content !important;
    }
    .swiper-button-prev, .swiper-rtl .swiper-button-next {
        left: 5vw;
        right: auto;
    }
    .slideBtnStruktur .swiper-button-next:after, .slideBtnStruktur .swiper-button-prev:after{
        font-size: 3.4vw !important;
    }
    .slideBtnStruktur .swiper-button-next, .slideBtnStruktur .swiper-button-prev{
        padding: 1.8vw 1vw;
    }
    .heading_content_struktur h1 {
        font-family: heading;
        font-size: 7vw;
        color: #0CC663;
        text-transform: uppercase;
    }
    .content_struktur_fix {
        display: flex;
        align-items: center;
        flex-direction: column;
        justify-content: center;
        gap: .6vw;
        text-align: center;
        width: 100%;
    }
    .diamond_box {
        width: 46vw;
        height: 55vw;
        position: relative;
        overflow: hidden;
        border-radius: 6.6vw;
        border: 1vw solid white;
    }
    .organisasi_image_overlay {
        width: 43vw;
        height: 42vw;
        position: absolute;
        top: -3vw;
        right: -5vw;
        border-radius: 5.5vw;
        background: linear-gradient(314.86deg, #00954A -21.35%, #FFFFFF 107.46%);
    }
    .organisasi_image {
        position: relative;
        width: max-content;
        margin-bottom: 2.5vw;
    }
    .heading_content_struktur{
        margin-bottom: 4vw;
    }
    .content_struktur_fix h3 {
        font-size: 4vw;
        font-weight: 600;
    }
    .content_struktur_fix p {
        text-transform: uppercase;
        font-size: 3.5vw;
    }
    .content_struktur_image{
        width: 60vw;
        height: 60vw;
        object-position: top center;
        border: .5vw solid #008F45;
        border-radius: 3vw;
        overflow: hidden;
        position: relative;
        display: block;
        margin: auto;
    }
    .layout_content_struktur_fix{
        gap: 10vw;
        margin-bottom: 4vw;
    }
    .content_struktur_image img{
        object-position: top center;
    }
    .content_struktur_data{
        gap: 4vw;
        height: max-content;
        overflow-y: scroll;
        border-radius: 2vw;
    }
    .content_struktur_box{
        padding: 1.8vw 3vw;
        border-radius: 1.6vw;
        gap: .9vw;
    }
    .content_struktur_box span{
        font-size: 4vw;
    }
    .content_struktur_box h3{
        font-size: 4.8vw;
    }

    .select_tab_layout{
        margin-top: 6vw;
        border: .4vw solid #007C3D;
        width: max-content;
      }
      #tabSelect {
        font-size: 4vw;
        padding: 2.8vw 4.8vw;
        padding-right: 8vw;
        width: 47vw;
      }
      .select_tab_layout iconify-icon{
        font-size: 4.5vw;
        right: 3vw;
      }
}