@charset "UTF-8";
/*폰트*/
@import url(//cdn.rawgit.com/hiun/NanumSquare/master/nanumsquare.css);
@font-face {
  font-family: 'Noto Sans KR';
  font-style: normal;
  font-weight: 100;
  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.woff2) format('woff2'),
      url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.woff) format('woff'),
      url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.otf) format('opentype');
}
@font-face {
  font-family: 'Noto Sans KR';
  font-style: normal;
  font-weight: 300;
  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.woff2) format('woff2'),
      url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.woff) format('woff'),
      url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.otf) format('opentype');
}
@font-face {
  font-family: 'Noto Sans KR';
  font-style: normal;
  font-weight: 400;
  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.woff2) format('woff2'),
        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.woff) format('woff'),
        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.otf) format('opentype');
 }
@font-face {
  font-family: 'Noto Sans KR';
  font-style: normal;
  font-weight: 500;
  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.woff2) format('woff2'),
        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.woff) format('woff'),
        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.otf) format('opentype');
 }
@font-face {
  font-family: 'Noto Sans KR';
  font-style: normal;
  font-weight: 700;
  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff2) format('woff2'),
        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff) format('woff'),
        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.otf) format('opentype');
 }
@font-face {
  font-family: 'Noto Sans KR';
  font-style: normal;
  font-weight: 900;
  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.woff2) format('woff2'),
        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.woff) format('woff'),
        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.otf) format('opentype');
 }

 /*공통*/
 body, a{ font-family: 'Noto Sans KR', "맑은 고딕";}
