@charset "utf-8";

.main_tit{ margin-bottom:50px; text-align:center; }
.main_tit h2{ display:block; font-size:44px; line-height:52px; color:#111; letter-spacing:-0.025em; font-weight:800; }

/* sec01 */
#main .sec01{ }
#main .sec01 .img_slide .img_bx{ position:relative; min-height:700px; overflow:hidden; }
#main .sec01 .img_slide img{ position:absolute; left:0; top:0; width:100%; height:100%; object-fit:Cover; }
#main .sec01 .img_slide img.m{ display:none; }
#main .sec01 .slick-dots{ position:absolute; left:0; bottom:40px; font-size:0; width:100%; text-align:Center; z-index:10; }
#main .sec01 .slick-dots li{ display:inline-block; vertical-align:top; margin:0 10px; }
#main .sec01 .slick-dots li button{ position:relative; display:block; padding:0; width:10px; height:10px; border-radius:50%; background:#fff; text-indent:-9999px; opacity:0.3; }
#main .sec01 .slick-dots li button:before{ content:''; position:absolute; left:50%; top:50%; margin-left:-5px; margin-top:-5px; width:10px; height:10px; border:2px solid #fff; border-radius:50%; box-sizing:border-box; -webkit-transition:all 0.3s; -moz-transition:all 0.3s; transition:all 0.3s; opacity:0; }
#main .sec01 .slick-dots li.slick-active button{ opacity:1; background:transparent; }
#main .sec01 .slick-dots li.slick-active button:before{ opacity:1; }

#main .sec01 .txt_bx{ position:absolute; left:50%; top:50%; width:calc(100% - 50px); max-width:1656px; -webkit-transform:translate(-50%,-50%); moz-transform:translate(-50%,-50%);transform:translate(-50%,-50%); z-index:1; overflow:hidden;}
#main .sec01 .txt_bx .txt1{ margin-bottom:25px; font-size:78px; line-height:88px; color:#fff; font-weight:700; font-family: 'Poppins', sans-serif; }
#main .sec01 .txt_bx .txt2{ margin-bottom:75px; font-size:24px; line-height:34px; color:#fff; letter-spacing:-0.025em; font-weight:700; }
#main .sec01 .txt_bx .btn_bx{}
#main .sec01 .txt_bx .btn_bx a{ position:relative; display:block; width:264px; height:64px; font-size:13px; line-height:62px; color:#fff; border:1px solid #fff; box-sizing:border-box; /* font-family: 'Poppins', sans-serif; */ overflow:hidden; }
#main .sec01 .txt_bx .btn_bx a:before{ content:''; position:absolute; right:0; top:50%; width:54px; height:1px; background:#fff; z-index:1; -webkit-transition:all 0.3s; -moz-transition:all 0.3s; transition:all 0.3s; }
#main .sec01 .txt_bx .btn_bx a:after{ content:''; position:absolute; left:0; top:0; width:0; height:100%; background:#005cab; -webkit-transition:all 0.3s; -moz-transition:all 0.3s; transition:all 0.3s; }
#main .sec01 .txt_bx .btn_bx a span{ display:inline-block; position:absolute; left:35px; z-index:1; -webkit-transition:all 0.3s; -moz-transition:all 0.3s; transition:all 0.3s; }

#main .sec01 .txt_bx .btn_bx a:hover{ border-color:#005cab; letter-spacing:0.3em; }
#main .sec01 .txt_bx .btn_bx a:hover:before{ right:-54px; }
#main .sec01 .txt_bx .btn_bx a:hover:after{ width:100%; }
#main .sec01 .txt_bx .btn_bx a:hover span{ left:35px; } 

#main .sec01 .scroll{ position:absolute; right:65px; bottom:0; width:3px; height:46%; z-index:1; }
#main .sec01 .scroll:before{ content:''; position:absolute; left:-3px; top:-90px; width:9px; height:78px; background:url('../images/main/scroll.png') no-repeat center; }
#main .sec01 .scroll span{ position:relative; display:block; width:100%; height:100%; overflow:hidden; }
#main .sec01 .scroll span:before{ content:''; position:absolute; left:1px; width:1px; height:100%; background:Rgba(255,255,255,.2); }
#main .sec01 .scroll span:after{ content:''; position:absolute; left:0; top:0; width:3px; height:60px; background:#fff; animation: scrollAni 5s linear infinite 0s; }

@-webkit-keyframes scrollAni {
  0% { top:-60px; }
  100% { top:100%; }
}

@keyframes scrollAni {
  0% { top:-40px; }
  100% { top:100%; }
}


#main .sec01 .img_slide .img_bx img{ 
	/*-moz-transform: translate(0) scale(1.3);
	-webkit-transform: translate(0) scale(1.3);
	-o-transform: translate(0) scale(1.3);
	-ms-transform: translate(0) scale(1.3);
	transform: translate(0) scale(1.3); */
	-moz-transform: translate(0) scale(2);
	-webkit-transform: translate(0) scale(2);
	-o-transform: translate(0) scale(2);
	-ms-transform: translate(0) scale(2);
	transform: translate(0) scale(2); 

	-moz-transition: transform 5.0s ;
	-webkit-transition: transform 5.0s ;
	-o-transition: transform 5.0s ;
	transition: transform 5.0s ; }

