@charset "utf-8";


/*누리웹 모든*/

* {
    margin: 0;
    padding: 0;
}

/*풀페이지 민하이 제안*/
html, body {
  width: 100%;
  height: 100%;
}

body {
  font-family: "Pretendard", "맑은 고딕", "Malgun Gothic", 돋움, Dotum, Arial, "Apple Gothic", sans-serif;
}

a {
    text-decoration: none;
}

img {
    border: 0;
}

li {
    list-style: none;
}



.swiper-button-prev, .swiper-button-next {
  width: 40px !important;
  height: 40px !important;
  top: 30px !important;
}

.swiper-button-prev:after, .swiper-rtl .swiper-button-next:after {
  content: '' !important;
}

.swiper-button-next:after, .swiper-rtl .swiper-button-prev:after {
  content: '' !important;
}

/*회사소개 시작*/

.company_bg {
  margin-top: -66px;
  min-width: 320px;
  background: url(../../../img/company_img/company_gall_img1.png) no-repeat center right;
  background-size: cover;

    /*높이제한 1단계*/
    min-height: 650px;
    height: 100%;
}

.company_wrap {
  margin: 0 auto;
  max-width: 1150px;
  width: auto;
  height: 100%;
  padding: 0 15px 0 15px;

  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}


.company {
  height: 100%;
}

.company_box1 {

    /*높이제한 2단계*/
    min-height: 650px;

display: flex;
display: -webkit-flex; /* NEW */
display:-ms-flexbox;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 100%;

  opacity: 0;
  overflow: hidden;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}


.company_box1_flex {
  width: auto;
}


.company_box1_flex > h1 {
   font-size: 55px;
   font-weight: 900;
   line-height: 80px;  
   color: #fff;
   word-break: keep-all;
   text-align: center;
}

.company_box1_flex > h2 {
  font-size: 50px;
  font-weight: 900; 
  line-height: 80px;
  margin: 0 0 10px 0;
  color: #fff;
  word-break: keep-all;
  text-align: center;
}

.company_box1_flex > h3 {
  font-size: 40px;
  font-weight: 600; 
  line-height: 60px;
  color: #fff;
  word-break: keep-all;
  text-align: center;
}

.now_tit {
  margin: 0 auto;
  width: auto;
  overflow: hidden;
}

.now_tit > h3 {
  width: auto;
  color: #fff;
  word-break: keep-all;
  float: left;
  border: 1px solid #fff;
  border-radius: 10px;
  padding: 2px 10px 2px 10px;
}

.now_tit.now_black > h3 {
  color: #434334;
  border: 1px solid #434343;
}

.now_center {
  margin: 0 auto;
  width: auto;
  overflow: hidden;

  /*float:left 중앙정렬*/
  text-align: center;
}

.now_center > h3 {
    /*float:left 중앙정렬*/
    display: inline-block;
    width: auto;
    
    color: #fff;
    word-break: keep-all;

    border: 1px solid #fff;
    border-radius: 10px;
    padding: 2px 10px 2px 10px;
}


.company_box1 > h4 {
  margin-top: 25px;
  font-size: 31px;
  word-break: keep-all;
  color: #fff;
  word-break: keep-all;
}


@media only screen and (min-width: 0px) and (max-width: 510px) {

  .company_bg {
    background: url(../../../img/company_img/company_gall_img1.png) no-repeat top right;
    background-size: cover;
  }

  .company_box1_flex > h1 {
    font-size: 41px;
    line-height: 60px;
    text-align: center;
 }
 
 .company_box1_flex > h2 {
  font-size: 20px;
  line-height: 35px;
   text-align: center;
 }
 
 .company_box1_flex > h3 {
  font-size: 15px;
  line-height: 30px;
  text-align: center;
}

 .company_box1_flex > h4 {
  font-size: 15px;
  line-height: 24px;
  text-align: center;
}


}

@media only screen and (min-width: 509px) and (max-width: 450px) {

  .company_bg {
    background: url(../../../img/company_img/company_gall_img1.png) no-repeat top right;
    background-size: cover;
  }
  
  .company_box1_flex > h1 {
    font-size: 50px;
    line-height: 80px;
    text-align: center;
 }
 
 .company_box1_flex > h2 {
  font-size: 30px;
  line-height: 45px;
   text-align: center;
 }
 
 .company_box1_flex > h3 {
  font-size: 25px;
  line-height: 50px;
  text-align: center;
}

 .company_box1_flex > h4 {
  font-size: 15px;
  line-height: 24px;
  text-align: center;
}

}


@media only screen and (min-width: 415px) and (max-width: 450px) {
  
  .company_box1 {
    opacity: 0;
    height: 100vh;
  }
  
} 


@media only screen and (min-width: 451px) and (max-width: 776px) {
  .company_box1_flex > h1 {
    font-size: 55px;
    line-height: 80px;
    text-align: center;
 }
 
  .company_box1_flex > h2 {
    font-size: 35px;
    line-height: 55px;
    text-align: center;
  }
  
  .company_box1_flex > h3 {
    font-size: 30px;
    line-height: 45px;
    text-align: center;
  }

  .company_box1_flex > h4 {
    font-size: 20px;
    line-height: 24px;
    text-align: center;
  }
}

@media only screen and (min-width: 777px) and (max-width: 970px) {

  .company_box1 {
    opacity: 0;
    overflow: hidden;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
  }
  
  
  .company_box1 > h1 {
     text-align: center;
  }
  
  .company_box1 > h2 {
    text-align: center;
  }
  
  .company_box1 > h3 {
    text-align: center;
  }

  .company_box1 > h4 {
    text-align: center;
  }
  
}



/*색션2*/

