






/* -------- 인재채용 / 인재상 / recruit1 -------- */


.recruit1-sec1 {
    height: 100vh; 
    overflow-x: hidden;
}

.talent-slide {
    position: sticky;
    top: 0px;
    height: 100vh;
    align-items: center; 
    color: white;
    background-size: cover;
    background-position: center; 
    overflow:hidden;
    display:grid;
    grid-template-columns: 1fr 1fr;
    background:#fff;
}

.talent-slide figure {
    height:100vh;
    overflow: hidden;
    position: relative;
    z-index:3;
}

/* .talent-slide div::after {
    display:block;
    content:"";
    width:80vh;
    height:80vh;
    border-radius:100%;
    background:var(--primary-color);
    opacity:0.2;
    position:absolute;
    left:-100px;
    top:60%;
    transform:translate(-50%,-50%);
    z-index:-1;
} */

.talent-slide figure img {
    width:100%;
    height:100%;
    object-fit: cover;
}

.talent-slide div {
    margin:0 100px 10%; 
    position: relative;  
}

.talent-slide h3 {
    font-size:clamp(32px, 5vw, 66px);
    font-weight:800;
    line-height:1.1;
}

.talent-slide p {
    font-size:22px; 
}


.talent-img2 {
    position:absolute;
    top:0;
    left:0;
    animation: talent-img 8s infinite;
}

@keyframes talent-img {
    0% {
        opacity: 0;
    }
    25% {
        opacity: 0;
    }
    50% {
        opacity: 1;
    }
    75%{
        opacity:1;
    }
    100% {
        opacity: 0;
    }
}




/* -------- 인재채용 / 인재상 / recruit1 -------- */



/* -------- 인재채용 / 인사제도 / recruit2 -------- */

.recruit2-wrap {
    display:flex;
    flex-direction: column;
    gap:150px;
}

.recruit2 .sub-con-flex {
    grid-template-columns: 2fr 5fr;
}

.recruit2 .wrap-title {
    height: fit-content;
    position: sticky;
    top:100px;
}

.recruit2 .sub-con-flex .wrap-title p {
    font-size:30px;
    line-height:1.3;
    padding-top:50px;
}

.recruit2-sec1-con {
    display:flex;
    flex-direction: column;
    gap:50px;
}

.recruit2-sec1-con div figure {
    width:70%;
    position:relative;
    border-radius: 20px;
    overflow: hidden;
}

.recruit2-sec1-con div figure img {
    transition:0.2s;
}

.recruit2-sec1-con div figure:hover img {
    transform: scale(1.05);
    transition:0.2s;
}

.recruit2-sec1-con div p {
    position:absolute;
    bottom:30px;
    left:30px;
    font-size:30px;
    color:#fff;
    font-weight:700;
}

.recruit2-sec1-con>div:nth-child(2) figure {
    margin-left:auto;
}

.recruit2-sec2-wrap h4 {
    font-size:40px;
    font-weight:700;
    margin-bottom:30px;
    margin-top:60px;
}


.recruit2-sec2-wrap>h4:first-child {
    margin-top:0;
}

.recruit2-sec2-box {
    display:grid;
    gap:30px;
    grid-template-columns: 1fr 1fr 1fr;
}

.recruit2-sec2-con {
    border-radius:20px;
    border:2px solid var(--primary-color);
    padding:30px;
    transition:0.1s;
}

.recruit2-sec2-con:hover {
    border:2px solid var(--primary-color2);
    transition:0.1s;
}


.recruit2-sec2-con figure {
    width:30%;
}

.recruit2-sec2-con figure img {
    width:100%;
    height:100%;
    object-fit: cover;
}

.recruit2-sec2-con p {
    font-size:22px;
    font-weight:700;
    margin-top:10px;
}




/* -------- 인재채용 / 인사제도 / recruit2 -------- */



/* -------- 인재채용 / 직무소개 / recruit3 -------- */

.recruit3-wrap {
    display:flex;
    flex-direction: column;
    gap:150px;
}
.recruit3-sec1-wrap {
    display:grid;
    grid-template-columns: 1fr 1fr;
    gap:30px;
}

.recruit3 .wrap-title {
    height: fit-content;
    position: sticky;
    top:100px;
}

.recruit3-sec1-con {
    border-radius:20px;
    border:2px solid var(--primary-color);
    padding:40px;
    display:grid;
    grid-template-columns: 3fr 7fr;
    gap:40px;
    align-items:center;
    transition:0.1s;
}

