@charset "utf-8"; 



/* main visual */
#main_visual{overflow:hidden; position:relative; z-index:1; height:calc(1000rem); color:#fff; text-align:center;}
#main_visual .bx-wrapper{height:100%; margin-bottom:0; background:transparent; border:0; box-shadow:none;}
#main_visual .bx-viewport{height:100% !important;}
#main_visual .slider{height:100%;}
#main_visual .roll{}
#main_visual .roll_txt{ width:1400rem; margin:0 auto; text-align:center; }
#main_visual .roll_img{z-index:-1; position:absolute; left:0; top:0; width:100%;height:100%; background-size:cover; background-position:50%;  animation: imagescale 5s; -webkit-animation: imagescale 5s; -moz-animation: imagescale 5s; -o-webkit-animation: imagescale 5s;}
#main_visual .roll01{background-image:url(../img/main/visual01.jpg);}
#main_visual .roll02{background-image:url(../img/main/visual02.jpg);}
#main_visual .roll03{background-image:url(../img/main/visual03.jpg);}
#main_visual .roll04{background-image:url(../img/main/visual04.jpg);}
#main_visual .roll{height:100%;}
#main_visual h2{ line-height:1.3; font-weight:800; font-size:45rem; padding:15rem 0;}
#main_visual h2 span{display:block; font-weight:800; font-size:35rem;}
#main_visual p{line-height:1.4; margin:320rem 0 0 0; font-size:20rem; letter-spacing:1rem; color:#faa21b; font-family: 'neurimboGothicRegular'; margin:370rem 0 20rem 0;}
#main_visual .btn_more{margin-top:50rem}
#main_visual .roll_txt2{display:inline-block; margin-right:80rem; text-align:left;}
#main_visual .bx-controls{ z-index:100; width:100%; text-align:center;}
#main_visual .bx-controls-direction{}
#main_visual .bx-pager{display:inline-block; vertical-align:middle;}
#main_visual .bx-pager > div{display:inline-block;}
#main_visual .bx-pager a{display:inline-block; width:12rem; height:12rem; margin:0 5rem; border:2px solid #fff; font-size:0; text-indent:-9000px; border-radius:50%;}
#main_visual .bx-pager a.active{background:#fff;}
#main_visual .bx-controls-auto{display:inline-block; vertical-align:middle;}
#main_visual .bx-controls-auto > div{display:inline-block;}
#main_visual .bx-controls-auto a{display:inline-block; width:20px; height:20px; margin:0 5px; background-position:center; font-size:0; color:#fff; text-indent:-9000px; background-repeat:no-repeat;}
#main_visual .bx-controls-auto a.bx-start{background-image:url(../img/btn_play.png);}
#main_visual .bx-controls-auto a.bx-stop{background-image:url(../img/btn_pause.png);}
#main_visual .bx-controls-auto a.active{display:none;}

/* 이전다음버튼일때 */
#main_visual .bx-default-pager{display:none; position: absolute; left:0; width: 100%;bottom:30rem;z-index: 60;}
#main_visual .bx-controls-direction{position: absolute; left:0; width: 100%;top:48%;z-index: 60;}
#main_visual .bx-controls-direction a.bx-prev:After{transform:rotate(180deg); -webkit-transform:rotate(180deg);}
#main_visual .bx-controls-direction a:hover{}
#main_visual .bx-controls-direction a{display:block; position:absolute; overflow:hidden; width:28rem; height:46rem; text-indent:-9999px; transition:all 0.2s ease-out 0s;}
#main_visual .bx-controls-direction a:after{content:""; position:absolute; top:0; left:0; width:100%; height:100%; background:url(../img/layout/icon_btn_arrow.svg) no-repeat 50% 50%;}
#main_visual .bx-controls-direction a.bx-next{right:100rem;}
#main_visual .bx-controls-direction a.bx-prev{left:100rem;}

@keyframes imagescale {
  0% {
    transform: scale(1.2)  rotate(.001deg);
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -o-transform: scale(1.2);
  }

  100% {
    transform: scale(1)  rotate(.001deg);
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -o-transform: scale(1);
  }
}



