@charset "utf-8";

#main .main_tit{position:relative; padding-top:80px; margin-bottom:70px; font-size:46px; line-height:56px; color:#fff; font-weight:700; font-family: 'Montserrat', sans-serif; text-align:center; background:url('../images/main/main_tit_deco.png') no-repeat center top; text-transform: uppercase; }

#main .sec01 { position:relative; overflow:hidden; }
#main .sec01 .scroll{ position:absolute; left:50%; margin-left:-15px; bottom:40px; width:30px; height:50px; border:2px solid #ddd; border-radius:15px; box-sizing:border-box; }
#main .sec01 .scroll > span{ position:absolute; left:50%; top:10px; margin-left:-3px; width:6px; height:6px; background:#fff; border-radius:50%; animation: scroll 1s infinite; animation-timing-function: ease-in-out; }
@keyframes scroll {
	0% {top:10px;}
	50% {top:20px;}
	100% {top:10px;}
}

#main .sec01 .slide{ position:relative; }
#main .sec01 .slide .img_bx{ position:relative; overflow:hidden; min-height:600px; }
#main .sec01 .slide .img_bx div{ position:absolute; left:0; top:0; width:100%; height:100%; background-size:Cover !important; }

#main .sec01 .slide .img_bx div{ z-index:1;
	-moz-transform: translate(0) scale(1.1);
	-webkit-transform: translate(0) scale(1.1);
	-o-transform: translate(0) scale(1.1);
	-ms-transform: translate(0) scale(1.1);
	transform: translate(0) scale(1.1); 

	-moz-transition: transform 1.3s ease-out;
	-webkit-transition: transform  1.3s ease-out;
	-o-transition: transform 1.3s ease-out;
	transition: transform  1.3s ease-out; 
}
#main .sec01 .slide .active .img_bx div{
	-moz-transform: translate(0) scale(1);
	-webkit-transform: translate(0) scale(1);
	-o-transform: translate(0) scale(1);
	-ms-transform: translate(0) scale(1);
	transform: translate(0) scale(1);
}


#main .sec01 .txt_bx{ position:absolute; left:50%; top:50%; width:100%; max-width:1400px; box-sizing:border-box; transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); -moz-transform:translate(-50%,-50%); z-index:10; }
#main .sec01 .txt_bx > strong{ display:block; font-size:70px; line-height:70px; color:#fff; font-weight:700; font-family: 'Montserrat', sans-serif; text-transform: uppercase;}
#main .sec01 .txt_bx > p{ margin-top:5px; font-size:22px; line-height:32px; color:#fff; font-family: 'Montserrat', sans-serif; }
#main .sec01 .txt_bx > p > strong{ font-weight:700;}
#main .sec01 .txt_bx .ctr_bx{ margin-top:35px; font-size:0; }
#main .sec01 .txt_bx .ctr_bx .count{ display:inline-block; font-size:16px; line-height:18px; color:#fff; font-weight:700; font-family: 'Montserrat', sans-serif; }
#main .sec01 .txt_bx .ctr_bx .count span{ display:inline-block; vertical-align:top; }
#main .sec01 .txt_bx .ctr_bx .count p{ display:inline-block; vertical-align:top; margin:0 11px;}
#main .sec01 .txt_bx .ctr_bx .arrow{ display:inline-block; vertical-align:top; width:11px; height:18px; text-indent:-9999px; }
#main .sec01 .txt_bx .ctr_bx .prev_ar{ margin-right:25px; background:url('../images/main/main_s_ar01.png') no-repeat center; }
#main .sec01 .txt_bx .ctr_bx .next_ar{ margin-left:25px; background:url('../images/main/main_s_ar02.png') no-repeat center; }
#main .sec01 .txt_bx a.detail{ display:inline-block; position:relative; margin-top:100px; padding-right:70px; font-size:15px; line-height:40px; color:#fff; letter-spacing:0.05em; background:url('../images/btn/detail_ar.png') no-repeat right center;}
#main .sec01 .txt_bx a.detail:before{ content:''; position:absolute; right:-15px; top:0; width:40px; height:40px; border:1px solid rgba(255,255,255,0.2); border-radius:50%; box-sizing:border-box; -webkit-transition:all 0.3s; -moz-transition:all 0.3s; transition:all 0.3s;}
#main .sec01 .txt_bx a.detail:after{ content:''; position:absolute; right:-5px; top:10px;  width:20px; height:20px; border:1px solid rgba(255,255,255,0.2); border-radius:50%; box-sizing:border-box; opacity:0; -webkit-transition:all 0.3s; -moz-transition:all 0.3s; transition:all 0.3s; transition-delay: 0.05s;}

