@charset "utf-8";
/* *******************************************************
 * filename : main.css
 * description : 메인 레이아웃 및 컨텐츠 CSS
 * date : 2020-09-08
******************************************************** */
/* ******************  메인 컨텐츠 ********************** */
#mainContainer { width:100%; overflow:hidden; min-width:1920px;}
/* ****************** MAIN :: VISUAL ********************** */
#mainVisual { width:100%; position:relative; top:0; left:0;}
#visualInner{ width:100%; max-height:1032px; overflow:hidden; position:relative;}
.visual-img{width:100%; max-height:1032px; position:relative;}
.visual-img li.visual-container{position:relative;}
.visual-img li.visual-container > img{position:relative; left:0%;bottom:0;
	-moz-transition:left 5.5s linear, opacity 1.5s;
	-ms-transition:left 5.5s linear, opacity 1.5s;
	-webkit-transition:left 5.5s linear, opacity 1.5s;
	-o-transition:left 5.5s linear, opacity 1.5s;
	transition:left 5.5s linear, opacity 1.5s;
}
/* ****************** MAIN :: VISUAL text ********************** */

/* 텍스트영역 */
.main-visual-txt-con{position:absolute; top:20%; top:30vh; left:0; right:0; font-size:16px; color:#fff; /* color:rgba(255,255,255,0.8); */  color:rgba(255,255,255,0.9); letter-spacing:-0.3px; z-index:9999; text-align:center;}
.main-visual-txt-con .visual-txt1{font-size:1.875em; line-height:1.466; /* color:rgba(255,255,255,0.7); */ color:rgba(255,255,255,0.9); margin-bottom:1em; font-weight:500;}
.main-visual-txt-con .visual-tit{font-size:4.15em; font-weight:600; margin-bottom:50px; color:rgba(255,255,255,0.9);}
.main-visual-txt-con .visual-tit .glow-text{white-space:pre; }
.main-visual-txt-con .visual-tit .glow-text span{display:inline-block; }
.main-visual-txt-con .visual-txt2{font-size:22px; line-height:1.875; margin-bottom:2.811em; font-weight:400; letter-spacing: -0.8px;}
.main-visual-txt-con .visual-txt2 span{ display:block;}

.main-visual-txt-con .visual-txt1,.main-visual-txt-con .visual-txt2,.glow-text span{-webkit-animation: text-active-animation 0.5s 0.5s ease both;animation: text-active-animation 0.5s 0.5s ease both;}
.main-visual-txt-con .visual-txt2{-webkit-animation-delay:1.8s;animation-delay:1.8s}
@keyframes text-active-animation {
	from {
		opacity:0;filter:Alpha(opacity=0);
		transform: translateY(30px); 
	}
	to {
		opacity:1.0;filter:Alpha(opacity=100);
		transform: translateY(0); 
	}
}
/* ****************** MAIN :: VISUAL :: ACTIVE ********************** */
.visual-img li.active.visual-container > img{left:-200px;}

/* 메인비주얼  :: 컨트롤영역 */
.main-visual-controls{position: absolute; top:65%; left: 0; width: 100%;text-align: center; z-index: 11; } 
.main-visual-controls > div{display:inline-block; vertical-align:middle;}
.main-visual-controls .arrow-controls button{vertical-align:middle; display:inline-block;}
.main-visual-controls .arrow-controls .prev-visual-btn{margin-right:25px}
.main-visual-controls .arrow-controls i{font-size:24px; letter-spacing:-0.25px; color:#fff;}
.main-visual-controls .arrow-controls .next-visual-btn i{position:relative; top:-1px;}
.main-visual-controls .paging-controls{text-align:center; margin:0 26px 0 35px; color:#fff; font-weight:700}
.main-visual-controls .paging-controls em{margin:0 7px}
.main-visual-controls .stop-pause-controls{position:relative;}
.main-visual-controls .play-visual-btn{display:none;}
.main-visual-controls .stop-pause-controls i{color:#fff; font-size:24px;}
/* 메인 비주얼 :: 스크롤아이콘 */
.main-scroll-icon{position:absolute; bottom:50px; left:50%; transform:translateX(-50%); text-align:center; z-index:9}	/* width값에 맞게 margin-left수정 */
.main-scroll-icon span{display:block; color:#fff; padding-top:5px; letter-spacing:-0.5px; font-weight:300; letter-spacing:0.5px; opacity:0.5;filter:Alpha(opacity=50);}


/* ****************** MAIN :: CONTENT :: 공통 ********************** */
#mainContent {width:100%; background-color:#e5e5e5; padding-top:40px; position:relative; z-index:1;}
.main-tit{font-size:42px; color:#202020; font-weight:600; position:relative; margin-bottom:25px; text-align:center}
.main-tit span, .main-tit em{display:inline-block; vertical-align:middle; letter-spacing:-0.5px; }
.main-subtit{font-size:18px; color:#333; letter-spacing:-0.75px; text-align:center; margin-bottom:4%; opacity:0.8;filter:Alpha(opacity=80);}
.main-tit span{ padding:0 20px;}
.main-tit em{font-size:20px; color:#2a2a2a; display:none;}
/*.main-tit:before{display:inline-block; content:""; width:33px; height:2px; background-color:#1d5bc1; position:absolute; top:0; left:-55px;}*/
.main-tit.white, .main-subtit.white{ color:#fff}
.section{ width:100%; position:relative;}
.section.pt{ padding:4.5% 0 }


/* ****************** 메인 컨텐츠 :: mainContent :: mainBusiness ********************** */
#mainBusiness{/*margin:0 259px;*/ position:relative; padding:4.5% 0; background:url(../../img/main_business_bg.jpg) no-repeat center bottom; background-size:cover;}
.main-business-inner{max-width:1400px; margin:0px auto; height:521px;}
.business-list li > a{display:block; margin:0 5px; position:relative; overflow:hidden; max-height:465px;}
.business-img-thum{position:relative;}
.business-img-cover{position:absolute; top:0; left:0; bottom:0; right:0; max-width:477px; background-color:rgba(0,0,0,0.5); -webkit-transition:all 0.3s; -moz-transition:all 0.3s; -o-transition:all 0.3s; -ms-transition:all 0.3s; transition:all 0.3s;}
.business-txt{position:absolute; left:0; bottom:-60px; padding-bottom:25px; overflow:hidden; width:100%; max-width:477px; background-color:rgba(0,0,0,0.6); -webkit-transition:all 0.3s; -moz-transition:all 0.3s; -o-transition:all 0.3s; -ms-transition:all 0.3s; transition:all 0.3s; border-top:1px solid #fff; border-top:1px solid rgba(255,255,255,0.3);}
.business-txt > h2, .business-txt > strong, .business-txt > p{padding-left:10px; -webkit-transition:all 0.3s; -moz-transition:all 0.3s; -o-transition:all 0.3s; -ms-transition:all 0.3s; transition:all 0.3s;}
.business-txt > h2{font-size:22px; line-height:30px; color:#fff; padding-top:10px; word-break: break-word; height: 60px;}
.business-txt > strong{display:block; font-size:20px; line-height:28px; color:#fff; opacity:0.5;filter:Alpha(opacity=50); font-weight:400; margin-bottom:5px;}
.business-txt > p{font-size:16px; line-height:28px; color:#fff; color:rgba(255,255,255,0.5); letter-spacing:-0.75px; width:100%; min-width:610px; max-width:610px; opacity:0;filter:Alpha(opacity=00); font-weight:300;}
.business-txt > p span{display:block;}
.business-list{display: block;list-style-type: none;list-style: none;position: relative;margin: 0;padding: 0;}
.business-list>*{display: block;overflow: hidden;padding: 0;margin: 0;}
.kwicks.kwicks-processed > * {margin: 0;/*position: absolute;*/}
.kwicks-horizontal > * {float: left;}
.kwicks-horizontal > :first-child {margin-left: 0;}
.kwicks-vertical > :first-child {margin-top: 0;}
.business-list li > a img {}
.business-list li:hover .business-img-cover{background:none;}
.business-list li:hover .business-txt{bottom:0; background-color:rgba(21,60,157,0.9);}
.business-list li:hover .business-txt > h2{font-size:25px; height:auto; margin-bottom:8px}
.business-list li:hover .business-txt > strong{font-size:26px; line-height:32px; font-weight:500; opacity:1.0;filter:Alpha(opacity=100);}
.business-list li:hover .business-txt > p{opacity:1.0;filter:Alpha(opacity=100);}
/* ****************** 메인 컨텐츠 :: mainContent :: mainCompany ********************** */
#mainCompany{width:100%; background:url(../../img/main_company_bg.png) no-repeat center top;background-size: cover;background-attachment: fixed; height:600px; position:relative; box-sizing:border-box; padding-top:4.5%}
#mainCompany:before{ content:""; display:block; background:rgba(0,0,0,0.3); position:absolute; left:0; top:0; width:100%; height:100%;}
#mainCompany .company_list{display: flex;position: absolute;top: 0; left: 0;z-index: 1;width: 100%; height: 100%;}
#mainCompany .company_list li{position:relative; padding-top:15%; width:25%; height:100%; border-left:1px solid rgba(255,255,255,0.2); box-sizing:border-box;}
#mainCompany .company_list li:nth-child(1){border-left:0; }
#mainCompany .company_list li .Obj_inner{padding-top:110px;display:block; position:relative; z-index:1; }
#mainCompany .company_list li:nth-child(1) > .Obj_inner{ background:url("../../img/main_culture_icon1.png") no-repeat center 0;}
#mainCompany .company_list li:nth-child(2) >  .Obj_inner{background:url("../../img/main_culture_icon2.png") no-repeat center 10px;}
#mainCompany .company_list li:nth-child(3) >  .Obj_inner{background:url("../../img/main_culture_icon3.png") no-repeat center 10px;}
#mainCompany .company_list li:nth-child(4) > .Obj_inner{background:url("../../img/main_culture_icon4.png") no-repeat center 10px;}
#mainCompany .company_list li dl{ text-align:center;}
#mainCompany .company_list li dl dt{font-size:30px; color:#fff; font-weight:700; letter-spacing:0;}
#mainCompany .company_list li dl dd{padding-top: 20px;color: #fff;color: rgba(255,255,255,0.85); line-height: 22px; font-size:17px }
/* ****************** 메인 컨텐츠 :: mainContent :: mainProcess ********************** */
#mainProcess{ background:#f6f6f6; width:100%; padding:7% 0}
#mainProcess .main-tit{ text-align:left;}
#mainProcess .con_wrap{padding: 55px 0;}
#mainProcess .con_wrap:before{position: absolute;top: 55%;left: -23%;display: block;content: "";clear: both;width: 0%;height: 600px;transform: translate(0,-50%);background: #2c53b0;}
#mainProcess .con_wrap .con{float:left; width:50%; box-sizing:border-box; position:relative;}
#mainProcess .con_wrap .con.txt_box{ color:#fff; margin-top:30px;}
#mainProcess .con_wrap .con.txt_box .s_tit{font-size: 40px;}
#mainProcess .con_wrap .con.txt_box .s_txt{margin: 23px 0 30px 0; font-size: 17px; line-height: 26px;}
#mainProcess .con_wrap .con.txt_box .con_list{}
#mainProcess .con_wrap .con.txt_box .con_list li{float: left;}
#mainProcess .con_wrap .con.txt_box .con_list li+li {margin-left: 40px;}
#mainProcess .con_wrap .con.txt_box .con_list li:hover .icon{transform:scale(0.95); transition:0.3s;}
#mainProcess .con_wrap .con.txt_box .con_list li a{display: inline-block;color: #fff;}
#mainProcess .con_wrap .con.txt_box .con_list li a .icon{width: 150px;height: 150px;border: 2px solid #fff;border-radius: 50%;display: inline-block;transition: 0.2s;}
#mainProcess .con_wrap .con.txt_box .con_list li:nth-child(1) a .icon{background:url(../../img/main_s2_icon1.png)no-repeat center;}
#mainProcess .con_wrap .con.txt_box .con_list li:nth-child(2) a .icon{background:url(../../img/main_s2_icon2.png)no-repeat center;}
#mainProcess .con_wrap .con.txt_box .con_list li:nth-child(3) a .icon{background:url(../../img/main_s2_icon3.png)no-repeat center;}
#mainProcess .con_wrap .con.txt_box .con_list li a .s_tit{margin-top:20px;font-size: 19px;text-align: center;font-weight: 400;}
#mainProcess .con_wrap .video_box{position:relative; z-index:0;}
#mainProcess .con_wrap .video_box:before{position:absolute; top:10px; left:-10px; display:block; content:""; width:100%; height:100%; background:url(../../img/main_s3_bgitem.png)no-repeat center; z-index:-1;}
/*애니메이션 on*/
#mainProcess >div{ transform: initial!important;}
#mainProcess >div.aos-animate .con_wrap:before {width:100%; transition:0.9s;}