html,body{position: relative;}
 body{ font-size: 14px; background: #fff; width: 100%; letter-spacing: 1px;}
 #hd, #wrapper, #ft{ min-width: 0;}
 .all_wrap{position: relative;}
 .blank{ display: block;}
 .blind{ position: absolute; top: 0; left: 0; bottom: 0; background: rgba(0,0,0,0.6); width:100%; z-index: 998; display: none;}
 .wrap{ width: 100%; max-width: 1300px; margin: 0 auto;}
 .clearfix{ clear: both;}
 #container_wr{ width:100% !important;}
 #container{ width:100% !important; margin: 0 !important;}
.hideme{ opacity:0; }
#hd_pop, #hd_wrapper, #tnb ul, #gnb .gnb_wrap, #container_wr, #ft_wr{ width: auto !important;}

@media all and (max-width:800px) {
  *{ word-break: keep-all;}
  .hideme{ opacity:1; }
}

/*공통 gnb*/
.big_gnb{ position: absolute; width: 100%; height: 100%; background: url(../img/main/m_bg.png) no-repeat center center; background-size:cover; left: 0; top: 0; z-index: 999; overflow: hidden; display:none;}
.big_gnb>div{ position: relative; width: 100%; height: 100%; overflow: hidden;}
.big_gnb .gnb_wrap{ position: absolute; width: 100%; max-width: 1534px; left: 50%; top: 50%; transform: translate(-50%,-50%); height: 564px; z-index: 99;}
.big_gnb .gnb_wrap>ul{ text-align: center; width: 100%;  margin: 0 auto;}
.big_gnb .gnb_wrap>ul>li.m_menu{ display: inline-block; margin: 0 25px; }
.big_gnb .gnb_wrap>ul li.m_menu>a{ display: block; width: 100%; height: 100%; font-size: 22px;}
.big_gnb .gnb_wrap>ul li.m_menu>a span{ display: block; margin-bottom: 20px; color: white;}
.big_gnb .gnb_wrap ul li a .img_area{ width: 160px; height: 160px; margin: 0 auto;}
.big_gnb .gnb_wrap ul .m1 a .img_area{background:url(../img/main/m_m1_off.png) no-repeat center center;}
.big_gnb .gnb_wrap ul .m2 a .img_area{background:url(../img/main/m_m2_off.png) no-repeat center center;}
.big_gnb .gnb_wrap ul .m3 a .img_area{background:url(../img/main/m_m3_off.png) no-repeat center center;}
.big_gnb .gnb_wrap ul .m4 a .img_area{background:url(../img/main/m_m4_off.png) no-repeat center center;}
.big_gnb .gnb_wrap ul .m5 a .img_area{background:url(../img/main/m_m5_off.png) no-repeat center center;}
.big_gnb .gnb_wrap ul .m6 a .img_area{background:url(../img/main/m_m6_off.png) no-repeat center center;}
.big_gnb .gnb_wrap ul .m1 a:hover .img_area, .big_gnb ul .m1 a.on .img_area{background:url(../img/main/m_m1_on.png) no-repeat center center;}
.big_gnb ul .m2 a:hover .img_area, .big_gnb ul .m2 a.on .img_area{background:url(../img/main/m_m2_on.png) no-repeat center center;}
.big_gnb .gnb_wrap ul .m3 a:hover .img_area, .big_gnb ul .m3 a.on  .img_area{background:url(../img/main/m_m3_on.png) no-repeat center center;}
.big_gnb .gnb_wrap ul .m4 a:hover .img_area, .big_gnb ul .m4 a.on  .img_area{background:url(../img/main/m_m4_on.png) no-repeat center center;}
.big_gnb .gnb_wrap ul .m5 a:hover .img_area, .big_gnb ul .m5 a.on .img_area{background:url(../img/main/m_m5_on.png) no-repeat center center;}
.big_gnb .gnb_wrap ul .m6 a:hover .img_area, .big_gnb ul .m6 a.on  .img_area{background:url(../img/main/m_m6_on.png) no-repeat center center;}

.main .main_gnb ul .m1 a .img_area{background:url(../img/main/m_m1_off.png) no-repeat center center;}
.main .main_gnb ul .m2 a .img_area{background:url(../img/main/m_m2_off.png) no-repeat center center;}
.main .main_gnb ul .m3 a .img_area{background:url(../img/main/m_m3_off.png) no-repeat center center;}
.main .main_gnb ul .m4 a .img_area{background:url(../img/main/m_m4_off.png) no-repeat center center;}
.main .main_gnb ul .m5 a .img_area{background:url(../img/main/m_m5_off.png) no-repeat center center;}
.main .main_gnb ul .m6 a .img_area{background:url(../img/main/m_m6_off.png) no-repeat center center;}
.main .main_gnb ul .m1 a:hover .img_area{background:url(../img/main/m_m1_on.png) no-repeat center center;}
.main .main_gnb ul .m2 a:hover .img_area{background:url(../img/main/m_m2_on.png) no-repeat center center;}
.main .main_gnb ul .m3 a:hover .img_area{background:url(../img/main/m_m3_on.png) no-repeat center center;}
.main .main_gnb ul .m4 a:hover .img_area{background:url(../img/main/m_m4_on.png) no-repeat center center;}
.main .main_gnb ul .m5 a:hover .img_area{background:url(../img/main/m_m5_on.png) no-repeat center center;}
.main .main_gnb ul .m6 a:hover .img_area{background:url(../img/main/m_m6_on.png) no-repeat center center;}



/*big_gnb의 s_menu*/
.big_gnb .s_menu{ position: absolute; width: 100%; left: 0; bottom:0; display: none; top: 382px;}
.big_gnb .s_menu ul{text-align: center;}
.big_gnb .s_menu ul li{display: inline-block; margin: 0 10px;}
.big_gnb .s_menu ul li div{ width: 145px; height: 145px; border: 1px solid #fff; border-radius: 200px; position: relative; color: white;}
.big_gnb .s_menu ul li:hover div{ background: #fff; color: #86ba44; border: 0;}
.big_gnb .s_menu ul li:hover div span{ font-weight: bold;}
.big_gnb .s_menu ul li div span{ position: absolute; width: 100%; top: 50%; transform: translateY(-50%); font-size: 22px; font-weight: 200; left: 0;}
/*m_menu_btn*/
.m_menu_btn{ position: absolute; width: 220px; top: 55%; left: 50%; transform: translate(-50%,-50%); height:80px; z-index: 99;}
.m_menu_btn ul li{ float: left; width: 16.66666%;}
.m_menu_btn ul li a{ display: block; width: 8px; height: 52px; background: #fff; border-radius: 50px;}
.m_menu_btn ul li a.on{ height: 76px; background: #86ba44; position: relative; bottom: 20px;}
/*big_gnb에서의 상단 btn_wrap*/
.big_gnb .btn_wrap{ position: absolute; top: 30px;  z-index: 99; right:0;}
.big_gnb .btn_wrap ul{ float: right; margin-right: 20px; }
.big_gnb .btn_wrap li { float: left;}
.big_gnb .btn_wrap li a{color:#555555}
.big_gnb .btn_wrap li span{ display:block; padding: 0 20px; border-right: 1px solid #fff; line-height: 15px; color: white;}
.big_gnb .btn_wrap li a{ display: block; width: 100%; height: 100%;}
.big_gnb .btn_wrap li:last-of-type span{ border-right: 0}
.big_gnb .btn_wrap li .img_area{ width: 35px; height: 35px; display: block; margin: 0 auto; margin-top: 10px;}
.big_gnb .m_fix a .img_area{ background: url(../img/main/m_fix_off.png) no-repeat center center;}
.big_gnb .m_logout a  .img_area{ background: url(../img/main/m_logout_off.png) no-repeat center center;}
.big_gnb .m_admin a  .img_area{ background: url(../img/main/m_adm_off.png) no-repeat center center;}
.big_gnb .m_login a  .img_area{ background: url(../img/main/m_login_off.png) no-repeat center center;}
.big_gnb .m_join a  .img_area{ background: url(../img/main/m_join_off.png) no-repeat center center;}
.big_gnb .m_fix a:hover .img_area{ background: url(../img/main/m_fix_on.png) no-repeat center center;}
.big_gnb .m_logout a:hover  .img_area{ background: url(../img/main/m_logout_on.png) no-repeat center center;}
.big_gnb .m_admin a:hover  .img_area{ background: url(../img/main/m_adm_on.png) no-repeat center center;}
.big_gnb .m_login a:hover  .img_area{ background: url(../img/main/m_login_on.png) no-repeat center center;}
.big_gnb .m_join a:hover  .img_area{ background: url(../img/main/m_join_on.png) no-repeat center center;}

.close_gnb{ position: absolute; left: 30px; top: 30px; cursor: pointer; font-size: 50px;}
.close_gnb .img_area{ display: block; width: 35px; height: 35px; background: url(../img/main/close_off.png) no-repeat center center; margin: 0 auto;}
.close_gnb:hover .img_area{background: url(../img/main/close_on.png) no-repeat center center;}
.close_gnb span{ display: block; text-align: center; font-size: 16px; margin-top: 2px; letter-spacing: -0.5px; color: white;}

@media all and (max-width:1610px) {
  .big_gnb .s_menu ul li div{ width: 110px; height: 110px;}
  .big_gnb .s_menu ul li div span{ font-size: 17px;}
  .big_gnb .s_menu ul li{ margin: 0 5px;}
  .big_gnb .s_menu{ top: 420px;}
}
@media all and (max-width:1350px) {
  .big_gnb .gnb_wrap>ul>li.m_menu{margin: 0 15px;}
}
@media all and (max-height:790px) {
  .big_gnb .gnb_wrap{ position: static; transform: translate(0); margin-top: 9%; max-width: 100%;}
  .m_menu_btn{ transform: translate(50%.0); top: 460px; }
}




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

@media all and (max-width:1200px) {
  .small_gnb{ display: block; position: fixed; overflow-y: scroll; background: white; left: -250px; bottom: 0; width: 250px; z-index: 9999; height:100%;}
  .small_gnb .btn_wrap{ display: block; width: 100%; text-align: center;}
  .small_gnb .btn_wrap li{ display: inline-block; margin: 20px 0; padding: 0 7px; box-sizing: border-box;border-right: 1px solid #cccccc; height: 15px; line-height: 15px;}
  .small_gnb .btn_wrap li:last-of-type{ border-right: 0;}
  .small_gnb>ul>li{ box-sizing: border-box;}
  .small_gnb>ul>li>a{ line-height: 50px; border-bottom: 1px solid #f2f2f2;  display: block; width: 100%; height: 100%;}
  .small_gnb .s_menu{ display: none;}
  .small_gnb>ul>li>a{ padding: 0 20px; background: url(../img/nav_arrow1.png) no-repeat 200px center;}
  .small_gnb>ul>li>a.on{ background: url(../img/nav_arrow2.png) no-repeat 200px center;}
  .small_gnb .s_menu li{ border-bottom: 0; line-height: 35px; }
  .small_gnb .s_menu { background: #f2f2f2;}
  .small_gnb .s_menu li a{ display: block; box-sizing: border-box; padding-left: 40px; font-size: 12px;}
  .blind{ display: block; width: 100%; height: 100%; background: rgba(0,0,0,0.7); position: absolute; top: 0; left: 0; bottom: 0; z-index: 999; display: none;}
}


/************main_header*************/
/*main에서의 상단 btn_wrap*/
#main_header{ position: absolute; top: 30px; width: 100%;  z-index: 999;}
#main_header li a{ color: white;}
#main_header ul{ float: right; margin-right: 20px;}
#main_header li { float: left;}
#main_header li span{ display:block; padding: 0 20px; border-right: 1px solid white; line-height: 15px;}
#main_header li a{ display: block; width: 100%; height: 100%;}
#main_header li:last-of-type span{ border-right: 0}
#main_header li .img_area{ width: 35px; height: 35px; display: block; margin: 0 auto; margin-top: 10px;}
#main_header .m_fix a .img_area{ background: url(../img/main/m_fix_off.png) no-repeat center center;}
#main_header .m_logout a  .img_area{ background: url(../img/main/m_logout_off.png) no-repeat center center;}
#main_header .m_admin a  .img_area{ background: url(../img/main/m_adm_off.png) no-repeat center center;}
#main_header .m_login a  .img_area{ background: url(../img/main/m_login_off.png) no-repeat center center;}
#main_header .m_join a  .img_area{ background: url(../img/main/m_join_off.png) no-repeat center center;}
#main_header .m_fix a:hover .img_area{ background: url(../img/main/m_fix_on.png) no-repeat center center;}
#main_header .m_logout a:hover  .img_area{ background: url(../img/main/m_logout_on.png) no-repeat center center;}
#main_header .m_admin a:hover  .img_area{ background: url(../img/main/m_adm_on.png) no-repeat center center;}
#main_header .m_login a:hover  .img_area{ background: url(../img/main/m_login_on.png) no-repeat center center;}
#main_header .m_join a:hover  .img_area{ background: url(../img/main/m_join_on.png) no-repeat center center;}
#main_header .m_open{ display:none;}

@media all and (max-width:1200px) {
#main_header .m_open{ display:block; position:absolute; top:9px; left: 20px; font-size:30px; color:white;}
}

/*****main******/
.main{ width: 100%; height: 100vh; background: url(../img/main/m_bg.png) no-repeat center center; background-size: cover; position: relative; box-sizing: border-box; overflow: hidden; min-height: 720px;}
.main_content{ width: 100%;  margin-top: 9%; }
.main_content2{ width: 100%; margin-top: 2%; overflow: hidden;}
.main .main_gnb ul{ text-align: center; width: 100%; max-width: 1300px; margin: 0 auto;}
.main .main_gnb ul li{ display: inline-block; margin: 0 25px; }
.main .main_gnb ul li a{ display: block; width: 100%; height: 100%; color: white; font-size: 22px;}
.main .main_gnb ul li a span{ display: block; margin-bottom: 20px;}
.main .main_gnb ul li a .img_area{ width: 160px; height: 160px; margin: 0 auto;}
.main .main_gnb ul .m1 a .img_area{background:url(../img/main/m_m1_off.png) no-repeat center center;}
.main .main_gnb ul .m2 a .img_area{background:url(../img/main/m_m2_off.png) no-repeat center center;}
.main .main_gnb ul .m3 a .img_area{background:url(../img/main/m_m3_off.png) no-repeat center center;}
.main .main_gnb ul .m4 a .img_area{background:url(../img/main/m_m4_off.png) no-repeat center center;}
.main .main_gnb ul .m5 a .img_area{background:url(../img/main/m_m5_off.png) no-repeat center center;}
.main .main_gnb ul .m6 a .img_area{background:url(../img/main/m_m6_off.png) no-repeat center center;}
.main .main_gnb ul .m1 a:hover .img_area{background:url(../img/main/m_m1_on.png) no-repeat center center;}
.main .main_gnb ul .m2 a:hover .img_area{background:url(../img/main/m_m2_on.png) no-repeat center center;}
.main .main_gnb ul .m3 a:hover .img_area{background:url(../img/main/m_m3_on.png) no-repeat center center;}
.main .main_gnb ul .m4 a:hover .img_area{background:url(../img/main/m_m4_on.png) no-repeat center center;}
.main .main_gnb ul .m5 a:hover .img_area{background:url(../img/main/m_m5_on.png) no-repeat center center;}
.main .main_gnb ul .m6 a:hover .img_area{background:url(../img/main/m_m6_on.png) no-repeat center center;}

.main .m_slogon{ width: 100%; max-width: 580px; margin: 0 auto; margin-top: 60px; border-top: 1px solid white; border-bottom: 1px solid white; padding: 15px 0; text-align: center;}
.main .m_slogon p{ color: white; font-size: 27px; max-width: 90%; margin: 0 auto; font-weight: 300; letter-spacing: -0.5px; line-height: 35px;}

.main .m_footer{ margin-top: 5%; text-align: center;}
.main .m_footer span{ color: white; font-size: 24px; font-weight: 300; display: block; letter-spacing: -0.5px;}

@media all and (max-height:800px) {
  .main_content2{ margin-top: 0;}
}
@media all and (max-width:1350px) {
  .main .main_gnb ul li{ margin: 0 15px; margin-bottom: 30px;}
}
@media all and (max-width:1200px) {
.main{ height: auto; min-height: 100vh;}
.main_content{ margin-top: 160px;}
.main_content2{ margin-top: 20px;}
.main .m_footer{ margin-top: 40px; margin-bottom: 100px;}
.main .m_slogon p{ font-size: 20px;}
.main .m_slogon{ width:95%;max-width:400px;}
.main .main_gnb ul{ max-width:700px;}

}
@media all and (max-width:600px) {
	.main_content{margin-top:120px;}
	.main .main_gnb ul li a .img_area{ background-size:100% !important; width:130px; height:130px;}
	.main .main_gnb ul li a{ font-size:16px;}
	.main .main_gnb ul li a span{ margin-bottom:10px;}
	.main .m_slogon{margin-top: 0px;}
	.m_footer img{width:250px;}
	.main .m_footer span{font-size:16px;}
	.main .m_footer{margin-bottom:60px;}
	.main .m_slogon p{font-size:17px;}

}


/*****************sub header*******************/

#sub_header{ width:100%; height: 120px; position: relative;}
#sub_header .header_wrap{ height: 120px; border-bottom: 1px solid #dedede; width: 100%;  margin:auto 100px auto;box-sizing: border-box; text-align:center; }
#sub_header .menu_box{ height: 120px; width: 100px; border-right: 1px solid #dedede; position:absolute; top:0; left: 0;z-index: 99; overflow: hidden;}
#sub_header .menu_box i{ font-size: 30px; color: #adadad; display: block; margin: 0 auto; width: 30px; margin-top: 40px; display:none;}
#sub_header h1{width:100%; max-width: 280px;  margin: auto 46% auto; transform: translate(-50%,-50%);}
#sub_header h1 img {width:100%;padding-top:40%; }

/*#sub_header 에서의 상단 btn_wrap*/
#sub_header .btn_wrap{ position: absolute; top: 30px;  z-index: 99; right:0;}
#sub_header .btn_wrap ul{ float: right; margin-right: 20px;}
#sub_header .btn_wrap li { float: left;}
#sub_header .btn_wrap li a{color:#555555}
#sub_header .btn_wrap li span{ display:block; padding: 0 20px; border-right: 1px solid #555555; line-height: 15px;}
#sub_header .btn_wrap li a{ display: block; width: 100%; height: 100%;}
#sub_header .btn_wrap li:last-of-type span{ border-right: 0}
#sub_header .btn_wrap li .img_area{ width: 35px; height: 35px; display: block; margin: 0 auto; margin-top: 10px;}
#sub_header .m_fix a .img_area{ background: url(../img/main/fix_off.png) no-repeat center center;}
#sub_header .m_logout a  .img_area{ background: url(../img/main/logout_off.png) no-repeat center center;}
#sub_header .m_admin a  .img_area{ background: url(../img/main/adm_off.png) no-repeat center center;}
#sub_header .m_login a  .img_area{ background: url(../img/main/login_off.png) no-repeat center center;}
#sub_header .m_join a  .img_area{ background: url(../img/main/join_off.png) no-repeat center center;}
#sub_header .m_fix a:hover .img_area{ background: url(../img/main/fix_on.png) no-repeat center center;}
#sub_header .m_logout a:hover  .img_area{ background: url(../img/main/logout_on.png) no-repeat center center;}
#sub_header .m_admin a:hover  .img_area{ background: url(../img/main/adm_on.png) no-repeat center center;}
.big_gnb .m_login a:hover  .img_area{ background: url(../img/main/login_on.png) no-repeat center center;}
.big_gnb .m_join a:hover  .img_area{ background: url(../img/main/join_on.png) no-repeat center center;}

@media all and (max-width:950px) {
  #sub_header, #sub_header .header_wrap{ height: 72px; padding-left: 0px; overflow: hidden; margin:0;}
  #sub_header .menu_box{ width: 70px; height: 72px; background: none; border-bottom: 1px solid #dedede;;}
   #sub_header h1{ width:100%; max-width:100px; margin: auto; } 
  #sub_header h1 img{ width: 200px; padding-top: 55%;}
  #sub_header .menu_box i{ margin-top: 25px;}
  #sub_header .btn_wrap{ display: none;}
  .menu_box {display:none;}
}

/***서브페이지 컨텐츠**/
.sub_container{ box-sizing: border-box;   min-height: 700px !important; padding-bottom: 100px; padding-left: 0 !important;}
.sub_container .menu_area{ position: absolute; top: 0; left: 0; bottom: 0; width: 100px; border-right: 1px solid #dedede;  }
.sub_container .menu_area p{ font-size: 24px; color:#fff;  font-weight:500; margin-top: 140px; text-align: center; width: 100px; text-shadow:-1px 0 #bbb, 0 -1px #bbb, 1px 0 #bbb, 0 1px #bbb;}
.sub_container .menu_area p span{ display: block; padding-top: 10px;}

@media all and (max-width:1400px) {
  .sub_container{ padding-left: 100px !important;}
}

@media all and (max-width:768px) {
  .sub_container .menu_area{ display: none;}
  .sub_container{ padding-left: 2.5% !important; padding-right:2.5%; min-height: 300px !important;}
}

/***서브페이지 푸터****/
#sub_footer{position: relative; box-sizing: border-box;padding-left: 100px;}
#sub_footer .menu_area{ position: absolute; top: 0; left: 0; bottom: 0; width: 100px; border-right: 1px solid #dedede; border-top: 1px solid white; z-index: 99;}
#sub_footer .footer_wrap{width: 100%;  margin:auto ; height: 100px; border-top: 1px solid #dedede; }
#sub_footer .footer_wrap div{ width: 100%; max-width:700px; margin: 0 auto; position: relative; height: 100%;}
#sub_footer .footer_wrap div .footer_logo{ width: 100%;  margin:auto; transform: translateY(-50%);}
#sub_footer .footer_wrap div  ul{ float: left; overflow: hidden; position: absolute; right: 20%; top: 50%; transform: translateY(-50%);}
#sub_footer .footer_wrap div  ul li{ float: left; margin: 0 20px; font-size: 15px; color: #a8a8a8; letter-spacing: -0.3px;}
#sub_footer .footer_wrap .foot{text-align:center;margin-top:30px;}

@media all and (max-width:1220px) {
  #sub_footer .footer_wrap div ul li{ float: none; margin-bottom:20px;}
  #sub_footer .footer_wrap div .footer_logo{ left: 20px;}
  #sub_footer .footer_wrap div ul{ left: 250px; right: auto;}

  #sub_footer{ padding: 0;}
  #sub_footer .footer_wrap{ height: auto; padding: 20px 0;}
  #sub_footer .footer_wrap div{ padding: 0 2.5%; box-sizing: border-box;}
  #sub_footer .menu_area{ display: none;}
  #sub_footer .footer_wrap div .footer_logo{ position: static; display: block; width: 240px;margin: 0 auto; transform: translate(0);}
  #sub_footer .footer_wrap div ul{ float: none; position: static; transform: translate(0); margin-top: 20px; text-align: center;}
  #sub_footer .footer_wrap div ul li{ float: none;}
}

@media all and (max-width:768px) {
#sub_footer .footer_wrap div .footer_logo{ position: static; display: block; width: 100%;margin: 0 auto; transform: translate(0);}
#sub_footer .footer_wrap div .footer_logo img{width:100%;}
#sub_footer .footer_wrap .foot{text-align:center;margin-top:10px;}
}

/*************서브페이지,게시판 공통부분**************/
#container_title{ display: none;}
#bo_list, #bo_v, #bo_w, #bo_gall, .faq_wrap{ width:95% !important;max-width: 1200px; margin: 0 auto; }
#bo_v{ padding: 0;}
#bo_btn_top a.btn_b02 , .btn_b02 , a.btn_b02:hover , .btn_b02:hover { background: #fff;}
a.btn_b02 i, .btn_b02 i, a.btn_admin i, .btn_admin i, a.btn_b01 i, .btn_b01 i{ display: none;}
a.btn_b02 , .btn_b02 , a.btn_b02:hover , .btn_b02:hover { background: #86ba45}
a.btn_admin , .btn_admin, a.btn_b01, .btn_b01, a.btn_admin:hover , .btn_admin:hover, a.btn_b01:hover, .btn_b01:hover{ background: #4d4d4d;}
.cmt_btn i{display: none;}
#bo_list table tr:hover{border: 0;}
#bo_list .bo_tit a:hover.listSbjA strong{ color: #21703e;}
#bo_v_info_img{ display: none;}
.btn_submit{ background: #86ba45;}
#bo_sch {width:100%; max-width: 400px;border:1px solid #ccc;border-radius:3px; margin:10% auto;background:#fff; float:none;}
.btn_submit:hover{ background: #21703e;}
.pg_current{  background: #8ab850; box-shadow: none;}



.sub_navigation{ width: 100%; max-width: 1150px; margin: 0 auto; margin-top: 57px; position: relative;}
.sub_navigation .bottom_line{ width: 100%; height: 1px; border-bottom: 1px solid #86ba45; position: absolute; top: 34px; left: 0; z-index: 9;}
.sub_navigation ul{ text-align: center;}
.sub_navigation ul li{ display: inline-block;}
.sub_navigation ul li a{ display: block; padding: 0 25px; height: 35px; box-sizing: border-box; height: 35px; line-height: 35px; position: relative; color: #777777; border: 1px solid white; border-bottom: 0; font-size: 16px;}
.sub_navigation ul li.on a{border: 1px solid #86ba45; border-bottom: 1px solid white; color: #999;  z-index: 99; }
.sub_navigation ul li a:hover{border: 1px solid #86ba45; border-bottom: 1px solid white; color: #999;  z-index: 99; }
.sub_navigation ul li.on a{border: 1px solid #86ba45; border-bottom: 1px solid white; color: #222;  z-index: 99;  }

.sub_title{ margin-top: 105px; text-align: center; margin-bottom: 105px;}
.sub_title span{ padding-bottom: 1px; border-bottom: 2px solid #8ab850; color: #555555; font-size: 36px; font-weight: bold;}

@media all and (max-width:1200px) {
  .sub_navigation .bottom_line{ display: none;}
  .sub_navigation{ width: 95%;}
  .sub_navigation ul li{ margin:0 5px; margin-bottom: 10px;}
  .sub_navigation ul li a{ border: 1px solid #86ba45;}
  .sub_navigation ul li.on a{ background:#86ba45; color: white;  z-index: 99; }
  .sub_navigation ul li a:hover{background:#86ba45; color: white;  z-index: 99;}
  .sub_title{ margin-top: 65px;}
  .sub_title span{ font-size: 26px;}
}
@media all and (max-width:768px) {
  #bo_list, #bo_v, #bo_w, #bo_gall, .faq_wrap{ width:100% !important;}
  #bo_v_title .bo_v_tit{ font-size: 17px;}
  #bo_v_con{ font-size: 13px; line-height: 18px;}
  #bo_sch select{ width: 70px;}
  #bo_sch .sch_input{ width: 69%;}
  #bo_v_info{ font-size: 14px;}
  .tbl_head01 thead th:last-of-type{ border-right: 1px solid #ddd;}

  .sub_title span{ font-size: 22px;}
  .sub_title{ margin-top:30px; margin-bottom: 50px;}

}

@media all and (max-width:500px) {
  #bo_sch .sch_input{ width: 65%;}
}

@media all and (max-width:350px) {
  #bo_sch .sch_input{ width: 60%;}
}


/**********faq*********/
#faq_sch{ border: 0; padding: 0; margin-bottom: 30px;}
#faq_sch .btn_submit{ background: #21703e; margin-left: 10px;}
#bo_cate #bo_cate_on{ border: 1px  solid #21703e; color: #21703e;}
#faq_sch .frm_input{ border: 1px solid #ddd;}
#faq_sch .sch_tit{ display: none;}

@media all and (max-width:768px) {
#faq_sch .frm_input{ width: 170px;}
}



.recruit_menu{ width: 100%; max-width: 800px; margin: 0 auto; overflow: hidden; clear: both; margin-bottom: 70px;}
.recruit_menu ul li{ float: left; width: 50%; box-sizing: border-box; border: 2px solid #86ba44;}
.recruit_menu ul li a{ line-height: 50px; text-align: center; display: block; font-size: 20px;}
.recruit_menu ul li.on a{ background: #86ba44; color: white;}

@media all and (max-width:768px) {
    .recruit_menu ul li a{ line-height: 40px; font-size: 17px;}
}


/***********회원가입***********/
#fregister{ max-width:1200px; margin: 0 auto; margin-top: 50px;}
#register_form{ max-width: 1200px; margin: 0 auto; margin-top: 50px;}



/***********모바일에서 수정***********/
.mbskin{width:90%; max-width:400px;}
@media all and (max-width:768px) {
  #fregister .fregister_agree{position:static; border-top:1px solid #dbdbdb;}
  #fregister h2 i{ display:none;}

  /*sub페이지 카테고리 박스*/
  .sub_navigation ul li{ width:47%; margin: 0 1%; margin-bottom:10px;}

}


@media all and (max-width:500px) {
  .sub_navigation ul li a{font-size:12px; padding: 0;}
}
@media all and (max-width:420px) {

}


@media all and (max-width:768px) {
  /* #faq_con table{ table-layout: fixed;max-width: 250px;}
  #faq_con table th{ width: 50px;} */
  /* #faq_con table{ table-layout: fixed;max-width: 250px;} */
  #faq_con table th, #faq_con table td{ word-break: break-all;}
  #faq_con .con_inner{ overflow-x:scroll !important;}
  #faq_con .con_inner table{ width: 500px;}
}