@charset "utf-8";

#subContent { position: relative; overflow: hidden; padding: 40px 0 5%; }

#s_gnb { float: left; width: 250px; }
#s_gnb .s_depth1 { margin-bottom: 10px; }
#s_gnb .s_depth1 h2 { font-size: 1.625em; font-family: 'DWImpactamin'; font-weight: normal; color:#fff;
                                  padding: 2.15em 0; text-align: center; background: url("/images/sub/snav_titBG.png") no-repeat center; background-size: cover; }
#s_gnb .s_depth1 .hide { display: none; }
#s_gnb .s_depth2 .deptit { display: none; }
#s_gnb .s_depth .smenu { padding-top: 1px; }
#s_gnb .s_depth .smenu > li { width: 100%; line-height: 55px; border: 1px solid #d6e1db; margin-top: -1px; }
#s_gnb .s_depth .smenu > li > a { display: block; padding: 0 1em; background: #fff; }
#s_gnb .s_depth .smenu > li.s_on > a { color:#fff; background: #437dea; border-color:#437dea;  }

#s_gnb .s_depth .smenu .dep3 { position: relative; }
#s_gnb .s_depth .smenu .dep3::after { content: '\e874'; font-family:'Linearicons-Free'; color:#a6abb2; font-weight: 900;
                                                      position: absolute; right: 1em; font-size: 0.9em; opacity: 0.7; }
#s_gnb .s_depth .smenu > li.s_on .dep3::after { color: #fff; }
#s_gnb .s_depth .smenu .dep3.on::after { content: '\e873'; }
#s_gnb .s_depth .smenu .depth3 { display: none; padding: 10px 0; background: #f2f8fc; }
#s_gnb .s_depth .smenu > li.s_on .depth3 { display: block; }
#s_gnb .s_depth .smenu .depth3 li { line-height: 2em; }
#s_gnb .s_depth .smenu .depth3 li a { padding: 0 1.5em; }

#pageWrap { float: left; width: calc(100% - 300px); margin-left: 50px; }

#subTitle { position: relative; overflow: hidden; border-bottom: 1px solid #d6e1db; padding: 2em 0; }
#subTitle h3 { font-size: 1.875em; font-family: 'DWImpactamin'; font-weight: normal; color:#212121; }
#subTitle .subLoca { position: absolute; right:0; top: 50%; transform: translateY(-50%); }
#subTitle .subLoca li { float: left; color:#989898; font-size: 0.875em; margin-top: 0.6em;}
#subTitle .subLoca li::before { content: '\e876'; font-family:'Linearicons-Free'; color#7a7e7c; font-size: 0.8em; margin: 0 10px; }
#subTitle .subLoca li.home::before { display: none; }

#pageCont { position: relative; width: 100%; overflow: hidden; padding: 3% 0 0; line-height: 1.5em; }

@media all and (max-width:1280px) {
  #s_gnb { width: 20%; }
  #s_gnb .s_depth1 h2 { padding: 2em 0; }
  #s_gnb .s_depth .smenu li  { line-height: 50px; }
  #pageWrap { float: left; width: 75%; margin-left: 5%; }
}

@media all and (max-width:976px) {
  #subContent { padding-top:0; }
  #s_gnb { width: 100%; display: none; }
  #s_gnb .s_depth { position: relative; width: 50%; float: left; }
  #s_gnb .s_depth .smenu { display: none; }
  #s_gnb .s_depth1 .hide { display: block; }
  #s_gnb .s_depth2 .deptit { display: block; }


  #s_gnb .s_depth .deptit { position: relative; width: 100%; background: none; color:#585858; font-size: 1.0em;
                                        padding:0; font-family: 'Pretendard'; line-height: 50px; text-align: left;
                                        border: 1px solid #d6e1db; padding: 0 1em; cursor: pointer; }
  #s_gnb .s_depth2 .deptit { border-left-width:0; }

  #s_gnb .s_depth .deptit::after { content: '\e874'; font-family:'Linearicons-Free'; position: absolute; right: 1em; line-height: 50px; }
  #s_gnb .s_depth .smenu { position: absolute; top: 50px; width: 100%; z-index: 999999; }
  #s_gnb .s_depth .smenu li { line-height: 3em; }

  #pageWrap { width: 100%; margin-left: 0; }
  #subTitle h3 { font-size: 1.6em; }
}

@media all and (max-width:767px) {
  #subTitle { padding-bottom: 1.5em; }
}

@media all and (max-width:568px) {
  #subTitle { text-align: center; }
  #subTitle .subLoca { display: none; }
  #pageCont { padding-top: 6%; }
}



.tabmenu { text-align: center; width: 100%; margin: 0 auto 3%; overflow: hidden; }
.tabmenu li { position: relative; width:calc(100% / 8); float:left; }
.tabmenu li:first-child { border-left:1px solid #dedede; }
.tabmenu li a { text-decoration: none; width:100%; height:50px; line-height: 50px; display: block; background:#fff;
                      color:#525252;  border: 1px solid #dedede; border-left:0; font-weight: 600; font-size: 0.95em;
                      box-sizing: border-box; text-overflow:ellipsis; overflow:hidden; white-space:nowrap;}
.tabmenu li a:hover { color:#37c477; }

.tabmenu.col4 li { width: calc(100% / 4); }
.tabmenu.col5 li { width: calc(100% / 5); }

@media all and (max-width:1280px) {
  .tabmenu { padding-top:1px; }
  .tabmenu li { width:calc(100% / 4); margin-top: -1px; }
  .tabmenu li:nth-child(4n+1) { border-left:1px solid #dedede; }
  .tabmenu li a { height: 40px; line-height: 40px; }
}

@media all and (max-width:767px) {
  .tabmenu { margin-top:0; margin-bottom: 5%; }
}

@media all and (max-width:400px) {
  .tabmenu li { width:calc(100% / 3); }
  .tabmenu li:nth-child(4n+1) { border-left:0; }
  .tabmenu li:nth-child(3n+1) { border-left:1px solid #dedede; }

  .tabmenu.col5 li { width: calc(100% / 3); }
}

/* 페이지 인식을 위한 부분 */
#tab01 .tabmenu  a.menu1,
#tab02 .tabmenu  a.menu2,
#tab03 .tabmenu  a.menu3,
#tab04 .tabmenu  a.menu4,
#tab05 .tabmenu  a.menu5,
#tab06 .tabmenu  a.menu6,
#tab07 .tabmenu  a.menu7,
#tab08 .tabmenu  a.menu8,
#tab09 .tabmenu  a.menu9,
#tab10 .tabmenu  a.menu10 { color:#fff; background:#37c477; font-weight:600; border-color: #37c477 !important; z-index:100; }