@charset "utf-8";

/*
 * =================================================================================
 * INFORMATION
 * ---------------------------------------------------------------------------------
 * @File Name 	: header.css
 * @Description : header Style Sheet
 * @Version 	: 1.0.0
 * @Create Date : 
 * @Update Date : N/A
 * @History		: N/A
 * =================================================================================
 */


/* live_movie */
.live_view { display:inline-block; width:100%; position:relative;}/* 16:9 �ڵ������� */
.live_view::after { padding-top:56.25%; display:block; content: '';}
.live_view .movie { position:absolute; top:0; bottom:0; right:0; left:0; background:#cfe6f2 url("../img/header/bg_movie.png") no-repeat center; background-size:100% 100%; overflow:hidden; }
.live_view .movie img { width:100%; height:100%;}


/* Layout */
.inner { min-width:360px; width:1400px; margin:0 auto} /* Default :1400 */

#skip_to_content { position:absolute; left:0; top:-10em; width:100%; z-index:99999;}
#skip_to_content a:active, #skip_to_content a:focus { position:absolute; left:0; top:10em; width:100%; height:27px; color:#fff; text-align:center; text-decoration:none; line-height:30px; outline:0;}


/* Header --------------------------------------------------------------------------- */
#header {position:relative; z-index:200; height:200px;}
.tnb { height:45px; background:url('../img/header/bg_tnb.png') repeat-x bottom;}
/* link_site */
.other_site { float:left; position:relative; height:45px; border-left:1px #e9e9e9 solid;}
.other_site li { float:left; height:45px; width:110px; border-right:1px #e9e9e9 solid;}
.other_site li a { display:block; line-height:46px; color:#e9e9e9; text-align:center;}
.other_site li a:hover { color:#fff; background-color:#4963bd;}

/* other_conn */
.other_con { float:right;}
.other_con li{ float:left;}

/* headertop */
#headertop { position:relative; height:100px;}
#headertop .logo_inner { position:relative; width:1400px; height:100px; margin:0 auto; background-color:#fff;}
.top_logo { position:absolute; left:10px; top:19px; width:340px; z-index:1;}
.top_logo a {display:block;}
.top_logo img { width:100%;}

/* control_text */.control_text { float:left; height:32px; line-height:32px; vertical-align:middle; margin-top:7px;}
.control_text button { position:relative; float:left; width:32px; height:32px; border:1px solid #e9e9e9; font-size:13px; background:#fff url("../img/header/btn_zoom_pt.png") no-repeat right center; padding:0; cursor:pointer;}
.control_text button:hover, .control_text button:active, .control_text button:focus { color:#000; z-index:1; font-weight:600; background-color:#eef2ff;}
#btn_text_large { border-right:0px; border-radius:25px 0 0 25px;}
#btn_text_default { width:40px; font-size:10px; line-height:32px; border-left:0px; border-right:0px;}
#btn_text_small { border-left:0px; border-radius:0 25px 25px 0;}

/* search */
.hd_search { position:absolute; top:25px; left:50%; margin-left:-200px; width:400px; overflow:hidden; height:50px; border-radius:25px; border:1px #a8c8e8 solid; background:#fff; z-index:1000;}
.hd_search .h_btn { text-indent:-99999px;border:0px; top:0px; right:0px; width:50px; height:50px;}
.hd_search .open_search { background:#fff url("../img/header/btn_search.png") no-repeat center; display:none;}
.hd_search .close_search {background:#fff url("../img/header/btn_search.png") no-repeat center; display:none;}
.totalsearch { display:inline-block; height:50px; z-index:1000;}
.totalsearch label { display:none; line-height:0; text-indent:-9999999px; position:absolute; top:-9999999px; left:-9999999px;}
.totalsearch .search input { font-size:15px; height:50px; border:none; padding:0;}
.totalsearch .search #stext { width:350px; border:0px; padding-left:20px;}
.totalsearch .search #sbtn { position:absolute; right:0px; top:0px; width:50px; height:50px; text-indent:-9999999px; background:#005aab url("../img/header/btn_search.png") no-repeat center; border:0px; border-radius:50%; cursor:pointer;}

/* sns */.sns { position:absolute; right:10px; top:30px;}
.sns a { float:left; width:37px; height:37px; background:url("../img/header/icon_sns.png") no-repeat; font-size:0px; border-radius:5px; margin-left:3px;}
.sns a.twitter { background-position:left;}
.sns a.facebook { background-position:-37px;}
.sns a.youtube { background-position:right;}

/* gnb_wrap contents */
#headertop #gnb_wrap { width:100%; height:55px; z-index:10; background:#fff; border-top:1px #ddd solid; border-bottom:1px #ddd solid;}
/* dc_menu */
#gnb_wrap #dc_menu {  height:auto; display:block; }
#gnb_wrap .offscreen { display:none;}
#gnb_wrap .gnb_inner { width:; margin:0 auto; position:relative;}
/* .gnbquick */
#gnb_wrap .gnbquick { position:relative; height:60px; background:#4963bd; }
#gnb_wrap .gnbquick li { float:left; height:60px;}
#gnb_wrap .gnbquick .home { width:60px; height:60px; }
#gnb_wrap .gnbquick .home a { display:inline-block; width:60px; height:60px; padding:20px 0 0; text-align:center; vertical-align:middle; border-right:solid 1px #2e479c;}
#gnb_wrap .gnbquick .mview_slogan {  border-left:solid 1px #6d85d9; padding-left:10px; color:#fff; line-height:60px; font-size:18px;}
#gnb_wrap .gnbquick .mview_slogan strong { font-size:22px;}

/* gnb */
#gnb { height:55px; width:1400px; margin:0 auto; text-align:center;}
#gnb a {display:block;}
#gnb .depth { display:none;}

/* memu_bg */
#gnb .memu_bg { position:absolute; left:0px; width:100%; height:55px; font-size:0px; }
#gnb .memu_bg .depth { position:absolute; top:55px; left:0px; width:100%; height:250px; background:#f5f7f9; border-bottom:1px #eee solid; }

/* 1 Depth */#btn_menu, #btn_search {display:none;}
#gnb > li { display:inline-block; float:none; vertical-align:top; width:14.22%; /* background:url("../img/header/gnb_icon.png") no-repeat right center; */ padding:0px;}
#gnb > li:last-child { background-image:none; padding-left:0px;}
#gnb > li > a { position:relative; display:block; height:55px; line-height:57px; color:#000; font-size:20px; text-align:center; text-decoration:none; }
#gnb > li.active > a { border-bottom:3px solid #01aedd; color:#01aedd; }
/* 2 Depth */.gnb2 {position:static;}
#gnb > li > div { display:none; position:absolute; top:55px; left: auto; z-index:10; background:url("../img/header/gnb_ptline.png") repeat-y left;}
#gnb > li > div .dep_list li { padding:0px;}
#gnb > li > div .dep_list a { text-align:left; display:block; padding:8px 0 8px 17px; line-height:22px; background:url("../img/header/icon_hdmenu.png") no-repeat 3px 11px; font-size:17px; letter-spacing:-0.02em; background-size:14px;}
#gnb > li > div .dep_list a:hover { color:#0071b9; background:url("../img/header/icon_hdmenu_over.png") no-repeat 4px 12px; text-decoration:underline; background-size:14px; padding-left:18px;}
#gnb > li > div .dep_list { width:100%; height:250px; padding:15px 0;}
#gnb > li > div .dep_list .no_br { display:none;}
/* 3 Depth */
#gnb > li > div .dep_list .sub_3D a { height:24px; line-height:26px; font-size:15px; color:#999; background:url("../img/header/icon_menu.png") no-repeat 17px center;}
#gnb > li > div .dep_list .sub_3D a:hover { color:#000; background:url("../img/header/icon_menu.png") no-repeat 17px center;}
#gnb > li > div .dep_list .sub_3D a:last-child { margin-bottom:15px;}	

/* mview */
.mview, .mviewC {display:none !important;}
.wview, .wviewC {display:block !important;}
.mviewT {display:none !important;}
.wviewT {display:table !important;}






@media all and (max-width:1024px) and (min-width:768px){

.mask { display:none; opacity:0; position:fixed; top:0; left:0; right:0; bottom:0; height:100%; background:url("../img/header/bg_op60.png"); z-index:100; background-size:100% 100%;}

/* Header --------------------------------------------------------------------------- */
#header { width:100%; height:145px;}
.tnb { width:100%;}

/* control_text */.control_text { height:31px; margin-top:2px;}
.control_text button { height:31px;}
#btn_text_default { line-height:31px;}

/* search */
.hd_search { z-index:1000 !important; left:inherit; right:73px; width:300px;}
.totalsearch .search #stext { width:296px;}

/* sns */
.sns { right:138px; top:-42px;}

/* headertop */
#headertop .logo_inner { width:100%;}

/* layout */
.mview, .wviewC {display:block !important;}
.wview, .mviewC {display:none !important;}
.mviewT {display:none !important;}
.wviewT {display:table !important;}

.gnb_allmneu, .btn_gnb_search, #btn_search {display:none;}
.inner { padding:0; width:100%;}

/* gnb_wrap contents */
#headertop #gnb_wrap { width:100%; height:0px; z-index:10; background:#fff; border-bottom:1px #ddd solid;}

/* gnb_wrap */
#gnb_wrap .inner { width:100%; margin:0; position:relative;}

/* dc_menu */
#dc_menu { display:block; opacity:0; position:absolute; top:0px; right:0px; width:100%; height:auto; display:block; background:#fff;}

/* gnb */
#gnb { width:100%; min-width:inherit; height:250px;}
#gnb .depth { display:block !important; border-top:1px #eee solid;}

/* Depth bg */
#gnb .memu_bg { background:#002d62;}
#gnb .memu_bg .depth { position:absolute; top:55px; left:0px; height:250px; }

/* 1 Depth */#btn_menu, #btn_search {display:none;}
#gnb > li { display:block;}
#gnb > li:last-child a { background-image:none;}
#gnb > li > a { position:relative; display:block; height:55px; line-height:55px; color:#fff; font-size:16px; text-align:center; text-decoration:none;background:url("../img/header/gnb_icon.png") no-repeat right center;}
#gnb > li > a:hover, #gnb > li.active > a { border-bottom:3px solid #01aedd; color:#01aedd;}

/* 2 Depth */.gnb2 {position:static;}
#gnb > li > div { display:none; top:115px;}
#gnb > li > div .dep_list { height:249px; padding:15px 0;}
#gnb > li > div .dep_list li {}
#gnb > li > div .dep_list a { text-align:left; display:block; padding:8px 0 8px 15px; line-height:19px; background:url("../img/header/icon_hdmenu.png") no-repeat 2px 9px; font-size:15px; letter-spacing:-0.05em; background-size:13px;}
#gnb > li > div .dep_list a:hover { color:#0071b9; background:url("../img/header/icon_hdmenu_over.png") no-repeat 3px 10px; text-decoration:underline; background-size:14px; padding-left:16px;}

/* 3 Depth */
#gnb > li > div .dep_list .sub_3D a { height:24px; line-height:26px; font-size:15px; color:#999; background:url("../img/header/icon_menu.png") no-repeat 17px center;}
#gnb > li > div .dep_list .sub_3D a:hover { color:#000; background:url("../img/header/icon_menu.png") no-repeat 17px center;}
#gnb > li > div .dep_list .sub_3D a:last-child { margin-bottom:15px;}	

/* btn_menu - btn_search */
#btn_menu  {position:absolute; top:-75px; right:20px; display:block; width:49px; border-radius:10px; overflow:hidden;}
#btn_menu img { width:100%;}

}




@media all and (max-width:950px) and (min-width:768px){

#gnb > li > div .dep_list .no_br { display:block; height:1px;}

}






@media all and (max-width:768px){
.mask { display:none; opacity:0; position:fixed; top:0; left:0; width:100%; height:100%; background:url("../img/header/bg_op60.png"); z-index:100;}

/* Header --------------------------------------------------------------------------- */
#header { width:100%; height:auto;}
.tnb { width:100%; height:40px;}
/* link_site */
.other_site { width:50%; height:40px;}
.other_site li { width:50%; height:40px;}
.other_site li a { line-height:40px; font-size:14px;}

/* control_text */.control_text { display:none;}

/* sns */
.sns { right:2px; top:-37px; z-index:10;}
.sns a { width:32px; height:32px; margin-left:2px; background-size:96px;}
.sns a.twitter {}
.sns a.facebook { background-position:-32px;}
.sns a.youtube {}

/* headertop */
#headertop { height:80px;}
#headertop .logo_inner { height:80px; width:100%; border-bottom:1px #eee solid;}
.top_logo { margin-left:0px; width:240px;}
.top_logo a { top:14px;}
.top_logo img { width:100%;}

/* search */
.hd_search { position:absolute; left:inherit; right:57px; top:17px; width:45px; height:45px; border:0px; z-index:1; border-radius:5px;}
.hd_search .h_btn { display:inherit;}
.hd_search .open_search, .hd_search .close_search { width:45px; height:45px; cursor:pointer;}
.hd_search .open_search { background:#4963bd url("../img/header/btn_search.png") no-repeat center;}
.hd_search .close_search { display:none; background:#4963bd url("../img/header/btn_search_close.png") no-repeat center;}
.totalsearch { display:none; position:fixed; left:0px; top:120px; width:100% !important; padding:10px; height:70px; background-color:#4963bd; z-index:200; border:0px; margin:0px;}
.totalsearch .search { width:100%;}
.totalsearch .search input {height:49px;}
.totalsearch .search #stext { width:100%; height:50px;}
.totalsearch .search #sbtn {width:50px; height:50px; top:10px; right:10px;}

/* gnb_wrap contents */
#headertop #gnb_wrap { height:0px;}

/* gnb_wrap contents */
#gnb_wrap .gnbquick .mview_slogan img { width:220px; margin-top:7px;}
/* .gnbquick */
#gnb_wrap .gnbquick .mview_slogan { font-size:15px;}
#gnb_wrap .gnbquick .mview_slogan strong { font-size:18px;}


/* layout */
.mview, .wviewC {display:block !important;}
.wview, .mviewC {display:none !important;}
.mviewT {display:none !important;}
.wviewT {display:table !important;}

.btn_gnb_search, #btn_search {display:none;}
.inner { padding:0; width:100%;}

#gnb_wrap { height:0px;}
#gnb_wrap .inner { width:100%; margin:0; position:relative;}

/* dc_menu */
#dc_menu {display:none; opacity:0; position:absolute; top:0px; right:0px; width:100%; height:auto; background:#fff;}

/* gnb */
#gnb { margin:0; width:100%;}
#gnb > li { width:100%; background-image:none;}
#gnb > li > a { height:50px; line-height:50px; color:#444; font-size:17px; border-bottom:solid 1px #ddd; padding-left:37px; text-align:left; background:url("../img/header/m_menu_open.png") no-repeat 15px center;}
#gnb > li.current { background:#666666;}
#gnb > li.current > a { border-bottom:none; color:#fff; background-image:none; background:#002d62 url("../img/header/m_menu_close.png") no-repeat 15px center;}
#gnb > li > ul.sub01, #gnb > li > ul.sub02, #gnb > li > ul.sub03, #gnb > li > ul.sub04, #gnb > li > ul.sub05, #gnb > li > ul.sub06, #gnb > li > ul.sub07 {}
#gnb > li > div.depth { width:100%; display:none; position:relative; top:0px; left:0; right:0; padding:0px; z-index:10; border:0; background-image:none;}
#gnb > li > div.depth .dep_list { background-image:none;  }
#gnb > li > div.depth .dep_list a { display:block; font-size:16px; height:40px; line-height:28px; background:#f5f6fa url("../img/header/icon_hdmenu.png") no-repeat 20px center; padding-left:40px;  border-bottom:0px !important;}
#gnb > li > div.depth .dep_list li:last-child { padding-bottom:10px; background:#f5f6fa; border-bottom:1px #ddd solid}
#gnb > li > div .dep_list .sub_3D { border-bottom:0px !important; }
#gnb > li > div .dep_list .sub_3D a {  height:28px; line-height:28px; font-size:16px; color:#666; background:#f2f2f2 url("../img/header/icon_menu.png") no-repeat 40px center; padding-left:50px; border-bottom:0px !important;}
#gnb > li > div .dep_list .sub_3D a:hover { color:#000; background:#f2f2f2 url("../img/header/icon_menu.png") no-repeat 40px center;}
#gnb > li > div .dep_list .sub_3D a:last-child {margin-bottom:0px;}
#gnb > li > div .dep_list { width:100%; height: auto; padding:0;}

/* btn_menu - btn_search */
#btn_menu  {position:absolute; top:-63px; right:5px; display:block; width:45px; border-radius:5px; overflow:hidden;}
#btn_menu img { width:100%;}


}