@charset "utf-8";

.company-info{
    padding:110px 0;
}



.company-logo{
    text-align:center;
}


.company-logo img{
    width: 120px;
    /* text-align: center; */
    margin: 0 auto;
}


.company-logo h3{
    margin-top:20px;
    font-size:22px;
}



.company-logo p{
    margin-top:35px;
    font-size:22px;
    line-height:1.6;
    font-weight:600;
}


.company-text{

max-width: 1200px;

margin:60px auto;

color:#555;

/* line-height:1.8; */

font-size: 18px;
}




.history-box{

    height:130px;

    background:#999;

    border-radius:6px;

    display:flex;
    align-items:center;
    justify-content:center;

    color:#fff;

    margin-bottom:70px;

}




.location h3{

    font-size:22px;
    margin-bottom:25px;

}


.map img{

    width:100%;

}



.address{

    display:flex;
    justify-content:space-between;
    align-items:center;

    margin-top:20px;

}



.map-btn a{

    padding:15px 35px;

    border-radius:5px;

    color:#777;

}

/* =================================
   BUSINESS
================================= */


.business-section{

    padding:100px 0;

}



/* 서브페이지 타이틀 */

.sub-content-title{

    text-align:center;

    margin-bottom:90px;

}



.sub-content-title h3{

    font-size:32px;

    font-weight:700;

}



.sub-content-title p{

    margin-top:15px;

    font-size:18px;

    color:#777;

    line-height:1.6;

}



/* 그룹 */

.business-group{

    margin-bottom:80px;

}



.business-group-title{

    display:flex;

    align-items:center;

    gap:15px;

    font-size:26px;

    margin-bottom:45px;

}



.business-group-title::before{

    content:"";

    width:12px;

    height:12px;

    background:#111;

}



.business-group-title::after{

    content:"";

    flex:1;

    height:1px;

    background:#222;

}



/* IT 서비스 리스트 */


.business-list{

    display:grid;

    grid-template-columns:repeat(4,1fr);

}



.business-list li{

    height:220px;

    text-align:center;

    padding:10px 20px;

    border-right:1px solid #ddd;

}



.business-list li:nth-child(4n){

    border-right:0;

}



.business-list .icon{

    height:80px;

    display:flex;

    justify-content:center;

}







.business-list h5{

    margin:25px 0 15px;

    font-size:20px;

}



.business-list p{

    color:#555;

    font-size:15px;

    line-height:1.7;

}





/* 솔루션 */

.solution-list{

    display:grid;

    grid-template-columns:repeat(3,1fr);

}



.solution-list li{

    display:flex;

    align-items:center;

    gap:30px;

    padding:20px 40px;

    border-right:1px solid #ddd;

}



.solution-list li:last-child{

    border-right:0;

}


.solution-list img{

    width:75px;

}


.solution-list h5{

    font-size:18px;

    margin-bottom:12px;

}


.solution-list p{

    color:#555;

    line-height:1.6;

}





@media(max-width:1024px){

    .business-list{

        grid-template-columns:repeat(2,1fr);

    }


    .solution-list{

        grid-template-columns:1fr;

    }

}



@media(max-width:768px){

    .business-list{

        grid-template-columns:1fr;

    }


    .business-list li{

        border-right:0;

    }

}

/* ==========================
   RECRUIT
========================== */


.recruit-section{

    padding:100px 0;

}


.recruit-intro{

    text-align:center;

    margin-bottom:90px;

}


.recruit-intro h3{

    font-size:32px;

    margin-bottom:35px;

}


.recruit-intro p{

    color:#777;

    line-height:1.8;

}




.recruit-box{

    margin-bottom:70px;

}



.recruit-box h4{

    font-size:24px;

    margin-bottom:35px;

}





/* 인재상 */


.talent-list{

    display:grid;

    grid-template-columns:repeat(5,1fr);

}



.talent-list li{

    display:flex;

    align-items:center;

    gap:20px;

    border-right:1px solid #ddd;

    padding:20px;

}


.talent-list img{

    width:55px;

}



.talent-list p{

    font-size:16px;

}






/* 복지 */


.benefit-list{

    display:grid;

    grid-template-columns:repeat(4,1fr);

}



