@charset "utf-8";

/* Browser Resets */
.main_banner_wrap .flex-container a:active,
.main_banner_wrap .flexslider a:active,
.main_banner_wrap .flex-container a:focus,
.main_banner_wrap .flexslider a:focus{/*outline: none;*/}
.main_banner_wrap .slides,
.main_banner_wrap .flex-control-nav,
.main_banner_wrap .flex-direction-nav {margin: 0; padding: 0; list-style: none; } 

/* FlexSlider Necessary Styles
*********************************/ 
.main_banner_wrap .flexslider { overflow:hidden; position:relative; width:100%; height:100%; margin:0 auto; zoom: 1; overflow:hidden; /* background:#fff url(../img/loading.gif) no-repeat center;  */}
.main_banner_wrap .flexslider .slides {zoom: 1;  width:100%;  }
.main_banner_wrap .flexslider .slides > li {position:relative;width:100%;height:937px; background-size:cover !important;display:none;-webkit-backface-visibility: hidden;} /* Hide the slides before the JS is loaded. Avoids image jumping */

.main_banner_wrap .flexslider .slides > li > img{ width:auto; max-width:100%; }
.main_banner_wrap .flex-pauseplay span {text-transform: capitalize; }

/* Clearfix for the .slides element */
.main_banner_wrap .slides:after {content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;} 
html[xmlns] .slides {display: block;} 
* html .slides {height: 1%;}

/* No JavaScript Fallback */
/* If you are not using another script, such as Modernizr, make sure you
 * include js that eliminates this class on page load */
.no-js .slides > li:first-child {  }

/* FlexSlider Default Theme
*********************************/
.main_banner_wrap .flex-viewport { max-height: 1000px; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; transition: all 1s ease;}
.main_banner_wrap .loading .flex-viewport {max-height: 200px;}
.main_banner_wrap .carousel li { margin-right: 5px; }

/* Direction Nav */ 
.main_banner_wrap .flex-direction-nav{ display:none; max-width:1330px; margin:0 auto; }
.main_banner_wrap .flex-direction-nav a {  position:absolute; margin:0px; top:50%; width:50px; height:100px; margin-top:-50px; display: block; padding:0px; color:rgba(255,255,255,0.8); font:normal 60px/100px "FontAwesome"; text-align:center; }
.main_banner_wrap .flex-direction-nav a{ -webkit-transition-duration:0.2s; -moz-transition-duration:0.2s; -o-transition-duration:0.2s; -ms-transition-duration:0.2s; transition-duration:0.2s; }
.main_banner_wrap .flex-direction-nav .flex-next { position:absolute; right:5%; opacity:.1; filter:alpha(opacity=10); z-index:9; /* background:#000 url(/img/after_btn.png) no-repeat 25px center; */ }
.main_banner_wrap .flex-direction-nav .flex-prev { position:absolute;  left:5%; opacity:.1; filter:alpha(opacity=10);  z-index:9; /* background:#000 url(/img/before_btn.png) no-repeat 17px center; */ }
.main_banner_wrap .flexslider:hover .flex-next { opacity: .3; filter:alpha(opacity=30); }
.main_banner_wrap .flexslider:hover .flex-prev { opacity: .3; filter:alpha(opacity=30); }
.main_banner_wrap .flexslider:hover .flex-next:hover, .flexslider:hover .flex-prev:hover { opacity: 0.5; filter:alpha(opacity=50); }
.main_banner_wrap .flex-direction-nav .disabled {opacity: .3!important; filter:alpha(opacity=30); cursor: default; }

