@charset "utf-8";

/* 기본 CSS */
html,body{width:100%; min-height:100%}

#wrap{position:relative;width:100%;min-width:360px;margin:0 auto;overflow:hidden;}

.sound_only{position:absolute;font-size:0;line-height:0;overflow:hidden;left:0px;top:-9999px;filter:Alpha(opacity=0);opacity:0.0;-moz-opacity:0.0;}

.clearfix::after{content: ''; display: block; clear: both;}

.mblue{color: midnightblue!important;}
.grn{color: forestgreen!important;}
.palred{color: palevioletred!important;}
.Dred{color:#ff3300;}

input:focus, a:focus, button:focus, textarea:focus, select:focus{outline: 1px auto #ff0;}

/********header********/
.header_wrap {position: relative; max-width:1200px; height:115px; margin:0 auto;}
.header_wrap h1{position:absolute; top:32px; left:0px; min-width:300px;z-index:10;}
.open_menu{display:none;}
.open_btn{display:none;}
/* header util */
.header_wrap .util_wrap{z-index: 20; display: block; position:absolute; top:10px; right:0px;height: 38px; overflow: hidden;} 
.header_wrap .util_wrap ul{right:0;top:0;float:left; vertical-align: middle;}
.header_wrap .util_wrap li{float:left;padding:3px 1px;background:url("../images/common/w_line.png") no-repeat 100% 50%; vertical-align: middle;}
.header_wrap .util_wrap li a{display:block;padding:0 .9em;color:#444;font-size:76%;line-height:34px;}
.header_wrap .util_wrap li.last{background:none}
.header_wrap .util_wrap .util_sns li{background:none; padding:0; }
.header_wrap .util_wrap .util_sns li a{padding:.4em .3em;}

  /* 메인메뉴 */
.tbv{display:none;}
.pcv {display: block !important;}
#GNB{display: block; z-index:999999999;float:right;margin-top:70px;}
#GNB h2{position:absolute;font-size:0;line-height:0;overflow:hidden;left:0px;top:-9999px;filter:Alpha(opacity=0);opacity:0.0;-moz-opacity:0.0;}
#GNB .gnb{height:40px;}
#GNB ul li{float:left;text-align: center;margin:0px;padding:0px;background:url("../images/common/w_line.png") no-repeat 100% 50%;transition:all .3s;}
#GNB ul li:last-child{background: none;}
#GNB ul li a.gnb1d{color:#222;font-size:104%;font-weight: bold;float:left;cursor:pointer;display:block;width:100%;height:52px;line-height:40px;text-align:center;}
#GNB ul li.first a.gnb1d{background:none !important;}
#GNB ul li a:link,
#GNB ul li a:visited{text-decoration:none;color:#333;}
#GNB ul li a.gnb1d span{display:block;float:left;padding:0 10px;letter-spacing:0.05em;}
#GNB ul li.active a.gnb1d{color:#2133a3;}
#GNB ul li.gnb1d{position:relative;min-width:7em;padding:0 15px; font-weight: 700; font-size: 1.2em;}
/*서브메뉴*/
#GNB ul li .submenu{width:86%;box-shadow:0px 2px 1px rgba(0,0,0,0.3);position:absolute;top:19px;left:0px;z-index:999999;background:#fff;padding:10px 10px 0;padding-top:25px;border-top:1px solid #fff;text-align:center;transition:all .2s;opacity:0;visibility: hidden;}
#GNB ul li .submenu ul{margin:0px;padding:0;width:100%;}
#GNB ul li .submenu ul li{margin:0px 0 0 -10px;padding:10px;width:100%;background-image:none;float:left;}
#GNB ul li .submenu ul li a{display:block;padding:0 6px !important;font-weight: 400;letter-spacing:-0.1em;font-size:.8em;color:#3e3e3e;}
#GNB ul li .submenu ul li:active,
#GNB ul li .submenu ul li:hover{background:#f18644;}
#GNB ul li .submenu ul li:active a,
#GNB ul li .submenu ul li:hover a{color:#fff;}
/*메인메뉴 hover*/
#GNB ul li.gnb1d a:focus + .submenu,
#GNB ul li.gnb1d:hover .submenu{opacity: 1;visibility:visible;}
.submenu_on{opacity: 1!important;visibility:visible!important;}

/*Header tablet - max-width: 1023px*/ 
@media all and (max-width:1024px){

  /* header */
  .header_wrap {position: relative; max-width:1023px; height:115px; margin:0 auto;}
  .header_wrap h1{position:absolute; top:32px; left:0px; min-width:300px;z-index:10;}
  
  /*open menu*/
  .open_btn{display:block; float:right;font-size: 4vw; margin:40px 20px 0 0;z-index:40;}
  .open_menu{z-index:9999999; background:rgba(0,0,0,0.5); width:100%;height:calc(100%);;overflow-y:scroll; position:fixed; top:0; right:0;}
  .open_menu .open_mn_inner{float:right;width:300px;height:cover;background:#fff;position: relative;}
  .close_btn{font-size: 1.5em; position: absolute;top:20px;right:10px;}
  .close_btn i{color:#fff;z-index:8888888;}
  .open_menu.open{display:block;}
  /* header util */
  .header_wrap .util_wrap{display:none;}/*pc ver*/ 
  .header_wrap .util_wrap2{z-index: 20;display: block;width:100%;height:115px; overflow: hidden;background-color:#67625d;} 
  .header_wrap .util_wrap2 ul.top_menu{float:left;padding-top:60px;}
  .header_wrap .util_wrap2 ul.util_sns{float:left;padding-top:76px}
  .header_wrap .util_wrap2 li{float:left;padding:12px 1px 0 1px;background:url("../images/common/w_line.png") no-repeat 100% 67%;}
  .header_wrap .util_wrap2 li a{display:block;padding:0 8px;font-weight:400;color:#fff;font-size:.9em;line-height:34px;}
  .header_wrap .util_wrap2 li.last,
  .header_wrap .util_wrap2 .top_menu li:last-child {background:none;}
  .header_wrap .util_wrap2 .util_sns li{background:none; padding:0;width:38px;height:38px;}
  .header_wrap .util_wrap2 .util_sns li a{padding:0 6px 0;line-height:34px;}
  .header_wrap .util_wrap2 .util_sns li img{width:100%;}
  .header_wrap .util_wrap2 li.last{display:none;}
  .header_wrap .util_wrap2 li.homeBtn a img{width:100%;}
    /*header - 메인메뉴 */
  .pcv {display:none !important;}/*pc ver*/
   /*open menu*/
   .tbv{display:block;}
   #GNB2{display: block; z-index:999999;float:left;position: relative;width:100%;}
   #GNB2 .btn{text-transform: uppercase;}
   #GNB2 h2{position:absolute;font-size:0;line-height:0;overflow:hidden;left:0px;top:-9999px;filter:Alpha(opacity=0);opacity:0.0;-moz-opacity:0.0;}
   #GNB2 .gnb_inner{float:left;width:43%;height:100vh;}
   #GNB2 .gnb{position:relative;}
   #GNB2 ul li.gnb1d{width:300px;background:#fff;border-bottom:1px solid #eeeeee;text-align:left;margin:0px; font-weight: 700;}
   #GNB2 ul li a{display:block;padding:20px 0 15px 30px;font-size:1em;color:#222;font-weight: bold;cursor:pointer;text-align:left;}
   #GNB2 ul li a::after{content:'+'; display:block; float: right; margin-right: 30px;}
   #GNB2 ul li.gnb1d.active .submenu{}
   #GNB2 ul li .submenu{display:none;width:100%;background:#eeeeee;text-align:left;padding-top:0px;}
   #GNB2 ul li .submenu ul{margin:0px;padding:0;width:100%;}
   #GNB2 ul li .submenu ul li{border-bottom:1px solid #d2d2d2;margin:0px;width:100%;}
   #GNB2 ul li .submenu ul li a{display:block;padding:10px 0 10px 30px;letter-spacing:-0.1em;font-size:1em;font-weight:400;}
   #GNB2 ul li .submenu ul li a::after{content:' ';}
   #GNB2 ul li .submenu .bottomenu{display:none;text-align: center;padding:0;background:#e6e6e6;}
   #GNB2 ul li .submenu .bottomenu.active{display:block;}
   #GNB2 ul li .submenu li ul.subject{background:#eeeeee;}
   #GNB2 ul li .submenu .bottomenu a{font-size:1em;color:#7c7c7c;padding:8px 0 8px 30px;}
   #GNB2 ul li .submenu .bottomenu li:hover a{color:#020202;}
   #GNB2 ul li .submenu .bottomenu li{border-bottom:none;} 
   #GNB2 ul li .submenu ul li a.btn3dep::after{content:'+'; display:block; float: right; margin-right: 30px;}

   #GNB2 .util_sns li a::after{content:'  ';display: block;}
   #GNB2 .util_sns{display:inline-block;width:100%;margin:10px 0 0 170px;}
   #GNB2 .util_sns li{display:inline-block;}
   #GNB2 .util_sns li a{display:block;width:25px;height:25px;padding: 0;}
   #GNB2 .util_sns li a img{width:100%;}
}/**e:header tablet - max-width: 1023px**/

/*Header tablet - max-width: 768px*/ 
@media all and (max-width:768px){
  /* header */
.header_wrap {position: relative; max-width:768px; height:115px; margin:0 auto;}
.header_wrap h1{position:absolute; top:32px; left:16px; min-width:200px;z-index:10;}
/*open menu*/
.open_btn{display:block; float:right;font-size: 2.3em; margin:39px 16px 0 0;}
.open_menu h1{padding-left: 0px;}
.close_btn{font-size: 2em; float:right; }
.header_wrap .util_wrap2 li a{font-size:.8em;}
}/**e:Header tablet - max-width: 768px**/

/*Header tablet - max-width: 768px*/ 
@media all and (max-width:414px){
/*open menu*/
.header_wrap h1 {top: 20px;left:14px;}


}/**e:Header tablet - max-width: 414px**/

/**********main_bar***********/
.menu_bar{height:27px; background-color:#67625e; }
.menu_bar .navigation{width:1200px; height:27px; margin:0 auto;position: relative;}
.menu_bar .navigation .dir{position:absolute; top:4px; right:0;}
.menu_bar .navigation .dir span{display:inline; color:#fff; font-size:10pt;}
.menu_bar .navigation .dir span.l_line.last{color:#f18644;}
.menu_bar .navigation .dir span.home{vertical-align: middle; text-indent:-9999999px; display:inline-block;width:15px;height:15px;background:url('../images/HOME.png') no-repeat center;background-size:100%;}
.menu_bar .navigation .dir span::before{content:'>'; margin:0 6px;}
.menu_bar .navigation .dir span.l_line.last::before{content:'>'; color:#fff;}
.menu_bar .navigation .dir span:first-child::before{content:none;}
/*menu_bar- max-width: 1200px*/ 
@media all and (max-width:1200px){
  .menu_bar .navigation{width:100%;}
  .menu_bar .navigation ul{right:8px;}
}
/*menu_bar- max-width: 1024px*/ 
@media all and (max-width:1024px){
  .menu_bar .navigation .dir{position:absolute; top:4px; right:8px;}
}
/*menu_bar- max-width: 768px*/ 
@media all and (max-width:768px){
  .menu_bar .navigation .dir{position:absolute; top:4px; right:8px;}
}
/*menu_bar- max-width: 414px*/ 
@media all and (max-width:414px){
  .menu_bar .navigation .dir{position:absolute; top:4px; right:8px;}
}
@media all and (max-width:375px){
  .menu_bar .navigation .dir{position:absolute; top:4px; right:8px;}
}
@media all and (max-width:360px){
  .menu_bar .navigation .dir{position:absolute; top:4px; right:8px;}
}

/**********main_side_menu***********/
#main_inner{width:1200px; height:auto; margin:0 auto;}
#main_inner .side_menu{width:230px; height:auto; float:left;}
#main_inner .side_menu h2.slnb_tit{padding:49px 32px;text-align: center;background-color:#1a3567; font-weight:600; color:#fff; font-size:1.2em; position: relative;}
#main_inner .side_menu h2.slnb_tit::after{content:'';display:block;width:25px;height:2px;background-color:#e2ea7d;position: absolute;top:30px;left:50%;transform:translate(-50%, -50%);}
#main_inner .side_menu li{position:relative;}
#main_inner .side_menu li a{display:block; padding:12px 0 10px 32px; border-bottom:1px solid #d2d2d2; font-weight:400; color:#67625e;}
#main_inner .side_menu a:hover{background-color:#f3f3f3; transition:all .5s;}
.side_menu .btn3dep::before{content:'+'; position:absolute; top:12px; right:15px;}
#main_inner .side_menu .bottomenu{display:none;}
#main_inner .side_menu .bottomenu.active{display:block;}
#main_inner .side_menu .bottomenu li.dep3{background-color:#f9f9f9; color:#7c7c7c; }
#main_inner .side_menu .bottomenu li.dep3 a{font-size:.9em;border-bottom: none;}
#main_inner .side_menu .bottomenu li.dep3:last-child a{border-bottom:1px solid #d2d2d2;}
#main_inner .side_menu .bottomenu li.dep3 a:hover{color:#020202; transition:all .5s;}
#main_inner .side_menu .dep2 .on{font-weight:bold;background-color:#e4e4e4; }
#main_inner .side_menu .dep3 .on{color:#f18644;background-color: #f9f9f9;}
/*side_menu - max-width: 1200px*/ 
@media all and (max-width:1200px){
  #main_inner{width:100%; margin:0 auto 30px;}
  #main_inner .side_menu{width:19.1%; height:auto; float:left;}
  }
@media all and (max-width:1024px){
  #main_inner{width:100%; margin:0 auto;}
  #main_inner .side_menu{display:none;}
}
/**main_content**/






/************footer************/
#footer{clear:both;width: 100%; height:170px; background: #3e3e3e; color: #ccc;}
#footer .footer_inner{width:1200px; margin: 0 auto;position: relative;}
/*#footer .footer_inner .jump{float:right; padding-top: 10px;}
#footer .footer_inner .jump select{width:200px; height:33px; padding:0 0px 0 15px; color:#a6a6a6; background: #f0f0f0;border:1px solid #a6a6a6; font-size: 15px; cursor: pointer;}
#footer .footer_inner .jump option{background: #fff; font-size: 1em; color: #000; padding-right: 5px;}*/
#footer .footer_inner .footer_menu ul{clear:both; position: absolute; right:0; top:30px;}
#footer .footer_inner .footer_menu li{display: inline-block;}
#footer .footer_inner .footer_menu li a{color:#ccc;}
#footer .footer_inner .footer_menu li::after{content:' | '; padding: 0 5px;}
#footer .footer_inner .footer_menu li:last-child::after{content:'  '; padding: 0;}
#footer .footer_inner .footer_logo{float: left; margin-top: 55px;}
#footer .footer_inner .footer_info{float: left;margin: 59px 0 0 40px;font-size: .9em;line-height:1.4;}

/*footer PC - min-width: 1199px*/
@media all and (max-width:1199px){
  #footer .footer_inner{width:91.6%;}
  #footer .footer_inner .footer_info .footer_menu li a{font-size: 1.2vw;}
  #footer .footer_inner .footer_menu ul{}

}/*e:footer PC - min-width: 1199px*/

/*footer PC - min-width: 1024px*/
@media all and (max-width:1024px){
  #footer .footer_inner .footer_info{font-size: .8em;margin: 65px 0 0 40px;}
}

/*footer PC - min-width: 800px*/
@media all and (max-width:800px){

  /*footer*/
  #footer .footer_inner{width:91.6%;margin: 0 auto;}

  #footer .footer_inner .footer_logo{position:absolute;top:135px;float:none;text-align: center;width:100%;margin: 0;}
  #footer .footer_inner .footer_info{text-align: center;font-size:1em;float:none;width:100%;position:absolute;top:55px;margin: 0;}
  

  #footer{width: 100%; height:230px; background: #3e3e3e; color: #ccc;}

  #footer .footer_inner .footer_menu ul{position: static;text-align: center;padding-top: 1rem;}
  
  }/*e:footer PC - min-width: 800px*/

/*footer PC - max-width: 558px*/ 
@media all and (max-width:588px){

  /*footer*/
  #footer .footer_inner .footer_info p{font-size:.9em;}
  
  }/*e:footer PC - min-width: 558px*/

/*footer PC - min-width: 500px*/
@media all and (max-width:500px){

  /*footer*/
  #footer .footer_inner .footer_logo{top:150px;}
  
}/*e:footer PC - min-width: 414px*/
  
@media all and (max-width:372px){

.footer_inner .footer_menu ul li a{font-size: .9em;}
.footer_inner .footer_info p {font-size: .7em;}

}