.benefit-list li{

    display:flex;

    gap:20px;

    padding:20px;



}



.benefit-list img{

   width:70px;
    height:70px;

    object-fit:contain;

    flex-shrink:0;

}



.benefit-list strong{

    display:block;

    font-size:17px;

    margin-bottom:8px;

}






/* 절차 */


.process-list{

    display:flex;

    justify-content:space-between;

}



.process-list li{

    text-align:center;

    position:relative;

}



.process-list img{

    width:90px;

    margin:auto;

}



.process-list span{

    display:block;

    margin-top:20px;

}




/* 문의 */


.recruit-contact{

    display:flex;

    justify-content:center;

    align-items:center;

    gap:30px;

    background:#f5f7fb;

    padding:30px;

}



.mail-icon img{

    width:60px;

}



.recruit-contact strong{

    font-size:22px;

}




/* FORM */


.contact-form{

    margin-top:50px;

    border:1px solid #ddd;

    padding:40px;

}



.form-row{

    display:flex;

    margin-bottom:25px;

}



.form-row label{

    width:120px;

    padding-top:15px;

    font-weight:600;

}


.form-row em{

    color:red;

}



.form-row input,
.form-row textarea{

    flex:1;

    border:1px solid #ddd;

    padding:15px;

}



.form-row textarea{

    height:160px;

}



.contact-form button{

    display:block;

    width:210px;

    height:55px;

    margin:40px auto 0;

    background:#071a3a;

    color:#fff;

    border-radius:5px;

    font-size: 18px;

}


/* =================================
   SUPPORT
================================= */


.support-section{

    padding:100px 0;

}




.support-title{

    text-align:center;

    padding-bottom:70px;

    border-bottom:1px solid #ddd;

}



.support-title h3{

    font-size:32px;

    line-height:1.5;

}





/* FORM */


.support-form{

    padding-top:40px;

}



.form-item{

    display:flex;

    margin-bottom:35px;

}



.form-item label{

    width:160px;

    padding-top:18px;

    font-size:18px;

    font-weight:600;

}



.form-item em{

    color:#e60000;

    font-style:normal;

}



.form-item input,
.form-item textarea{

    flex:1;

    border:1px solid #ddd;

    border-radius:8px;

    padding:18px;

    font-size:16px;

}



.form-item textarea{

    height:200px;

    resize:none;

}




.file-box{

    flex:1;

    display:flex;

}



.file-box input{

    border-radius:8px 0 0 8px;

}



.file-box button{

    width:180px;

    border:1px solid #ddd;

    border-left:0;

    border-radius:0 8px 8px 0;

    font-size:16px;

}



.form-item p{

    position:absolute;

    margin-top:65px;

    margin-left:160px;

    color:#777;

    font-size:14px;

}





/* 고객센터 */


.support-info{

    margin-top:80px;

    border:1px solid #ddd;

    border-radius:10px;

    padding:35px;

    display:flex;

}



.support-item{

    width:50%;

    display:flex;

    align-items:center;

    gap:30px;

}



.support-item + .support-item{

    border-left:1px solid #ddd;

    padding-left:60px;

}



.support-item img{

    width:70px;

}



.support-item h4{

    font-size:20px;

    margin-bottom:10px;

}



.support-item p{

    font-size:18px;

    margin-bottom:8px;

}



.support-item span{

    color:#555;

}





/* BUTTON */


.submit-btn{

    display:block;

    width:340px;

    height:60px;

    margin:50px auto 0;

    background:#061936;

    color:#fff;

    border-radius:6px;

    font-size:18px;

}





@media(max-width:768px){


    .support-title h3{

        font-size:22px;

    }



    .form-item{

        display:block;

    }



    .form-item label{

        display:block;

        margin-bottom:15px;

    }



    .support-info{

        display:block;

    }



    .support-item{

        width:100%;

    }



    .support-item + .support-item{

        border-left:0;

        padding-left:0;

        margin-top:30px;

    }



}
/* =================================
   RECRUIT PROCESS
================================= */


.process-list{

    display:flex;

    justify-content:space-between;

    align-items:center;

    width:100%;

}



.process-list li{

    position:relative;

    width:140px;

    text-align:center;

}



