@charset "utf-8";


/* Slider reset */
.slick-slider { position: relative; display: block; box-sizing: border-box; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;   -webkit-touch-callout: none;-khtml-user-select: none;-ms-touch-action: pan-y;touch-action: pan-y; -webkit-tap-highlight-color: transparent;}
.slick-list {position: relative; display: block;overflow: hidden; margin: 0; padding: 0;}
.slick-list:focus{  outline: none;}
.slick-list.dragging{ cursor: pointer; cursor: hand;}
.slick-slider .slick-track, .slick-slider .slick-list {-webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0);}
.slick-track { position: relative; top: 0;  left: 0; display: block; margin-left: auto; margin-right: auto; }
.slick-track:before, .slick-track:after { display: table; content: ''; }
.slick-track:after {  clear: both; }
.slick-loading .slick-track{visibility: hidden;}
.slick-slide{ display: none;float: left;/* height: 100%;*/ min-height: 1px;}
[dir='rtl'] .slick-slide {  float: right;}
.slick-slide img{display: block;}
.slick-slide.slick-loading img{ display: none;}
.slick-slide.dragging img{ pointer-events: none;}
.slick-initialized .slick-slide { display: block;}
.slick-loading .slick-slide{ visibility: hidden;}
.slick-vertical .slick-slide{ display: block;height: auto; border: 1px solid transparent;}
.slick-arrow.slick-hidden {  display: none;}

/* 메인 비주얼 */
#main_visual {position:relative; width:100%; overflow:hidden; z-index:1}
#main_visual .slick-slide {float: left; height:100vh; background-position:center center; background-repeat:no-repeat; background-size:cover;}
/* 화살표 */
#main_visual .slick_navigation{ font-size:20px; display:inline-block; vertical-align:middle; position: absolute;  bottom:90px;padding-left:5%; z-index: 1; }
#main_visual .slick_navigation button i { font-size:20px;vertical-align:top; font-size:22px; position:relative; } 
#main_visual .slick_navigation a{transition:all 0.3s; position:relative; display:block !important}
#main_visual .slick_navigation .slick_prev:hover {transform:translateX(-5px)}
#main_visual .slick_navigation .slick_next:hover {transform:translateX(5px)}
#main_visual .slick_navigation a i{color:#fff; font-size:18px}
#main_visual .slick_navigation button, #main_visual .slick_navigation .slick-dots, #main_visual .slick_navigation ul li {display:inline-block;}
#main_visual .slick_navigation ul li	 {margin:2px 7px}
#main_visual .slick_navigation ul li button { position:relative;}

#main_visual .slick-slide	{width:100%;margin:0 auto;text-align:center;} 
#main_visual .slick-slide img { max-width:100%;}
#main_visual .slick-dots li {display:inline-block;}

/* dot */
#main_visual .slick-dots {display:inline-block; vertical-align:middle; margin:-1px -8px 0 7px;color:#fff;}
#main_visual .slick-dots li{position:relative; display:inline-block; margin-right:20px; transition:all 0.8s}
#main_visual .slick-dots li:after{position:absolute; content:""; width:0; height:2px; background-color:#5bb8e8; left:35px; top:17px;}
#main_visual .slick-dots li.slick-active{margin-right:120px}
#main_visual .slick-dots li.slick-active:after{animation:loading_bar 4s both; animation-delay:0.2s}
#main_visual .slick-dots li button{position:relative; display:inline-block; padding-left:7px; font-weight:600; font-size:14px;color:#fff; }
#main_visual .slick-dots li button:before{position:absolute; content:"0"; left:0; top:0}
#main_visual .slick-dots li.slick-active button{color:#5bb8e8;;}

@-webkit-keyframes loading_bar{from{width:0px;}to{width:80px;}}
@keyframes loading_bar{from{width:0px;}to{width:80px;}}

/* pause,play */
#main_visual .slick_navigation .Pause{display:none;}

/* 타이틀 */