@media (max-width:1700px){
	.main-facilities__inner{width:100%; padding-left:30rem;}
	
	#main_visual .bx-controls-direction a.bx-prev{left:20rem;}
	#main_visual .bx-controls-direction a.bx-next{right:20rem;}
}

@media (max-width:1480px){
	#main_visual .roll_txt{width:80%;}
}

@media (max-width:1023px) {
	#main_visual h2{font-size:18rem; padding:5rem 0;}
	#main_visual h2 b{font-size:20rem}

}


@media (max-width:860px){
	#main_visual .bx-default-pager{display:block;}
	#main_visual .bx-controls-direction{display:none;}

}

@media (max-width:540px) {
	#main_visual{height:300rem}
	#main_visual .roll{padding-top:0}
	#main_visual p{margin:120rem 0 0rem; font-size:12rem}
	#main_visual .btn_more{margin-top:25rem}
	
}


/*.overlay {  z-index: 10;  position: fixed;  width: 100%; height: 100%;  left: 0; top: 0;  background-color: rgba(0,0,0, 0.2);  overflow-x: hidden;}*/

@font-face {
    font-family: 'neurimboGothicRegular';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_2304-01@1.0/neurimboGothicRegular.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}

#mainvideo {position: relative; width: 100%; height: auto; margin-top:100rem;}
/*#mainvideo:before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 8rem;
  left: 0;
  background-color: rgba(0,0,0, 0.2);  
  opacity: 0.6;
  z-index:1;
}
*/
@media (max-width:1023px) {
	#mainvideo {margin-top:80rem;}
}