/* Control Nav 동그라미 숫자 버튼 */
.main_banner_wrap .flex-control-nav { width: 100%; position:absolute; bottom:15px; text-align: center; z-index:9; display:none; }
.main_banner_wrap .flex-control-nav li {margin: 0 4px; display: inline-block; zoom: 1; *display: inline; }
.main_banner_wrap .flex-control-paging li a { width: 13px; height: 13px; display: block; background: #fff;  cursor: pointer; text-indent:-9999px; opacity:.9 }
.main_banner_wrap .flex-control-paging li a { -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; border-radius: 20px; /* box-shadow: inset 1px 1px 1px rgba(0,0,0,0.3); */  }
.main_banner_wrap .flex-control-paging li a:hover { background:#0059a9; }


/* Control Nav 네모 숫자 버튼_2020/07-27 */
.main_banner_wrap .flex-control-nav { width: 100%; position:absolute; bottom:50px; text-align: center; z-index:9; display:block; }
.main_banner_wrap .flex-control-nav li {margin: 0 4px; display: inline-block; zoom: 1; *display: inline; }
.main_banner_wrap .flex-control-paging li a { width:23px; height:6px; display: block; background:rgba(255,255,255,.4);  border-radius:100px; cursor: pointer; text-indent:-9999px; opacity:.9 }
.main_banner_wrap .flex-control-paging li a:hover { background:#d5243c; }
.main_banner_wrap .flex-control-paging li a.flex-active { background:#d5243c; cursor: default; opacity:1  }



/* 메인 비쥬얼 탭(Control Nav 동그라미 숫자 버튼 제이쿼리 복사)*/
.main_banner_wrap .main_visualArea a:focus{outline:none !important;}
.main_banner_wrap .main_visualArea .flex-control-nav { text-align:center  }
.main_banner_wrap .main_visualArea .flex-control-paging li a{width:72px; height:7px; box-shadow:none; background:#fff; border:none;}

.main_banner_wrap .main_visualArea .flex-control-paging li a:hover,
.main_banner_wrap .main_visualArea .flex-control-paging li a.flex-active { background:#1b63ce; opacity:1; border:none; cursor: default; opacity:1;}

/*메인비주얼*/
.main_banner_wrap{ width:100%; height:100vh; }
.main_banner_wrap{ animation: 1s ease-out 0s 1 slideInFromLeft; }
.visual_ment{ position:absolute; left:0; top:30%; width:100%;  text-align:center; }
.visual_ment p{ margin-top:40px; font:400 22px 'Noto Sans KR','Malgun Gothic',Sans-serif; line-height:160%; color:rgba(255,255,255,0.8); text-shadow:0 1px 1px rgba(0,0,0,0.1); }
.visual_ment p b{font:400 19px 'Noto Sans KR','Malgun Gothic',Sans-serif; }
/*.visual_ment a{ display:inline-block; padding:0 40px; margin-top:55px; font-size:14px; line-height:43px; font-weight:400; color:rgba(255,255,255,0.8); border-radius:100px; background:rgba(12,76,163,0.9); }
.visual_ment a{ -webkit-transition-duration:0.2s; -moz-transition-duration:0.2s; -o-transition-duration:0.2s; -ms-transition-duration:0.2s; transition-duration:0.2s; }
.visual_ment a:hover{ background:#1d3f80; }*/


/*메인비주얼_추가멘트*/

.visual_ment .main_small_title{overflow:hidden; max-width:400px; width:auto; margin:0 auto;  }
.visual_ment .main_small_title:before{display:inline-block; content:' '; background:url(/img/main_title_line.png); width:322px; height:2px;  }
.visual_ment .main_small_title li{ float:left; width:32%; margin-left:2%;  }
.visual_ment .main_small_title li:first-child{margin-left:0;}
.visual_ment .main_small_title li a {color:#0dc23a; font:500 15px 'Roboto','Noto Sans KR','Malgun Gothic',Sans-serif;}
.visual_ment .main_small_title li a:hover{ color:#fff; } 


/* ############### 태블릿 반응형 ############### */
@media (max-width:1200px) {

.flexslider .slides > li{ height:610px; }
.flex-direction-nav a{ width:40px; height:50px; margin-top:-25px; font-size:30px; line-height:50px; }
.flex-direction-nav .flex-next { opacity:.3; filter:alpha(opacity=30); }
.flex-direction-nav .flex-prev { opacity:.3; filter:alpha(opacity=30); }


}

/* ############### 모바일 반응형 ############### */
@media (max-width:999px) {

.flexslider .slides > li { height:250px; }
.flex-direction-nav a{ width:30px; height:34px; margin-top:-17px; font-size:20px; line-height:34px; }

.visual_ment{ top:75%; }
.visual_ment h1{ font-size:30px; }
.visual_ment p b{ font-size:13px;}
.visual_ment p{ font-size:12px; margin-top:10px; }
.visual_ment a{ padding:0 15px; font-size:11px; line-height:32px; margin-top:25px; }

.visual_ment .main_small_title{ max-width:300px; }
.visual_ment .main_small_title li a{font-size:12px;}

.main_banner_wrap{ height:auto; }
.main_banner_wrap .flexslider .slides > li{ height:370px; }
.main_banner_wrap .flex-direction-nav{ display:none; }
.main_banner_wrap .flex-control-nav{ bottom:25px; }
.main_banner_wrap .flex-control-paging li a{ width:25px; height:3px; }
.main_banner_wrap .flex-control-paging li a.flex-active{ width:25px; }


}
@media (max-width:600px) {

.flexslider .slides > li {  }
.flexslider .slides > li:last-child{  }
.flexslider2 .flex-control-nav{ margin-top:0;}

}