#main .sec01 .img_slide .active .img_bx img{
	-moz-transform: translate(0) scale(0);
	-webkit-transform: translate(0) scale(1);
	-o-transform: translate(0) scale(1);
	-ms-transform: translate(0) scale(1);
	transform: translate(0) scale(1);
}


/* sec02 */
#main .sec02{ padding:145px 0 0; }
#main .sec02 .video_bx{ position:relative; width:100%; padding-bottom:56.25%; }
#main .sec02 .video_bx iframe{ position:absolute; left:0; top:0; width:100%; height:100%; }
#main .sec02 .txt_bx{ margin-top:50px; }
#main .sec02 .txt_bx dl{ font-size:0; margin:0 auto; width:100%; max-width:1080px; }
#main .sec02 .txt_bx dt{ display:inline-block; vertical-align:top; width:37%; font-size:38px; line-height:48px; color:#111; letter-spacing:-0.025em; }
#main .sec02 .txt_bx dt strong{ font-weight:800; }
#main .sec02 .txt_bx dd{ display:inline-block; vertical-align:top; width:63%; font-size:19px; line-height:32px; color:#666; letter-spacing:-0.025em; word-break: keep-all; word-wrap: break-word; }

/* sec03 */
#main .sec03{ padding-top:135px; }
#main .sec03 .bx_wrap{ font-size:0; overflow:hidden;}
#main .sec03 .bx_wrap ul{ display:flex; flex-wrap:Wrap; margin-right:-40px; }
#main .sec03 .bx_wrap ul li{ display:inline-block; vertical-align:top; position:relative; padding:2.5% 3% 3%; width:calc(33.33% - 40px); min-height:380px; margin-right:40px; background:#f1f3f5; box-sizing:border-box ;}
#main .sec03 .bx_wrap ul li:after{ content:''; position:absolute; right:40px; top:40px; }
#main .sec03 .bx_wrap ul li.li01:after{ width:56px; height:56px; background:url('../images/main/sec03_icon01.png') no-repeat center; }
#main .sec03 .bx_wrap ul li.li02:after{ width:56px; height:52px; background:url('../images/main/sec03_icon02.png') no-repeat center; }
#main .sec03 .bx_wrap ul li.li03:after{ width:55px; height:54px; background:url('../images/main/sec03_icon03.png') no-repeat center; }

#main .sec03 .bx_wrap ul li > strong{ display:block; margin-bottom:105px; width:100%; font-size:26px; line-height:34px; color:#9fa5ae; font-weight:700; /* font-family: 'Poppins', sans-serif; */ font-style: italic; opacity:0.36; }
#main .sec03 .bx_wrap ul li dl{ width:100%; }
#main .sec03 .bx_wrap ul li dt{ margin-bottom:15px; font-size:30px; line-height:40px; color:#090b12; letter-spacing:-0.025em; font-weight:700; word-break: keep-all; word-wrap: break-word;}
#main .sec03 .bx_wrap ul li dd{ font-size:19px; line-height:32px; color:#666; letter-spacing:-0.025em; word-break: keep-all; word-wrap: break-word;}