.company2_bg {
  min-width: 320px;
  background: rgb(249,249,249);
  background: -moz-linear-gradient(121deg, rgba(249,249,249,1) 0%, rgba(233,233,233,1) 100%);
  background: -webkit-linear-gradient(121deg, rgba(249,249,249,1) 0%, rgba(233,233,233,1) 100%);
  background: linear-gradient(121deg, rgba(249,249,249,1) 0%, rgba(233,233,233,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#f9f9f9",endColorstr="#e9e9e9",GradientType=1);


  padding: 100px 0 100px 0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;

}

.company2_wrap {
  margin: 0 auto;
  width: auto;
  max-width: 1150px;
  height: auto;

  padding: 0 15px 0 15px;
  overflow: hidden;

    
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;

}

.company_box2 {
  width: calc(50% - 20px);
  margin-right: 20px;
  opacity: 0;
  float: left;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.company_box2 > h1 {
  font-size: 41px;
  font-weight: 900;
  line-height: 66px;  
  color: #434343;
}

.company_box2 > h2 {
  font-size: 31px;
  word-break: keep-all;
  font-weight: 400; 
  line-height: 50px;
  color: #434343;
}

.company_box2 > h3 {
  color: #434343;
}


/*
.company_box2 > h2 > span {
  color: #434343;
  background: rgb(255,255,255);
  background: -moz-linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 50%, rgba(213,213,213,1) 50%, rgba(213,213,213,1) 100%);
  background: -webkit-linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 50%, rgba(213,213,213,1) 50%, rgba(213,213,213,1) 100%);
  background: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 50%, rgba(213,213,213,1) 50%, rgba(213,213,213,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff",endColorstr="#d5d5d5",GradientType=1);
}
*/



.company_box2_2 {
  opacity: 0;
  float: left;

  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}



.works {
  margin: 0 auto;

  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.works_box {
  width: 100%;
  height: auto;
  overflow: hidden;

  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;

}

.works1 {
  height: auto;

  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;

}

.works_square {
  margin-bottom: 0;
  padding: 15px;

  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.works_text > h2 {
  font-size: 31px;
  word-break: keep-all;
  font-weight: bold; 
  line-height: 50px;
  color: #434343;
}


.works_text > ul > li {
  list-style: disc;
  font-size: 20px;
  line-height: 36px;
  color: #434343;
}




.company_box2_3 {
  float: right;
  opacity: 0;
}


@media only screen and (min-width: 0px) and (max-width: 320px) {


  .company2_bg {
     padding: 50px 0 50px 0;
  }

  .company_box2 {
    width: 100%;
    margin-right: 0;
    margin-bottom: 20px;

    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
  }


  .company_box2 > h1 {
    font-size: 31px;
  word-break: keep-all;
    line-height: 60px;

  }
  
  .company_box2 > h2 {
    font-size: 20px;
    line-height: 35px;

    word-break: keep-all;
  }
  
  .company_box2 > h3 {

  }
  
  

  .company_box2_2 {
    margin-top: 15px;
    width: 100%;
  
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
  }
  

}

@media only screen and (min-width: 321px) and (max-width: 970px) {


  .company2_bg {
    padding: 50px 0 50px 0;
 }

  .company_box2 {
    width: 100%;
    margin-right: 0;
    margin-bottom: 20px;

    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
  }



  .company_box2 > h1 {
    font-size: 31px;
  word-break: keep-all;
    line-height: 60px;

  }
  
  .company_box2 > h2 {
    font-size: 20px;
    line-height: 35px;

    word-break: keep-all;
  }
  

  .company_box2_2 {
    margin-top: 15px;
    width: 100%;
  
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
  }
  

  
}






/*색션3*/

.company3_bg {
  min-width: 320px;
  background: rgb(5,89,173);
  background: -moz-linear-gradient(90deg, rgba(5,89,173,1) 0%, rgba(6,164,176,1) 100%);
  background: -webkit-linear-gradient(90deg, rgba(5,89,173,1) 0%, rgba(6,164,176,1) 100%);
  background: linear-gradient(90deg, rgba(5,89,173,1) 0%, rgba(6,164,176,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#0559ad",endColorstr="#06a4b0",GradientType=1);

  padding: 100px 0 100px 0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.company3_wrap {
  margin: 0 auto;
  max-width: 1150px;
  height: auto;

  padding: 0 15px 0 15px;
  overflow: hidden;

    
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;


}


.company_box3 {
  width: calc(50% - 20px);
  margin-right: 20px;
  opacity: 0;
  float: left;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.company_box3 > h1 {
  font-size: 41px;
  font-weight: 900;
  line-height: 66px;  
  color: #fff;
  text-align: left;
}

.company_box3 > h2 {
  font-size: 31px;
  word-break: keep-all;
  font-weight: 400; 
  line-height: 50px;
  color: #fff;
  text-align: left;
}

.company_box3 > h3 {
  color: #434343;
}

/*
.company_box3 > h2 > span {
  color: #fff;
  background: rgb(255,255,255);
  background: -moz-linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 50%, rgba(62,189,255,1) 50%, rgba(62,189,255,1) 100%);
  background: -webkit-linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 50%, rgba(62,189,255,1) 50%, rgba(62,189,255,1) 100%);
  background: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 50%, rgba(62,189,255,1) 50%, rgba(62,189,255,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff",endColorstr="#3ebdff",GradientType=1);
}
*/

.company_box3_2 {
  width: calc(50%);
  opacity: 0;
  float: left;
}



.works_text_white > h2 {
  font-size: 31px;
  word-break: keep-all;
  font-weight: bold; 
  line-height: 50px;
  color: #fff;
  text-align: left;
}


.works_text_white > ul > li {
  list-style: disc;
  font-size: 20px;
  line-height: 36px;
  color: #fff;
  text-align: left;
  list-style-position: inside;
  
}

.works_text_white_center > h2 {
  font-size: 31px;
  word-break: keep-all;
  font-weight: 100; 
  line-height: 50px;
  color: #434343;
  text-align: center;
}


.works_text_white_center > ul > li {
  list-style: disc;
  font-size: 16px;
  line-height: 30px;
  color: #434343;
  text-align: center;
  list-style-position: inside;
}




@media only screen and (min-width: 0px) and (max-width: 320px) {

  .company3_bg {
    padding: 50px 0 50px 0;
  }
  .company_box3 {
    width: 100%;
    margin-right: 0;
    margin-bottom: 20px;

    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
  }
  
  

  .company_box3_2 {
    margin-top: 15px;
    width: 100%;
  }
  
  .company_box3 > h1 {
    font-size: 31px;
  word-break: keep-all;
    line-height: 60px;
 
  }
  
  .company_box3 > h2 {
    font-size: 20px;
    line-height: 35px;

    word-break: keep-all;
  }
  
  .company_box3 > h3 {

  }

}




@media only screen and (min-width: 321px) and (max-width: 970px) {

  .company3_bg {
    padding: 50px 0 50px 0;
  }

  .company_box3 {
    width: 100%;
    margin-right: 0;
    margin-bottom: 20px;

    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
  }


  .company_box3 > h1 {
    font-size: 31px;
  word-break: keep-all;
    line-height: 50px;
 
  }
  
  .company_box3 > h2 {
    font-size: 20px;
    line-height: 35px;

    word-break: keep-all;
  }
  
  
  .company_box3_2 {
    margin-top: 15px;
    width: 100%;
  }


  
}





/*색션4*/

.company4_bg {
  min-width: 320px;
  padding: 100px 0 100px 0;

  background: rgb(94,180,114);
  background: -moz-linear-gradient(90deg, rgba(94,180,114,1) 0%, rgba(133,180,94,1) 100%);
  background: -webkit-linear-gradient(90deg, rgba(94,180,114,1) 0%, rgba(133,180,94,1) 100%);
  background: linear-gradient(90deg, rgba(94,180,114,1) 0%, rgba(133,180,94,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#5eb472",endColorstr="#85b45e",GradientType=1);


  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.company4_wrap {
  margin: 0 auto;
  max-width: 1150px;


  padding: 0 15px 0 15px;
  overflow: hidden;

    
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}


.company_box4 {
  width: calc(50% - 20px);
  margin-right: 20px;
  opacity: 0;
  float: left;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.company_box4 > h1 {
  font-size: 41px;
  font-weight: 900;
  line-height: 66px;  
  color: #fff;
  word-break: keep-all;
  float: left;
  display: block;
}

.company_box4 > h2 {
  font-size: 31px;
  word-break: keep-all;
  font-weight: 400; 
  line-height: 50px;
  color: #fff;
}

.company_box4 > h3 {
  color: #434343;
}

/*
.company_box4 > h1 > span {
  color: #fff;
  background: rgb(255,255,255);
  background: -moz-linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 50%, rgba(129,219,118,1) 50%, rgba(129,219,118,1) 100%);
  background: -webkit-linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 50%, rgba(129,219,118,1) 50%, rgba(129,219,118,1) 100%);
  background: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 50%, rgba(129,219,118,1) 50%, rgba(129,219,118,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff",endColorstr="#81db76",GradientType=1);
}
*/

.company_box4_2 {
  opacity: 0;
  float: left;
}

.company_box4_3 {
  opacity: 0;
  float: right;
}



@media only screen and (min-width: 0px) and (max-width: 320px) {

  .company4_bg {
    padding: 50px 0 50px 0;
  }

  .company_box4 {
    width: 100%;
    margin-right: 0;
    margin-bottom: 20px;

    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
  }
  
  

  .company_box4_2 {
    margin-top: 15px;
    width: 100%;
  }
  
  .company_box4 > h1 {
    font-size: 31px;
  word-break: keep-all;
    line-height: 50px;
  }
  
  .company_box4 > h2 {
    font-size: 20px;
    line-height: 35px;
    word-break: keep-all;
  }



}





@media only screen and (min-width: 321px) and (max-width: 970px) {

  .company4_bg {
    padding: 50px 0 50px 0;
  }


  .company_box4 {
    width: 100%;
    margin-right: 0;
    margin-bottom: 20px;

    float: inherit;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
  }
  
  

  .company_box4_2 {
    margin-top: 15px;
    width: 100%;
  }


  .company_box4 > h1 {
    font-size: 31px;
  word-break: keep-all;
    line-height: 50px;
 
  }
  
  .company_box4 > h2 {
    font-size: 20px;
    line-height: 35px;

    word-break: keep-all;
  }
  
  
  
}





/*색션5*/

.company5_bg {
  min-width: 320px;
  padding: 100px 0 100px 0;

  background: #f9f9f9;


  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.company5_wrap {
  margin: 0 auto;
  max-width: 1150px;


  padding: 0 15px 0 15px;

  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.company5_wrap:after {
  content: '';
  display: table;
  clear: both;
}


.company_box5 {
  opacity: 0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.company_box5_img {
  opacity: 0;
  border-radius: 10px;
}

.company_box5 > h1 {
  font-size: 41px;
  font-weight: 900;
  line-height: 66px;  
  color: #434343;
  word-break: keep-all;
  text-align: center;
}

.company_box5 > h2 {
  font-size: 31px;
  font-weight: 400; 
  line-height: 50px;
  color: #434343;
  text-align: center;
  word-break: keep-all;
}

.company_box5 > h3 {
  color: #434343;
}






@media only screen and (min-width: 0px) and (max-width: 320px) {

  .company5_bg {
    padding: 50px 0 50px 0;
  }

  .company_box5 {
    width: 100%;
    margin-right: 0;
    margin-bottom: 20px;

    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
  }
  
  
  
  .company_box5 > h1 {
    font-size: 31px;
  word-break: keep-all;
    line-height: 50px;
  }
  
  .company_box5 > h2 {
    font-size: 20px;
    line-height: 35px;
    word-break: keep-all;
  }



}





@media only screen and (min-width: 321px) and (max-width: 970px) {

  .company5_bg {
    padding: 50px 0 50px 0;
  }


  .company_box5 {
    width: 100%;
    margin-right: 0;
    margin-bottom: 20px;

    float: inherit;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
  }
  
  


  .company_box5 > h1 {
    font-size: 31px;
  word-break: keep-all;
    line-height: 50px;
 
  }
  
  .company_box5 > h2 {
    font-size: 20px;
    line-height: 35px;

    word-break: keep-all;
  }
  
  
  
}







/*
.company_box5 > h2 > span {
  color: #434343;
  background: rgb(255,255,255);
  background: -moz-linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 50%, rgba(213,213,213,1) 50%, rgba(213,213,213,1) 100%);
  background: -webkit-linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 50%, rgba(213,213,213,1) 50%, rgba(213,213,213,1) 100%);
  background: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 50%, rgba(213,213,213,1) 50%, rgba(213,213,213,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff",endColorstr="#d5d5d5",GradientType=1);
}
*/

.company_box5_2 {
  opacity: 0;
  margin-top: 30px;
}


.company_box5_2::after {
  display: table;
  content: '';
  clear: both;
}


.company_box5_img {
  margin-top: 30px;
  width: 100%;
  height: 400px;
  background: url(../../../img/company_img/img_box1.png) no-repeat center center;
  background-size: cover;
}




.company_works_box:nth-of-type(1) {
  width: calc(50% - 15px);
  margin-right: 15px;
  margin-bottom: 15px;
  height: 350px;
  float: left;
  border: 1px solid #eaeaea;

  letter-spacing: -1px;

  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}


.company_works_box:nth-of-type(2) {
  width: calc(50%);

  margin-bottom: 15px;
  height: 350px;
  float: right;

  letter-spacing: -1px;
  border: 1px solid #eaeaea;

  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}


.tools_content {
  width: 100%;
  height: auto;
}

.tools_content::after {
  content: '';
  display: table;
  clear: both;
}

.tools_content:first-child > .tools_left {
  border-top: 1px solid #eaeaea;

  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.tools_content {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}

.tools_box {
  width: calc(1 / 2*100% - (1 - 1/2)*15px);

  height: auto;
  overflow: hidden;
  background: #fff;
  border: 1px solid #eaeaea;
  border-radius: 10px;
  box-shadow: 0 3px 5px rgba(0, 0, 0, 0.07);

  margin-right: 15px;
  margin-bottom: 15px;



  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}


.tools_box:nth-child(2n) {
  margin-right: 0px;
}

.tools_content > .tools_box:nth-child(1) > .tools_img_box {
  background: rgb(241,241,241);
  background: -moz-linear-gradient(132deg, rgba(241,241,241,1) 0%, rgba(212,216,219,1) 100%);
  background: -webkit-linear-gradient(132deg, rgba(241,241,241,1) 0%, rgba(212,216,219,1) 100%);
  background: linear-gradient(132deg, rgba(241,241,241,1) 0%, rgba(212,216,219,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#f1f1f1",endColorstr="#d4d8db",GradientType=1);
}

.tools_content > .tools_box:nth-child(2) > .tools_img_box {
  background: rgb(241,241,241);
  background: -moz-linear-gradient(132deg, rgba(241,241,241,1) 0%, rgba(212,216,219,1) 100%);
  background: -webkit-linear-gradient(132deg, rgba(241,241,241,1) 0%, rgba(212,216,219,1) 100%);
  background: linear-gradient(132deg, rgba(241,241,241,1) 0%, rgba(212,216,219,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#f1f1f1",endColorstr="#d4d8db",GradientType=1);
}


.tools_content > .tools_box:nth-child(3) > .tools_img_box {
  background: rgb(241,241,241);
  background: -moz-linear-gradient(132deg, rgba(241,241,241,1) 0%, rgba(212,216,219,1) 100%);
  background: -webkit-linear-gradient(132deg, rgba(241,241,241,1) 0%, rgba(212,216,219,1) 100%);
  background: linear-gradient(132deg, rgba(241,241,241,1) 0%, rgba(212,216,219,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#f1f1f1",endColorstr="#d4d8db",GradientType=1);
}


.tools_content > .tools_box:nth-child(4) > .tools_img_box {
  background: rgb(241,241,241);
  background: -moz-linear-gradient(132deg, rgba(241,241,241,1) 0%, rgba(212,216,219,1) 100%);
  background: -webkit-linear-gradient(132deg, rgba(241,241,241,1) 0%, rgba(212,216,219,1) 100%);
  background: linear-gradient(132deg, rgba(241,241,241,1) 0%, rgba(212,216,219,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#f1f1f1",endColorstr="#d4d8db",GradientType=1);
}

.tools_img {
  width: 100%;
  height: 150px;
  padding: 15px;

  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}


.tools_img1 {
  background: url(../../../img/company_img/icon1.png) no-repeat center center;
}


.tools_img2 {
  background: url(../../../img/company_img/icon2.png) no-repeat center center;
}

.tools_img3 {
  background: url(../../../img/company_img/icon3.png) no-repeat center center;
}

.tools_img4 {
  background: url(../../../img/company_img/icon4.png) no-repeat center center;
}


.tools_text {
  width: 100%;
  padding: 15px 25px 15px 25px;

  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.tools_text > h2 {
    font-size: 21px;
  word-break: keep-all;
    font-weight: 400;
    line-height: 50px;
    color: #434343;
    text-align: left;
}

.tools_text > ul > li {
  list-style: disc;
  font-size: 14px;
  line-height: 26px;
  color: #434343;
  text-align: left;
  list-style-position: inside;
}



@media only screen and (min-width: 721px) and (max-width: 970px) {

  .tools_img {
    margin: 0 auto;
    width: 100px;
    height: 100px;
    float: inherit;
    border-right: none;
  }

  .tools_img1 {
    background: url(../../../img/company_img/icon1.png) no-repeat center center;
  }
  
  
  .tools_img2 {
    background: url(../../../img/company_img/icon2.png) no-repeat center center;
  }
  
  .tools_img3 {
    background: url(../../../img/company_img/icon3.png) no-repeat center center;
  }
  
  .tools_img4 {
    background: url(../../../img/company_img/icon4.png) no-repeat center center;
  }
  


  .tools_text {
    width: 100%;
    height: auto;
    float: inherit;
    margin-left: 0;
  }

  .tools_text > h2 {
    text-align: center;
  }


  .tools_text > ul > li {
    text-align: center;

  }

}






@media only screen and (min-width: 0px) and (max-width: 720px) {



  .tools_box {
    width: 100%;
    margin-right: 0px;
  }
  


  .tools_img {
    margin: 0 auto;
    width: 100px;
    height: 100px;
    float: inherit;
    border-right: none;
  }

  .tools_img1 {
    background: url(../../../img/company_img/icon1.png) no-repeat center center;
  }
  
  
  .tools_img2 {
    background: url(../../../img/company_img/icon2.png) no-repeat center center;
  }
  
  .tools_img3 {
    background: url(../../../img/company_img/icon3.png) no-repeat center center;
  }
  
  .tools_img4 {
    background: url(../../../img/company_img/icon4.png) no-repeat center center;
  }
  


  .tools_text {
    width: 100%;
    height: auto;
    float: inherit;
    margin-left: 0;
  }

  .tools_text > h2 {
    text-align: center;
  }


  .tools_text > ul > li {
    text-align: center;

  }

}



/*색션6*/

.history_bg {
  min-width: 320px;
  background: #1BA3B2;
  padding: 100px 0 100px 0;

  overflow: hidden !important;

  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.history_wrap {
  margin: 0 auto;
  max-width: 1150px;
  height: auto;

  padding: 0 15px 0 15px;

  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}


.history_scroll_box {
  position: relative;
}



.company_box6 {
  opacity: 0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.company_box6 > h1 {
  font-size: 41px;
  font-weight: 900;
  line-height: 66px;  
  color: #fff;
  word-break: keep-all;
}

.company_box6 > h2 {
  font-size: 31px;
  word-break: keep-all;
  font-weight: 400; 
  line-height: 50px;
  color: #fff;
}

.company_box6 > h3 {
  color: #fff;
}


.history {
  opacity: 0;
  overflow: hidden;
  margin-top: 50px;
  margin-bottom: 25px;

  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}


.history_text > h1{
  font-size: 31px;
  word-break: keep-all;
  font-weight: 900;
  line-height: 50px;
  color: #fff;
}


.history_text > h1::before{
  content: ' ';
  width: 10px;
  height: 10px;
  background: #fff;
  border-radius: 50%;
  display: block;
  margin-top: -14px;
}


.history_item {
  background: url(../../../img/company_img/history_line.png) repeat-x;

}


.history_text {
  padding-top: 30px;

  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.history_text > ul {
  margin-right: 20px;
}

.history_text > ul > li{
  font-size: 14px;
  line-height: 26px;
  color: #fff;
  list-style: disc !important;

  list-style-position: outside;
  word-break: keep-all;

  padding-left: 5px;
  margin-left: 20px;
}


.swiper-container {
  margin: 0 auto;
  max-width: 1150px;
  overflow: visible !important;
}




.swiper-button-prev, .swiper-button-next {
  top: 30px !important;
}

.swiper-button-next, .swiper-container-rtl .swiper-button-prev {
  background: url(../../../img/main_img/next_white.svg) no-repeat rgba(255, 255, 255, 0.3) center center !important;
  right: 0 !important;
  border-radius: 8px;
}

.swiper-button-prev, .swiper-container-rtl .swiper-button-next {
  background: url(../../../img/main_img/prev_white.svg)  no-repeat rgba(255, 255, 255, 0.3) center center !important;
  left: 0 !important;
  border-radius: 8px;
}

@media only screen and (min-width: 0px) and (max-width: 320px) {

  .history_bg {
    padding: 50px 0 50px 0;
  }

  .company_box6 {
    width: 100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
  }
  
  .company_box6 > h1 {
    font-size: 31px;
  word-break: keep-all;
    line-height: 60px;
  }
  
  .company_box6 > h2 {
    font-size: 20px;
    line-height: 35px;
    word-break: keep-all;
  }
  

}



@media only screen and (min-width: 321px) and (max-width: 970px) {


  .history_bg {
    padding: 50px 0 50px 0;
  }

  .company_box6 {
    width: 100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
  }

  
  .company_box6 > h1 {
    font-size: 31px;
  word-break: keep-all;
    line-height: 50px;
 
  }
  
  .company_box6 > h2 {
    font-size: 20px;
    line-height: 35px;

    word-break: keep-all;
  }
  

  
}




/*색션 7*/

.company7_bg {
   min-width: 320px;
   background: #f9f9f9;
   padding: 100px 0 100px 0;

   -webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
   box-sizing: border-box;
}

.company7_wrap {
  margin: 0 auto;
  max-width: 1150px;

  padding: 0 15px 0 15px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  

  display: flex;
  flex-direction: column;

}


.company_box7 {
  width: calc(100%);
  opacity: 0;
  float:left;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.company_box7 > h1 {
  font-size: 41px;
  font-weight: 900;
  line-height: 66px;  
  color: #434343;
  word-break: keep-all;
}

.company_box7 > h2 {
  font-size: 31px;
  word-break: keep-all;
  font-weight: 400; 
  line-height: 50px;
  color: #434343;
}

.company_box7 > h3 {
  color: #434343;
}


@media only screen and (min-width: 0px) and (max-width: 320px) {

  .company7_bg {
    padding: 50px 0 50px 0;
  }

  .company_box5 {
    width: 100%;
    margin-right: 0;
    margin-bottom: 20px;

    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
  }
  
  
  
  .company_box7 > h1 {
    font-size: 31px;
  word-break: keep-all;
    line-height: 50px;
  }
  
  .company_box7 > h2 {
    font-size: 20px;
    line-height: 35px;
    word-break: keep-all;
  }



}





@media only screen and (min-width: 321px) and (max-width: 970px) {

  .company7_bg {
    padding: 50px 0 50px 0;
  }


  .company_box7 {
    width: 100%;
    margin-right: 0;
    margin-bottom: 20px;

    float: inherit;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
  }
  
  


  .company_box7> h1 {
    font-size: 31px;
  word-break: keep-all;
    line-height: 50px;
 
  }
  
  .company_box7 > h2 {
    font-size: 20px;
    line-height: 35px;

    word-break: keep-all;
  }
  
  
  
}



.company_box7_2 {
  margin-top: 30px;
  width: 100%;
  opacity: 0;
}



.company_cert_now {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}



.cert_item {
  width: calc(1/2*100% - (1 - 1/2)*20px);
  height: auto;
  margin-right: 20px;
  margin-bottom: 20px;

  background: #ffffff;
  box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.1);
  padding: 15px;
  border-radius: 10px;

  display: flex;
  flex-direction: row;
}

.cert_item:nth-child(2n) {
  margin-right: 0px;
}



@media only screen and (min-width: 0px) and (max-width: 780px) {
  .cert_item {
    width: calc(100%);
    height: auto;
    margin-right: 0px;
    margin-bottom: 20px;
  
    background: #ffffff;
    box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.1);
    padding: 15px;
    border-radius: 10px;
  
    display: flex;
    flex-direction: row;
  }
  
  .cert_item:nth-child(2n) {
    margin-right: 0px;
  }
  
  .cert_item:nth-child(n + 11) {
    margin-bottom: 15px;
  }

  .cert_item:last-child {
    margin-bottom: 0px;
  }
}


.cert_icon {
  width: 40px;
  height: 40px;
  background: url(../../../img/company_img/cert_icon.svg) no-repeat center center;
  background-size: 30px 30px;
  flex-shrink: 0;
  margin-right: 15px;
}

.cert_text {
  flex-grow: 1;
}

.cert_date {
  font-size: 15px;
  font-weight: 700;
  color: #434343;
  padding-bottom: 15px;
  margin-bottom: 15px;
  border-bottom: 1px solid #eaeaea;
  word-break: keep-all;
}

.cert_name {
  font-size: 18px;
  font-weight: 700;
  color: #434343;
  word-break: keep-all;
}

.cert_number {
  font-size: 14px;
  font-weight: 700;
  color: #434343;
  word-break: keep-all;  
  margin-bottom: 10px;
}

@media only screen and (min-width: 0px) and (max-width: 320px) {
  
  .works_text > h2 {
    font-size: 20px;
    line-height: 35px;

    word-break: keep-all;
  }
  
  
  .works_text > ul > li {
    font-size: 14px;
    line-height: 30px;
    padding-left: 5px;
  }



  .works_text_white > h2 {
    font-size: 20px;
    line-height: 35px;

    word-break: keep-all;
  }
  
  
  .works_text_white > ul > li {
    font-size: 14px;
    line-height: 30px;
    padding-left: 5px;
  }
  



  .works_text_white_center > h2 {
    font-size: 20px;
    line-height: 35px;
    word-break: keep-all;
  }
  
  
  .works_text_white_center > ul > li {
    padding-left: 5px;
  }

  
}



@media only screen and (min-width: 321px) and (max-width: 970px) {
  

  .works_text > ul > li {
    font-size: 16px;
    line-height: 35px;
    padding-left: 5px;
  }



  
  .works_text_white > ul > li {
    font-size: 16px;
    line-height: 35px;
    padding-left: 5px;
  }



  
  .works_text_white_center > ul > li {
    padding-left: 5px;
  }
  

  
}





/*색션 채용*/


.recruit_bg {
  min-width: 320px;
  padding: 100px 0 50px 0;

  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;

  background: #203C96;
  background: -webkit-linear-gradient(180deg, rgba(32, 60, 150, 1) 0%, rgba(71, 102, 204, 1) 100%);
  background: -moz-linear-gradient(180deg, rgba(32, 60, 150, 1) 0%, rgba(71, 102, 204, 1) 100%);
  background: linear-gradient(180deg, rgba(32, 60, 150, 1) 0%, rgba(71, 102, 204, 1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#203C96", endColorstr="#4766CC", GradientType=0);

  position: relative;
  overflow: hidden;


}

.recruit_wrap {
 margin: 0 auto;
 max-width: 1150px;

 padding: 0 15px 0 15px;
 -webkit-box-sizing: border-box;
 -moz-box-sizing: border-box;
 box-sizing: border-box;
 z-index: 2;
 position: relative;
 opacity: 0;
}


.recruit_box {
  display: flex;
  flex-direction: row;
  padding: 100px 0px 50px 0px;
}

.recruit_item {
  position: relative;
  width: calc(1/2*100% - (1 - 1/2)*30px);
  margin-right: 30px;
}

.recruit_item:last-child {
  margin-right: 0px;
}


.recruit_item_text {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;

}

.recruit_item_text > h3 {
  display: block;
  font-size: 35px;
  font-weight: 900;
  line-height: 50px;
  margin-bottom: 8px;
  color: #ffffff;

  word-break: keep-all;
  text-shadow: 0px 0px 10px rgba(0, 0, 0, 0.3);
}

.recruit_item_text > h4 {
  display: block;
  font-size: 30px;
  font-weight: 700;
  line-height: 45px;
  margin-bottom: 8px;
  color: #ffffff;
  word-break: keep-all;
  text-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
}

.recruit_item_text > h5 {
  display: block;
  font-size: 20px;
  font-weight: normal;
  line-height: 30px;
  color: #ffffff;
  word-break: keep-all;
  text-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
}

.round_font {
  display: flex;


  margin-bottom: 15px;

}

.round_font > p {
  font-size: 15px;
  font-weight: 500;
  color: #ffffff;
  margin: 0 auto;

  background: rgba(249,249,249,0.3);
  padding: 8px 20px 8px 20px;
  border-radius: 30px;


  display: flex;


  justify-self: center;
  align-items: center;
}

.small_font {
  display: block;
  font-size: 15px;
  line-height: 26px;
  font-weight: normal;
  color: #ffffff;
  margin: auto;
  margin-bottom: 15px;
  margin-top: 15px;
  word-break: keep-all;
  max-width: 400px;
  text-align: center;

}

.recruit_item_text > .small_font > a {
  color: #ffffff;
  text-decoration: underline;
}


#bokehCanvas {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  z-index: 1;

  height: 100%;
}


.recruit_link_box {
  display: flex;
  flex-direction: row;
  justify-content: center;

}

.recruit_item_link {
  padding: 13px;
  background: #ffffff;
  box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.1);
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-right: 15px;

  font-size: 15px;
  font-weight: 700;
  color: #434343;
  transition: all 0.1s ease-in;
}

.recruit_item_link:hover {
  transform: scale(1.05);
}

.recruit_item_link:last-child {
  margin-right: 0px;
}

.recuruit_link_icon {
  width: 100px;
  height: 30px;
  margin-bottom: 8px;
}

.recuruit_link_icon_saramin {
  background: url(../../../img/company_img/recruit_saramin.svg) no-repeat center center;
  background-size: 100px 30px;
}

.recuruit_link_icon_jobkorea {
  background: url(../../../img/company_img/recruit_jobkorea.svg) no-repeat center center;
  background-size: 100px 30px;
}


@media only screen and (min-width: 0px) and (max-width: 559px) {
  .recruit_box {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 50px 0px 50px 0px;
  }


  .recruit_item {
    max-width: 500px;
    width: calc(100%);
    margin-right: 0px;
  }
  
  .recruit_item_text > h3 {
    text-align: center;
    font-size: 22px;
    font-weight: 900;
    line-height: 35px;
  }
  
  .recruit_item_text > h4 {
    text-align: center;
    font-size: 18px;
    font-weight: 700;
    line-height: 25px;
  }
  
  .recruit_item_text > h5 {
    text-align: center;
    font-size: 13px;
    font-weight: normal;
    line-height: 20px;
    margin-bottom: 30px;
  }

  .recruit_link_box {
    display: flex;
    flex-direction: column;
    justify-content: center;
    max-width: 300px;
    margin: auto;
  }

  .recruit_item_link {
    margin-right: 0px;
    margin-bottom: 10px;
  }

  .recruit_item_link:last-child {
    margin-bottom: 0px;
  }
}

@media only screen and (min-width: 560px) and (max-width: 1045px) {

  .recruit_box {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 50px 0px 50px 0px;
  }


  .recruit_item {
    max-width: 500px;
    width: calc(100%);
    margin-right: 0px;
    justify-content: center;
  }
  

  .recruit_item_text > h3 {
    text-align: center;
  }
  
  .recruit_item_text > h4 {
    text-align: center;
  }
  
  .recruit_item_text > h5 {
    text-align: center;
    margin-bottom: 50px;
  }

  .recruit_link_box {
    display: flex;
    flex-direction: column;
    justify-content: center;
    max-width: 300px;
    margin: auto;
  }

  .recruit_item_link {
    margin-right: 0px;
    margin-bottom: 10px;
  }
}




.recruit_wrap2 {
  margin: 0 auto;
  max-width: 1150px;
 
  padding: 0 15px 0 15px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  z-index: 2;
  position: relative;

 }
 

.recruit_box2 {
  padding: 25px;
  background: rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(10px) contrast(100%);
  -webkit-backdrop-filter: blur(10px) contrast(100%);
  box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.1);
  border-radius: 15px;
}


.recruit_item2 > h3 {
  font-size: 20px;
  font-weight: 900;
  line-height: 30px;
  color: #ffffff;
  text-align: center;
  margin-bottom: 25px;
}


.recruit_item2 > ul {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}

.recruit_item2 > ul > li {
  width: calc(1/4*100% - (1 - 1/4)*15px);
  margin-right: 15px;
  margin-bottom: 15px;
  border-radius: 10px;
  padding: 15px;
  font-size: 16px;
  line-height: 27px;
  font-weight: 700;
  background: #ffffff;
  border: 1px solid #eaeaea;
  box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.2);
  text-align: center;
  word-break: keep-all;

  display: flex;
  flex-direction: column;
  align-items: center;

  overflow: hidden;
}

.recruit_item2 > ul > li:nth-child(4n) {
  margin-right: 0px;
}

.recruit_item2 > ul > li:nth-child(n + 5) {
  margin-bottom: 0px;
}


.recruit_item2_img {
  width: 200px;
  height: 200px;
  background: #eaeaea;
  margin-bottom: 15px;
}

.recruit_item2_img1 {
  background: url(../../../img/company_img/recruit_item2_icon1.png) no-repeat center center;
  background-size: cover;
}

.recruit_item2_img2 {
  background: url(../../../img/company_img/recruit_item2_icon2.png) no-repeat center center;
  background-size: cover;
}

.recruit_item2_img3 {
  background: url(../../../img/company_img/recruit_item2_icon3.png) no-repeat center center;
  background-size: cover;
}

.recruit_item2_img4 {
  background: url(../../../img/company_img/recruit_item2_icon4.png) no-repeat center center;
  background-size: cover;
}

.recruit_item2_img5 {
  background: url(../../../img/company_img/recruit_item2_icon5.png) no-repeat center center;
  background-size: cover;
}

.recruit_item2_img6 {
  background: url(../../../img/company_img/recruit_item2_icon6.png) no-repeat center center;
  background-size: cover;
}

.recruit_item2_img7 {
  background: url(../../../img/company_img/recruit_item2_icon7.png) no-repeat center center;
  background-size: cover;
}

.recruit_item2_img8 {
  background: url(../../../img/company_img/recruit_item2_icon8.png) no-repeat center center;
  background-size: cover;
}


@media only screen and (min-width: 0px) and (max-width: 580px) {
  .recruit_item2 > ul > li {
    width: calc(100%);
    margin-right: 0px;
    margin-bottom: 15px;
    border-radius: 10px;
  }

  .recruit_item2 > ul > li:nth-child(n + 5) {
    margin-bottom: 15px;
  }

  .recruit_item2 > ul > li:last-child {
    margin-bottom: 0px;
  }
  
}


@media only screen and (min-width: 581px) and (max-width: 850px) {
  .recruit_item2 > ul > li {
    width: calc(1/2*100% - (1 - 1/2)*15px);
    margin-right: 15px;
    margin-bottom: 15px;
    border-radius: 10px;
  }

  .recruit_item2 > ul > li:nth-child(2n) {
    margin-right: 0px;
  }

  .recruit_item2 > ul > li:nth-child(4n) {
    margin-right: 0px;
  }

  .recruit_item2 > ul > li:nth-child(n + 5) {
    margin-bottom: 15px;
  }
  
  
}


@media only screen and (min-width: 851px) and (max-width: 1015px) {
  .recruit_item2 > ul > li {
    width: calc(1/3*100% - (1 - 1/3)*15px);
    margin-right: 15px;
    margin-bottom: 15px;
    border-radius: 10px;
  }

  .recruit_item2 > ul > li:nth-child(3n) {
    margin-right: 0px;
  }

  .recruit_item2 > ul > li:nth-child(4n) {
    margin-right: 15px;
  }

  .recruit_item2 > ul > li:nth-child(n + 5) {
    margin-bottom: 15px;
  }
  
  .recruit_item2 > ul > li:nth-child(n + 7) {
    margin-bottom: 0px;
  }
  
}



/*채용색션3*/

.recruit_wrap3 {
  margin: 0 auto;
  max-width: 1150px;
 
  padding: 0 15px 0 15px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  z-index: 2;
  position: relative;
  margin-top: 40px;
 }
 

.recruit_box3 {
  padding: 25px;
  background: rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(10px) contrast(100%);
  -webkit-backdrop-filter: blur(10px) contrast(100%);
  box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.1);
  border-radius: 15px;
}


.recruit_item_video > iframe {
  width: 100%;
  height: 600px;
}



/*색션 레퍼런스*/

.reference_bg {
  min-width: 320px;
  padding: 100px 0 100px 0;

  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}



.reference_wrap {
  margin: 0 auto;
  max-width: 1150px;
  height: auto;

  padding: 0 15px 0 15px;

  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}




.reference_all_box > h1 {
  font-size: 41px;
  font-weight: 900;
  line-height: 66px;  
  color: #434343;
  word-break: keep-all;

  display: block;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.reference_all_box > h2 {
  font-size: 31px;
  font-weight: 400; 
  line-height: 50px;
  color: #434343;
  word-break: keep-all;

  display: block;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.reference_all_box > h3 {
  color: #434343;

  display: block;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.reference_box::after {
  content: '';
  display: table;
  clear: both;
}


.reference_box > h2 {
  font-size: 20px;
  font-weight: 400; 
  line-height: 35px;
  color: #434343;
  word-break: keep-all;

  display: block;
  margin-top: 10px;
  margin-bottom: 15px;
  font-weight: bold;

  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}



.reference_all_box {
  opacity: 0;
}

.reference_box {
  margin-top: 15px;
  margin-bottom: 15px;
}


.reference_box > ul {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  padding-bottom: 15px;

  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;

  border-bottom: 1px solid #eaeaea;
}


.reference_box > ul li {
  display: inline-block;
}

.reference_box > ul > li {
  width: calc(1/5*100% - (1 - 1/5)*10px);
  height: 60px;
  margin-right: 10px;
  margin-bottom: 10px;
  border: 1px solid #eaeaea;
  border-radius: 5px;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.07);

  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;

  transition: ease-in-out 0.2s;
}

.reference_box > ul > li:hover {
  transform: translateY(-5px);

  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}


.reference_box > ul > li:nth-child(5n) {
  margin-right: 0;
}

.reference_logo_opswat {
  background: url(../../../img/company_img/r1.png) no-repeat #fff center center;
  background-size: contain;
}

.reference_logo_uabro {
  background: url(../../../img/company_img/r43.png) no-repeat #fff center center;
  background-size: contain;
}

.reference_logo_yegiadde {
  background: url(../../../img/company_img/r44.png) no-repeat #fff center center;
  background-size: contain;
}

.reference_logo_yanolja {
  background: url(../../../img/company_img/r45.png) no-repeat #fff center center;
  background-size: contain;
}


.reference_logo_lignex1 {
  background: url(../../../img/company_img/r68.png) no-repeat #fff center center;
  background-size: contain;
}

.reference_logo_nhnglobal {
  background: url(../../../img/company_img/r61.png) no-repeat #fff center center;
  background-size: contain;
}

.reference_logo_somansa {
  background: url(../../../img/company_img/r62.png) no-repeat #fff center center;
  background-size: contain;
}

.reference_logo_polsarisoffice {
  background: url(../../../img/company_img/r64.png) no-repeat #fff center center;
  background-size: contain;
}


.reference_logo_sknet {
  background: url(../../../img/company_img/r6.png) no-repeat #fff center center;
  background-size: contain;
}

.reference_logo_ns {
  background: url(../../../img/company_img/r10.png) no-repeat #fff center center;
  background-size: contain;
}

.reference_logo_hanu {
  background: url(../../../img/company_img/r4.png) no-repeat #fff center center;
  background-size: contain;
}

.reference_logo_samhwa {
  background: url(../../../img/company_img/r50.png) no-repeat #fff center center;
  background-size: contain;
}

.reference_logo_iseeya {
  background: url(../../../img/company_img/r66.png) no-repeat #fff center center;
  background-size: contain;
}




.reference_logo_edenbiztech {
  background: url(../../../img/company_img/r51.png) no-repeat #fff center center;
  background-size: contain;
}


.reference_logo_mcm {
  background: url(../../../img/company_img/r73.png) no-repeat #fff center center;
  background-size: contain;
}


.reference_logo_dangun {
  background: url(../../../img/company_img/r74.png) no-repeat #fff center center;
  background-size: contain;
}


.reference_logo_peal {
  background: url(../../../img/company_img/r75.png) no-repeat #fff center center;
  background-size: contain;
}


.reference_logo_lgu {
  background: url(../../../img/company_img/r76.png) no-repeat #fff center center;
  background-size: contain;
}


.reference_logo_dnsever {
  background: url(../../../img/company_img/r77.png) no-repeat #fff center center;
  background-size: contain;
}


.reference_logo_airpremia {
  background: url(../../../img/company_img/r78.png) no-repeat #fff center center;
  background-size: contain;
}


.reference_logo_tossinsurance {
  background: url(../../../img/company_img/r79.png) no-repeat #fff center center;
  background-size: contain;
}


.reference_logo_hwawoo {
  background: url(../../../img/company_img/r80.png) no-repeat #fff center center;
  background-size: contain;
}


.reference_logo_sanha {
  background: url(../../../img/company_img/r81.png) no-repeat #fff center center;
  background-size: contain;
}


.reference_logo_koreaap {
  background: url(../../../img/company_img/r82.png) no-repeat #fff center center;
  background-size: contain;
}

.reference_logo_snt {
  background: url(../../../img/company_img/r83.png) no-repeat #fff center center;
  background-size: contain;
}

.reference_logo_orbro {
  background: url(../../../img/company_img/r84.png) no-repeat #fff center center;
  background-size: contain;
}

.reference_logo_nexus {
  background: url(../../../img/company_img/r85.png) no-repeat #fff center center;
  background-size: contain;
}

.reference_logo_niceinfo {
  background: url(../../../img/company_img/r91.png) no-repeat #fff center center;
  background-size: contain;
}













/********제2 러퍼런스*********/

.reference_logo_archives {
  background: url(../../../img/company_img/r25.png) no-repeat #fff center center;
  background-size: contain;
}


.reference_logo_kisa {
  background: url(../../../img/company_img/r26.png) no-repeat #fff center center;
  background-size: contain;
}


.reference_logo_education {
  background: url(../../../img/company_img/r27.png) no-repeat #fff center center;
  background-size: contain;
}


.reference_logo_procurement {
  background: url(../../../img/company_img/r28.png) no-repeat #fff center center;
  background-size: contain;
}

.reference_logo_etri {
  background: url(../../../img/company_img/r30.png) no-repeat #fff center center;
  background-size: contain;
}


.reference_logo_defense {
  background: url(../../../img/company_img/r32.png) no-repeat #fff center center;
  background-size: contain;
}

.reference_logo_lh {
  background: url(../../../img/company_img/r52.png) no-repeat #fff center center;
  background-size: contain;
}


/********제3 러퍼런스*********/

.reference_logo_ibk {
  background: url(../../../img/company_img/r40.png) no-repeat #fff center center;
  background-size: contain;
}

.reference_logo_jt {
  background: url(../../../img/company_img/r41.png) no-repeat #fff center center;
  background-size: contain;
}

.reference_logo_hygood {
  background: url(../../../img/company_img/r55.png) no-repeat #fff center center;
  background-size: contain;
}


.reference_logo_toss {
  background: url(../../../img/company_img/r56.png) no-repeat #fff center center;
  background-size: contain;
}

.reference_logo_tosspayment {
  background: url(../../../img/company_img/r57.png) no-repeat #fff center center;
  background-size: contain;
}

.reference_logo_tossplace {
  background: url(../../../img/company_img/r58.png) no-repeat #fff center center;
  background-size: contain;
}

.reference_logo_tossmobile {
  background: url(../../../img/company_img/r86.png) no-repeat #fff center center;
  background-size: contain;
}

/********제4 러퍼런스*********/

.reference_logo_defense_business {
  background: url(../../../img/company_img/r59.png) no-repeat #fff center center;
  background-size: contain;
}

.reference_logo_ewp {
  background: url(../../../img/company_img/r60.png) no-repeat #fff center center;
  background-size: contain;
}

.reference_logo_iitp {
  background: url(../../../img/company_img/r87.png) no-repeat #fff center center;
  background-size: contain;
}

.reference_logo_kalis {
  background: url(../../../img/company_img/r88.png) no-repeat #fff center center;
  background-size: contain;
}

.reference_logo_busanedu {
  background: url(../../../img/company_img/r89.png) no-repeat #fff center center;
  background-size: contain;
}

.reference_logo_hoseoedu {
  background: url(../../../img/company_img/r90.png) no-repeat #fff center center;
  background-size: contain;
}

@media only screen and (min-width: 0px) and (max-width: 1170px) {


  .reference_box > ul {
    margin-top: 10px;
    text-align: center;
  }


  .reference_box > ul > li {
  width: calc(1/3*100% - (1 - 1/4)*10px);
    margin-right: 10px;
    margin-bottom: 10px;
  }
  

 

  .reference_box > ul > li:nth-child(5n) {
    margin-right: 10px;
  }
  .reference_box > ul > li:nth-child(3n) {
    margin-right: 0;
    float: right;
  }
}


@media only screen and (min-width: 0px) and (max-width: 320px) {

  .reference_bg {
    min-width: 320px;
    
    padding: 50px 0 50px 0;
  
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
  }
  


  .reference_all_box > h1 {
    font-size: 31px;
    line-height: 50px;  
    word-break: keep-all;
  }

  
  .reference_box > h2 {
    font-size: 20px;
    line-height: 35px;

    word-break: keep-all;
  }
  


  .reference_box > h2 {
    font-size: 20px;
    line-height: 35px;

    word-break: keep-all;
  }
  




  .reference_box > h2 {
    font-size: 20px;
    line-height: 35px;
    word-break: keep-all;
  }
  
  
  .reference_box > ul > li {
    list-style-position: inside;
    margin-left: 0;
  }

  
}



@media only screen and (min-width: 321px) and (max-width: 970px) {
  
  .reference_bg {
    min-width: 320px;
    
    padding: 50px 0 50px 0;
  
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
  }


  .reference_all_box > h1 {
    font-size: 31px;
    line-height: 50px;  
    word-break: keep-all;
  }

  
  .reference_box > h2 {
    font-size: 20px;
    line-height: 35px;

    word-break: keep-all;
  }


  .works_text > ul > li {
    padding-left: 5px;
  }



  
  .works_text_white > ul > li {
    padding-left: 5px;
  }



  
  .works_text_white_center > ul > li {
    padding-left: 5px;
  }
  

  
}







/*********************
*
*
* 색션 파트너사
*
*
*************************/

.partner_bg {
  min-width: 320px;
  padding: 100px 0 100px 0;
  background: #f9f9f9;

  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}



.partner_wrap {
  margin: 0 auto;
  max-width: 1150px;
  height: auto;

  padding: 0 15px 0 15px;

  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}


.partner_all_box > h1 {
  font-size: 41px;
  font-weight: 900;
  line-height: 66px;  
  color: #434343;
  word-break: keep-all;

  display: block;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}



.partner_box::after {
  content: '';
  display: table;
  clear: both;
}


.partner_box > h2 {
  font-size: 20px;
  font-weight: 400; 
  line-height: 35px;
  color: #434343;
  word-break: keep-all;

  display: block;
  margin-top: 10px;
  margin-bottom: 15px;
  font-weight: bold;

  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}



.partner_all_box {
  opacity: 0;
}

.partner_box {
  margin-top: 15px;
  margin-bottom: 15px;
}


.partner_box > ul {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  padding-bottom: 15px;

  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;

  border-bottom: 1px solid #eaeaea;
}

.partner_box > ul:last-child {
  border-bottom: none;
  padding-bottom: 0px;
}


.partner_box > ul li {
  display: inline-block;
}

.partner_box > ul > li {
  width: calc(1/5*100% - (1 - 1/5)*10px);
  height: 60px;
  margin-right: 10px;
  margin-bottom: 10px;
  border: 1px solid #eaeaea;
  border-radius: 5px;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.07);

  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;

  transition: ease-in-out 0.2s;
}

.partner_box > ul > li:hover {
  transform: translateY(-5px);

  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}


.partner_box > ul > li:nth-child(5n) {
  margin-right: 0;
}

.partner_box > ul > li > a {
  display: block;
  width: 100%;
  height: 100%;
}


/*제1파트너사*/

.partner_logo_kddi {
  background: url(../../../img/company_img/p1.png) no-repeat #fff center center;
  background-size: contain;
}

.partner_logo_netandsecu {
  background: url(../../../img/company_img/p2.png) no-repeat #fff center center;
  background-size: contain;
}

.partner_logo_sknetworksservice {
  background: url(../../../img/company_img/p3.png) no-repeat #fff center center;
  background-size: contain;
}

.partner_logo_zeronsoft {
  background: url(../../../img/company_img/p4.png) no-repeat #fff center center;
  background-size: contain;
}

.partner_logo_intersecutech{
  background: url(../../../img/company_img/p5.png) no-repeat #fff center center;
  background-size: contain;
}






@media only screen and (min-width: 0px) and (max-width: 1170px) {


  .partner_box > ul {
    margin-top: 10px;
    text-align: center;
  }


  .partner_box > ul > li {
  width: calc(1/3*100% - (1 - 1/4)*10px);
    margin-right: 10px;
    margin-bottom: 10px;
  }
  

 

  .partner_box > ul > li:nth-child(5n) {
    margin-right: 10px;
  }
  .partner_box > ul > li:nth-child(3n) {
    margin-right: 0;
    float: right;
  }
}


@media only screen and (min-width: 0px) and (max-width: 320px) {

  .partner_bg {
    min-width: 320px;
    
    padding: 50px 0 50px 0;
  
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
  }
  


  .partner_all_box > h1 {
    font-size: 31px;
    line-height: 50px;  
    word-break: keep-all;
  }

  
  .partner_box > h2 {
    font-size: 20px;
    line-height: 35px;

    word-break: keep-all;
  }
  


  .partner_box > h2 {
    font-size: 20px;
    line-height: 35px;

    word-break: keep-all;
  }
  




  .partner_box > h2 {
    font-size: 20px;
    line-height: 35px;
    word-break: keep-all;
  }
  
  
  .partner_box > ul > li {
    list-style-position: inside;
    margin-left: 0;
  }

  
}



@media only screen and (min-width: 321px) and (max-width: 970px) {
  
  .partner_bg {
    min-width: 320px;
    
    padding: 50px 0 50px 0;
  
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
  }


  .partner_all_box > h1 {
    font-size: 31px;
    line-height: 50px;  
    word-break: keep-all;
  }

  
  .partner_box > h2 {
    font-size: 20px;
    line-height: 35px;

    word-break: keep-all;
  }

  
}

















/*색션 8*/

.map_bg {
  min-width: 320px;
  background: #ffffff;

  padding: 100px 0 100px 0;

  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.map_wrap {
  margin: 0 auto;
  max-width: 1150px;
  height: auto;
  overflow: hidden;

  padding: 0 15px 0 15px;

  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}


.map_box1 {
  width: 100%;
  margin-right: 15px;
}

.map_box1 > h1 {
  font-size: 41px;
  font-weight: 900;
  line-height: 66px;  
  color: #434343;
  word-break: keep-all;
}

.map_box1 > h2 {
  font-size: 31px;
  word-break: keep-all;
  font-weight: 400; 
  line-height: 50px;
  color: #434343;
}

.map_box1 > h3 {
  color: #434343;
}


.map_name {
  font-size: 20;
}


.map_box2 {
  margin-top: 20px;
  width: 100%;
}

.map {
  width: 100%;
  height: 400px;
}


.iframe_box{
  width:100%;
  height:100%;
}


.map_box3 {
  margin-top: 30px;
  border-top: 1px solid #eaeaea;
}



@media only screen and (min-width: 0px) and (max-width: 320px) {

  .map_bg {
    min-width: 320px;
    background: #ffffff;
  
    padding: 50px 0 50px 0;
  
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
  }


  .map_box1 > h1 {
    font-size: 31px;
  word-break: keep-all;
    line-height: 50px;  
  }
  
  .map_box1 > h2 {
    font-size: 20px;
    line-height: 35px;
  }
  
}



@media only screen and (min-width: 321px) and (max-width: 970px) {


  .map_bg {
    min-width: 320px;
    background: #ffffff;
  
    padding: 50px 0 50px 0;
  
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
  }



  .map_box1 > h1 {
    font-size: 31px;
  word-break: keep-all;
    line-height: 50px;  
  }
  
  .map_box1 > h2 {
    font-size: 20px;
    line-height: 35px;
  }
  
}