@charset "utf-8";

/* 슬라이드 공용 */
.slick-slider{transition:all ease-in-out .3s; -webkit-transition:all ease-in-out .3s; 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-slide{ display:none; height:100%; min-height:1px; vertical-align:middle; }
.slick-list{ overflow:hidden; }
.slick-list.dragging{ cursor:pointer; }
.slick-initialized .slick-slide{ display:inline-block; }
.slick-arrow.slick-hidden { display:none; }
.slick-current { opacity:1; display:block; }

/* 메인비주얼 */
.main_visual {position:relative; padding-top:9rem; }

	/* sns 바로가기 200813 */
/* 	.sns_wrap{position: absolute; width:100%; max-width:1400px; top:13%; left:50%; margin-left:-700px; z-index:201;}
	.sns_link{max-width:400px; }
	.sns_link li{float:left; margin-left: 10px;}
	.sns_link li:first-child{margin-left:0;}
	.sns_link li a{display:block;}
	.sns_link li a:hover img{-webkit-animation:sns_link_icon 0.5s ease;animation:sns_link_icon 0.5s ease;} */
	
.sns_wrap{position: absolute; width:100%; max-width:1400px; top:13%; left:22%; margin-left:-700px; z-index:201;}
.sns_link{max-width:400px; margin:0 auto; }
.sns_link li{float:left; margin-left: 10px;}
.sns_link li:first-child{margin-left:0;}
.sns_link li a{display:block;}
.sns_link li a:hover img{-webkit-animation:sns_link_icon 0.5s ease;animation:sns_link_icon 0.5s ease;}

/* 슬로건 */
.main_visual .slogan{ text-align:center; color:#fff; word-break:keep-all; }
.main_visual .slogan p{ text-align:center; font-size:1.2rem;  }
.main_visual .slogan p span{ color:#bbedff; }
.main_visual .slogan h2 { /*font-family:'SpoqaR'; 200609 삭제*/ font-size:2rem; padding:0 2rem; }

/* 메인비주얼 동영상 */
.visual_wrap { position:relative; z-index:100; max-width:1920px; height:100%; margin:0 auto; overflow:hidden; }
.visual_wrap .mvisual { position:relative; z-index:200; padding:0; margin:3rem auto; width:100%; transition-delay:0s; -webkit-transition-delay:0s; opacity: 0; visibility: hidden; transition: opacity 1s ease; -webkit-transition: opacity 1s ease; } /* 200609 수정 */
.visual_wrap .mvisual.slick-initialized { visibility: visible; opacity: 1; } /* 200609 추가 */
.visual_wrap .mvisual .slick-list { padding-bottom:10px !important; }
.visual_wrap .mvisual .mvBox { position:relative; width:450px; height:450px;}
.visual_wrap .mvisual .mvBox:before { position:absolute; top:0; left:50%; width:800px; height:100%; background:#000; opacity:0.4; transform: translateX(-50%); -webkit-transform: translateX(-50%); z-index:10; content:''; }
.visual_wrap .mvisual .mvBox video { position:absolute; top:50%; left:50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); width:800px; height:450px; background:#000; -webkit-box-shadow:8px 8px 10px 0px rgba(0,0,0,0.4); -moz-box-shadow:8px 8px 10px 0px rgba(0,0,0,0.4); box-shadow:8px 8px 10px 0px rgba(0,0,0,0.4); }
.visual_wrap .mvisual .mvBox iframe { position:absolute; top:50%; left:50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); width:800px; height:450px; background:#000; -webkit-box-shadow:8px 8px 10px 0px rgba(0,0,0,0.4); -moz-box-shadow:8px 8px 10px 0px rgba(0,0,0,0.4); box-shadow:8px 8px 10px 0px rgba(0,0,0,0.4); }
.visual_wrap .mvisual .mvBox.slick-slide, .mvBox.slick-slide[aria-hidden="true"]:not(.slick-cloned) ~ .slick-cloned[aria-hidden="true"] { transform: scale(0.5); -webkit-transform: scale(0.5); transition:all 0.3s ease; -webkit-transition:all 0.3s ease; }
.visual_wrap .mvisual .mvBox.slick-slide:nth-child(1), .visual_wrap .mvisual .mvBox.slick-slide:nth-child(2) { opacity:0; } /* 200609 추가*/
.visual_wrap .mvisual .mvBox.slick-active { transform: scale(0.7); -webkit-transform: scale(0.7); z-index:5; }
.visual_wrap .mvisual .mvBox.slick-center, .mvBox.slick-slide[aria-hidden="true"]:not([tabindex="-1"]) + .slick-cloned[aria-hidden="true"] { transform: scale(1); -webkit-transform: scale(1); z-index:10; }
.visual_wrap .mvisual .mvBox.slick-center:before { display:none; }

.visual_wrap .slick-dots { display:table; margin:3rem auto 0; }
.visual_wrap .slick-dots li { float:left; line-height:0; }
.visual_wrap .slick-dots li button { width:13px; height:13px; border-radius:50%; background:#98b4ef; margin:0 7px; text-indent:-9999%; overflow:hidden; cursor:pointer; box-sizing:border-box; transition:all .3s ease; -ms-transition:all .3s ease; -moz-transition:all .3s ease; -webkit-transition:all .3s ease; }
.visual_wrap .slick-dots .slick-active button { width:13px; height:13px; border:3px solid #0288d1; background:none; }

.mcontrol a { position:absolute; bottom:2.8rem; width:44px; height:23px; z-index:150; }
.mcontrol a.btn_m_next { right:50%; margin-right:-150px; background:url('/images/web/ect/main/btn_m_next.png') no-repeat; }
.mcontrol a.btn_m_prev { left:50%; margin-left:-150px; background:url('/images/web/ect/main/btn_m_prev.png') no-repeat; } 


/* 동영상 */
.video { position:relative; }
.video h3 { font-size:34px; font-family:'NotoB'; /* 200609 수정*/ color:#000; margin-bottom:10px; }
.video .video_slide ul { float:left; }
.video .video_slide ul:nth-child(4n+1) { margin-left:0; }
.video .video_slide ul li { position:relative; width:95%; margin:0 auto 70px; }
.video .video_slide ul li a { display:block; width:100%; height:100%; }
.video .video_slide ul li a .img { position:relative; width:100%; height:220px; overflow:hidden; }
.video .video_slide ul li a .img:before { position:absolute; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.4); content:''; z-index:2; transition:all .3s ease; -ms-transition:all .3s ease; -webkit-transition:all .3s ease; }
.video .video_slide ul li a .img:after { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); width:60px; height:60px; background:rgba(255,255,255,0.45) url('/images/web/ect/main/btn_video.png') no-repeat center; border-radius:50%; content:''; z-index:3;transition:all .3s ease; -ms-transition:all .3s ease; -webkit-transition:all .3s ease; }
.video .video_slide ul li a:hover .img { box-shadow:3px 3px 6px 0 rgba(0, 0, 0, 0.2); }
.video .video_slide ul li a:hover .img:after { transform:translate(-50%,-50%) rotateY(360deg); -webkit-transform:translate(-50%,-50%) rotateY(360deg); } 
.video .video_slide ul li a:hover .img:before { background:rgba(0,0,0,0.6); }
.video .video_slide ul li a .img img { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); width:100%; height:auto; }
.video .video_slide ul li a .txt { width:100%; font-family:'NotoM'; color:#000; padding:10px 0 0;  overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
.video .video_slide ul li a .txt span { display:block; color:#666; }
.video .video_slide ul li a:hover .txt { color:#0068b7; } 

.video .control { position:absolute; right:0; top:12px; }
.video .control a { position:relative; display:block; width:27px; height:27px; float:left; margin-left:30px; }
.video .control a.btn_prev { background:url('/images/web/ect/main/btn_prev.png') no-repeat center; }
.video .control a.btn_next { background:url('/images/web/ect/main/btn_next.png') no-repeat center; }
.video .control a.btn_next:before { position:absolute; top:8px; left:-15px; width:1px; height:12px; background:#b2b2b2; content:''; }
.video .control a.btn_more { background:url('/images/web/ect/main/btn_more1.png') no-repeat center; transition:all .3s ease; -ms-transition:all .3s ease; -webkit-transition:all .3s ease;  }
.video .control a.btn_prev:after, .video .control a.btn_next:after { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); width:0px; height:0px; background:#ddd; border-radius:50%; content:''; z-index:-1; transition:all .2s ease-out; -ms-transition:all .2s ease-out; -webkit-transition:all .2s ease-out; }
.video .control a.btn_prev:hover:after, .video .control a.btn_next:hover:after  { width:40px; height:40px; }
.video .control a.btn_more:hover { transform:rotate(180deg); }

/* 공지사항 */
.notice { position:relative; }
.notice h3 { font-size:34px; font-family:'NotoB'; /* 200609 수정*/ color:#000; }
.notice ul { width:100%; border-top:1px solid #3a72c6; }
.notice ul li a { position:relative; display:block; border-bottom:1px solid #cbcbcb; padding:30px 0 30px 10px; background:url('/images/web/ect/main/btn_more2.png') no-repeat right 20px center; }
.notice ul li a:before { position:absolute; left:-100%; top:0; width:100%; height:100%;background: rgb(233,247,255); z-index:-1; content:'';
	background: -moz-linear-gradient(90deg, rgba(233,247,255,1) 0%, rgba(255,255,255,1) 100%); 
	background: -webkit-linear-gradient(90deg, rgba(233,247,255,1) 0%, rgba(255,255,255,1) 100%);
	background: linear-gradient(90deg, rgba(233,247,255,1) 0%, rgba(255,255,255,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#e9f7ff",endColorstr="#ffffff",GradientType=1);  
}
.notice ul li a p { padding-right:240px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
.notice ul li a p.tit {  font-size:22px; color:#000;  }
.notice ul li a p.txt { font-size:16px; color:#666; }
.notice ul li a .date { position:absolute; right:140px; top:50%; transform:translateY(-50%); -webkit-transform:translateY(-50%); }
.notice .btn_more { position:relative; display:block; width:180px; height:70px; line-height:70px; text-align:center; font-size:22px; color:#fff; background:#0068b7; border-radius:70px; margin:40px auto 100px; overflow:hidden; }
.notice .btn_more span { position:relative; z-index:2; }
.notice .btn_more:before { position:absolute; top:0; left:-180px; width:180px; height:70px; content:'';
	background:rgb(4,26,68);
	background:-moz-linear-gradient(90deg, rgba(4,26,68,1) 0%, rgba(0,104,183,1) 100%);
	background:-webkit-linear-gradient(90deg, rgba(4,26,68,1) 0%, rgba(0,104,183,1) 100%);
	background:linear-gradient(90deg, rgba(4,26,68,1) 0%, rgba(0,104,183,1) 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#041a44",endColorstr="#0068b7",GradientType=1); }
.notice .btn_more:hover:before { left:0; }
.notice ul li a:hover { background:url('/images/web/ect/main/btn_more3.png') no-repeat right 20px center; }
.notice ul li a:hover:before { left:0; }
.notice ul li a:hover p.tit,
.notice ul li a:hover p.txt { color:#0288d1;  }

.notice ul li a, .notice ul li a:before, .notice ul li a p, .notice .btn_more, .notice .btn_more:before { transition:all .3s ease; -ms-transition:all .3s ease; -webkit-transition:all .3s ease; }

/* 퀵메뉴 200715*/
.quick_ser {width:100%; height:100%; }
.quick_ser h3{display:none;}
.quick_ser .list_wrap {position:relative; max-width:1400px; margin:0 auto; }
.quick_ser .list_wrap ul li{width:12.5%; float:left; }
.quick_ser .list_wrap ul li a{display:block; height:100px; padding:40px 0; text-align:center; color:#333; }
.quick_ser .list_wrap ul li a span{display:block; margin:10px 0 0; }
.quick_ser .list_wrap ul li:first-child a{border-left:0; }
.quick_ser .list_wrap ul li.point a{background:#e32c28; padding:60px 0 40px; border-color:#711e21; margin-top:-20px; }
.quick_ser .list_wrap ul li.noLine a{border-left:0; }
.quick_ser .list_wrap ul li a:hover img{margin-top:-10px; padding-bottom:10px; }
.quick_ser .list_wrap ul li a:hover span{color:#03a9f4; }
.quick_ser .list_wrap ul li a img{-webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -ms-transition:all 0.3s ease; transition:all 0.3s ease; }

/*221230*/
.baro_qr {background: #fff;width: 280px;/* margin-top: 1rem; */margin: 0.5rem auto 0;/* height: 85px; *//* margin: 0.5rem auto 0; *//* position: absolute; */display: table;padding: 0.3rem 0.5rem;box-sizing: border-box;overflow: hidden;border: 3px solid #52b4ff;border-radius: 1rem;/* right: 7rem; */}
.baro_qr img{/* display: block; */width: 60px;height: 60px;margin: 0 auto;/* text-align: center; */}
.baro_qr span{display: table-cell;font-size: 1rem;padding: 0.5rem 2.5rem 0.5rem 0;word-break: keep-all;text-align: center;color: #000;vertical-align: middle;text-shadow: 0 0 BLACK;font-weight: 500;position:relative;}

.baro_qr span:before{content:"";display:block;width: 18px;height: 18px;background:url('/images/con_com/sub/btn_linkG.png') no-repeat center;position:absolute;bottom: 1.4em;right: 1rem;} 

@media screen and (max-width:1019px) {
	
	/* sns 바로가기 200813 */
 	/* .sns_wrap{top:100px; left:32%; z-index:201; margin-left:0px;} */
 	.sns_wrap{position: absolute; width:100%; max-width:1400px; top:100px; left:5%; margin-left:0px; z-index:201;}
		
	/* 동영상 */
	.video .video_slide ul li a .img { height:140px; } 

	/* 공지사항 */
	.notice ul li a p { padding-right:150px; }
	.notice ul li a .date { right:60px; }

	/* 퀵메뉴  200715*/
	.quick_ser{overflow:hidden; }
	.quick_ser .list_wrap {margin-top:-1px; }
	.quick_ser .list_wrap ul li{width:25%; }
	.quick_ser .list_wrap ul li a{padding:20px 0; }
	.quick_ser .list_wrap ul li.point a{padding:20px 0; margin:0; }
}

@media screen and (max-width:800px) {

	/* sns 바로가기 200813 */
	.sns_wrap{left:7%;}

	/* 메인비주얼 */
	.visual_wrap { width:95%; margin:0 auto; }
	.visual_wrap .mvisual .mvBox { height:350px; }
	.visual_wrap .mvBox.slick-slide { height:350px !important; }
	.visual_wrap .mvisual .mvBox:before { display:none; }
	.visual_wrap .mvisual .mvBox video { width:100%; height:350px; }
	.visual_wrap .mvisual .mvBox iframe { width:100%; height:350px; }
    .visual_wrap .mvisual .mvBox.slick-slide:nth-child(1), .visual_wrap .mvisual .mvBox.slick-slide:nth-child(2) { opacity:1; } /* 200609 추가*/

	.visual_wrap .mvisual .mvBox.slick-slide, 
	.mvBox.slick-slide[aria-hidden="true"]:not(.slick-cloned) ~ .slick-cloned[aria-hidden="true"] ,
	.visual_wrap .mvisual .mvBox.slick-active,
	.visual_wrap .mvisual .mvBox.slick-center, 
	.mvBox.slick-slide[aria-hidden="true"]:not([tabindex="-1"]) + .slick-cloned[aria-hidden="true"] { transform:scale(1) translate(0); -webkit-transform:scale(1) translate(0); }


	
	/* 동영상 */
	.video h3 { font-size:30px; }

	/* 공지사항 */
	.notice h3 { font-size:30px; }
	.notice ul li a p.tit { font-size:20px; }
	.notice ul li a p.txt, .notice ul li a .date { font-size:15px; }


}

@media screen and (max-width:600px) {
	
	/* sns 바로가기 200813 */
	.sns_wrap{left:10%;}
	.sns_link li a img{width:35px; height:35px;} 
	
	/* 메인비주얼 200804 수정*/
	.visual_wrap { width:100%; margin:0 auto; }
	.visual_wrap .mvisual .mvBox video { width:90%; }
	.visual_wrap .mvisual .mvBox iframe { width:90%; }

	/* 공지사항 */
	.notice ul li a p { padding-right:60px; }
	.notice ul li a .date { position:relative; right:auto; top:auto; transform:translate(0); -webkit-transform:translate(0); }


}

@media screen and (max-width:540px) {

	/* sns 바로가기 200813 */
	.sns_wrap{left:13%;}

	/* 메인비주얼 */
	.main_visual .slogan p { font-size:1rem; }
	.main_visual .slogan h2 { font-size:1.6rem; }
	.mcontrol { display:none; }
}

@media (max-width:480px) {
	
	/* sns 바로가기 200813 */
	.sns_wrap{left:15%;}
	
	/* 퀵메뉴 */
	.quick_ser{overflow:hidden;margin-bottom: 20px;}
	.quick_ser .list_wrap ul li{width:50%;}
	.quick_ser .list_wrap ul li a{position:relative; height:auto; text-align:left; padding:10px  0 !important; }
	.quick_ser .list_wrap ul li a p{position:absolute; left:20px; top:10px; }
	.quick_ser .list_wrap ul li a p img{width:auto; height:45px; }
	.quick_ser .list_wrap ul li a span{ line-height:45px; height:45px; margin:0; padding-left:90px; }
	
}

@media (max-width:350px) {
	
	/* sns 바로가기 200813 */
	.sns_wrap{left:10%;}
	
	/* 퀵메뉴 */
	.quick_ser{overflow:hidden;margin-bottom: 20px;}
	.quick_ser .list_wrap ul li{width:50%;}
	.quick_ser .list_wrap ul li a{position:relative; height:auto; text-align:left; padding:10px  0 !important; }
	.quick_ser .list_wrap ul li a p{position:absolute; left:20px; top:10px; }
	.quick_ser .list_wrap ul li a p img{width:auto; height:45px; }
	.quick_ser .list_wrap ul li a span{ line-height:45px; height:45px; margin:0; padding-left:90px; }
	
}