/* ------------------------------------------------------------- */
/* ------------------- 공통으로 들어가는 부분  ------------------- */
/* ------------------------------------------------------------- */
html{
font-size:16px; scroll-behavior:smooth; height: 100%; margin: 0;
}

body{
position: relative;
height: 100%;
font-weight: bold;
color:#333;
width:100%;
letter-spacing: 0px;
line-height: 1.4;
font-size: 16px;
font-family:'suit';
list-style: none;
}



p, h1, h2, h3, h4, h5, h6{word-break: keep-all;}

.co_in_form_f {margin-top: 10px;}


/* 공통 마지막배너(last_banner) */
.right_con{display: none;}
.left_con{display: flex;align-items: flex-end;}
.call_wrap {margin-top: 0;}
.sec06{height: auto; padding:120px;}
.left_con { width: 100%;  justify-content: space-between; align-items: center;}


/* 로그인 마지막배너 */
.login_banner .right_con{display: block;}
.login_banner  .deposit_con{display: none;}
.login_banner .call_wrap{display: none;}
.login_banner .left_con {width: 55%;}

/* 섹션 별 공통 패딩값 */
.wrap_padding{padding:0 0 200px;}

select {
    -webkit-appearance:none; /* 크롬 화살표 없애기 */
    -moz-appearance:none; /* 파이어폭스 화살표 없애기 */
    appearance:none /* 화살표 없애기 */
}