/* sec04 */
#main .sec04{ padding:145px 0 130px; }
#main .sec04 .bx_wrap{ overflow:hidden; }
/*#main .sec04 .bx_wrap > ul{ font-size:0; margin-right:-40px; }*/
#main .sec04 .bx_wrap > ul{ font-size:0; margin-right:-40px; display: flex; flex-flow: wrap;}
#main .sec04 .bx_wrap > ul > li{ display:inline-block; vertical-align:top; width:calc(33.33% - 40px); margin-right:40px; padding-bottom: 68px; position: relative;}
#main .sec04 .bx_wrap > ul > li .img_bx{ position:relative; height:340px; overflow:hidden; }
#main .sec04 .bx_wrap > ul > li .img_bx img{ position:absolute; left:0; top:0; width:100%; height:100%; object-fit:cover; }
#main .sec04 .bx_wrap > ul > li .img_bx img.m{ display:none; }
#main .sec04 .bx_wrap > ul > li .txt_bx{ position:relative; z-index:1; margin-top:-20px; padding:0 0 0 25px; }
#main .sec04 .bx_wrap > ul > li .txt_bx:before{ content:''; position:absolute; left:0; top:-40px; width:80%; height:60px; background:#fff; }
#main .sec04 .bx_wrap > ul > li .txt_bx div{ position:relative; z-index:1; }
#main .sec04 .bx_wrap > ul > li .txt_bx .txt1{ margin-bottom:25px; font-size:30px; line-height:40px; color:#005cab; font-weight:700; /* font-family: 'Poppins', sans-serif; */}
#main .sec04 .bx_wrap > ul > li .txt_bx .txt2{ margin-bottom:20px; max-width:400px; font-size:30px; line-height:40px; color:#111; font-weight:800; letter-spacing:-0.025em; word-break: keep-all; word-wrap: break-word;}
#main .sec04 .bx_wrap > ul > li .txt_bx .txt3{ margin-bottom:20px; min-height:180px; font-size:18px; line-height:32px; color:#555; letter-spacing:-0.025em; word-break: keep-all; word-wrap: break-word;}
#main .sec04 .bx_wrap > ul > li .txt_bx .txt3 span {display: inline-block;}
#main .sec04 .bx_wrap > ul > li .txt4 { font-size:24px; line-height:34px; color:#111; font-weight:700; letter-spacing:-0.025em; word-break: keep-all; word-wrap: break-word; position: absolute; bottom: 0; left: 25px; width: calc(100% - 25px); min-height: 68px;}

/*#main .sec04 .bx_wrap > ul > li.li02 .txt_bx .txt3{ max-width:444px; }*/
#main .sec04 .bx_wrap > ul > li.li02 .txt_bx .txt3{ max-width:391px; }
#main .sec04 .bx_wrap > ul > li.li03 .txt_bx .txt3{ max-width:467px; }

/* PC */
@media all and (min-width:1025px){
	
}

@media all and (max-width:1250px){
#main .sec03 .bx_wrap ul{ margin-right:-20px; }
#main .sec03 .bx_wrap ul li{ width:calc(33.33% - 20px); margin-right:20px; }
#main .sec03 .bx_wrap ul li dt{ font-size:24px; line-height:34px; }
#main .sec03 .bx_wrap ul li dd{ font-size:15px; line-height:25px; }
}

