@charset "utf-8";
/* 공통 레이아웃 */
div {box-sizing: border-box;}
#wrap {position: relative; width: 100%; overflow: hidden;}
#wrap:after {content: ''; display: block; clear: both;}

/* 상단 레이아웃 */
#header_wrap {position: fixed; width: 100%; height: 60px; background:#222; z-index:999;}
#header {position: relative; width:100%; height:auto; margin: 0 auto; z-index:11; }
#header:after {content: ''; display: block; clear: both;}
#logo {display:table; float: left; width: 15%; height:60px;}
#logo  > a {display:table-cell; width:100%; height:100%; vertical-align:middle;  text-align:center;}
#logo  > a:hover ,#logo  > a:focus  { background:#a00; transition:all 0.3s ease;}
#logo  > a > img { width:112px; height:20px;}

/* 메뉴 부분 */
#lnb{ height:100%; width:85%; float:left; padding-right:249px;  box-sizing:border-box; }
 li.lnb_li {text-align:center; float:left;  height:auto;  box-sizing:border-box; border-left:1px solid #444;}
 li.lnb_li > a {position:relative; display: block; font-weight:400; line-height:60px; color:#ddd; width:100%; height:100%;  font-size: 15px;  }
 li.lnb_li > a.lnb_on {color:#fff; background:#a00; transition:all 0.3s ease; }
 li.lnb_li > a.lnb_on:after {position:absolute; display:block; content:''; bottom:0; left:50%; margin-left:-8px; width:0; height:0; border-width:8px; border-style:solid; border-color: transparent transparent #900 transparent}
    
  /*서브메뉴 세로형태 */
.sub {width:100%; display:none;  }
.sub > li  { width:100%; text-align:left; border-bottom:1px solid #800;  }
.sub > li > a {display:block; background:#900; color:#fff;width:100%; padding: 10px 20px; box-sizing:border-box; }
.sub > li > a:focus, .sub > li > a:hover{color:#fff; background:#333} 
.sub > li > a:focus:after, .sub > li > a:hover:after {font-size:9px; content:"\e60d"; font-family:'xeicon'; float:right;  margin-top:5px; color:#fff;}

/*모바일 메뉴 */
#m_wrap {position:fixed; display:none;  top:0px; width:100%; height:100%; background:#000;  z-index:10;opacity:0.7; filter:alpha(opacity:'70');}
#m_lnb{position:relative; display:none;  width:100%; padding-right:0;  }
 li.m_lnb_li {text-align:left; width:100%;  height:auto; border:0px; }
 li.m_lnb_li > a {display: block; color:#ddd; height:45px; padding-left:30px; font-weight:400;  font-size: 13px; box-sizing:border-box; background:#333;   border-top:1px solid #444; line-height:45px;}
 li.m_lnb_li > a.lnb_on {color:#fff; background:#900;  border-top:0;  }
 li.m_lnb_li > a > i  {float:right; font-size:16px; margin:14px;  }
.m_sub {width:100%; display:none; background:#700; }
.m_sub > li  { width:100%; text-align:left; }
.m_sub > li > a {display:block;  font-size:12px; color:#fff; width:100%; padding:8px 35px;  border-bottom:1px solid #800; box-sizing:border-box; }
div.m_on > button {background:#900;}

/*gnb 영역 */
#gnb_wrap {position:absolute; top:0px;  right:0px; width:250px; height: 60px; padding: 0; float:left;}
#gnb_wrap > li { width:60px; height:100%;  color: #777; float:left; border-left:1px solid #444; box-sizing:border-box;}
#gnb_wrap > li > a {display:block;  width:100%; height:100%; font-weight:400; background:#000; font-size: 15px; color: #ddd; text-align:center; line-height:60px;}
#gnb_wrap > li#gnb_mypage {width:130px; }
#gnb_wrap > li#gnb_mypage > button {width:100%; height:100%; border:0px; color:#fff; background:#000;}
#gnb_wrap > li > a:hover ,#gnb_wrap > li > a:focus, #gnb_wrap li#gnb_mypage > button:hover {background:#a00 !important; color:#fff !important; transition:all 0.3s ease; }
#gnb_lan > button {width:100%; height:100%;  border:0px; background:#000; }
#gnb_lan > button:hover {background:#a00 !important; transition:all 0.3s ease;}
.gnb_lan_group {display:none;}
.gnb_lan_group > li {width:60px;  overflow:hidden;}
.gnb_lan_group > li > a {display:block; width:100%; height:100%; padding:5px 0px ;text-align:center; vertical-align:middle;}
.gnb_lan_group > li > a > img {width:25px;}
.gnb_lan_group > li > a:hover > img {width:30px; transition:all 0.3s;}

.m_icon {display:none; float:left; width:60px; height:60px;}
.m_icon > button { font-size: 22px;  width:60px; height:60px; color: #ddd; text-align:center; line-height:60px; border:0px; background:#000; cursor:pointer; }
.m_menu { position:absolute; top:0px;  left:0px; width:60px;}
.m_menu  > button { box-sizing:border-box; border-right:1px solid #444;}
  
 /*마이페이지 */
 #mypage_wrap {position:absolute; display:none; width:320px; height:auto; padding:20px; background:#ccc; right:0px; top:60px; box-sizing:border-box; z-index:9;  }
 .h_txt_mypage { font-size:25px; font-weight:normal;  text-align:center; color:#000; }
 .h_txt_mypage_sub { font-size:15px; font-weight:normal;  text-align:center;  margin:10px 0px;}
 .inner_box {overflow:hidden; }
 .inner_box label {display:block; width:0px; height:0px; font-size:0px; overflow:hidden; line-height:0px; }
 #password, #uid {width:100%; height:30px; border:1px solid #ccc; margin-bottom:5px; padding-left:20px; box-sizing:border-box;}
.btn_mypage {display:block; width:100%; font-size:13px; height:40px; text-align:center; line-height:40px; border:0px; background:#333; cursor:pointer; color:#fff; }
.btn_mypage:hover {background:#000; }
.btn_group {width:100%; height:auto;  overflow:hidden; margin-top:10px; padding-top:10px; border-top:1px solid #aaa;  }
.btn_group > li  {width:137.5px; float:left; height:40px; line-height:40px; border:0px; margin-bottom:5px; line-height:40px;  }
.btn_group > li:first-child  {margin-right:5px;}

.p_box_mypage {background:#eee; padding:10px; margin-top:10px; text-align:center; }
.p_box_mypage > h3 {font-weight:normal; font-size:13px;  }
.p_box_mypage > p {font-size:12px;  }

.mypage_group  > ul > li { width:100%; float:left;  }  
.mypage_group  > ul > li > a {display:block; padding:10px 20px;color:#555; font-size:13px; background:#f9f9f9;border-top:1px solid #ddd; }  
.mypage_group  > ul > li > a > i {float:right; margin-top:2.5px; }  
.mypage_group  > ul > li > a:hover { background:#900; color:#fff; padding-right:10px; transition:all 0.3s ease;}  


/* 프론트 레이아웃 */
#main_visual {position: relative;  clear: both; width: 100%; height: 450px; margin-top:60px; border-bottom:1px solid #ccc; overflow:hidden;}
#fl_body {position:relative;width:100%; margin:0 auto !important;  padding:0; margin:0; }
#fl_context {position: relative; width: 100%; height: 100%; margin: 0 auto;}

/* 하단영역 */
#footer_wrap {clear: both; width: 100%; background: #333; overflow: hidden;}
#footer_gnb {width: 100%; height: 40px; background: #222;}
#footer_gnb ul {width:453px; height: 40px; margin: 0 auto; overflow: hidden;}
#footer_gnb ul li {display: inline-block; font-size: 14px; color: #707070; margin:0 7px; line-height: 40px;}
#footer_gnb ul li a {font-size: 14px; color: #999;}
#footer {width: 100%; margin: 0 auto; padding: 30px; text-align:center;}
#copyright, address {font-size: 14px; color: #999; line-height: 1.8;}

#fl_call {width:100%; background:url('/home/image/main/fl_call_bg.jpg') center no-repeat; padding:30px 0px; }
.call_wrap > .h_txt_fl2 {color:#fff; margin:0px; font-weight:400;}
.call_wrap > .h_txt_fl2:after {background:#fff;}
.call_wrap > h3.h_txt_item {text-align:center; padding:10px;  padding-top:0px; font-size:30px;color:#fff;}
.call_wrap > p.p_txt_fl1{color:#fff;}



/* 메인비쥬얼  */
#visual_wrap { position: relative;  width: 300%; height:100%; overflow:hidden;}
.visual  {height:auto;}

/*비쥬얼 이미지 부분 */
#vis01 {background:url('/home/image/visual/vis_bg4.jpg') no-repeat; background-position: center 0px;}
#vis02 {background:url('/home/image/visual/vis_bg1.jpg') no-repeat; background-position: center 0px;}
#vis03 {background:url('/home/image/visual/vis_bg2.jpg') no-repeat; background-position: center 0px;}
#vis04 {background:url('/home/image/visual/vis_bg3.jpg') no-repeat; background-position: center 0px;}

/*비쥬얼 교체 할수있는  부분 */
.visual_item {position:relative; width:100%; max-width:1200px; height:auto;  margin:0 auto; }
.visual_item:after  {content: ''; display: block; clear: both;}
.visual_item  > .visual_text {position:absolute; width:520px;  left:50px; top:20%; }
.visual_item  > .visual_img {position:relative;  float:right;  }
.visual_item  > .visual_text_m {position:relative; margin: 0 auto; width:400px;  padding:50px 0px;display:none; }
#vis02  .visual_img {right:40px;}

#visual_nav  { width:80px; margin:0 auto; margin-top:7px; }  
#visual_nav  ul {display:block;overflow:hidden;}
#visual_nav  ul li {display:block; cursor:pointer; float:left; background:#333; color:#333; width:16px; height:16px; margin:0px 2px;  padding:0px;  border-radius:16px;  }
#visual_nav  ul li.visual_active { background:#900;} 


.visual_btn {position:absolute; padding:10px 0px 10px 0px;  top:40%;  cursor:pointer; z-index:10; font-size:20px; color:#999;  background:#000;opacity:0.3; filter:alpha(opacity:'30');}
#visual_prev {border-radius:0px 35px 35px 0px; padding-right:7px !important; }
#visual_prev > i {margin-left:-2px;}
#visual_next {border-radius:35px 0px 0px 35px; padding-left:7px !important;}
#visual_next > i {margin-right:-2px;}
.visual_btn:hover { opacity:0.7; filter:alpha(opacity:'70'); color:#fff;}
#visual_next {right:0px;}

/*비쥬얼 로그인 부분  */
#visual_login {position:relative; width:100%; max-width:1200px;  margin:0 auto; bottom:50px; height:50px; padding:10px; box-sizing:border-box; z-index:10; }
#visual_notice {width:430px; float:left; }
#visual_notice  > p{display:block;  padding:0px 10px ; font-weight:600; color:#900; line-height:30px; float:left;  }
#visual_notice > ul.postbrief{float:left;} 
#visual_notice   .text_a > .s_icons{display:none; }


#visual_login > ul  > li {float:left;   height:30px; line-height:30px; margin-left:5px;  } 


/*---비쥬얼 끝 ---*/


/* 퀵메뉴 */
.q_div {position: absolute; top: 0; right: -270px; width: 170px; overflow: hidden;}
.q_div .cap {width: 100%; height: 40px; font-size: 16px; color: #fff; line-height: 40px; text-align: center; background: #333;}
.q_div .mlist {width: 100%; padding: 10px 20px; background: #fff;}
.q_div .mlist a {display: block; width: 100%; height: 100%; font-size: 14px; color: #333; line-height: 35px;}
.q_div .mbase {clear: both; width: 100%; height: 1px; background: #9a9a9a;}

/* 서브페이지 레이아웃 */
#sl_wrap {clear: both; position: relative; width:100%; height:100%; padding-top: 60px; overflow:hidden; background: #f3f3f3;}
#sl_body {position: relative; width: 100%; margin: 0 auto; height: auto;}
#sl_body:after {content: ''; display: block; clear: both;}
#sl_vismenu { width:100%; height:auto; padding-top:130px; box-sizing:border-box; background:url('/home/image/sub/sub_bg.jpg') center 0px no-repeat;}
#sl_menu {position:relative; width:100%;  max-width:1100px; margin:0 auto;}
#sl_context {position: relative; width: 100%; max-width:1100px; height:auto; border-bottom: 1px solid #ebebeb; margin:0 auto;  margin-bottom:50px;}
#cl_context {padding: 30px; background: #fff;  margin:0;} 

/* 서브페이지 좌측메뉴 */
#sl_menu button {display:none; position:absolute;  width:35px; height:35px; background:#333; top:95px; right:20px; border:0px; color:#fff;}
#sl_menu .cap {width:100%; max-width:1100px; height:70px; margin:0 auto;  margin-left:10px; margin-bottom:5px;}
#sl_menu .title {color: #333; font-size:50px; padding-top: 5px; color:#fff;}
#sl_menu .title:before {content:''; display:block; width:50px; height:2px; background:#fff; }
#sl_menu .mlist {width:100%; height:75px; overflow: hidden; background:#f9f9f9; padding:20px 0px 20px 20px; box-sizing:border-box;}
#sl_menu .mlist:before {content:'>'; display:block; color:#fff;  float:left; background:#333; padding:0px 13px 0px 15px; font-size:12px; font-family:Dotum; height:35px; line-height:35px;  font-weight:600;}
#sl_menu .mbase {width:100%; height:30px; clear:both; background:#fff;}
#edit_con {position:absolute; top:20px;  z-index:999;}

/* 1차 메뉴 */
#sl_menu .mlist .m_out, #sl_menu .mlist .m_current {float:left; margin-left:5px;display:block; }
#sl_menu .mlist .m_out a, #sl_menu .mlist .m_current a {display:block; height:35px; line-height:35px; padding:0px 15px; font-size:15px;}
#sl_menu .m_out a {color: #555; background: #ddd;}
#sl_menu .m_out a:hover {color: #333; background: #ccc;}
#sl_menu .m_current a {color: #fff; background: #600; font-weight:400;}

/* 컨텐츠 제목 영역 */
#cl_top { width: 100%; height: auto;  padding:30px 10px;  background: #fff; padding-bottom: 10px; overflow: hidden;}
#cl_top:after {content:''; display:block; width:100%; height:20px; margin-top:30px;  background:url('/home/image/sub/con_bar.png') center no-repeat;}
#cl_top h1 {width:100%;height: auto; overflow: hidden;}
#cl_top h1:after {content:''; display:block; width:30px; height:1px;margin:0 auto; margin-top:10px; background:#333;}
#cl_top .cms_title_str {font-size: 33px;  font-weight:400; color: #333; text-align: center;}
#cl_top #cl_nav {  margin:0 auto; margin-top: 20px;}
#cl_top #cl_nav .cms_navigation_str {text-align:center; font-size: 14px; color :#999;}
#cl_top #cl_nav .cms_navigation_str a {color :#999; margin: 0 10px;}
#cl_top #cl_nav .cms_navigation_str .navi_last_id { font-size: 14px;  color:#777; }


/*사이트맵 내용*/
.sitemap_wrap {overflow:hidden; background:#fff;}
.sitemap_wrap > div {width:30%; margin:1.5%; float:left; min-height:250px; height: auto; overflow: hidden; }
.sitemap  {margin-top:20px; }
.sitemap .cap {background:#555; width:100%; padding:10px 0px;}
.sitemap .title {font-family: 'Noto Sans Regular'; font-size: 15px; color:#fff; text-align: center;}
.sitemap .menu { border-bottom:1px dotted #d1d1d1; width:100%; text-align:left; clear:both; }
.sitemap .menu > a  {display:block;padding:10px 10px 10px 15px; clear:both;  color:#555;  }
.sitemap .menu > a:hover  {color: #000; background: #f9f9f9;}
.sitemap ul.menu_third li { width:100%; border:none; border-top:1px dotted #d1d1d1; background:#f9f9f9; }
.sitemap ul.menu_third li a {padding-left: 25px;  color:#777; }
.sitemap ul.menu_third li a:hover { color: #333; }

/* 공통 요소 */
.btn_item1 {display:block; padding:0px 10px;  border:0px; height:100%; background:#333; color:#fff;} 
.btn_item1:hover { background:#000;} 
.btn_red {background:#900;}
.btn_red:hover {background:#c00;}
#sl_context  > .brd {padding:0px 30px;  padding-bottom:50px; background: #fff; }



/*게시판 카테고리 */
.brd_category {width:100%; overflow:hidden; margin:10px 0px; }
.brd_category > ul {overflow:hidden; padding-bottom:20px;}
.brd_category > ul >li {float:left; width:32.33%; margin:0px 0.5%;  background:#eee; text-align:center; padding:12px 0px; box-sizing:border-box;}
.brd_category > ul >li > a {display:block; width:100%; height:100%; font-weight:600; font-size:17px; color:#777;}
.brd_category > ul >li.brd_cat_on {position:relative; font-size:17px; color:#fff; background:#600}
.brd_category > ul >li.brd_cat_on:after  {position:absolute; display:block; content:''; bottom:-20px; left:50%; margin-left:-10px; width:0; height:0; border-width:10px; border-style:solid; border-color: #600 transparent transparent transparent}



 @media screen and (min-width:970px) {
 
  #sl_menu .mlist .m_out{display:block !important; }
 }

 @media screen and (max-width:969px) and  (min-width:770px){
 #logo {display:table; float: left; width: 20%; }
 #lnb{ width:80%; padding-right:60px; }
 #gnb_wrap {width:60px;}
 #gnb_wrap li {display:none;  }
 #gnb_wrap li.m_icon {display:block;}
 .m_icon > button:hover , #gnb_wrap li.m_icon > button:focus {background:#a00; color:#fff;  transition:all 0.3s ease; }
 /*비쥬얼 영역 */
 .visual_item  > .visual_text {width:420px;}
.visual_item  > .visual_img {width:50%;}
 #visual_login {display:none;}
 /*서브메뉴*/
#sl_menu .mlist:before, #sl_menu .mlist .m_out {display:none; }
#sl_menu button {display:block; }
#sl_menu .mlist {height:auto; padding:20px; padding-right:60px; box-sizing:border-box;}
#sl_menu .mlist .m_out, #sl_menu .mlist .m_current {float:none; border-bottom:1px solid #eee; }
#sl_menu .mlist .m_out a, #sl_menu .mlist .m_current a {height:35px; line-height:35px; box-sizing:border-box; font-size:15px; }
  /*사이트맵*/
  .sitemap_wrap > div {width:45%; margin:2.5%;}
}
  
 @media screen and (max-width:769px){
 #cl_context {padding:20px;}
 #sl_context  > .brd {padding:0px 20px;  padding-bottom:50px;}
 #logo {display:table; float: none;  clear:both; width:100%; padding: 0px 60px;  box-sizing:border-box;}
#logo  > a:hover ,#logo  > a:focus  { background:none;}
#gnb_wrap {width:60px;}
#gnb_wrap li {display:none;  }
#gnb_wrap li.m_icon {display:block;}
#lnb{ display:none;}
.m_menu {display:block;}
 .fl_login {display:none;}
 /*비쥬얼 영역 */
.visual_item  > .visual_text {display:none;}
.visual_item  > .visual_img {display:none;}
.visual_item  > .visual_text_m{ display:block;}
#main_visual  div.visual  {background-position:0px 0px ; }
.visual_btn:hover { opacity:0.3; filter:alpha(opacity:'30'); color:#999;}
 #visual_login {display:none;}
#sl_menu .mlist:before, #sl_menu .mlist .m_out {display:none; }
#sl_menu button {display:block; }
#sl_menu .mlist {height:auto; padding:20px; padding-right:60px; box-sizing:border-box;}
#sl_menu .mlist .m_out, #sl_menu .mlist .m_current {float:none; border-bottom:1px solid #eee; }
#sl_menu .mlist .m_out a, #sl_menu .mlist .m_current a {height:35px; line-height:35px; box-sizing:border-box; font-size:15px; }
/*사이트맵*/
  .sitemap_wrap > div {width:45%; margin:2.5%;}
 
 
 }

 @media screen and (max-width:500px){
  #cl_context {padding:10px;}
   #sl_context  > .brd {padding:0px 10px;  padding-bottom:50px;}
 /*비쥬얼 영역 */
.visual_item  > .visual_text_m{ width:270px;}
#copyright, address {font-size: 12px; }
#footer_gnb ul {width:303px;}
#footer_gnb ul li {margin:0 0.5px; }
#footer_gnb ul li a { font-size:11px }

#sl_vismenu {padding-top:80px; }
 #sl_menu .mlist:before, #sl_menu .mlist .m_out {display:none; }
 #sl_menu button {display:block; }
 
 #sl_menu .mlist {height:auto; padding:20px; padding-right:60px; box-sizing:border-box;}
#sl_menu .mlist .m_out, #sl_menu .mlist .m_current {float:none; border-bottom:1px solid #eee; }
#sl_menu .mlist .m_out a, #sl_menu .mlist .m_current a {height:35px; line-height:35px; box-sizing:border-box; font-size:15px; }
}
 /* 배너 */ 
 #container {height:70px;}
.banner_con {height:auto; float:left; box-sizing:border-box;}

/*개인정보 취급 */
.terms {width:99%; height:200px;  border:1px solid #ddd; margin:0.5%;padding:20px; box-sizing:border-box; overflow-y: scroll;  margin-bottom:30px;}