@charset "utf-8";

.wrap{position:relative;  max-width:1200px; margin:0 auto;} /*전체 최대 넓이 조절 */
@media screen and (max-width:1200px) {
.wrap{margin:0 2% !important; }	
}
@media screen and (max-width:640px) {
.wrap{margin:0 4% !important; }	
}

/******************************* 공통layout ******************************************/

#header_wrap {position:fixed; width:100%; z-index: 100 !important; height:150px}

/*top*/
#top {width:100%; height:42px; overflow:hidden; background: url("../img/common/top_bg.png") bottom repeat-x; font-size:13px; color:#fff;}
#top ul {margin:0 0 0 -3px;}
#top ul li {float:left; line-height:42px; width:118px; text-align:center; background: url("../img/common/top_line.png") right center no-repeat;}
#top ul li:last-child {background:none;}
#top ul li.on {width:138px; background: url(../img/common/top_on.png) right center no-repeat; }
#top ul li.on a {color:#06004e; font-weight:500;}
#top .story {float:right; text-align:right; width:242px; line-height:42px; background: url(../img/common/story.png) left center no-repeat;}
#top .story a {width:242px;}

@media screen and (max-width:1200px) {
#top {width:100%; height:28px; overflow:hidden; font-size:12px; color:#c1bce3;}
#top ul li {display:inline-block; line-height:28px; width:auto;}
#top ul li.mpr {padding:0 16px 0 0;}
#top ul li.mps {padding:0 16px;}
#top ul li.on {width:auto; background: url(../img/common/top_line.png) right center no-repeat;}
#top ul li.on a {color:#fff; font-weight:600;}
#top .story {float:right; text-align:right; width:224px; line-height:28px; background: url(../img/common/story.png) left center no-repeat;}
#top .story a {width:224px; color:#fff;}
}

@media screen and (max-width:1000px) {
#top .story {width:212px;}
#top .story a {width:212px;}
}

@media screen and (max-width:640px) {
#top ul li span {display:none;}
#top ul li.mpr {padding:0 10px 0 0;}
#top ul li.mps {padding:0 10px;}
#top .story span {display:none;}
#top .story {width:98px;}
#top .story a {width:98px;}
}


#header { width: 100%;   background:#FFF; border-bottom:1px solid #e5e5e5; }
#header h1 {position: absolute; z-index: 1; padding:28px 0 0 0; left: 50%;  margin-left: -600px;  }
@media screen and (max-width:1200px) {	 
#header h1	{ margin-left: -48%;} 
}