#main .sec01 .txt_bx .pause{ display:inline-block; margin-left:16px; padding:0; width:20px; height:20px; text-indent:-9999px; background:url('../images/btn/btn_pause.png') no-repeat center; } 
#main .sec01 .txt_bx .pause.play{ background:url('../images/btn/btn_play.png') no-repeat center; }

#main .sec02{ padding-bottom:100px; background:url('../images/main/sec02_bg.jpg') no-repeat center; background-size:cover; }
#main .sec02 .main_tit{ color:#222; }
#main .sec02 ul{ font-size:0; }
#main .sec02 ul li{ display:inline-block; vertical-align:top; width:25%; }
#main .sec02 ul li:nth-child(2n-1){ margin-top:75px; }
#main .sec02 ul li a{ position:relative; display:block; padding-bottom:143%; background-size:cover !important; } 
#main .sec02 ul li a:before{ content:''; position:absolute; left:0; top:0; width:100%; height:100%; background:url('../images/main/sec02_hover.png') no-repeat center; background-size:cover; box-shadow:0 20px 20px rgba(0,0,0,0.3); opacity:0; -webkit-transition:all 0.3s; -moz-transition:all 0.3s; transition:all 0.3s; }
#main .sec02 ul li a:after{ content:''; position:absolute; opacity:0; right:10%; bottom:8%; width:24px; height:24px; background:url('../images/main/sec02_plus.png') no-repeat center; -webkit-transition:all 0.3s; -moz-transition:all 0.3s; transition:all 0.3s;}
#main .sec02 ul li a div{ position:absolute; left:0; top:0; padding:12% 10%; }
#main .sec02 ul li a strong{ display:block; font-size:24px; line-height:34px; color:#fff; font-weight:700; font-family: 'Montserrat', sans-serif; }
#main .sec02 ul li a p{ position:relative; top:20px; opacity:0; margin-top:15px; font-size:14px; line-height:26px; color:#fff; word-break: keep-all; word-wrap: break-word; -webkit-transition:all 0.3s; -moz-transition:all 0.3s; transition:all 0.3s;}
#main .sec02 ul li.li01 a{ background:url('../images/main/sec02_bg01.jpg') no-repeat center; }
#main .sec02 ul li.li02 a{ background:url('../images/main/sec02_bg02.jpg') no-repeat center; }
#main .sec02 ul li.li03 a{ background:url('../images/main/sec02_bg03.jpg') no-repeat center; }
#main .sec02 ul li.li04 a{ background:url('../images/main/sec02_bg04.jpg') no-repeat center; }

#main .sec03{ padding-bottom:100px; background:url('../images/main/sec03_bg.jpg') no-repeat center; background-size:cover; }
#main .sec03 .form_bx{ padding:35px 100px; background:#fff; border-radius:10px; }
#main .sec03 .form_bx > p{ margin-bottom:30px; font-size:16px; line-height:26px; color:#666; font-family: 'Montserrat', sans-serif; }
#main .sec03 .form_bx .bx{ margin-bottom:30px; font-size:0; }
#main .sec03 .form_bx .bx:last-of-type{ margin-bottom:0; }
#main .sec03 .form_bx .bx strong{ display:block; margin-bottom:15px; font-size:18px; line-height:28px; color:#222; font-weight:700; font-family: 'Montserrat', sans-serif;}
#main .sec03 .form_bx .bx input{ padding:15px 20px; width:100%; height:50px; font-size:12px; line-height:18px; color:#666; border:1px solid #ddd; border-radius:3px; box-sizing:border-box; font-family: 'Montserrat', sans-serif !important; outline:none; }
#main .sec03 .form_bx .bx textarea{ padding:15px 20px; width:100%; height:120px; font-size:12px; line-height:18px; color:#666; border:1px solid #ddd; border-radius:3px; box-sizing:border-box; font-family: 'Montserrat', sans-serif !important; outline:none; resize:none; }
#main .sec03 .form_bx .bx.two{ margin-right:-40px; }
#main .sec03 .form_bx .bx.two > div{ display:inline-block; vertical-align:top; width:calc(50% - 40px); margin-right:40px; }
#main .sec03 .form_bx .btn_bx{ margin-top:40px; text-align:center; }
#main .sec03 .form_bx .btn_bx a{ display:inline-block; width:220px; height:60px; font-size:18px; line-height:58px; color:#222; border:1px solid #000; box-sizing:border-box; font-weight:700; font-family: 'Montserrat', sans-serif; text-transform: uppercase;}
#main .sec03 .form_bx .ag_ck{ margin-top:15px; text-align:Center; }
#main .sec03 .form_bx .ag_ck label{ display:inline-block; font-size:16px; line-height:26px; color:#444; } 
#main .sec03 .form_bx .ag_ck label input{ width:20px; height:20px; border-radius:0; }
#main .sec03 .form_bx .ag_ck a{ display:inline-block; font-weight:700; color:#0092d3; text-decoration:underline; }

