@charset "utf-8";

.pcbr{display:none !important;}
.ptbr{display:none !important;}
.tbr{display:none !important;}
.tmbr{display:block !important;}
.mbr{display:block !important;}
.pc_view{display:none !important;}
.pt_view{display:none !important;}
.tm_view{display:block !important;}
.t_view{display:none !important;} 
.m_view{display:block !important;}


body{background:#e9e4de;}

section{position:relative; width: 100%; box-sizing:border-box; }
section *{box-sizing:border-box;}
section .txt1{font-size: 12px;color: #444;font-weight: 300;word-break: keep-all;line-height: 1.7;letter-spacing: -0.25px;}

.sec_title_g{position: relative;width: 100%;word-break: keep-all;}
.sec_title_g .cate{font-size: 14px;font-family: 'Montserrat','AritaDotum',sans-serif;font-weight: 600;color: #333;line-height: 1em;letter-spacing: -0.25px;text-transform: uppercase;}
.sec_title_g .title1{font-size: 50px;color: #000;font-family: 'Montserrat','AritaDotum',sans-serif;font-weight: 600;line-height: 1.07;letter-spacing: -1.5px;}
.sec_title_g .title2{font-size: 29px;font-weight: 600;line-height: 1.4;font-family: 'Montserrat','AritaDotum',sans-serif;color: #000;}
.sec_title_g .txt1{color: #;}
.view_more a .arr{position: relative;width: 11px;height: 8px;display: inline-block;margin-left: 7px;}
.view_more a .arr:before{display:block;content:"";position: absolute;top: 50%;left: 0;width: 100%;height: 1px;background: #555;margin-top: -1px;}
.view_more a .arr:after{display:block;content:"";position: absolute;top: 1px;right: 0;width: 4px;height: 4px;border: 1px solid #555;border-top: 0;border-left: 0;transform: rotate(-45deg);}



.main_fig{position: absolute;z-index: -1;}
.main_fig img{width:100%;}
.main_fig.fig1{right: -20px;top: 200px;width: 200px;}
.main_fig.fig2{bottom: 50px;left: 0;width:120px;}
.main_home{background: #111; z-index: 1;}
#wrap .main_home .main_bg_slider{position:absolute; top:0;left:0;}
#wrap .main_home .text_slider_wrap{position:relative;top:0;left:0;display: flex;flex-wrap: wrap;justify-content: center;flex-direction: column;width: 100%;height: 100%;}
#wrap .main_home .main_text_slider{position:relative;top:0;left:0;height: auto;padding-top: 30px;}
.main_home .main_slider,.main_home .slick-list,.main_home .slick-track{width: 100%;height: 100%;outline:0; overflow:hidden;}
.main_home .main_slider .item{outline:0;}
.main_home .main_slider .item,.main_home .main_slider .img{width: 100%;height: 100%;}
.main_home .main_slider .img{position:absolute;top: 0;left: 0;}
.main_home .main_slider .text_g{position: relative;display: flex;flex-wrap: wrap;align-items: center;word-break: keep-all;}

.main_home .main_slider .text_g .title1{font-size: 22px;color: #fff;font-weight: 600;}
.main_home .main_slider .text_g .title1 br{display: none;}
.main_home .main_slider .text_g .title1:before{display:block;content:"";width: 40px;height: 1px;background: rgba(255,255,255,0.4);margin-bottom: 30px;}
.main_home .indicator{position: relative;width: 100%;margin-top: 35px;z-index: 10;}
.main_home .indicator .inner{display: flex;flex-wrap: wrap;align-items: center;}
.main_home .indicator .btn{position: relative;width: 10px;height: 14px;margin-right: 35px;}
.main_home .indicator .btn:before{display:block;content:"";position: absolute;top: 3px;left: 4px;width: 8px;height: 8px;border: 1px solid #fff;border-top: 0;border-left: 0;transform: rotate(135deg);}
.main_home .indicator .btn.next{margin-right: initial;margin-left: 35px;}
.main_home .indicator .btn.next:before{transform:rotate(-45deg);left: -6px;}
.main_home .indicator .dot ul{font-size:0;}
.main_home .indicator .dot li{position:relative; display:inline-block;vertical-align:middle}
.main_home .indicator .dot button{position:relative;width: 7px;height: 7px;border: 1px solid #fff;border-radius: 50%;box-sizing:border-box;}
.main_home .indicator .dot li + li{margin-left: 12px;}
.main_home .indicator .dot li.slick-active button{background: #fff;}
.main_home .status_wrap{position: relative;width: 6px;height: 9px;margin-left: 23px;}
.main_home .status_wrap .stop{display: block;width: 100%;height: 100%;border: 2px solid #fff;border-top: 0;border-bottom: 0;}
.main_home .status_wrap .play{position: relative;display:block;width: 100%;height: 100%;}
.main_home .status_wrap .play:before{display:block;content:"";position: absolute;width: 0px;height: 0px;top: -1px;left: 0;border-left: 6px solid #fff;border-top: 5px solid transparent;border-bottom: 5px solid transparent;border-right: 5px solid transparent;}


#scroll_down{position: absolute;bottom: 0;left: 50%;transform: translateX(-50%);}
#scroll_down:after{display:block;content:"";width: 1px;height: 57px;position: absolute;top: 100%;left: 50%;background: rgba(0,0,0,0.4);margin-left: -1px;}
#scroll_down a{position: relative;display: block;padding-bottom: 40px;}
#scroll_down a:before{display:block;content:"";width: 1px;height: 57px;position: absolute;bottom: 0;left: 50%;background: rgba(255,255,255,0.5);margin-left: -1px;}
#scroll_down a:after{display: inline-block;content:"";position: absolute;bottom: 0;left: 50%;width: 1px;height: 57px;background: #fff;transform:scaleY(0);animation:lineActiveAnimation 1.9s cubic-bezier(0.445,0.05,0.55,0.95) infinite;margin-left:-1px;}
#scroll_down .txt{font-size: 12px;color: #fff;font-weight: 600;font-family: 'Montserrat',sans-serif;line-height: 1em;margin-bottom: 10px;display: block;}
#scroll_down .fig{width: 20px;height: 32px;border: 1px solid #fff;border-radius: 25px;margin: 0 auto;}
@keyframes lineActiveAnimation {
0%{-webkit-transform:scaleY(1);transform:scaleY(1);-webkit-transform-origin:center top;transform-origin:center bottom}
49%{-webkit-transform:scaleY(0);transform:scaleY(0);-webkit-transform-origin:center top;transform-origin:center bottom}
50%{-webkit-transform:scaleY(0);transform:scaleY(0);-webkit-transform-origin:center bottom;transform-origin:center top}
99%{-webkit-transform:scaleY(1);transform:scaleY(1);-webkit-transform-origin:center bottom;transform-origin:center top}
100%{-webkit-transform:scaleY(1);transform:scaleY(1);-webkit-transform-origin:center bottom;transform-origin:center top}
}


#section_group{position: relative;padding-top: 90px;width: 100%;}
.main_slogan {text-align: center;padding-bottom: 40px;}
.main_slogan .sec_title_g .txt1{font-weight: 400;margin-bottom: 23px;font-size: 22px;}

.pipeline{padding-bottom: 140px;}
.pipeline:before{display:block;content:"";position:absolute;bottom:0;left:50%;width:1px;height: calc(100% - 26px);background: rgba(0,0,0,0.1);}
.pipeline .item_list:after{display:block;content:"";position: absolute;top: -28px;left: 10%;width: 80%;height: calc(100% + 28px + 140px);border-left: 1px solid rgba(0,0,0,0.1);border-right: 1px solid rgba(0,0,0,0.1);box-sizing: border-box;z-index: -1;}
.pipeline .sec_title_g{text-align: center;}
.pipeline .contents{position: relative;width: calc(100% + 3.7%);padding-top: 75px;}
.pipeline .contents .item_list{position: relative;width: 100%;}
.pipeline .contents .item_list .slick-list,
.pipeline .contents .item_list .slick-track{overflow:initial;}
.pipeline .item_list .item{position: relative;width: 260px;height: 396px;overflow: hidden;margin-right: 20px;}
.pipeline .item_list .item:first-child{border-top-left-radius: 40px;}
.pipeline .item_list .item:last-child{border-bottom-right-radius:40px;}
.pipeline .item_list .item a{display: block;width: 100%;height: 100%;}
.pipeline .item_list .item .img{position: relative;display: block;width: 100%;height: 110%;top: 50%;margin-top: -80%;}
.pipeline .item_list .item .text_box{position: absolute;bottom: 0;left: 0;width: 100%;padding: 25px 23px;}
.pipeline .item_list .item .text_box .title{font-size: 20px;color: #fff;font-weight: 500;}
.pipeline .item_list .item .text_box .txt1{color: #fff;font-weight: 400;margin-top: 7px;}

.big_font{position: absolute;bottom: -1px;left: 0;width: 100%;text-align: center;}
.big_font .text{font-size: 19vw;color: #000;font-family: 'Montserrat',sans-serif;font-weight: 700;line-height: 0.71;letter-spacing: -3.7px;}

.rnd{z-index: 10;}
.rnd .inner{background: #1f2838;text-align: center;color: #fff;display: flex;flex-wrap: wrap;align-items: center;justify-content: center;width: 100%;max-width: 100%;padding: 80px 20px;overflow: hidden;}
.rnd .bg{position:absolute;top:0;left:0;width: 100%;height: 100%;display: block;}
.rnd .sec_title_g{width: 100%;z-index: 1;}
.rnd .sec_title_g .cate{color: #fff;margin-bottom: 25px;}
.rnd .sec_title_g .title2{color: #fff;}
.rnd .sec_title_g .txt1{color: #fff;font-weight: 400;margin-top: 10px;}
.rnd .sec_title_g .view_more{margin-top: 25px;}
.rnd .sec_title_g .view_more a{width: 135px;height: 38px;border: 1px solid #fff;border-radius: 38px;display: flex;flex-wrap: wrap;align-items: center;justify-content: center;margin: 0 auto;font-size: 12px;color: #fff;font-family: 'Montserrat',sans-serif;text-transform: uppercase;font-weight: 500;}
.rnd .sec_title_g .view_more a .arr:before{background:#fff;}
.rnd .sec_title_g .view_more a .arr:after{border-color:#fff;}
.merit {height: 100% !important;max-height: 100% !important;padding: 130px 0 100px;}
.merit .fig_g{position:absolute;top: -176px;right: -170px;width: 400px;}
.merit .fig_g img{width:100%;}
.merit .fig_g .fig2{position:absolute;top: 92px;right: 72px;width: 195px;}
.merit .sec_title_g .cate{margin-bottom: 30px;}
.merit .sec_title_g .title2{font-weight: 700;line-height: 1.3;letter-spacing: -0.1px;font-size: 25px;}
.merit .horizontal_scrolling{padding-left: 15.5%;padding-left: 40vw;margin-top: 100px;}
.merit .horizontal_scrolling .item_list{width: calc(270px * 4);padding-right: 60vw;box-sizing: initial;height: 100%;}
.merit .item_list{display: flex;flex-wrap: wrap;}
.merit .item_list .item{width: 270px;display: flex;flex-wrap: wrap;}
.merit .item_list .item .fig{position: relative;width: 55px;margin-top: 6px;}
.merit .item_list .item .fig svg{transform: scale(0.45);transform-origin: left top;}
.merit .item_list .item .fig svg *{stroke: #000;}
.merit .item_list .item .text_box .title{font-size: 24px;font-weight: 600;color: #000;line-height: 1.3;font-family: 'Montserrat','AritaDotum',sans-serif;}
.merit .item_list .item .text_box .txt1{font-weight: 400;margin-top: 6px;line-height: 1.75;}

.news_notice{padding: 75px 0 80px;}
.news_notice .inner{max-width:1400px;}
.news_notice .sec_title_g{text-align: center;margin-bottom: 26px;}
.news_notice .sec_title_g .view_more{position: absolute;top: 0;right: 0;z-index: 1;}
.news_notice .sec_title_g .view_more a{display: flex;flex-wrap: wrap;align-items: center;font-size: 12px;font-family: 'Montserrat',sans-serif;font-weight: 500;text-transform: uppercase;color: #444;}
.news_notice .contents{position: relative;width: 100%;}
.news_notice .board_slider{position: relative;width: 100%;}
.news_notice .board_slider .item{margin-right: 40px;width: 223px;}
.news_notice .board_slider .item a{display:block;}
.news_notice .board_slider .item .thumbnail{width: 100%;height: 125px;margin-bottom: 10px;}
.news_notice .board_slider .item .thumbnail .img{display: block;width: 100%;height: 100%;}
.news_notice .board_slider .item .cate_date{display: flex;justify-content: space-between;align-items: center;}
.news_notice .board_slider .item .cate_date .cate{background: #222222;color: #fff;font-size: 12px;font-family: 'Montserrat',sans-serif;line-height: 1em;height: 22px;font-weight: 500;display: flex;flex-wrap: wrap;align-items: center;justify-content: center;padding: 0 11px;border-radius: 22px;}
.news_notice .board_slider .item .cate_date .cate1{background: #d9005f;}
.news_notice .board_slider .item .cate_date .date{font-size: 12px;color: #555;font-family: 'Montserrat',sans-serif;font-weight: 500;}
.news_notice .board_slider .item .text_g{padding-top: 14px;word-break: keep-all;}
.news_notice .board_slider .item .text_g .title{font-size: 15px;color: #222222;font-weight: 600;}
.news_notice .board_slider .item .text_g .title .e_{-webkit-line-clamp: 2;}
.news_notice .board_slider .item .text_g .txt1{color: #666;font-weight: 400;margin-top: 6px;}
.news_notice .board_slider .item .text_g .txt1 .e_{-webkit-line-clamp: 2;}
.news_notice .board_util{display: none !important;}
.news_notice .board_util .swiper-pagenav button{display: block;position: relative;width: 54px;height: 54px;background: #f4f4f4;border-radius: 50%;}
.news_notice .board_util .swiper-pagenav button + button{margin-top: 5px;}
.news_notice .board_util .swiper-pagenav button:before{display: block;content:"";position: absolute;top: 23px;left: 24px;width: 7px;height: 7px;border: 1px solid #666;transform: rotate(135deg);border-top: 0;border-left: 0;}
.news_notice .board_util .swiper-pagenav button.button_next:before{transform: rotate(-45deg);left: 20px;}



#wrap header .logo,
#wrap header #nav > .gnb,
#wrap header .area_r,
#wrap header .line{opacity: 0;}

/*motion*/
body #wrap{opacity:0;}
#wrap.ani{opacity:1; transition:1.5s;}


#scroll_down{opacity: 0;}
#wrap .text_slider_wrap{opacity:0;}
#wrap.ani .text_slider_wrap{opacity:1; transition:1.5s;}
.main_home .main_bg_slider  .img{transform:scale(1); transition:5s ease;}
.main_home .main_bg_slider .on .img{transform:scale(1.07);}
/*
.ani_style1{opacity: 0;}
.ani_style1.is-inview{animation:1.2s aniStyle1 0.1s;  animation-fill-mode: forwards;}
.ani_style2{opacity: 0;}
.ani_style2.is-inview{animation:1.5s aniStyle2;  animation-fill-mode: forwards;}
.ani_style3{opacity: 0;}
.ani_style3.is-inview{animation:1s aniStyle3 0.3s;  animation-fill-mode: forwards;}
.ani_style4{opacity: 0;}
.ani_style4.is-inview{animation:1.2s aniStyle4 0.3s;  animation-fill-mode: forwards;}

.rnd .bg.is-inview{animation:2s aniStyle3 0.2s;  animation-fill-mode: forwards;}
@keyframes aniStyle1 {
0% {
 opacity:0;
}
100% {
  opacity:1;
}
}
@keyframes aniStyle2 {
0% {
 opacity:0; transform:translate3d(0,40px,0);
}
100% {
  opacity:1; transform:translate3d(0,0px,0);
}
}
@keyframes aniStyle3{
0% {
 opacity:0; transform:scale(1.2);
}
100% {
  opacity:1; transform:scale(1);
}
}

@keyframes aniStyle4{
0% {
 opacity:0; transform:scale(1); letter-spacing:8px;
}
100% {
  opacity:1; transform:scale(1);  letter-spacing:0px;
}
}*/















































/* section2 */
#section2{background:linear-gradient( rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6) ),url(http://websitekorea.co.kr/images/dongsan/main17.jpg) no-repeat center;background-size:cover;text-align:center;padding:30px 0 30px}
#section2 h2{margin-top:15px;font-size:30px;color:#fff;font-weight:400;}
#section2 h2 span{display:inline-block;line-height:100%;border-bottom:1px solid #fff;}
#section2 h3{margin:40px 0 15px;padding:0 4%;font-size:40px;color:#fff;font-weight:600;}
#section2 p{font-size:15px;color:rgba(255,255,255,1);}
#section2 .business_tabcon{
	box-sizing:border-box;
	position:relative;
	width:100%;
	margin:40px auto;
}
#section2 .business_tabcon:before{
	display:block;
	content:"";
	width:100%;
	height: 1px;
	background:rgba(255,255,255,0.6);
	position:absolute;
	left:0;
	top:50%;
	margin-top: 0.5px;
}
#section2 .business_tabcon:after{}
#section2 .business_tabcon .tabcon{position:relative;max-width:82%;margin:0 auto;}
#section2 .business_tabcon .business{margin:0 auto;max-width: 560px;}
#section2 .business_tabcon .business>div{}
#section2 .business_tabcon .slick-prev{
	display:inline-block;
	cursor:pointer;
	position:absolute;
	width: 18px;
	height: 18px;
	border: 0;
	border-left:1px solid #fff;
	border-bottom:1px solid #fff;
	background:0;
	outline:0;
	transform: rotate(45deg);
	left: -5%;
	top:50%;
	margin: -8px 0 0 0;
	font-size: 0;
}
#section2 .business_tabcon .slick-next{
	display:inline-block;
	cursor:pointer;
	position:absolute;
	border: 0;
	width: 18px;
	height: 18px;
	border-left:1px solid #fff;
	border-bottom:1px solid #fff;
	background:0;
	outline:0;
	transform: rotate(-135deg);
	right: -5%;
	top:50%;
	margin: -8px 0 0 0;
	font-size: 0;
}

#section2 .business_tabcon .swiper-slide,#section2 .business_tabcon .swiper-slide a{
    display: block;
    outline: 0;
}
#section2 .business_tabcon .swiper-slide a{padding:;}
#section2 .business_tabcon .boxwrap{
	position:relative;
	width: 100%;
	height: 36vw;
	max-height: 230px;
	margin:0 auto;
	perspective:1000px;
}
#section2 .business_tabcon .boxwrap:before{
	display:block;
	content:"";
	width: 4px;
	height: 4px;
	background:#fff;
	border-radius:50%;
	position:absolute;
	left:50%;
	top:50%;
	transform:translate(-50%,-50%);
	margin-top: 1px;
}
#section2 .business_tabcon .boxwrap .bg{
	position:absolute;left:0;top:0;width:100%;height:100%;
	/*background:url(../images/main/sec2_guide_bg.png) no-repeat;*/
	transform:rotate(0);transition:all 3s ease-out;
}
#section2 .business_tabcon .boxwrap .bg svg{width:100%;height:100%;}
#section2 .business_tabcon .swiper-slide:hover .boxwrap .bg svg{filter: drop-shadow(10px -3px 12px rgba(255,255,255,0.8) inset);}
#section2 .business_tabcon .swiper-slide:hover .boxwrap .bg svg polygon{stroke:#4ec3f4;stroke-opacity:1;}
#section2 .business_tabcon .swiper-slide:hover .boxwrap .bg{animation:business_ani 5s linear infinite;}
@keyframes business_ani{
	0%{transform:rotate(0);}
	100%{transform:rotate(360deg);}
}
@keyframes business_ani2{
	0%{transform:rotate(360deg);}
	100%{transform:rotate(0deg);}
}
#section2 .business_tabcon .boxwrap .ico{
	box-sizing:border-box;
	height: 50%;
	display:flex;
	align-items:center;
	justify-content:center;
	padding-top:15px;
}
#section2 .business_tabcon .boxwrap .ico svg{
    transform: scale(0.7);
}
#section2 .business_tabcon .boxwrap .sbj{
	box-sizing:border-box;
	height:50%;
	padding-top: 4%;
	font-size: 17px;
	color:#fff;
	font-weight: 400;
}
#section2 .business_tabcon .swiper-slide:hover .boxwrap .sbj{color:#4ec3f4;}



#section2 .business_tabs{display:none;padding:0 5%;}
#section2 .business_tabs>div{display:none;}
#section2 .business_tabs>div:first-child{display:block;}
#section2 .business_tabs ul{display:flex;flex-wrap:wrap;align-items:center;}
#section2 .business_tabs ul li{overflow:hidden;width:25%;}
#section2 .business_tabs ul li:nth-child(1),
#section2 .business_tabs ul li:nth-child(2),
#section2 .business_tabs ul li:nth-child(3),
#section2 .business_tabs ul li:nth-child(4){margin-bottom:15px;}
#section2 .business_tabs ul li a{
	display:block;position:relative;
	padding-bottom:15px;
	font-size:16px;color:#fff;font-weight:500;text-align:left;
}
#section2 .business_tabs ul li a:before{
	display:block;content:"";
	width:100%;height:3px;
	border-bottom:3px solid rgba(255,255,255,0.3);
	position:absolute;left:0;bottom:0;
}
#section2 .business_tabs ul li a:after{
	display:block;content:"";
	width:0;height:3px;	
	border-bottom:3px solid rgba(255,255,255,1);
	position:absolute;left:0;bottom:0;transition:all 0.6s;
}
#section2 .business_tabs ul li.on a{}
#section2 .business_tabs ul li.on a:after{width:100%;}