.visual_title {
    width: 100%;
    text-align: left;
    padding-left: 5%;
    word-break: keep-all;
    display: flex;
    height: 100%;
    align-items: center;
    flex-wrap: wrap;
    align-content: center;
}
.visual_title span{ position:relative; display:block; padding-top:15px; font-size:40px;font-size:18px;color:#fff;}
.visual_title strong { width:100%; display:block; font-size:70px; line-height:1.2; font-weight:600; color:#fff;font-weight:900; letter-spacing: -1px; }

/* title */
.main_title { position:relative;   }
.main_title h2 {position:relative; display: inline-block; font-size:25px; font-weight:bold; 	background: -webkit-linear-gradient(124deg, #5bb8e8 0%, #2e62cb 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.main_title h3 { padding-top:20px;font-size:45px; font-weight:500; line-height:1.2 }
.main_title h3 b { font-weight:700; display:block;}
#hg_experience { position:relative;  padding:80px 0 50px 0;}
#main_exp_slide {  position: relative; padding:120px 0 50px 0; text-align:center;}
#main_exp_slide .slide_item {  max-width:330px; position:relative;}
#main_exp_slide .exp_thum { position: relative;/* width: 320px; height:320px;*/ text-align: center; } 
#main_exp_slide .exp_thum .img_box{ display: inline-block; /*width: 220px; height: 220px;*/ border-radius: 3rem; box-shadow: 0px 0rem 3rem rgb(13 42 102 / 15%); position: relative; cursor: pointer; transition: .5s ease-in-out; overflow: hidden; z-index: 1;  transform-origin:50% 50%; transform:scale(0.74);transition:transform .5s linear; } 
#main_exp_slide .exp_thum .img_box img { width: 100%; } 
#main_exp_slide .exp_thum .img_box:before { display: block; content: ""; width: 0; height: 0; background:linear-gradient(rgba(0,0,0,0.0), rgba(0,0,0,0.4)); position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); opacity: 0; visibility: hidden; border-radius: 10rem; z-index: 1; }
#main_exp_slide .exp_thum .text_box { position: absolute; bottom: 0; left: 0; opacity: 0; visibility: hidden; z-index: 2; color: #fff; display: block; width: 100%; font-size:20px;  text-align: left; padding:10px 20px; word-break: keep-all;; text-align:center; } 
#main_exp_slide .slick-slide.slick-current .exp_thum .img_box {/*width: 350px; height: 350px;*/ cursor: auto;   transform:scale(1); transition:transform .5s linear;} 
#main_exp_slide .slick-slide.slick-current .exp_thum .img_box::before { opacity: 1; visibility: visible; width: 100%; height: 100%; border-radius: 3rem; } 
#main_exp_slide .slick-slide.slick-current .exp_thum .text_box { opacity: 1; visibility: visible; bottom: 1rem; transition: .5s .25s; } 
#main_exp_slide * { outline: none; } 
#main_exp_slide .slick-list {   overflow: visible!important; } 
#main_exp_slide .slick-slide { padding: 0 1rem; transition: .5s ease-in-out; } 
#hg_experience .slick_navigation  { position: absolute; right: 20px; top:36px; font-weight:bold; z-index:1; } 
#hg_experience .slick_navigation button { margin-left:35px; font-weight:900; font-size:16px; }
#hg_experience .slick_navigation button { padding:0 30px; }
#hg_experience .slick_navigation button i { display:block; width:22px; height:10px; position:absolute; top:6px; left:0; background:url('../images/btn_main_exp_prev.png') no-repeat; ; transition: .3s} 
#hg_experience .slick_navigation a{transition:all 0.3s; position:relative; display:block !important}
#hg_experience .slick_navigation .slick_next  i { left:inherit; right:0; background:url('../images/btn_main_exp_next.png') no-repeat; ; }
#hg_experience .slick_navigation .slick_prev:hover i {transform:translateX(-5px)}
#hg_experience .slick_navigation .slick_next:hover i {transform:translateX(5px)}


.obj { position: absolute;}
.obj.obj01 {width:287px; height:287px; background:url(../images/obj01.png) ;left:-100px; bottom:0;}
.obj.obj02 {width:404px; height:361px; background:url(../images/obj02.png); left:50%;  margin-left:-200px; top:-50px;}
 

#main_business { padding:120px 0; background-color:#000;position: relative; }
#main_business .container:after {content:""; display:block; clear:both; } 
#main_business .slider_wrap {
    z-index: 0;
    position: relative;
}
#main_business .swiper-wrapper {
    align-items: center;
}
#main_business .swiper-container { overflow:inherit}
#main_business .main_title h3 { color:#fff;}
#main_business .title_wrap h2 b{ display:inline-block; width:100%; font-weight:800;}
#main_business  .swiper-slide .item {display:flex;    align-items: center;     justify-content: space-between;}
#main_business  .swiper-slide .item { }
#main_business  .swiper-slide .item .info_wrap { padding-top:200px;padding-right:80px;}
#main_business  .swiper-slide h3 { font-size:70px; font-weight:900; color: #fff; -webkit-text-fill-color: transparent; -webkit-text-stroke: 1px #5bb8e8;  }
#main_business  .swiper-slide ul { padding-top:70px; padding-left:10px;}
#main_business  .swiper-slide ul li { position:relative; margin-bottom:10px; color:#9e9e9e; padding-left:10px;text-align: left;}
#main_business  .swiper-slide ul li::before { content:""; display:block; width:5px; height: 5px; background-color:#5bb8e8; border-radius: 100%; position: absolute; left:0; top:10px;}
#main_business  .swiper-slide .item .thum { }
#main_business  .swiper-slide .item .thum img { border-radius: 30px;}

#main_business  .swiper-slide .item .info_wrap .btn_more  { margin-top:40px;}
#main_business .swiper-slide { width:1200px;}
#main_business .swiper-slide.swiper-slide-prev .info_wrap,
#main_business .swiper-slide.swiper-slide-next  .info_wrap { display:none;}

#main_business .swiper-slide.swiper-slide-prev .thum,
#main_business .swiper-slide.swiper-slide-next .thum {    transform: translateY(0) scale(0.7);}


#main_news { padding:80px 0; 
	background:#000 url(../images/bg_main_story.jpg) no-repeat bottom -100px center / 100%;
	border-bottom-right-radius: 150px;
}
#main_news .main_title {
	color: #fff;
 }
