@charset "utf-8";

/* s_visual */
#sub_top_Wrap{}

.s_visual { position:relative;width:100%; height:680px; box-sizing:border-box;overflow:hidden; background:no-repeat center center; background-size:cover; }
.s_visual .s_visual_in { position:relative; display:table; width:90%; height:100%;  z-index:2; max-width: 1600px; margin: 0 auto; }
.s_visual .sv_tit { display:table-cell; box-sizing:border-box; color:#fff; vertical-align:middle; text-align: center; padding-top: 4%;  }
.s_visual .sv_tit h2 { font-size: 6rem; }
.s_visual .sv_tit .t1 { font-size: 2rem; font-family: 'Play'; line-height: 1.0em; margin-bottom: 0.5em; }
.s_visual .sv_tit .t1 span { vertical-align: middle; }
.s_visual .sv_tit .t2 { font-size: 1.8rem; line-height: 1.8em; margin-top: 1.5em;  }


@media (max-width: 1480px){
  .s_visual { height: 40vw; }
}

@media (max-width: 1080px){
  .s_visual { height: 45vw; }
  .s_visual .sv_tit h2 { font-size: 5.5rem; }
}

@media (max-width: 880px){
  .s_visual { height: 50vw; }
  .s_visual .sv_tit h2 { font-size: 5rem; }
}

@media (max-width: 640px){
    .s_visual { height: 60vw; }
}

@media (max-width: 568px){
  .s_visual { height: 70vw; }
    .s_visual .sv_tit h2 { font-size: 4.5rem; }
    .s_visual .sv_tit .t1 { font-size: 1.8rem; }
    .s_visual .sv_tit .t2 { margin-top: 1em; line-height: 1.6em; }
}



#subContent { position: relative; width: 100%; }

/* Sub-Menu */
.sub_menu_wrap {width:100%; height:80px; line-height:80px; margin: 0 auto; border-bottom: 1px solid #dedede;
                          position:relative; font-weight:400; box-sizing:border-box; z-index:98; background: #fff;}
.sub_menu_wrap .m_dep_tit,
.sub_menu_wrap .m_1dep_box,
.sub_menu_wrap br{display:none;}
.sub_menu_wrap .in { max-width: 1600px; width: 100%; margin: 0 auto; }

.sub_menu_wrap .m_home{position:static; display:none; width:80px; height:80px; float:left; background:#0f319e url("/images/sub/ico_home.png"); border:0; background-size: 100% auto;}
.sub_menu_wrap .m_2dep_box {text-align:center; width: 100%; }
.sub_menu_wrap .m_2dep_box .smenu {display:block; font-size:0; }
.sub_menu_wrap .m_2dep_box li {position:relative; display: inline-block; width: calc(100% / 6); font-size: 1.8rem; font-weight:400; }
.sub_menu_wrap .m_2dep_box li:before{content:""; width:1px; height:12px; background:#dedede; position:Absolute; left:0; top:50%; margin-top:-6px;}
.sub_menu_wrap .m_2dep_box li:first-child:before{display:none;}
.sub_menu_wrap .m_2dep_box li:hover a{ font-weight: 500; color:#eb2a2e; }
.sub_menu_wrap .m_2dep_box li.s_on{ color:#212121; border-bottom: 3px solid #ff0000; }
.sub_menu_wrap .m_2dep_box li a { display: block; }
.sub_menu_wrap .m_2dep_box li a.on{ font-weight: 500; color:#252525; }

.sub_menu_wrap .m_2dep_box .col6 li { width: calc(100% / 6); }

@media all and (max-width:1280px) {
  .sub_menu_wrap { height:70px; line-height:70px; }
  .sub_menu_wrap .m_home { width:70px; height:70px; }
  .sub_menu_wrap .m_2dep_box li { padding: 0 20px; }
}

@media all and (max-width:976px) {
	.sub_menu_wrap{width:100%;  height:60px;  line-height:60px; margin:-1px auto 0; padding:0;}
  .sub_menu_wrap::before  { display: none;}
  .sub_menu_wrap .inner{width:100%;}
	.sub_menu_wrap .m_home{width:60px; height:60px; display: block; }
	.sub_menu_wrap .m_dep_box{display:block; width:220px; float:left; border-right:1px solid rgba(255,255,255,0.3); text-align:left; cursor:pointer;height:60px; line-height:60px; border-right:1px solid #ddd;}
	.sub_menu_wrap .m_dep_tit {display:block; background:url('/images/sub/arrow_down.png') no-repeat 95% center; height:60px; line-height:60px; color:#333; box-sizing:border-box; padding:0 15px; cursor:pointer;}
	.sub_menu_wrap .m_dep_box .smenu{ display:none; width:calc(100% + 2px); margin-left:-1px; background:#f9f9f9; box-sizing:Border-box; border:1px solid #ddd; border-top:0; font-size: 1.0em;}
	.sub_menu_wrap .m_dep_box .smenu li {margin:0; width:100%; display:block; box-sizing:border-box;  border-top:1px dotted #ddd; padding:0; font-size: 1.06em;}
	.sub_menu_wrap .m_dep_box .smenu li:hover{background:#ccc;}
	.sub_menu_wrap .m_dep_box .smenu li:hover a{padding:1em 1.5em; border:0; font-weight:500;}
	.sub_menu_wrap .m_dep_box .smenu li a.on{background:#eb2a2e; color:#FFF; border:0; padding:1em 1.5em;}
	.sub_menu_wrap .m_dep_box .smenu li:first-child{border-top:0;}
	.sub_menu_wrap .m_dep_box .smenu a{ color:#333; display:block; width:100%;  padding:1em 1.5em; box-sizing:border-box; line-height:normal; font-size: 0.9em;}
	.sub_menu_wrap .m_2dep_box li:before{display:none;}
}

@media all and (max-width:767px) {
	.sub_menu_wrap{ height:55px;  line-height:55px}
	.sub_menu_wrap .m_home{width:55px;  height:55px;}
	.sub_menu_wrap .m_dep_tit{height:55px; line-height:55px;}
	.sub_menu_wrap .m_dep_box{width:calc(50% - 28.5px); height:55px; line-height:55px;}
	.sub_menu_wrap .m_2dep_box{border-right:0;}
}
@media all and (max-width:480px) {
  .sub_menu_wrap{ height:45px;  line-height:45px}
	.sub_menu_wrap .m_home{width:45px;  height:45px;}
	.sub_menu_wrap .m_dep_tit{height:45px; line-height:45px;}
	.sub_menu_wrap .m_dep_box{width:calc(50% - 23.5px); height:45px; line-height:45px;}
}




#subTitle { text-align: center; color:#212121; font-size: 4rem; font-weight: 700; line-height: 1.2em; padding: 4% 0 3%; letter-spacing: -0.04em;}
#pageCont { padding-bottom: 4%; overflow: hidden; }

@media all and (max-width:976px) {
   #subTitle { padding: 7% 0 4%; }
}

@media all and (max-width:767px) {
   #subTitle { padding: 8% 0 4%; }
}

@media all and (max-width:568px) {
   #subTitle { font-size: 3.5rem; }
   #pageCont { padding-bottom: 5%; }
}

@media all and (max-width:480px) {
  #subTitle { padding: 9% 0 5%; }
  #pageCont { padding-bottom: 7%; }
}



.tabmenu { text-align: center; width: 92%; max-width: 1600px; margin: 0 auto 3%; overflow: hidden; font-size:0; }
.tabmenu li { position: relative; display: inline-block; width:calc(100% / 3); max-width: 280px;}
.tabmenu li:first-child { border-left:1px solid #dedede; }
.tabmenu li a { text-decoration: none; width:100%; height:70px; line-height: 70px; display: block; background:#fff;
                      color:#525252; font-size:1.7rem;  border: 1px solid #dedede; border-left:0; font-weight: 600;
                      box-sizing: border-box; text-overflow:ellipsis; overflow:hidden; white-space:nowrap;}
.tabmenu li a:hover { color:#0f319e; }



/* 페이지 인식을 위한 부분 */
.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:#0f319e; font-weight:600; border-color: #0f319e !important; z-index:98; }

@media all and (max-width:1080px) {
  .tabmenu { margin-bottom: 5%; }
}


@media all and (max-width:976px) {
  .tabmenu li a { height:60px; line-height: 60px; }
}

@media all and (max-width:640px) {
  .tabmenu li a { height:50px; line-height: 50px;  }
}

@media all and (max-width:480px) {
  .tabmenu li a { height:40px; line-height: 40px;  }
}



.targetMenu { text-align: center; width: 92%; max-width: 1600px; margin: 0 auto 3%; overflow: hidden; font-size:0; }
.targetMenu li { position: relative; display: inline-block; width:calc(100% / 3); max-width: 280px;}
.targetMenu li:first-child { border-left:1px solid #dedede;  }
.targetMenu li:first-child a { background: #0f319e; color:#fff; }
.targetMenu li a { text-decoration: none; width:100%; height:70px; line-height: 70px; display: block; background:#fff;
                      color:#525252; font-size:1.7rem;  border: 1px solid #dedede;  border-left:0; font-weight: 600;
                      box-sizing: border-box; text-overflow:ellipsis; overflow:hidden; white-space:nowrap;}
.targetMenu li a:hover { background: #51608f; color:#fff; }


@media all and (max-width:976px) {
  .targetMenu li a { height:60px; line-height: 60px; }
}

@media all and (max-width:640px) {
  .targetMenu li a { height:50px; line-height: 50px;  }
}

@media all and (max-width:480px) {
  .targetMenu li a { height:40px; line-height: 40px;  }
}