.recruit3-sec1-con:hover {
    border:2px solid var(--primary-color2);
    transition:0.1s;
}

.recruit3-sec1-con figure {
    width:70%;
    margin:0 auto;
}


.recruit3-sec1-con div {
    display:flex;
    flex-direction: column;
    gap:10px;
}

.recruit3-sec1-con h4 {
    font-size: 30px;
    font-weight:700;
}

.recruit3-sec1-con span {
    font-size: 22px;
    font-weight:500;
    line-height:1.3;
}

.recruit3-sec1-con p {
    font-size: 18px;
    color:#666;
}



/* -------- 인재채용 / 직무소개 / recruit3 -------- */









/* -------- 1600px --------*/
@media screen and (max-width: 1600px) {

    


}




/* -------- 1440px --------*/
@media screen and (max-width: 1440px) {

    /* 인재상 */
    .talent-slide p {
        font-size:20px;
    }
    
    .talent-slide div {
        margin: 0 80px 10%;
    }

    
    /* 직무소개 */

    .recruit3-sec1-con {
        grid-template-columns:1fr;
        gap:30px
    }

    .recruit3-sec1-con figure {
        width:30%;
    }

    .recruit3-sec1-con div {
        text-align: center;
    }

    .recruit3-sec1-con span {
        font-size:20px;
    }

    .recruit3-sec1-con h4 {
        font-size:26px;
    }

    .recruit3-sec1-con p {
        font-size:16px;
    }





    

}


/* -------- 1280px --------*/
@media screen and (max-width: 1280px) {

    /* 인재상 */

    .talent-slide div {
        margin: 0 65px 10%;
    }

    .talent-slide h3 {
        font-size:50px;
    }

    /* 직무소개 */
    .recruit3-sec1-con h4 {
        font-size:22px;
    }

    .recruit3-sec1-con p {
        font-size:16px;
    }







}



/* -------- 1024px --------*/
@media screen and (max-width: 1024px) {

    /* 인재상 */
    
    .talent-slide h3 {
        font-size:46px;
    }

    .talent-slide p {
        font-size:18px;
    }

    .talent-slide {
        display:flex;
        flex-direction: column;
        height:120vh;
    }

    .talent-slide figure {
        height: 50vh;
        width: 100%;
        position:relative;
    }

    .talent-slide3 figure img {
        position:absolute;
        top:0;
        left:0;
        height:unset;
    }

    
    .talent-slide3 figure img:first-child {
        top:-30px;
    }

    .talent-slide div {
        width:100%;
        margin:unset;
        padding:30px 30px 50px; 
        margin-bottom:auto;
    } 


    /* 직무소개 */

    .recruit3 .wrap-title {
        position:static;
    }

    .recruit3-sec1-con {
        padding:30px;
    }
    
    .recruit3-sec1-con span {
        font-size:18px;
    }

    .recruit3-sec1-con h4 {
        font-size:22px;
    }

    .recruit3-sec1-con p {
        font-size:14px;
    }

    .recruit3-wrap {
        gap:80px;
    }





}





/* -------- 768px --------*/
@media screen and (max-width: 768px) {

    /* 인재상 */
    .talent-slide h3 {
        font-size:34px;
    }

    .talent-slide p {
        font-size:16px;
        line-height: 1.5;
    }

    .talent-slide figure {
        height:35vh;
    }

    
    /* 직무소개 */
    .recruit3-sec1-wrap {
        gap:20px
    }

    .recruit3-sec1-con figure {
        width:35%;
    }

    .recruit3-sec1-con span {
        font-size:16px;
    }

    .recruit3-sec1-con h4 {
        font-size:20px;
    }

    .recruit3-sec1-con p {
        font-size:14px;
    }
    
    .recruit3-sec1-con div {
        gap:5px;
    }

    .recruit3-sec1-con {
        padding:20px;
    }





}



/* -------- 600px --------*/
@media screen and (max-width: 600px) {

    /* 직무소개 */
    
    .recruit3-sec1-wrap {
        grid-template-columns: 1fr;
    }

    .recruit3-sec1-con {
        grid-template-columns: 1fr 3fr;
    }

    .recruit3-sec1-con figure {
        width:80%;
    }

    .recruit3-sec1-con div {
        text-align: left;
    }

    .recruit3-sec1-con {
        padding:30px
    }





}




/* -------- 480px --------*/
@media screen and (max-width: 480px) {

    

}


/* -------- 350px --------*/
@media screen and (max-width: 350px) {

    

}



