@charset "utf-8";
@import url("./default.css"); 
@import url("../../../css/content.css");


body {  }

/* 서브비주얼 */
#sub_visual { width:100%; height:455px; position:relative; background: url(../images/sub/sub_visual.png) left top no-repeat; z-index:1; margin-top:-146px; }
#sub_visual .txt_wrap { width:1252px; height:auto; margin:0 auto; padding-top:170px; }
#sub_visual .vi_txt { margin: 0px 105px 0 0; text-align:right; -webkit-animation:slide-in-right 1.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both; animation: slide-in-right 1.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;}
#sub_visual .vi_txt img { }
#sub_visual .vi_txt p.vit1 { margin:0 180px 0 0; }
#sub_visual .vi_txt p.vit2 { margin:-5px 10px 0 0; }
#sub_visual .vi_txt p.vit3 { }

@-webkit-keyframes slide-in-right {
    0% {
      -webkit-transform: translateX(1000px);
              transform: translateX(1000px);
      opacity: 0;
    }
    100% {
      -webkit-transform: translateX(0);
              transform: translateX(0);
      opacity: 1;
    }
  }
  @keyframes slide-in-right {
    0% {
      -webkit-transform: translateX(1000px);
              transform: translateX(1000px);
      opacity: 0;
    }
    100% {
      -webkit-transform: translateX(0);
              transform: translateX(0);
      opacity: 1;
    }
  }
#wrap { background-position:left 0 top -180px; }
#container {margin:20px auto 40px; width:1252px; }
#container:after { content:""; display:block; clear:both; }
/*레프트메뉴*/
#left {float:left; width:252px; margin:0px 20px 40px 0; position:relative; }
/* #left span.bg { display:block; width:220px; height:14px; background:url(../images/sub/left_bg.png) left top no-repeat; position:absolute; bottom:-5px; left:-1px; } */
#left h2 { position:relative; text-align:center; line-height:24px; padding:48px 0; background: url(../images/sub/left_h2.png) left bottom no-repeat; font-family: 'NexonMaplestory'; font-weight:300;  color:#fff; font-size:27px; border-radius:20px 0 20px 0; }

ul#leftMenu {width: 100%; margin:13px auto 20px; background:#fff; padding:0px 0 0px; box-sizing:border-box;}
ul#leftMenu li { font-size:16px; letter-spacing:-0.5px; width:100%; margin:5px auto 0; border:1px solid #ddd; overflow:hidden; }
ul#leftMenu li a {display:block; color:#333; line-height:24px; box-sizing:border-box; padding:13px 20px 13px 45px; background:url(../images/sub/left_dot.png) 15px center no-repeat;  }
ul#leftMenu li a:hover { color:#f28e45; }
ul#leftMenu li a.on {font-weight:bold; color:#555;  background:#f28e45 url(../images/sub/left_dot_on.png) 15px center no-repeat;; color:#fff; font-weight:500; }

ul#leftMenu li div {display:none; position:relative; background:#f5f5f5; overflow:hidden; width:100%; }
ul#leftMenu li div.on {display:block;}
ul#leftMenu li div ul { padding:18px 0;}
ul#leftMenu li div ul li {font-size:15px; border:0px; margin:0 auto 0;}
ul#leftMenu li div ul li a {display:block; color:#555; padding:4px 0 4px 32px; line-height:23px; background:url(../images/sub/left_dot2.png) 18px center no-repeat;}
ul#leftMenu li div ul li.on a{color:#333; font-weight:500 !important; background:url(../images/sub/left_dot2.png) 18px center no-repeat;}
ul#leftMenu li div ul li a:hover{color:#333; font-weight:500 !important; background:url(../images/sub/left_dot2.png) 18px center no-repeat;}



#contentGroup { float:right; padding:15px 0px; box-sizing:border-box; width:calc(100% - 291px); background:#fff; border-radius:10px; }


/* 가이드박스
#guideGroup {position:relative;  height:72px; }
#guideGroup h3 { font-size:26px; color:#333333; padding:33px 0 0 0; font-weight:normal; letter-spacing:-1.5px;} */
	
/*가이드박스*/
#guideGroup {position:relative;  height:73px; border-bottom:1px dashed #ddd; display:flex; }
#guideGroup h3 { font-size:26px; color:#333333; padding:16px 0 0 0px; font-weight:normal; letter-spacing:-1.5px; flex:1; }
	