/*lnb*/
.lnb { position: absolute; z-index: 11 !important; top:75px;  left: 50%; width: 948px; margin-left: -320px; }
.lnb > ul {  }
.lnb > ul > li { text-align: center; letter-spacing: -0.6px; }
.lnb > ul > li > a { padding: 8px 10px; display: block; font-size: 16px;  letter-spacing:0px ; color:#343434; }
.lnb > ul > li > a:hover, .lnb > ul > li > a.on { color: #3726b2; font-weight:500;} /* 오버색상*/
.lnb ul li.lnb_1 { float: left; position: relative; }
.lnb ul li.lnb_1 ul { position: relative; top:62px; height: 100%; clear: both; display: none;}
.lnb ul li.lnb_1 ul li a { font-size: 14px; display: block; padding: 3px 5px; color: #5c5c5c; line-height:1.5em; }
.lnb li.on ul li a {  }
.lnb li.on ul li a:hover { color: #3726b2; font-weight:500;}   /*오버색상*/
.lnb li.lnb1 { width: 158px; text-align: center }
.lnb li.lnb2 { width: 158px; text-align: center }
.lnb li.lnb3 { width: 158px; text-align: center }
.lnb li.lnb4 { width: 158px; text-align: center }
.lnb li.lnb5 { width: 158px; text-align: center }
.lnb li.lnb6 { width: 158px; text-align: center }
  .bg_navi { background: url(../img/common/submenu_bg.jpg) top center no-repeat; top: 150px; width: 100%; height: 0px; overflow: hidden; position: absolute; z-index: 10;}
  .bg_navi li.bgn { left: 50%; top: 0px; width: 1000px; padding-top: 10px; margin-left: -500px; position: absolute; z-index: 10000; }
  .bg_navi li.bgn p.lnb_tit { font-size: 14px; font-weight:600; margin-bottom:10px; display:none }
  .bg_navi li.bgn p.lnb_img {  padding-top: 0px; width: 250px; font-size: 12px; letter-spacing: -1px; display:none }
  .bg_navi li.bgn p.lnb_img img { margin-bottom: 10px; }
  .bg_navi li.bgn p.text { float: left; letter-spacing: -1px; color: #666; line-height:normal }

.mobile_lnb { display: none }

@media screen and (max-width:1200px) {
#header_wrap { height: 92px}
#header { display:none; }
#header h1 { padding: 6px 0 0 0; left: 2%; top: 0px; margin-left: 0; position: absolute; z-index: 1 ; max-width:120px ; position:relative ; text-align: left}

.gnb { display: none; }
.lnb{ display:none}

.mobile_lnb { display: block; position: absolute; top: 0px;  width:100%; text-align:right ;}
.mobile_lnb a.menu_btn{ padding:0 2% 0 0 ; display:inline-block }
.mobile_lnb a.menu_btn img{ margin:14px 0;margin-right:0%;}
/*
.mobile_menu_area > ul{ position:absolute; top:60px; z-index:3000 !important ; width:100%;  left:0;  background:#fff;}*/
.mobile_menu_area{position:absolute; top:50px; overflow:hidden; display:none; background:#fbfbfb; display:block; width:100%;}
.mobile_menu_area > li { clear:both; padding:15px 2%; border-top:1px solid #E8E8E8; overflow:hidden}
.mobile_menu_area li h3{ float:left; width:100px; text-align:left; margin:0; padding:0; font-size:14px; font-weight:500;padding:5px 5px; w}
.mobile_menu_area li ul{ text-align:left}
.mobile_menu_area li ul li{ float:left; width:120px; padding:0; display:block;}
.mobile_menu_area li ul li a{ font-size:13px; padding:3px 5px; display:block;}
.mobile_menu_area li.menu_close{ text-align:left ; background:#333; overflow:hidden; height:28px}
.mobile_menu_area li.menu_close a{ border-bottom:0;  }
.mobile_menu_area li.menu_close img{ margin:5px 0; float:right}
.mobile_menu_area li a.call {   width:auto;  padding: 10px 0; font-size:14px; line-height:28px; text-align:left; letter-spacing: 0.3px;font-weight:500 ; color:#fff}
.mobile_menu_area li a.call span{ color:#6685f8; font-weight:300; padding:0 5px 0 0;letter-spacing: -0.5px;}
}
@media screen and (max-width:640px) {
.mobile_lnb a.menu_btn{ padding:0 4% 0 0 ;}
#header h1 { left: 4%;}
.mobile_menu_area > li {  padding:5px 3%; }
.mobile_menu_area li ul{ margin:0 0 0 80px; text-align:left}
.mobile_menu_area li h3{ letter-spacing:-2px; padding:2px 0; font-size:13px; width:80px;}
.mobile_menu_area li ul li{ width:100px;}
.mobile_menu_area li ul li a{ font-size:12px}
}



/* footer */
#footer { position: relative; clear:both; height:220px;}

#footer .sitemap {padding:32px 0; border-top:1px solid #e5e5e5;}
#footer .sitemap ul {height:184px; background: url(../img/common/sitemap_line.png) left center no-repeat;}
#footer .sitemap ul li {width:16.666%; height:184px; float:left; background: url(../img/common/sitemap_line.png) right center no-repeat;}
#footer .sitemap ul li dl {padding:0 0 0 24px; }
#footer .sitemap ul li dl dt {font-weight:500; padding:0 0 6px 0; color:#5c5c5c;}
#footer .sitemap ul li dl dd {font-size:14px; color:#898989; line-height:1.6em; }

#footer .foot_info { overflow: hidden; padding:32px 0; font-size:13px; border-top:1px solid #e5e5e5; background:#f6f6f6;text-align:center;}
#footer .foot_info .sns {width:100%;}
#footer .foot_info .sns ul li {display:inline-block; padding:0 4px;}

#footer address { font-size: 13px; line-height:1.4em; padding:24px 0 6px 0; color:#898989; }
#footer address span{ color:#b7b7b7; padding:0 5px;  }
#footer .copy{ font-size:12px;  color:#a9a9a9; text-transform:uppercase; }
#footer .copy span{font-weight:500; color:#9b9b9b;}


@media screen and (max-width:1200px) {
#footer {height:auto !important;}
#footer address br { display:none}
}

@media screen and (max-width:960px) {
#footer .sitemap ul li dl {padding:0; text-align:center; }
#footer .sitemap ul li dl dd span {display:none;}
}
@media screen and (max-width:640px) {
#footer .sitemap {display:none;}
#footer .foot_info {padding:24px 2%;}
#footer address {padding:16px 0 3px 0;}
}

/*go_top*/

.btn_top {position:fixed; right:2%; bottom:2%; width:45px; height:45px; z-index:100;}
.btn_top a {display:block; width:100%; height:100%; background: url("../img/common/top.png") top center no-repeat;}
.btn_top a:hover {background: url("../img/common/top.png") bottom center no-repeat;}
@media screen and (max-width:960px){
.btn_top { display:none }
}





/***********************************************서브레이아웃***************************************************/
/*서브비주얼*/
.sub_visual { height: auto; margin: 0 auto; height:260px; padding:150px 0 0 0; text-align:center;  background-repeat:no-repeat; background-position:top center; }
.sub_visual h2 { font-size: 42px; padding-top: 92px; font-weight:normal; margin:0; color:#fff ; line-height:30px; /*text-shadow: #666 1px 1px 3px;*/}
.sub_visual p { font-size: 14px; color: #fff; padding:0; margin-top:18px; }

.sub_bg01{ background:#fff url(../img/sub/sub_visual01.jpg) top center no-repeat; background-attachment:fixed;}
.sub_bg02{ background:#fff url(../img/sub/sub_visual02.jpg) top center no-repeat; background-attachment:fixed; }
.sub_bg03{ background:#fff url(../img/sub/sub_visual03.jpg) top center no-repeat; background-attachment:fixed; }
.sub_bg04{ background:#fff url(../img/sub/sub_visual04.jpg) top center no-repeat; background-attachment:fixed;}
.sub_bg05{ background:#fff url(../img/sub/sub_visual05.jpg) top center no-repeat; background-attachment:fixed;}
.sub_bg06{ background:#fff url(../img/sub/sub_visual06.jpg) top center no-repeat; background-attachment:fixed;}

@media screen and (max-width:1200px) {
.sub_visual{ height:200px; background-size:200% }
.sub_visual h2 { padding-top: 38px;}
}
@media screen and (max-width:860px) {
.sub_visual{ height:150px;  background-size:200% }	
.sub_visual h2 { font-size:35px; padding-top:10px;} 
}
@media screen and (max-width:640px) {
.sub_visual h2 { font-size:24px;} 
.sub_visual{ height:120px; background-size:250% }	
.sub_visual p{ display:none}
}
@media screen and (max-width:500px) {
.sub_visual{  background-size:350% }	   
}



/*서브메뉴*/
.sub_nav{ display:block;  margin:0 auto; text-align:center; background:rgba(0, 0, 0, 0.3);}
.sub_menu {height:43px;margin: 0px auto; margin-top: -43px; margin-left:0px;  }
.sub_menu::after { overflow: hidden; clear: both; display: block; content: " "; }
.sub_menu li { min-width: 164px; _display:inline;*float:left; margin:0;  display:inline-block ;}
.sub_menu li a { height: 43px; text-align: center; line-height: 43px; overflow: hidden; display: block; position: relative; z-index: 0; color: #fff; padding:0 15px; font-size:14px; margin-left:-6px ; }
.sub_menu li a:hover {/* border: 1px solid #CCC; color: #fff; z-index: 100; background: #CCC; */ }
.sub_menu li.actived a {z-index: 100; background: #fff; color: #343434;}
.sub_menu li a.on {z-index: 100; background: #fff; color: #343434;}

@media screen and (max-width:1200px) {
.sub_menu li { min-width:158px !important}
.sub_menu li a { padding:0 10px; }
}
 
@media screen and (max-width:999px) {
.sub_nav {background:none;}
.sub_menu {height:auto; margin-top: 1px; margin-left:0; }
.sub_menu li a { border:1px solid #e5e5e5; overflow: hidden; display: block; position: relative; z-index: 0; background: #fff; color:#343434; margin:-1px 0 0 -1px; height: 35px; line-height:35px; font-size:13px; padding:0}
.sub_menu li {width:25%; min-width:50px; float:left}
.sub_menu li.actived a {z-index: 100; background: #343434; color: #fff; border:1px solid #343434;}
.sub_menu li a.on {z-index: 100; background: #343434; color: #fff; border:1px solid #343434;}
}

@media screen and (max-width:640px) {
.sub_menu { margin-top: 1px; margin-left:0;   }
.sub_menu li a { margin-left:-1px; margin-top:-1px;  height: 35px; line-height:35px; font-size:12px; padding:0}
.sub_menu li {  width:33.333%; min-width:50px; float:left}
}
@media screen and (max-width:442px) {
.sub_menu li {width:50%;}
}



/*타이틀, path*/
.tit_area{  position:relative; color:#333; z-index:1999 !important ; margin-bottom:3.4em ;}
.tit_area .wrap{ }
.tit_area .path{width:280px; position:absolute; right:0%; top:53px; font-size:13px; color:#898989; text-align:right; line-height:15px; }
.tit_area .path span.home{width:20px; height:20px; text-indent: -9999px; vertical-align: bottom;}
.tit_area .path span.v_line{ background:url(../img/sub/path_arr.gif) no-repeat 50% 50%; display:inline-block; width:20px; height:10px;}
.tit_area h2{font-size:52px; font-weight:200; padding:0 ; letter-spacing:-1px; text-align:center  }

.mobile_path{ display:none}

@media screen and (max-width:1200px){
.tit_area h2{font-size:42px; font-weight:400;}
.tit_area .path{width:100%; display:block; position:relative; text-align:center; top:inherit}
.mobile_path{ display:block; display:none }
.mobile_path{  overflow:hidden;border-bottom:1px solid #dddddd;}
.mobile_path > li{ float:left;  color:#333; border-right:1px solid #dddddd; height:44px; line-height:44px; display:inline-block; padding:0 10px}
.mobile_path > li.home{  background:url(../img/sub/path_home.gif) no-repeat 50% 50%;  text-indent: -9999px; width:20px; margin-left:2%;  border-left:1px solid #dddddd;}
.mobile_path > li.snb_area{ width:140px}

#select_open {  width:160px; top:46px;position: absolute;  background:#fff; display: none; border-left:1px solid #dddddd ; border-right:1px solid #dddddd; margin-top:-1px; z-index:30000; margin-left:-11px; }
#select_open .open li { clear: both; margin: 0; float:left; width:160px; text-indent:10px }
#select_open .open li a { display: block;   height:46px; line-height:46px; border-bottom:1px solid #dddddd;}
#select_open .open li a:hover { color:#fff; background:#999}
.select { width: 100%; }
.select input { width: 100%;   border: 0;   height:44px; line-height:44px;cursor:pointer; background:url("../img/sub/snb_down.gif") no-repeat 90% 50%; font-size:inherit;}	
}

.sub_container{width:100%; position:relative; margin:0 auto;  z-index:1;overflow:hidden ; padding:70px 0; min-height:350px; }
.elymong_container{width:100%; position:relative; margin:0 auto;  z-index:1; overflow:hidden ;padding: 0 0; }

@media screen and (max-width:1200px){
.sub_container{  padding:30px 0 30px 0}	
.tit_area{   margin-bottom:2em ;}
}
@media screen and (max-width:860px) {
.tit_area h2 { font-size:42px;} 
}
@media screen and (max-width:640px){
.tit_area h2{  font-size:32px;   }
}