#main .sec04 {padding-bottom: 100px;}
#main .sec04 .main_tit {color: #222;}
#main .sec04 .list_bx ul {font-size: 0; display: flex; flex-flow: wrap;}
#main .sec04 .list_bx ul li {width: calc(25% - 9.75px); margin-right: 13px; box-sizing: border-box;}
#main .sec04 .list_bx ul li:nth-child(4n) {margin-right: 0;}
#main .sec04 .list_bx ul li a {display: block; box-sizing: border-box; padding: 35px 30px 36px; background-color: #fff; position: relative; height: 100%;}
#main .sec04 .list_bx .type {font-size: 16px; color: #0092d3; font-weight: 700; letter-spacing: -0.05em; word-break: keep-all; margin-bottom: 18px; box-sizing: border-box; min-height: 24px;}
#main .sec04 .list_bx .subject {font-size: 24px; color: #222222; font-weight: 700; line-height: 36px; letter-spacing: -0.05em; word-break: keep-all; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; text-overflow:ellipss; display:-webkit-box; height: 72px; box-sizing: border-box;}
#main .sec04 .list_bx .txt {font-size: 16px; line-height: 24px; color: #666666; letter-spacing: -0.05em; word-break: keep-all; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; text-overflow:ellipss; display:-webkit-box; height: 72px; margin-top: 21px;}
#main .sec04 .list_bx .date {font-size: 14px; color: #aaaaaa; word-break: keep-all; margin-top: 42px;}
#main .sec04 .btn_bx {text-align: center; font-size: 0; padding-top: 60px;}
#main .sec04 .btn_bx a {display: inline-block; width: 220px; line-height: 60px; text-align: center; background-color: #0092d3; font-size: 18px; color: #ffffff; font-weight: 700; word-break: keep-all; font-family: 'Montserrat', sans-serif;}

/* PC */
@media all and (min-width:1025px){
	#main .sec02 ul li a:hover:before{ opacity:1; }
	#main .sec02 ul li a:hover:after{ opacity:1; transform: rotate( 180deg ); -webkit-transform: rotate( 180deg ); -moz-transform: rotate( 180deg ); }
	#main .sec02 ul li a:hover p{ top:0; opacity:1; }
	#main .sec01 .txt_bx a:hover:before{ right:-25px; top:-10px; width:60px; height:60px; }
	#main .sec01 .txt_bx a:hover:after{ opacity:1; right:-15px; top:0; width:40px; height:40px; }
	
	#main .sec04 .list_bx ul li {-webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s;}
	#main .sec04 .list_bx ul li:hover {z-index: 1;}
	#main .sec04 .list_bx ul li a {-webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s;}
	#main .sec04 .list_bx ul li a:hover {box-shadow: 0 30px 40px rgba(17,17,17,0.1);}
}

@media all and (max-width:1430px){ 
	#main .sec01 .txt_bx{ padding:0 20px; }
}