.sub .header h1 a img { content: url(../img/main/logo.png);}
.sub .nav_wrap .depth01>li > a {color: #111;padding:20px;}

.sub .right_item a {color: #111;padding:20px 0;}


/* ================회사소개 - 회사소개================== */

.company.comp1 .com_info_wrap {width: 100%; display: flex; justify-content: space-between;}
.company.comp1 .com_info_wrap > h3 {width: 50%; display: block; font-size: clamp(24px, 4vw, 55px); font-weight: 800; color: #111;}
.company.comp1 .com_info_wrap > .left_text_box {width: 50%; display: flex; flex-direction: column; gap: 30px;}
.company.comp1 .com_info_wrap > .left_text_box > h4 {display: block; font-size: clamp(28px, 2vw, 35px); font-weight: 700; color: #0E45A4;;} 
.company.comp1 .com_info_wrap > .left_text_box > div {display: flex; flex-direction: column; gap: 20px;}
.company.comp1 .com_info_wrap > .left_text_box > div > p {font-size: clamp(12px, 5vw, 20px); font-weight: 500; color: #333; line-height: 140%;}

.company.comp1 .wrap_padding {position: relative;}
.company.comp1 .wrap_padding::after {content: ''; width: 900px; height: 280px; left: 0; bottom: 80px; display: block; position: absolute; background-image: url(../img/deco_bg.png); background-repeat: no-repeat;}

.company.comp2 .con {display: flex; flex-direction: column; gap: 120px;}
.company.comp2 .com_group_box {width: 100%; display: flex; justify-content: space-between;}
.company.comp2 .com_img_box {width: 45%; position: relative; display: block; border-radius: 20px; overflow: hidden;}
.company.comp2 .com_img_box > img {width: 100%; height: 100%; object-fit: cover; object-position: center; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.company.comp2 .com_text_box {width: 50%; display: flex; flex-direction: column; justify-content: space-between;}
.company.comp2 .comt_text_01 {display: flex; flex-direction: column; gap: 1.5em;padding-bottom:2.0em;}
.company.comp2 .comt_text_01 > div {display: flex; align-items: center; gap: .5em;align-items: baseline;}
.company.comp2 .comt_text_01 > div > h3 {display: block; font-size: 3em; font-weight: bold; color: #111}
.company.comp2 .comt_text_01 > div > small {font-size: 1.1em; color: #0e45a44f;}
.company.comp2 .comt_text_01 > p {display: block; font-size: 1.25em; font-weight: 400; line-height: 150%; word-break: keep-all;}

.company.comp2 .comt_text_02 {padding-top: 2.0em; border-top: 1px solid #ddd;}
.company.comp2 .comt_text_02 > div {display: flex; flex-direction: column; gap: 0.5em;}
.company.comp2 .comt_text_02 > div:last-child {margin-top: 1.5em;}
.company.comp2 .comt_text_02 > div > strong {font-size: 1.25em; font-weight: 700;}
.company.comp2 .comt_text_02 > div > p {font-size: 1.2em; font-weight: 400; color: #333;}


















/* ======= 반응형 시작 ======== */

/* ********************************************* *
* 1600px
* ********************************************* */
@media screen and (max-width: 1600px){




}

/* ********************************************* *
* 1400px
* ********************************************* */
@media screen and (max-width: 1400px){
 

  .company.comp1 .com_info_wrap > h3 {width:40%;}
  .company.comp1 .com_info_wrap > .left_text_box {width:60%;}

}

/* ********************************************* *
* 1330px
* ********************************************* */
@media screen and (max-width: 1330px){


}


/* ********************************************* *
* 1284px
* ********************************************* */
@media screen and (max-width: 1284px){









}


/* ********************************************* *
* 1214px
* ********************************************* */
@media screen and (max-width: 1214px){


    
}


/* ********************************************* *
* 1211px
* ********************************************* */
@media screen and (max-width: 1211px){

    




}

/* ********************************************* *
* 1201px
* ********************************************* */
@media screen and (max-width: 1201px){

[class*='row']:before{display: none;}
[class*='row']::after{display: none;}
.row-wide > [class*='col']{ padding-right: 0; padding-left: 0;}

.row-wide > [class*='col'] { padding-right: 10px; padding-left: 10px;}


}


/* ********************************************* *
* 1140px
* ********************************************* */
@media screen and (max-width: 1139px){


        
}

/* ********************************************* *
* 1120px
* ********************************************* */
@media screen and (max-width: 1120px){



}

/* ********************************************* *
* 1024px
* ********************************************* */
@media screen and (max-width: 1024px){


  .m-title-t {font-size:38px !important;}

  .wrap_padding {padding: 0 0 150px;}
  .wrap_padding.core-value {padding: 0 0 100px;}

  .company.comp1 .com_info_wrap {flex-direction: column;}
  .company.comp1 .com_info_wrap > h3,.company.comp1 .com_info_wrap > .left_text_box {width:100%;}
  .company.comp1 .com_info_wrap > h3 {font-size:38px;margin-bottom:30px;}
  .none {display:none;}
  .company.comp1 .com_info_wrap > .left_text_box > h4 {font-size:26px;}
  .company.comp1 .com_info_wrap > .left_text_box > div > p {font-size:1.25em;}



  .company.comp2 .com_group_box {flex-direction:column;gap:1.5em}
  .company.comp2 .com_img_box {width:100%;height:50vh;}
  .company.comp2 .com_img_box > img {position:unset;transform:unset}
  .company.comp2 .com_text_box {width:100%;}
  .company.comp2 .comt_text_01 > div {align-items: baseline;}
  .company.comp1 .wrap_padding::after {width:100%;background-size:100%;bottom:0;}

  .company.comp2 .no_text {padding-bottom:0;}

  .company.comp2 .comt_text_01 > div > h3 {font-size:38px;}


  .com_tit p {font-size:38px;}
  .job_intro .intro_main {font-size:26px;}
  .job_intro .intro_sub {font-size:1.25em;}
  .interview_con dt p {font-size:1.25em;}
  .job {padding-bottom:150px;}

}


/* ********************************************* *
* 960px
* ********************************************* */
@media screen and (max-width: 960px){








}

/* ********************************************* *
* 875px
* ********************************************* */
@media screen and (max-width: 875px){


  .company_list .com_box {flex-direction: column;}
  .com_tit {width:100%;}



}


@media screen and (max-width: 768px){



}

/* ********************************************* *
* 750px
* ********************************************* */
@media screen and (max-width: 750px){



  .company.comp2 .com_img_box {height:40vh;}




  }


/* ********************************************* *
* 640px
* ********************************************* */
@media screen and (max-width: 640px){



}

/* ********************************************* *
* 580px
* ********************************************* */
@media screen and (max-width: 580px){

  .m-title-t {font-size:30px !important;}
  .m-title-tt {font-size:18px !important}


  .wrap_padding {padding: 0 0 100px ;}

  .company.comp1 .com_info_wrap {flex-direction: column;}
  .company.comp1 .com_info_wrap > h3,.company.comp1 .com_info_wrap > .left_text_box {width:100%;}
  .company.comp1 .com_info_wrap > h3 {font-size:30px;}
  .none {display:none;}
  .company.comp1 .com_info_wrap > .left_text_box > h4 {font-size:20px ;}
  .company.comp1 .com_info_wrap > .left_text_box > div > p {font-size:16px;}



  .company.comp2 .com_img_box {width:100%;height:30vh;}

  .company.comp2 .comt_text_01 > div > h3 {font-size:30px;}
  .company.comp2 .comt_text_01 > p {font-size:16px !important;}
  
  .company.comp2 .comt_text_02 > div > strong,.company.comp2 .comt_text_02 > div > p {font-size:16px;}

  .company.comp2 .con {gap:50px}

  .job {padding-bottom:100px;}
  .company_list .btn_box button {margin-bottom:100px;}
  .job_con .job_info p {font-size:20px;}
  .job_intro .intro_sub {font-size:1em !important;}
  .job_intro .intro_main {font-size:22px;word-break: keep-all;}
  



}

/* ********************************************* *
* 558px
* ********************************************* */
@media screen and (max-width: 558px){





}





/* ********************************************* *
* 500px
* ********************************************* */
@media screen and (max-width: 500px){


}

/* ********************************************* *
* 400px
* ********************************************* */
@media screen and (max-width: 400px){


}


/* ********************************************* *
* 350px
* ********************************************* */
@media screen and (max-width: 350px){



}

/* ********************************************* *
* 300px
* ********************************************* */
@media screen and (max-width: 300px){
  
}
    




