@media (min-width:1025px) and (max-width:1366px) {

    * {
        margin: 0;
        padding: 0;
        font-family: Arial, Helvetica, sans-serif;
    }

    .wrap {
        width: 1300px;
        height: 100vh;
        margin-left: auto;
        margin-right: auto;
        /*border: 5px solid black; */
    }

    #header {
        width: 1300px;
        height: 40px;
        background-image: url('../../main_images/001_001_blank20.jpg');
    }

    #linehead1 {
        width: 1300px;
        height: 5px;
        background: #035;
    }

    #linehead2 {
        width: 1300px;
        height: 3px;
        background: #09c;
    }

    #linehead3 {
        width: 1300px;
        height: 2px;
        background: #999;
    }

/* --- Area Utama Flexbox --- */
.content {
    display: flex;
    flex-direction: row; 
    flex: 1;            /* Membantu mendorong footer ke bawah */
    width: 100%;
    height: 95vh;
    border-left: 1px solid #ccc;
    border-right: 1px solid #ccc;
      /* Memberikan tinggi minimal agar kolom terlihat tinggi */
}


/* ----------|   TEXT  |-------------*/

.teks-resp20 {font-size:12px; line-height:1.0; color:black;}
.teks-resp30 {font-size:24px; color: black;}


/* ----------|   FRONT  |-------------*/

.frontprobox {
    flex: 0 0 calc(75% - 10px); 
        border-right: 1px solid #ccc;
    /*background-color: yellow;*/
}

.box-banner {
    width: 100%;
    height: 30vh;
    /*background-color: orange;*/
}


.wlc {
    width: 80%;
    height: 3.7vh;
    margin-top: 3vh;
    margin-left: 12.5vw;
    /*background-color: yellow;*/
    display: flex;
    justify-content: flex-end;
}

.info {
    width: 95.5%;
    height: 4vh;
    margin-top: 1vh;
    /*background-color: yellow;*/
    border-bottom: 2px solid #ccc;
    margin-left: 1.5vw;
}

.box-4info {
    width: 97%;
    height: 43vh;
    margin-top: 1vh;
    margin-left: 1.5vw;
    /*background-color: orange;*/
    display: flex;
    flex-direction: row; 
    flex: 1;    
}

.box-pix5 {
    width: 24%;
    height: 50vh;
    margin-right:1.1vw;
    background-color: #f9f9f9;
    border: 1px solid #ccc;
    border-bottom: 5px solid black;
}

.header5 {
    width: 100%;
    height: 6vh;
    background-color: #09c;
    color:white;
    display: flex;
    align-items: center;
    justify-content: center;
}

.pix5 {
    width: 100%;
    height: 10.7vw;
    overflow: hidden;
    /*background-color: skyblue;*/
}

.tex5{
    width: 90%;
    height: 15vh;
    margin-top: 0.5vw;
    margin-left: 1vw;
    /*background-color: yellow;*/
}

.tex5a{
    width: 90%;
    height: 3vh;
    margin-top: 0.5vw;
    margin-left: 1vw;
    color: red;
    /*background-color: yellow;*/
}



.sideprobox {
    flex: 0 0 calc(25% - 2px); 
    /*background-color: #eee;*/
}

.advbox5 {
    width:100%;
    height:30vh;
    /*background-color: yellow;*/
}

.ikonbox5 {
        width: 90%;
        height: 13vh;
        margin-top: 2vh;
        margin-left: 2vw;
         /*background: #09c; */
         display: flex;
        flex-direction: row; 
    }

.workikon {
    width: 100%;
    height: 10vh;
    display: flex;
    flex-direction: row; /* Memaksa elemen berbaris ke kanan */
    flex-wrap: wrap;     /* Ikon akan turun jika layar terlalu sempit */
    justify-content: flex-start; /* Membuat barisan ikon berada di tengah */
    padding: 0;
    /*background-color: yellow;*/
}

.workikon li {
    list-style: none;
    margin-right:10px;
}

.workikon li img {
    width: 80px; 
    height: 80px;
    border: 2px solid #ccc;
    border-radius: 15px;
}    

.footsection {
    width: 1300px;
}

.navigasi { height: 19px; background: #035; width: 100%; }
.linebar { height: 3px; background: #09c; width: 100%; }
.copyright {
    background: #222;
    color: grey;
    text-align: center;
    padding: 10px 0;
    font-size: 12px;
}

}