#guideGroup .guide { margin-left:auto; padding:17px 10px 0 0; }
#guideGroup .guide li {float:left; color:#999999; line-height:23px; font-size:15px; padding:0 15px 0 15px; background:url(../images/sub/guide_dot.jpg) left center no-repeat; font-weight:300 !important; }
#guideGroup .guide li.first {padding:0 10px 0 22px;background:url(../images/sub/guide_home.png) left center no-repeat; }
#guideGroup .guide li a {color:#999999; font-size:15px; color:#ec9730; font-weight:300 !important;}


#guideGroup .page_config {/*position:absolute; top:11px; right:0px;*/ margin-left:auto; padding:7px 0 0 0; }
#guideGroup .page_config li{float:left; height:45px; text-align:center;  border-top:0px;}
#guideGroup .page_config li a{display:block; width:45px; line-height:45px; height:45px;   border-top:0px; font-size:11px; color:#898989; text-indent:-9999px;}
#guideGroup .page_config li a:hover{text-decoration:underline; }
#guideGroup .page_config li.edit {border-left:0px; margin-left:10px;}
#guideGroup .page_config li.print a {background:url(../images/sub/page_print.png) left top no-repeat; padding:0 0 0 0;}
#guideGroup .page_config li.edit a {background:url(../images/sub/page_admin.png) left top no-repeat; padding:0 0 0 0;}


/*컨텐츠박스*/
#content { position:relative; min-height:500px; margin:30px 0 40px 0; }
#content:after { content:""; display:block; clear:both; }




/* 내용없음 */
.cm_no_conts {text-align:center; overflow:hidden; padding:30px 0 70px 0; margin:30px 0;}
.cm_no_conts .no_icon {background:transparent url(../images/sub/no_icon.png) center center no-repeat; height:317px;}
.cm_no_conts .gtxt {color:#7a5441 !important; font-size:30px; letter-spacing:-1px; display:block; font-family: 'NexonMaplestory'; font-weight: bold;}

/* 페이지네이트*/
.page_on {border:1px #248a2b solid; background:#31b049;}

.tapMenu1 { margin:0 0 20px 0; }
.tapMenu1::after { content:""; display:block; clear:both; }
.tapMenu1 li { float:left; box-sizing:border-box; min-width:165px; margin:0 10px 10px 0; }
.tapMenu1 li a { display:block; width:100%; padding:0 10px; color:#777; font-size:16px; font-weight:bold; box-sizing:border-box; border-radius:0 10px 0 10px; height:50px; line-height:48px; border:1px solid #dddddd; background:#f3f3f3; text-align:center; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
.tapMenu1 li a:hover { color:#333; }
.tapMenu1 li.on a { background:#83c80c; border:1px solid #8ab111; color:#fff; }



/*/////////////////////////////////////////////////////////////////////////////////반응형/////////////////////////////////////////////////////////////////////////////////*/

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


/*서브비주얼*/
#header {height:124px;}
#sub_visual {display:none;}

#container {margin:0px; width:100%; overflow:hidden; background:none; }
#header:before{background:none;}

/*레프트메뉴*/
#left {display:none;}

#contentGroup { float:none; overflow:hidden; padding:0px; box-sizing:border-box; width:100%; background:#fff; border-radius:0px; border:0 none; }

#content {width:94%; clear:both; margin:30px auto;}

/*가이드박스*/
#guideGroup {height:auto; border-bottom:none;}
#guideGroup h3 {display:none;}
	
#guideGroup .guide { position:relative; padding:0; left:0; top:0; width:100%; overflow:hidden; background:#f8f8f8; border-bottom:1px #d6d6d6 solid; border-top:1px #d6d6d6 solid;}
#guideGroup .guide li{float:left; line-height:35px; padding: 0 13px 0 16px; background:url(../images/sub/guide_dot.jpg) left 15px no-repeat; }
#guideGroup .guide li.first {padding:0 10px;background:none; }
#guideGroup .guide li.this {color:#666666;}
#guideGroup .page_config {display:none;}

/* 내용없음 */
.cm_no_conts {text-align:center; overflow:hidden; padding:30px 0 70px 0; margin:0;}
.cm_no_conts .no_icon {max-width:400px; margin:0 auto;}

/* 컨텐츠 공통 스타일 */
.tablebox { width:100%; overflow:auto; }
.tablebox table.cStyle { width:100%; min-width:580px; }

.cm_no_conts .no_icon { background-size:300px;}
.tapMenu1 { margin:0 0 20px 0; }
.tapMenu1::after { content:""; display:block; clear:both; }
.tapMenu1 li { float:left; box-sizing:border-box; width:48%; margin:0 1% 10px; min-width:10px; }


}