/* 태블릿&모바일 공통*/
@media all and (max-width:1024px){

	#main .main_tit{ padding-top:45px; margin-bottom:25px; font-size:30px; line-height:35px; background:url('../images/main/main_tit_deco_m.png') no-repeat center top; background-size:4px auto; }
	
	#main .sec01 .scroll{ display:none; }
	#main .sec01 .slide .img_bx{ min-height:auto; height:500px !important; }
	#main .sec01 .txt_bx{ padding-top:70px; }
	#main .sec01 .txt_bx > strong{ font-size:45px; line-height:45px; }
	#main .sec01 .txt_bx > p{ margin-top:10px; font-size:20px; line-height:25px; }
	#main .sec01 .txt_bx .ctr_bx{ margin-top:47px; }
	#main .sec01 .txt_bx .ctr_bx .count{ font-size:16px; line-height:18px }
	#main .sec01 .txt_bx .ctr_bx .count p{ margin:0 11px;}
	#main .sec01 .txt_bx .ctr_bx .arrow{ width:11px; height:18px; }
	#main .sec01 .txt_bx .ctr_bx .prev_ar{ margin-right:23px; background:url('../images/main/main_s_ar01_m.png') no-repeat center; background-size:11px auto;}
	#main .sec01 .txt_bx .ctr_bx .next_ar{ margin-left:23px; background:url('../images/main/main_s_ar02_m.png') no-repeat center; background-size:11px auto;}
	#main .sec01 .txt_bx a.detail{ margin-top:105px; padding-right:47px; font-size:11px; line-height:30px; background:url('../images/btn/detail_ar_m.png') no-repeat right center; background-size:37px auto; }
	#main .sec01 .txt_bx a.detail:before{ right:-10px; top:0; width:30px; height:30px; }
	#main .sec01 .txt_bx a.detail:after{ display:none;}

	#main .sec01 .txt_bx .pause{ margin-left:16px; width:20px; height:20px; background:url('../images/btn/btn_pause_m.png') no-repeat center; background-size:20px auto;} 
	#main .sec01 .txt_bx .pause.play{ background:url('../images/btn/btn_play_m.png') no-repeat center; background-size:20px auto;}

	#main .sec02{ padding-bottom:40px; background:url('../images/main/sec02_bg_m.jpg') no-repeat center; background-size:cover; }
	#main .sec02 ul{ font-size:0; }
	#main .sec02 ul li{ width:25%; }
	#main .sec02 ul li:nth-child(2n-1){ margin-top:50px; }
	#main .sec02 ul li a{ padding-bottom:143%; } 
	#main .sec02 ul li a:before{ display:none; }
	#main .sec02 ul li a:after{ opacity:1; right:15px; bottom:15px; width:15px; height:15px; background:url('../images/main/sec02_plus_m.png') no-repeat center; background-size:15px auto; }
	#main .sec02 ul li a div{ padding:15px 20px; }
	#main .sec02 ul li a strong{ font-size:18px; line-height:23px; }
	#main .sec02 ul li a p{ display:none; }
	#main .sec02 ul li.li01 a{ background:url('../images/main/sec02_bg01_m.jpg') no-repeat center; }
	#main .sec02 ul li.li02 a{ background:url('../images/main/sec02_bg02_m.jpg') no-repeat center; }
	#main .sec02 ul li.li03 a{ background:url('../images/main/sec02_bg03_m.jpg') no-repeat center; }
	#main .sec02 ul li.li04 a{ background:url('../images/main/sec02_bg04_m.jpg') no-repeat center; }
	
	#main .sec03{ padding-bottom:60px; background:url('../images/main/sec03_bg_m.jpg') no-repeat center; background-size:cover; }
	#main .sec03 .form_bx{ padding:25px 15px; border-radius:5px; }
	#main .sec03 .form_bx > p{ margin-bottom:15px; font-size:13px; line-height:18px; }
	#main .sec03 .form_bx .bx{ margin-bottom:15px; }
	#main .sec03 .form_bx .bx strong{ margin-bottom:7px; font-size:15px; line-height:20px; }
	#main .sec03 .form_bx .bx input{ padding:8px 10px; height:35px; font-size:11px; line-height:17px; }
	#main .sec03 .form_bx .bx textarea{ padding:8px 10px; height:100px; font-size:11px; line-height:17px;}
	#main .sec03 .form_bx .bx.two{ margin-right:0; }
	#main .sec03 .form_bx .bx.two > div{ width:100%; margin-right:0; margin-bottom:15px; }
	#main .sec03 .form_bx .bx.two > div:last-of-type{ margin-bottom:0; }
	#main .sec03 .form_bx .btn_bx{ margin-top:20px; }
	#main .sec03 .form_bx .btn_bx a{ width:140px; height:40px; font-size:14px; line-height:38px; }
	#main .sec03 .form_bx .ag_ck{ margin-top:15px; }
	#main .sec03 .form_bx .ag_ck label{ font-size:13px; line-height:18px; } 
	#main .sec03 .form_bx .ag_ck label input{ width:15px; height:15px; }
	
	#main .sec04 {padding-bottom: 40px;}
	#main .sec04 .list_bx ul li a {padding: 15px;}
	#main .sec04 .list_bx .type {min-height: auto; margin-bottom: 10px; font-size: 12px; min-height: 18px;}
	#main .sec04 .list_bx .subject {font-size: 15px; line-height: 21px; height: 42px;}
	#main .sec04 .list_bx .txt {font-size: 13px; line-height: 18px; margin-top: 10px; height: 54px;}
	#main .sec04 .list_bx .date {margin-top: 13px; font-size: 12px;}
	#main .sec04 .btn_bx {padding-top: 20px;}
	#main .sec04 .btn_bx a {font-size: 14px; line-height: 40px; width: 140px;}
}

/* 모바일 */
@media all and (max-width:768px){
	#main .sec02 ul li{ width:88%; }
	#main .sec02 ul li:nth-child(2n-1){ margin-top:0; margin-left:12%; }
	#main .sec02 ul li a{ padding-bottom:0; height:150px; } 
	
	#main .sec04 .list_bx ul li:nth-child(n) {margin-right: 0; width: 100%; padding-bottom: 15px; border-bottom: 1px solid #ddd; margin-bottom: 15px;}
	#main .sec04 .list_bx ul li:first-child {padding-top: 15px; border-top: 1px solid #ddd;}
	#main .sec04 .list_bx ul li:last-child {margin-bottom: 0;}
	#main .sec04 .list_bx ul li a {padding: 0;}
	#main .sec04 .list_bx .subject {height: auto;}
	#main .sec04 .list_bx .txt {height: auto;}
}