.process-list li:not(:last-child)::after{

    content:"→";

    position:absolute;

    top:40px;

    right:-95px;

    font-size:32px;

    color:#222;

    font-weight:300;

}



.process-list img{

    width:100px;

    height:100px;

    object-fit:contain;

    margin:0 auto;

}



.process-list span{

    display:block;

    margin-top:20px;

    font-size:17px;

}

.talent-list li:last-child {
    border-right: none;
}

p.file-info {
    /* position: absolute; */
    /* margin-top: 65px; */
    margin-left: 120px;
    color: #777;
    font-size: 15px;
}
@media (max-width:768px){

    .sub-visual{

        height:220px;

    }

    .visual-title{

        top:58%;

        width:100%;

        padding:0 20px;

    }

    .visual-title span{

        font-size:13px;

        margin-bottom:8px;

        letter-spacing:.08em;

    }

    .visual-title h2{

        font-size:32px;

        line-height:1.2;

    }
    h4.line:after { display:none}
    h4{
    text-align: center;
    font-size: 25px;
}
}

@media (max-width:768px){

    .talent-list,
    .benefit-list{

        display:grid;

        grid-template-columns:1fr;

        gap:20px;

    }

    .talent-list li,
    .benefit-list li{

        display:flex;

        align-items:center;

        gap:20px;

        padding:15px 0;

        border-bottom:1px solid #e5e5e5;

    }

    .talent-list li { border-right:none}

    .talent-list img,
    .benefit-list img{

        width:60px;
        height:60px;
        flex-shrink:0;

    }

}

/* =================================
   SUPPORT MOBILE
================================= */

@media (max-width:768px){

    .support-form{

        width:100%;

    }

    .form-item{

        display:block;

        margin-bottom:25px;

    }

    .form-item label{

        display:block;

        width:100%;

        margin-bottom:10px;

        font-size:17px;

        font-weight:600;

    }

    .form-item input,
    .form-item textarea{

        width:100%;

    }

    .form-item input{

        height:50px;

        padding:0 15px;

        font-size:15px;

    }

    .form-item textarea{

        height:180px;

        padding:15px;

        resize:none;

        font-size:15px;

    }

    /* 파일 */

    .file-box{

        display:flex;

        flex-direction:column;

        gap:10px;

    }

    .file-box input{

        width:100%;

    }

    .file-box button{

        width:100%;

        height:48px;

    }

    .form-item p{

        margin-top:10px;

        font-size:13px;

        color:#777;

        line-height:1.5;

    }

    /* 고객센터 */

    .support-info{

        display:flex;

        flex-direction:column;

        margin:40px 0;

        border:1px solid #ddd;

        border-radius:8px;

        overflow:hidden;

    }

    .support-item{

        width:100%;

        padding:25px 20px;

        border-bottom:1px solid #eee;

        text-align:center;

    }

    .support-item:last-child{

        border-bottom:0;

    }

    .support-item h4{

        margin-bottom:10px;

        font-size:22px;

    }

    .support-item p{

        font-size:28px;

        font-weight:700;

        margin-bottom:10px;

    }

    .support-item span{

        display:block;

        font-size:14px;

        line-height:1.6;

        color:#666;

    }

    /* 버튼 */

    .submit-btn{

        width:100%;

        height:55px;

        font-size:18px;

    }

      .file-box{
        display:flex;
        gap:10px;
    }

    .file-box input{
        flex:1;
    }

    .file-box button{
        width:110px;
        flex:none;
    }
    footer.footer p span {
        display: block;
        font-size: 14px;
     }
  .foot_link  {display: block;}
  p.file-info {margin-left: 0;}

}

table {
    width: 100%;
    border-top: 2px solid #222;
    border-collapse: collapse;
    margin: 20px 0;
}

table th,
table td {
    padding: 14px 16px;
    border-bottom: 1px solid #ddd;
    text-align: left;
    vertical-align: top;
}

table th {
    width: 180px;
    background: #fafafa;
    font-weight: 600;
}

table td {
    background: #fff;
}

.agree {
    border: 1px #ccc solid;
    padding: 10px;
    height: 150px;
    overflow: scroll;
        margin-top: 20px;
    margin-bottom: 10px;
}

.foot_link {color:#02cafc; margin-right: 10px;}