@charset "utf-8";

/*------------------------------------------------------------------------------------------------------------------------------------------
	File : Layout.CSS 
	Company : The Webstyle co.,ltd 
 	Author : Woo Seok, Shin 2015-09
 	CSS 적용순서 : 아이디 > 태그와 클래스 > 클래스 > 태그
	CSS 선택자 선언순서 : Type Selector, Layout Selector, Class Selector, Etc
	CSS 속성 선언순서 : display, position, float/clear, overflow, width/height, margin/padding, border, background, color/font, align, etc 
--------------------------------------------------------------------------------------------------------------------------------------------*/

/* SkipMenu */
#SkipMenu {
	overflow:hidden; 
	position:absolute; 
	left:0; 
	top:0; 
	z-index:500; 
	width:100%; 
	height:0px; 
	background-color:#105d9c;
}
#SkipMenu .skipNav {position:relative; height:35px; text-align:center;}
#SkipMenu .skipNav ul {display:inline-block; overflow:hidden;}
#SkipMenu .skipNav ul li {display:inline;}
#SkipMenu .skipNav ul li a {display:inline-block; font-size:12px; line-height:35px; font-weight:bold; color:#fff;}
#SkipMenu .skipNav .skipClose {display:inline-block; position:absolute; right:20px; top:11px;}
#SkipMenu .skipNav .skipClose a {display:block; width:13px; height:13px; text-indent:-9999px; background:url('/Images/Common/btn_skipMenu_close.png') center center no-repeat;}
#SkipMenu a:active, visited, link, hover {color:#fff;}

#Wrap {*zoom:1; position:relative; width:100%; min-width:1240px; min-height:100%;}

