/* 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:100vh; 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{ max-width:1330px; margin:0 auto; }
.main_banner_wrap .flex-direction-nav a {  position:absolute; margin:0px; top:40%; width:50px; height:100px; 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.3; 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; }
.main_banner_wrap .flex-control-paging li a.flex-active { width:38px; background:#0059a9; cursor: default; opacity:1  }


/* 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 6px; display: inline-block; zoom: 1; *display: inline; }
.main_banner_wrap .flex-control-paging li a { width:12px; height:12px; border-radius:30px !important; display: block; background:none; border:solid 1px #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:0; /* box-shadow: inset 1px 1px 1px rgba(0,0,0,0.3); */  }
.main_banner_wrap .flex-control-paging li a:hover { background:#0e518c; border-color:#0e518c; }
.main_banner_wrap .flex-control-paging li a.flex-active { width:38px; background:#0e518c; border-color:#0e518c; 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:50%; width:100%; margin-top:-150px; text-align:left; }
.visual_ment h1{ font:600 58px 'Play','Roboto','Noto Sans KR','Malgun Gothic',Sans-serif; color:#fff; text-shadow:0 1px 4px rgba(0,0,0,0.2); line-height:140%; }

.eng .visual_ment h3{  font:500 32px 'Roboto',Sans-serif; letter-spacing:1px;   }

.visual_ment h3{ margin-bottom:10px; font:500 44px 'Noto Sans KR','Malgun Gothic',Sans-serif; line-height:120%; letter-spacing:-.8px; color:rgba(255,255,255,0.9); text-shadow:0 1px 1px rgba(0,0,0,0.1); }
.visual_ment p{ font:400 26px 'Roboto',Sans-serif;line-height:180%; padding-top:20px; letter-spacing:0px; color:rgba(255,255,255,0.8); }
.visual_ment a{ display:inline-block; position:relative; background:#0c4da2; padding:7px 50px 7px 30px; margin-top:80px; font-size:14px; font-family:'Play'; line-height:38px; font-weight:400; color:rgba(255,255,255,0.8);}
.visual_ment a:after{position:absolute; top:18px; right:32px; content:''; font:normal 16px "FontAwesome";  }
.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:#fff; border-color:#fff; color:#0e518c; transition:all ease 1s;}

/*메인텍스트 움직임*/
.pc_main_banner_wrap.flex-active-slide .visual_ment{opacity: 1;transform: translate(0,0);}
.visual_ment{ transition:all 2s; opacity:0; transform:translate(0,30%); }

/*메인비주얼_추가멘트*/

.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) {

.visual_ment{left:8%;}
.main_banner_wrap{height:650px;}
.main_banner_wrap .flexslider .slides > li{height:650px;}
.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); }

.main_banner_wrap .flex-direction-nav .flex-next{right:20px;}
.main_banner_wrap .flex-direction-nav .flex-prev{left:20px;}

.visual_ment{margin-top:-110px;}
.visual_ment h1{font-size:48px;}
.visual_ment h3{ font-size:34px;}
.visual_ment p{font-size:18px;}
.visual_ment a{font-size:14px; padding:0 40px 0 25px; margin-top:50px; }
.visual_ment a:after{font-size:15px; top:11px; right:20px;  }
.main_banner_wrap .flex-direction-nav a{top:45%;}

}

/* ############### 모바일 반응형 ############### */
@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:62%; }
.visual_ment h1{ font-size:27px; }
.visual_ment h3{ margin-bottom:5px; font-size:18px; line-height:170%; }
.visual_ment p{ font-size:12px; }
.visual_ment a{ padding:0 30px 0 20px; font-size:11px; line-height:25px; margin-top:15px; }
.visual_ment a:after{top:5px; right:18px; font-size:13px;}
.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:13px; }
.main_banner_wrap .flex-control-paging li a{ width:25px; height:3px; border-color:rgba(255,255,255,.5); }
.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;}

}