.video_con {position:absolute; left:50%; transform:translateX(-50%); top:0; z-index:10;}
.video_con .video_txt { width:1400rem; margin:0 auto; text-align:left; color:#fff; padding-top:0rem;}
.video_con .video_txt h2{ line-height:1.3; font-weight:600; font-size:40rem; margin-top:20rem; padding:15rem 0;}
.video_con .video_txt h2 span {display:block; font-weight:200; font-size:26.5rem;}
.video_con .video_txt p{line-height:1.3; margin:320rem 0 0 0; font-weight:600; letter-spacing:-.5px; font-size:35rem; color:#fff; }

@media (max-width:1400px) {
	.video_con .video_txt { width:100%;}
	.video_con {position:absolute; left:10%; transform:translateX(-10%); top:0; z-index:10;}
	.video_con .video_txt h2 img {width:350rem;}
}

@media (max-width:1023px) {
	.video_con .video_txt { padding-top:0rem;}
	.video_con .video_txt p{margin:160rem 0 0 0; font-size:23rem;}
	.video_con .video_txt h2{font-size:35rem; margin-top:0rem;}
	.video_con .video_txt h2 img {width:250rem;}
	.video_con .video_txt h2 span {font-size:18.5rem;}
}

@media (max-width:800px) {
	.video_con .video_txt p{margin:120rem 0 0 0; }
}

@media (max-width:540px) {
	.video_con {position:absolute; left:10%; transform:translateX(-10%); top:0; z-index:10;}
	.video_con .video_txt p{margin:70rem 0 0 0; font-size:10rem;}
	.video_con .video_txt h2{font-size:25rem; padding:0rem 0; margin-top:0rem;}
	.video_con .video_txt h2 span {font-size:10rem;}
	.video_con .video_txt h2 img {width:130rem;}
}


.video {position: relative; margin:50rem 0 0; }
.video_list{display:grid;grid-template-columns: repeat(2, 1fr);gap:30px;}
.video_item{display:flex;align-items:center;flex-direction:column; }
.video_item iframe {width:100%;}
.video_icon{display:flex;align-items:center;justify-content:center;flex-direction:column;margin-bottom:30px;}

.video_list h5 {color:#000; font-weight:400;text-align: center; font-size:20px; line-height: 1.4; margin-top:10px; }
.video_list p {color:#000; font-weight:800;text-align: center; font-size:22px; line-height: 1.4; margin-top:10px; }
.iframe-container {position: relative;   width: 100%;  padding-bottom: 56.25%; }
.iframe-container iframe {position: absolute;  width: 100%;   height: 100%;}

@media(max-width:1400px){
	.video {margin-left:0px; }
	
}

@media(max-width:1023px){
	.video_list{grid-template-columns:repeat(1, 1fr);}
	.video_list h5 { font-size:16px; }
	.video_list p { font-size:18px; }
	
}




#c1_wrap .c_inner { width: 100%; max-width: 1400px; margin:0 auto; position: relative; padding:0 50px;}
#c1_wrap .c_title h2 {font-size: 40rem; font-weight:600; line-height: 1.2; color:#000; padding-top:20rem;}
#c1_wrap .c_title h2 span {font-weight:800;}
#c1_wrap .c_title h2::before {content: "";position: absolute;left: 50rem;top: 0;width:60rem;height: 1rem;background:#000; } 
#c1_wrap .c_title h2::after {content: "";position: absolute;left: 100rem;top: 0;width:60rem;height: 1rem;background:#29803a;} 

#c1_wrap .c_btn span {display:block; font-size: 35rem;  color:#fff; height: 60rem; line-height:55rem; position: relative; z-index: 1; width: 60rem; text-align:center; border-radius: 60rem; border:1px solid #fff; transition: all .3s; }
#c1_wrap .c_btn span:hover {background-color: #29803a; border-color: #29803a; }

/*Content CSS*/
#c1_wrap {background:#fff; overflow: hidden; padding: 80px 0 100px;}
#c1_wrap .top {display: flex; align-items: flex-start; }
#c1_wrap .top .c_title {flex-shrink: 0; margin-right: 60px;}
#c1_wrap .top p {padding-top: 20px;}

#c1_wrap .list {display: flex; justify-content: space-between; margin:35px 0 0; }
#c1_wrap .list li {width: 12.3%; position: relative; z-index: 1; transition: width .5s;}
#c1_wrap .list li:nth-child(1) a {border-radius: 40rem 40rem 40rem 0;}
#c1_wrap .list li:nth-child(5) a {border-radius: 40rem 0 40rem 40rem;}
#c1_wrap .list a {display: block; width: 100%; background-color: #fff; border-radius:40rem; height: 400px; position: relative;  transition: width .5s; overflow: hidden;}
#c1_wrap .list .img {display: flex; align-items:center; justify-content: center;  width: 100%; overflow: hidden; position: relative; z-index: 1; }
#c1_wrap .list .img::before {content: ''; display: block; width: 100%; height: 100%; left: 0; top:0; background-color: rgba(0,0,0,.25); transition: opacity .3s;
z-index: 2; opacity: 1; position: absolute;}
#c1_wrap .list .img img {max-width: inherit; min-height: 100%; transition: all .5s; }
#c1_wrap .list .txt {position: absolute; left: 0; bottom: 40rem; padding: 50rem; text-align: left; width: 100%; overflow: hidden; opacity: 0;  z-index: 2; display: flex; justify-content: space-between; align-items: center;}
#c1_wrap .list .txt h4 {font-size: 30rem; font-weight: 800; color:#fff; line-height: 1.3; text-transform: uppercase; margin-right: 30px; white-space: nowrap;}
#c1_wrap .list .icon {position: absolute; display: flex; align-items: center; justify-content: center; flex-direction: column;  left: 0; top:0;
padding:0; z-index: 3; width: 100%; height: 100%; }
#c1_wrap .list .icon i {display: block; flex-shrink: 0;}
#c1_wrap .list .icon i + i {margin-top: 20px;}

/* active */
@media screen and (min-width:1025px) {
#c1_wrap .list li.active {width: 45%; }
#c1_wrap .list li.active {z-index: 2;}
#c1_wrap .list li.active .img::before {opacity: 0;}
#c1_wrap .list li.active .txt {opacity: 1; }
#c1_wrap .list li.active .icon { height: 100%; padding: 0px 50px; display: flex; align-items: left; justify-content: left; flex-direction: column; }
#c1_wrap .list li.active .icon {flex-direction: row;}
#c1_wrap .list li.active .icon i + i {margin:0 0 0 20px;}
#c1_wrap .list li.active .icon::after {display:block;}
}



@media screen and (max-width:1400px) {

    /* active */
    @media screen and (min-width:1025px) {
        #c1_wrap .list li.active .icon {padding: 40px 30px; }
    }
    #c1_wrap .list .txt {padding: 50px 30px; }
    #c1_wrap .list .txt h4 {font-size: 27px; }


}



@media screen and (max-width: 1023px) {
    /* common */
    #c1_wrap {padding: 70px 0; }
    #c1_wrap .c_inner {padding:0 30px;}
    #c1_wrap .c_title h2 {font-size: 30rem; }
    #c1_wrap .c_title h2::before {margin: 0 auto 15px;left: 0rem;}
	#c1_wrap .c_title h2::after {left: 60rem;} 

    #c1_wrap .c_btn span {font-size: 13px; padding: 0 15px;  }

    /* content */
    #c1_wrap {}
    #c1_wrap .top {display: block;}
    #c1_wrap .top .c_title {margin: 0 0 10px;}
    #c1_wrap .top p {padding: 0;}

    #c1_wrap .list {flex-wrap:wrap; margin-top: 40px;}
    #c1_wrap .list li {margin:0; width: calc(50% - 10px); }
    #c1_wrap .list li:nth-child(n+2) {margin-top: 20px;}
    #c1_wrap .list li:first-child {width: 100%;}
    #c1_wrap .list a {height: auto; }
    #c1_wrap .list .img {max-height: 200px;  }
    #c1_wrap .list .img img {width: 100%; height: 100%; object-fit: cover;  min-height: 0;}
    #c1_wrap .list .img::before {background-color: rgba(0,0,0,.2);}
    #c1_wrap .list .txt {padding: 0px 20px; opacity: 1; }
    #c1_wrap .list .txt h4 {font-size:20px; margin-right: 20px; white-space: normal;}
    #c1_wrap .list .icon {padding: 20px 20px; height: auto; flex-direction: row; }
    #c1_wrap .list .icon i + i {margin:0 0 0 20px;}
    #c1_wrap .list .icon::after {display:block;}
	#c1_wrap .list a {border-radius: 30rem;}
	#c1_wrap .list li:nth-child(1) a {border-radius: 30rem;}
	#c1_wrap .list li:nth-child(5) a {border-radius: 30rem;}


}
@media screen and (max-width: 640px) {
    /* common */
    #c1_wrap {padding: 50px 0;}
    #c1_wrap .c_inner {padding:0 20px;}
	#c1_wrap .c_title h2 {font-size: 25rem; }

    /* content */
    #c1_wrap .list {margin-top: 30px; }
    #c1_wrap .list li {width: 100%; }
    #c1_wrap .list li:nth-child(n+2) {margin-top: 15px;}
    

    #c1_wrap .list .txt h4 {font-size:18px; }
    #c1_wrap .list .icon img {}
    #c1_wrap .list .icon i + i {margin: 0 0 0 10px;}

}
@media screen and (max-width:480px) {
    #c1_wrap .c_btn span {font-size: 15rem;padding: 0 10rem;  width:50rem; height:50rem; line-height:50rem;}


}



.main-esg {padding:150rem 0;background:url("../img/main/customer_bg.jpg") no-repeat top center / cover;}
.main-esg__title-wrap {text-align:center; color:#fff;  }
.main-esg__title-wrap h5 {font-size:17rem; font-weight:600; letter-spacing:1px; margin-bottom:10rem;}
.main-esg__title-wrap h3 {font-size:35rem; font-weight:800; line-height:1.3;}
.main-esg__wrap {margin-top:50px; }
.main-esg__list {display:flex;flex-wrap:wrap;}
.main-esg__item {width:33.33333333333333333333333%;padding:30px 0;background-color:rgba(255,255,255,.3);}
.main-esg__inner {display:flex;flex-direction:column;justify-content:center;align-items:center;position:relative;padding:0 30px;text-align:center;}
.main-esg__inner {height:230px;border-right:1px solid rgba(255,255,255,.1);}
.main-esg__inner::after {top:50%;right:-1px;transform:translate(40%, -50%);}
.main-esg__icon-wrap {display:flex;justify-content:center;align-items:center;height:90rem;}
.main-esg__icon {display:inline-block;}
.main-esg__svg {display:inline-block;}
.main-esg__item .main-esg__icon .main-esg__svg .svg-elem {transition:stroke-dashoffset 1s cubic-bezier(0.47,0,0.745,0.715);}
.main-esg__item .main-esg__icon .main-esg__svg.active .svg-elem{stroke-dashoffset:0}

.main-esg__item.first .main-esg__svg {width:50px;height:38px;}
.main-esg__item.second .main-esg__svg {width:42px;height:45px;}
.main-esg__item.third .main-esg__svg {width:41px;height:40px;}

.main-esg__title {margin-top:5px;font-size:25rem;font-weight:800;color:#008f5a;line-height:1;}
.main-esg__category {margin-top:10px;font-size:18rem;color:#000;}

@media (max-width:1023px) {

	.main-esg {display:none; padding:100px 0; background:url("../img/main/customer_bg_m.jpg") no-repeat top center / cover; }
	.main-esg__wrap {max-width:700rem;margin:50px auto 0;}
	.main-esg__item {position:relative;width:100%;padding:30rem 20rem;}
	.main-esg__item:not(:last-child)::after {content:"";position:absolute;bottom:0;left:50%;width:80%;height:1px;background-color:rgba(255,255,255,.1);transform:translateX(-50%);}
	.main-esg__inner {border-right:0;}
	.main-esg__inner::after {top:100%;right:50%;width:12px;height:3px;background:linear-gradient(to right, #007dc6 25%, transparent 25% 75%, #00a651 75% 25%);transform:translate(50%, 28px);}
	.main-esg__category {font-size:15px;}
	.main-esg .btn-default {visibility:visible;opacity:1;margin-bottom:0;}

}

@media (max-width:640px) {
	.main-esg {padding:70rem 0; background:url("../img/main/customer_bg_m.jpg") no-repeat top center / cover; }
	.main-esg__inner {height:auto;}
	.main-esg__title-wrap h5 {font-size:15rem}
	.main-esg__title-wrap h3 {font-size:23rem}
	.main-esg__icon img {width:70rem;}
}




.main-banner {position:relative; display:flex;height:500rem;}
.main-banner__wrap {width:50%;padding:90rem 0rem 0rem;background-repeat:no-repeat;background-position:top center;background-size:cover;}
.main-banner__wrap:nth-child(1) {padding-left:100rem;}
.main-banner__wrap.service {background:#f6f6f6;}
.main-banner .wrap {position:relative;max-width:720rem;margin:0;}
.main-banner__wrap.talent .wrap {padding-right:0; margin-left:100rem;}

.photo_title h2 {font-size: 35rem; font-weight:500; line-height: 1.2; color:#000; padding-top:20rem;}
.photo_title h2 b {font-weight:800;}
.photo_title h2 span {font-size: 20rem; display:inline-block; padding-left:20rem;}

@media (max-width:1600px) {
	.main-banner {display:block;height:auto;}
	.main-banner__wrap {width:100%;padding-left:50rem; }
	.main-banner__wrap.service {display:block;}
	.main-banner .wrap {display:block;max-width:100%;}
	.main-banner__wrap.talent .wrap {justify-content:flex-end;padding-right:0; margin-left:0rem;}

	.photo_title h2 {font-size: 25rem;}
	.photo_title h2 span {font-size: 15rem}
}

@media (max-width:800px) {
	.main-banner__wrap {width:100%; padding-left:0rem;}
	.main-banner__wrap:nth-child(1) {padding-left:0rem;}
}

.slick-slide {  padding: 40px 0;   }

.slick-prev::before,
.slick-next::before {  color: black;}


.slider div i { float:left; margin-right:30rem;}
.slider div i img {width:310rem; height:200rem;}
.slider div ul {padding-top:60rem; }
.slider div ul h3 {font-size:25rem; font-weight:800; margin-bottom:20rem; width:40%; position: relative; text-overflow: ellipsis;overflow: hidden;white-space: nowrap;}
.slider div ul p {font-size:16rem; font-weight:500; width:40%;  line-height: 1.5; letter-spacing:-.5px; display: -webkit-box;
  overflow: hidden;
  line-height: 1.5;
   max-height: 4.2em; /* 인터넷 익스플로러 호환 */
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  text-overflow: ellipsis;}

.slider2 div i { float:left; margin-right:30rem;}
.slider2 div i img {width:310rem; height:200rem;}
.slider2 div ul {padding-top:60rem;}
.slider2 div ul h3 {font-size:25rem; font-weight:800; margin-bottom:20rem; width:40%; position: relative; text-overflow: ellipsis;overflow: hidden;white-space: nowrap;}
.slider2 div ul p {font-size:16rem; font-weight:500; width:40%; font-size:16rem; font-weight:500;  line-height: 1.5; letter-spacing:-.5px; display: -webkit-box;
  overflow: hidden;
  line-height: 1.5;
   max-height: 3.2em; /* 인터넷 익스플로러 호환 */
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  text-overflow: ellipsis;}

@media (max-width:800px) {
	
	
}

@media (max-width:500px) {
	.slider {padding:0 0rem;}
	.slider div ul {padding-top:20rem; }
	.slider2 div ul {padding-top:20rem; }
	.slider2 {padding:0 0rem;}
	.slider div i { float:none; margin-right:0rem;}
	.slider2 div i { float:none; margin-right:0rem;}
	.slider div i img { width:100%; }
	.slider2 div i img { width:100%}

	.slider div ul h3 {font-size:20rem; width:100%;}
	.slider div ul p {font-size:15rem; width:100%;}
	.slider2 div ul h3 {font-size:20rem; width:100%;}
	.slider2 div ul p {font-size:15rem; width:100%;}
}

/* Arrows */
.slick-prev,
.slick-next{ z-index:10;  font-size: 0;    line-height: 0;    position: absolute;    top: 50%;    display: block;    width: 40rem;    height: 40rem;    padding: 0;    -webkit-transform: translate(0, -50%);    -ms-transform: translate(0, -50%);    transform: translate(0, -50%);    cursor: pointer;    color: transparent;    border: none;    outline: none;    background:rgba(0,0,0,0.5); border-radius:50rem; }

.slick-prev:before,
.slick-next:before{    font-size: 15rem;    line-height: 1;    opacity: .75;    color: white;    -webkit-font-smoothing: antialiased;    -moz-osx-font-smoothing: grayscale;}

.slick-prev{    left: -45px;}
[dir='rtl'] .slick-prev{    right: -25px;    left: auto;}
.slick-prev:before{    content: '<';}
[dir='rtl'] .slick-prev:before{    content: '>';}

.slick-next{    right: 25px;}
[dir='rtl'] .slick-next{    right: auto;    left: -25px;}
.slick-next:before{    content: '>';}
[dir='rtl'] .slick-next:before{    content: '<';}


.slick-dotted.slick-slider{    margin-bottom: 30px;}
.slick-dots{  background:none;  position: absolute;    bottom: -25px;    display: block;    width: 100%;    padding: 0;    margin: 0;    list-style: none;    text-align: center;}
.slick-dots li{    position: relative;    display: inline-block;    width: 20px;    height: 20px;    margin: 0 5px;    padding: 0;    cursor: pointer;}
.slick-dots li button{    font-size: 0;    line-height: 0;    display: block;    width: 0;    height: 0;    padding: 5px;    cursor: pointer;    color: transparent;    border: 0;    outline: none;    background: transparent;}
.slick-dots li button:hover,
.slick-dots li button:focus{    outline: none;}
.slick-dots li button:hover:before,
.slick-dots li button:focus:before{    opacity: 1;}
.slick-dots li button:before{    font-family: 'slick';    font-size: 0;    line-height: 20px;    position: absolute;    top: 0;    left: 0;    width: 0;    height: 0;    content: '';    text-align: center;    opacity: .25;    color: black;    -webkit-font-smoothing: antialiased;    -moz-osx-font-smoothing: grayscale;}
.slick-dots li.slick-active button:before{    opacity: .75;    color: black;}


@media (max-width:800px) {
	.slick-prev,.slick-next{ width: 20rem;    height: 20rem; top: 35%;  }
	.slick-prev{    left: 0px;}
	[dir='rtl'] .slick-prev{    right: 0px;    left: auto;}
	.slick-next{    right: 0px;}
	[dir='rtl'] .slick-next{    right: auto;    left: 0px;}

}