/* Header */
#Header_Wrap {position:relative; z-index:200; width:100%; /*margin-bottom:20px;*/}
#Header_Wrap .h_menu_wrap {width:100%; height:47px; border-bottom:1px solid #ccc;}
#Header_Wrap .h_menu_wrap .h_menu {*zoom:1; width:1240px; margin:0 auto; padding-top:7px;}
#Header_Wrap .h_menu_wrap .h_menu:after {content:""; *display:block; clear:both;}
#Header_Wrap .h_menu_wrap .h_menu li {float:left; margin-right:5px;}
#Header_Wrap .h_menu_wrap .h_menu li a {display:block; height:40px; line-height:40px; padding:0 25px; background-color:#fff; border:1px solid #ccc; border-bottom:1px solid #fff; border-radius:4px 4px 0 0 ; font-family:"NanumGothic Bold"; font-size:16px; color:#333;}
#Header_Wrap .h_menu_wrap .h_menu li a.on {background-color:#4dc6db; border:1px solid #4dc6db; border-bottom:1px solid #4dc6db; color:#fff;}
#Header_Wrap .h_menu_wrap .h_menu p.gnb_info{text-align:right; float:right; margin:8px 0 0 17px;}
.bg_gnb {height:45px; background-color:#3399ff; }
.bg_gnb.main {display:none;}
#Header_Wrap.sub .h_menu_wrap .h_menu {width:980px;}

#Header {*zoom:1; position:relative; width:1240px; height:83px; margin:0 auto;}
.sub #Header {width:980px;}
#Header:after {content:""; display:block; clear:both;}
#Header .h_logo {position:absolute; left:0px; top:30px;}
#Header .btn_english {position:absolute; left:200px; top:32px;}

#GNB_Wrap {float:right;}
#GNB_Wrap .gnb {*zoom:1; /*margin-top:33px;*/}
#GNB_Wrap .gnb:after {content:""; display:block; clear:both;}
#GNB_Wrap .gnb > li {position:relative; float:left; padding-left:48px;}
#GNB_Wrap .gnb > li a {display:block; padding:33px 0; /*background:#ff0066;*/ font-weight:bold; color:#333333;}
#GNB_Wrap .gnb li a.on {color:#349eed;}
#GNB_Wrap .gnb li a:hover {color:#349eed;}
#GNB_Wrap .gnb .node2 {/*display:none;*/ position:absolute; top:75px; width:715px; background:url('/Images/Common/bg_gnb_arrow.png') center top no-repeat;}
#GNB_Wrap .gnb .node2.on {display:block;}
#GNB_Wrap .gnb li.no1 .node2 {left:-225px;}
#GNB_Wrap .gnb li.no2 .node2 {left:-200px; width:580px;}
#GNB_Wrap .gnb li.no3 .node2 {left:-270px; background-position:342px top;}
#GNB_Wrap .gnb .node2 li {float:left; margin:0 15px;}
#GNB_Wrap .gnb .node2 li a {padding:22px 0; height:53px; color:#fff;}
#GNB_Wrap .gnb .node2 li a.on {color:#fff600;}
#GNB_Wrap .gnb .node2 li a:hover {color:#fff600;}
#GNB_Wrap.main .node2 {display:none;}

#Container {position:relative; width:100%; height:100%;}
#Container.main {padding:0 0 220px 0;}
#Container.sub {padding:0 0 190px 0;}
#Contents {position:relative; width:1240px; margin:0 auto;}
#Container.sub #Contents {width:980px; height:100%; padding:0 0 0 0;}

.quick_menu {position:absolute; right:0px; top:0px;height:330px;border:1px solid #dfe1e8;}
.quick_menu li {width:120px; height:25%; border-top:1px solid #dfe1e8; text-align:center;}
.quick_menu li:first-child{border-top:none}
.quick_menu li a {display:block;height:100%;padding-top:11px;}
.quick_menu li .img_wrap {margin-bottom:10px;}
.quick_menu li .tit {font-weight:bold; font-size:14px; color:#555;}


#Footer_Wrap {position:absolute; left:0px; bottom:0px; width:100%; padding:48px 0; background-color:#5f6166}
#Footer {position:relative; width:1240px; margin:0 auto;}
#Footer .f_logo {position:absolute; left:0px; top:0px;}
#Footer .footerInfo {margin-left:255px;}

#Footer .footerInfo .f_menu {overflow:hidden; margin-bottom:20px;}
#Footer .footerInfo .f_menu li {float:left; padding:0 16px; background:url('/Images/Common/ico_interval_footer.png') right 0 no-repeat;}
#Footer .footerInfo .f_menu li:first-child {padding-left:0px;}
#Footer .footerInfo .f_menu li:last-child {padding-right:0px; background:none}
#Footer .footerInfo .f_menu li a {display:block; font-weight:bold; font-size:14px; color:#fff;}
#Footer .footerInfo .address {font-size:12px; color:#fff; line-height:20px;}
#Footer .footerInfo .copyright {font-size:12px; color:#fff; line-height:20px;}

/* popup */
.pop_wrap {display:none; position:fixed; left:50%; top:10%; height:100%; z-index:222; opacity:0}
.pop_wrap.on {display:block;}
.pop_wrap .pop_inner {position:absolute; left:-440px;}
.pop_wrap.mainPop_no3 .pop_inner {position:absolute; left:-328px;}
.pop_wrap.mainPop_no4 .pop_inner {position:absolute; left:-328px;}
.pop_wrap .pop_header {position:relative; width:880px; height:80px; line-height:80px; padding:0 30px; background-color:#34bbd2; font-weight:bold; font-size:28px; color:#fff;}
.pop_wrap .btn_close {position:absolute; right:30px; top:0;}
.pop_wrap .btn_close.type2 {top:10px; right:10px;}
.pop_wrap .pop_body {padding:50px 60px; background-color:#fff}
.pop_wrap .pop_footer {padding:16px 20px; background-color:#dfe1e8;}

.pop_wrap.mainPop_no1 {}
.pop_wrap.mainPop_no1 .pop_inner {position:absolute; top:27px; left:100px;}
.pop_wrap.mainPop_no1 .pop_header {width:455px; height:50px; line-height:50px; font-size:18px;}
.pop_wrap.mainPop_no1 .pop_body {padding:30px; border:5px solid #34bbd2; border-top:0px; text-align:center;}
.pop_wrap.mainPop_no1 .pop_body .studyInfo {margin-bottom:20px; font-weight:bold; font-size:16px; color:#333; line-height:24px;}
.pop_wrap.mainPop_no1 .pop_body .explain {margin-top:20px; font-size:13px; color:#666; line-height:22px;}
.pop_wrap.mainPop_no1 .pop_body .explain a {font-weight:bold;}

.pop_wrap.no2 .pop_body .explain {margin-bottom:20px; font-size:16px; color:#333; line-height:24px; text-align:center;}

.pop_wrap.pop_sml {top:50%;}
.pop_wrap.pop_sml .pop_header {width:386px; height:50px; line-height:50px; font-size:18px;}
.pop_wrap.pop_sml .pop_inner {position:absolute; left:-198px; top:-98px;}
.pop_wrap.pop_sml .pop_body {padding:40px; border:3px solid #34bbd2;}

.popBtn_wrap {position:relative; width:1280px; margin:0 auto;}
.popBtn_wrap .btn_openPop {display:none; position:absolute; right:-37px; top:0px; z-index:202;}
.popBtn_wrap .btn_openPop.on {display:block;}

.con_wrap {display:none; position:fixed; left:0px; top:0px; width:100%; height:100%; background-color:#000; opacity:0.8; z-index:211; opacity:0}
.con_wrap.on {display:block;}