#main_news .news_list { position:relative; padding-top:40px; }

#main_news .news_list ul:after {content:""; display:block; clear:both; } 
#main_news .news_list li {
	aspect-ratio: 1/1;
	border: 1px solid #fff;
	border-radius: 8px;
	padding: 40px;
	color: #fff;
	transition: all .2s ease-in-out;
	}

#main_news .news_list li a {
	color: #fff;
	display:block;
	height:100%;
	position: relative;
}
#main_news .news_list li:hover { background-color:rgb(255 255 255 / 10%);}
#main_news .news_list li .item-title { padding-bottom:10px; font-size:28px; font-weight:bold; 
	overflow: hidden;
    text-overflow: ellipsis;
    word-wrap: break-word;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    line-height: 1.4em;
    height: 2.8em;
}
#main_news .news_list li p { 
 	margin-top:30px;
	white-space: nowrap;overflow: hidden; text-overflow: ellipsis;

}
#main_news .news_list li span { 
	position: absolute;
	bottom:0;
	opacity: 0.8; }
#main_news .btn_more {
	margin-top:50px;
}
.btn_more  a { display:block; 
	width:57px;
	height:57px;
	border:3px solid #fff;
	border-radius: 100%;
	position:relative; padding-right:30px; font-weight: 900; font-size: 16px; color:#000}

.btn_more .dot{position: absolute; display:block; width:4px; height:4px; border-radius:4px; background-color:#fff;}
.btn_more .dot.dot1{top: 23px; left: 16px;}
.btn_more .dot.dot2{top: 23px; left: 25px;}
.btn_more .dot.dot3{top: 23px; left: 34px;}


#hg_career { padding:50px 20px; background-color:#222; text-align:center; color:#fff; }
#hg_career p { padding-bottom:20px; font-size:35px;font-family:'GMd', sans-serif, "맑은 고딕", Malgun Gothic; }
#hg_career a { position:relative; display:inline-block; width:150px; height:55px; padding:0 30px; color:#000; line-height:50px; background-color:#fff; border-radius:4rem; font-size:16px; text-align:left;  font-weight:bold;}
#hg_career a:after { content:""; display:block; position:absolute; top:50%; margin-top:-7px; right:30px; width:22px; height:10px; background:url(../images/btn_main_more.png) no-repeat;transition: .3s }
#hg_career a:hover:after{ right:40px;}


/**** pc ***/
@media screen and (max-width: 1400px) {
	
	#main_business .swiper-slide .item .info_wrap { width:50%;}
	#main_business .swiper-slide .item .thum { width:50%;}
   
#main_business .swiper-slide .item .info_wrap



}
@media screen and (max-width: 1200px) {
	#main_business .slider_wrap { padding-top:30px;}
	#main_business .swiper-slide { width:100%;}
	
	#main_business .swiper-slide .item .info_wrap { padding-top:0;}



}
@media screen and (max-width: 1026px) {
	#main_news .news_list ul  {
		display: flex;
		flex-wrap: wrap;
	}
	#main_news .news_list li { 
		 margin:10px;
		width:calc((100% - 40px) / 2);
	}
	#main_news .news_list li:nth-child(5)
	{
		display:none;
	}
}
@media screen and (min-width: 1027px) {
	#main_news .main_title {
		position: absolute;
		z-index:1;
	 }
	 #main_news .news_list ul  {display:grid;grid-template-columns: 325px 325px 325px;grid-template-rows: 325px 325px;grid-gap: 30px;justify-content: end;}
	#main_news .news_list li {
		max-width: 325px;
		height: auto;
		aspect-ratio: 1/1;
		max-height: 325px;
		border: 1px solid #fff;
		border-radius: 8px;
		padding: 40px;
		color: #fff;
		transition: all .2s ease-in-out;
		display: flex;
		flex-direction: column;
		grid-template-columns: 150px 150px 150px;
		grid-template-rows: 150px 150px;
		}
	
	#main_news .news_list li:first-child {
		grid-column-start: 2;
	}
	#main_news .news_list li:nth-child(2) {
		margin-top:40px;
	}
	#main_news .news_list li:nth-child(3) {2
		margin-top:-40px;
	}
	#main_news .news_list li:nth-child(4) {
	}
	#main_news .news_list li:nth-child(5) {
		margin-top:40px;
	}
}
@media screen and (min-width: 1201px) {
	#main_business .main_title { max-width:1200px; position: absolute; left:50%; margin-left:-600px;z-index:1}

}




.footer_deco {
    height: 150px;
    background-color: #fff;
    position: relative;
    z-index: 10;
}
.footer_deco .footer_deco_inner {
    position: absolute;
    inset: -1px 0px 0px;
    z-index: 11;
    background-color: #000;
    border-bottom-right-radius: 150px;
}

/**** 태블릿 ***/
@media screen and (max-width: 1200px) {

	#main_visual .slick-slide { height:600px; }
}


/**** 모바일 ***/

@media screen and (max-width: 768px) {
	.visual_title { top:110px; }
	.visual_title span{ font-size:20px;}
	.visual_title strong {font-size:40px;  }
	
	.main_title h3 { font-size:26px;}


}

@media screen and (max-width: 600px) {
	#hg_experience .slick_navigation  { top:60px; }
	#main_business .main_card_wrap .card { width:100%; }
	#main_business .main_card_wrap .card:nth-child(2),
	#main_business .main_card_wrap .card:nth-child(3),
	#main_business .main_card_wrap .card:nth-child(4),
	#main_business .main_card_wrap .card:nth-child(5) {  margin-top:0 }
	

}

@media screen and (max-width: 340px) {
   
}