/* 태블릿&모바일 공통*/
@media all and (max-width:1024px){
	
	.main_tit{ margin-bottom:25px; }
	.main_tit h2{ font-size:28px; line-height:32px; }

	/* sec01 */
	#main .sec01 .img_slide .img_bx{ min-height:300px; }	
	#main .sec01 .slick-dots{ bottom:30px; }
	#main .sec01 .slick-dots li{ margin:0 5px; }
	#main .sec01 .slick-dots li button{ width:9px; height:9px; }
	#main .sec01 .slick-dots li button:before{ margin-left:-5px; margin-top:-5px; width:9px; height:9px; border:1px solid #fff; }

	#main .sec01 .txt_bx .txt1{ margin-bottom:17px; font-size:43px; line-height:49px; }
	#main .sec01 .txt_bx .txt2{ margin-bottom:25px; font-size:18px; line-height:24px; }
	#main .sec01 .txt_bx .btn_bx a{ width:180px; height:38px; font-size:11px; line-height:36px; }
	#main .sec01 .txt_bx .btn_bx a:before{ width:27px; }
	#main .sec01 .txt_bx .btn_bx a span{ left:18px; }

	#main .sec01 .scroll{ display:none; }

	/* sec02 */
	#main .sec02{ padding:58px 0 0; }
	#main .sec02 .txt_bx{ margin-top:25px; }
	#main .sec02 .txt_bx dt{ font-size:23px; line-height:30px; }
	#main .sec02 .txt_bx dd{ font-size:12px; line-height:20px; }

	/* sec03 */
	#main .sec03{ padding-top:53px; }
	#main .sec03 .bx_wrap ul{ margin-right:-15px; }
	#main .sec03 .bx_wrap ul li{ padding:17px 25px 25px; width:calc(33.33% - 15px); min-height:204px; margin-right:15px; }
	#main .sec03 .bx_wrap ul li:after{ right:25px; top:20px; }
	#main .sec03 .bx_wrap ul li.li01:after{ width:49px; height:48px; background:url('../images/main/sec03_icon01_m.png') no-repeat center; background-size:cover; }
	#main .sec03 .bx_wrap ul li.li02:after{ width:50px; height:46px; background:url('../images/main/sec03_icon02_m.png') no-repeat center; background-size:cover; }
	#main .sec03 .bx_wrap ul li.li03:after{ width:50px; height:50px; background:url('../images/main/sec03_icon03_m.png') no-repeat center; background-size:cover; }

	#main .sec03 .bx_wrap ul li > strong{ margin-bottom:45px; font-size:18px; line-height:23px; }
	#main .sec03 .bx_wrap ul li dt{ margin-bottom:7px; font-size:18px; line-height:23px; }
	#main .sec03 .bx_wrap ul li dd{ font-size:12px; line-height:20px; }

	/* sec04 */
	#main .sec04{ padding:55px 0 55px; }
	#main .sec04 .bx_wrap > ul{ margin-right:-15px; }
	#main .sec04 .bx_wrap > ul > li{ width:calc(33.33% - 15px); margin-right:15px; padding-bottom: 44px; }
	#main .sec04 .bx_wrap > ul > li .img_bx{ height:194px; }
	#main .sec04 .bx_wrap > ul > li .txt_bx{ margin-top:-12px; padding:0 15px; }
	#main .sec04 .bx_wrap > ul > li .txt_bx:before{ top:-28px; width:80%; height:40px; }
	#main .sec04 .bx_wrap > ul > li .txt_bx .txt1{ margin-bottom:15px; font-size:19px; line-height:25px; }
	#main .sec04 .bx_wrap > ul > li .txt_bx .txt2{ margin-bottom:12px; max-width:400px; font-size:20px; line-height:25px; }
	#main .sec04 .bx_wrap > ul > li .txt_bx .txt3{ /*margin-bottom:15px;*/ min-height:170px; font-size:12px; line-height:20px; }
	#main .sec04 .bx_wrap > ul > li .txt4{ font-size:17px; line-height:22px; min-height: 44px; left: 15px; width: calc(100% - 30px);}

	/*#main .sec04 .bx_wrap > ul > li.li02 .txt_bx .txt3{ max-width:444px; }*/
	#main .sec04 .bx_wrap > ul > li.li02 .txt_bx .txt3{ max-width:264px; }
	#main .sec04 .bx_wrap > ul > li.li03 .txt_bx .txt3{ max-width:467px; }

}

@media all and (max-width:850px){
	#main .sec04 .bx_wrap > ul{ margin-right:0; }
	#main .sec04 .bx_wrap > ul > li{ margin-bottom:35px; width:100%; margin-right:0; padding-bottom: 0; }
	#main .sec04 .bx_wrap > ul > li:last-child{ margin-bottom:0; }
	#main .sec04 .bx_wrap > ul > li .txt_bx .txt3{ min-height:auto; }
	#main .sec04 .bx_wrap > ul > li .txt4 {position: relative; min-height: auto; }
}

/* 모바일 */
@media all and (max-width:768px){
	
	#main .sec01 .img_slide img.pc{ display:none; } 
	#main .sec01 .img_slide img.m{ display:block; } 
	
	#main .sec02 .txt_bx dl{ text-align:Center; }
	#main .sec02 .txt_bx dt{ margin-bottom:15px; width:100%; }
	#main .sec02 .txt_bx dd{ width:100%; }

	#main .sec03 .bx_wrap ul{ margin-right:0; }
	#main .sec03 .bx_wrap ul li{ width:100%; margin-right:0; min-height:auto; margin-bottom:14px; }
	#main .sec03 .bx_wrap ul li:last-child{ margin-bottom:0; }
	#main .sec03 .bx_wrap ul li dd{ max-width:300px; }

	#main .sec04 .bx_wrap > ul > li .img_bx img.pc{ display:none; }
	#main .sec04 .bx_wrap > ul > li .img_bx img.m{ display:block; }
}