@charset "utf-8";

/* s_visual */
#sub_top_Wrap{}

.s_visual { position:relative;width:100%; height:430px; 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; padding-left: 2%; font-family: 'HallymGothic';  }
.s_visual .sv_tit h2 { font-size: 5.3rem; letter-spacing: -0.03em; line-height: 1.15em; font-weight: 500; }
/* .s_visual .sv_tit h2::before { content: ''; width: 100%; height: 66px; background: url("/images/main/symbol.png") no-repeat left top; background-size: auto 100%; display: block; margin-bottom: 0.2em; } */
.s_visual .sv_tit p { font-size: 3rem; margin-top: 0.5em;}
.s_visual .sv_tit p.tBG { font-size: 6rem; font-family: 'WindSong'; position: absolute; right:0; top: 50%; transform: translateY(-48%); line-height: 1.0em; margin-top:0; }

@media all and (max-width:1480px) {
 /* .s_visual { height: 50vw; } */
}

@media all and (max-width:1280px) {
  .s_visual .sv_tit h2::before { height: 55px; }
  .s_visual .sv_tit p { font-size: 2.6rem; }
  .s_visual .sv_tit p.tBG { font-size: 4.5vw; }
}

@media all and (max-width:1080px) {
  .s_visual { height: auto; padding: 16vw 0; }
  .s_visual .sv_tit h2 { font-size: 5rem; }
  .s_visual .sv_tit h2::before { height: 40px; }
  .s_visual .sv_tit p { font-size: 2.2rem; }
  .s_visual .sv_tit p.tBG { font-size: 4vw; }
}

@media all and (max-width: 767px){
  .s_visual { padding: 16vw 0 20vw; }
}

@media all and (max-width: 568px){
  .s_visual { padding: 7em 0 9em; }
  .s_visual .sv_tit h2 { font-size: 4rem; }
  .s_visual .sv_tit h2::before { height: 26px; }
  .s_visual .sv_tit p { font-size: 2rem; }
}

@media all and (max-width: 480px){
  .s_visual { padding: 7em 0 8em; }
  .s_visual .sv_tit h2 { font-size: 3.5rem; }
  .s_visual .sv_tit h2::before { height: 20px; }
  .s_visual .sv_tit p { margin-top: 0.5em; }
  .s_visual .sv_tit p.tBG { position: relative; right: inherit; top: inherit; transform: none; margin-top: 1.8em; font-size: 5vw;  }
}



/* Sub-Menu */
.sub_menu_wrap { position:relative;  width:90%; max-width: 1600px; height:90px; line-height:90px; margin:-90px auto 0; padding:0;
                          font-weight:400; box-sizing:border-box; z-index:10; background: rgba(16,27,42,0.5); }
.sub_menu_wrap .m_home{ position:static; display:block; width:90px; height:90px; float:left; background: #0d3f9e url("/images/sub/ico_home.png") no-repeat center; border:0;  }
.sub_menu_wrap .m_dep_box{ position: relative; display:block; width:280px; float:left; text-align:left; cursor:pointer; border-right: 1px solid rgba(255,255,255,0.3); font-size: 1.8rem; }
.sub_menu_wrap .m_dep_tit { display:block; background:url('/images/sub/arrow_down.png') no-repeat 92% center;  color:#fff; box-sizing:border-box; padding:0 1.5em; cursor:pointer;}
.sub_menu_wrap .m_dep_box .smenu { position: absolute; display:none; width:calc(100% + 2px); margin-left:-1px; background:#f6f6f6; box-sizing:Border-box; border:1px solid #ddd; border-top:0;}
.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;}
.sub_menu_wrap .m_dep_box .smenu li:hover{background:#ccc;}
.sub_menu_wrap .m_dep_box .smenu li:hover a { border:0; font-weight:500;}
.sub_menu_wrap .m_dep_box .smenu li a.on{background:#0d3f9e; color:#fff; border:0; }
.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:1.2em 1.5em; box-sizing:border-box; line-height:normal; font-size: 1.6rem;}
.sub_menu_wrap .m_dep_box .smenu a br { display: none; }
.sub_menu_wrap .m_2dep_box li:before {display:none;}

@media all and (max-width: 1080px){
  .sub_menu_wrap { height: 80px; line-height: 80px; margin-top: -80px; }
  .sub_menu_wrap .m_home { width:80px; height:80px;  background-size: 100% auto;}
}

@media all and (max-width: 767px){
  .sub_menu_wrap { height: 70px; line-height: 70px; margin-top: -70px; }
  .sub_menu_wrap .m_home { width:70px; height:70px; }
  .sub_menu_wrap .m_dep_box { width: calc(50% - 35px); }
  .sub_menu_wrap .m_2dep_box { border-right:0; }
}

@media all and (max-width: 640px){
  .sub_menu_wrap { height: 60px; line-height: 60px; margin-top: -60px; }
  .sub_menu_wrap .m_home { width:60px; height:60px; }
  .sub_menu_wrap .m_dep_box { width: calc(50% - 30px); }
}


@media all and (max-width: 480px){
  .sub_menu_wrap { width: 100%; height: 50px; line-height: 50px; margin-top: -50px; }
  .sub_menu_wrap .m_home { width:50px; height:50px; }
  .sub_menu_wrap .m_dep_box { width: calc(50% - 25px); }
  .sub_menu_wrap .m_dep_tit { padding: 0 0.8em; font-size: 1.7rem; background-size: 12px auto; }
  .sub_menu_wrap .m_dep_box .smenu a { padding: 0.8em 1em; }
}



#subTitle { text-align: center; color:#212121; font-size: 3.8rem; font-family: 'HallymGothic'; font-weight: 700; line-height: 1.2em;
                padding: 2.5em 0 0; letter-spacing: -0.04em;}
#pageCont { padding: 4% 0 5%; overflow: hidden; }

@media all and (max-width:976px) {
  #subTitle { padding-top: 2em; }
  #pageCont { padding: 7% 0; }
}

@media all and (max-width:767px) {
   #pageCont { padding: 8% 0; }
}

@media all and (max-width:568px) {
   #subTitle { font-size: 3.2rem;  }
}

@media all and (max-width:480px) {
  #pageCont { padding: 10% 0; }
}




.tabmenu { text-align: center; width: 100%; max-width: 1600px; margin: 0 auto 4%; overflow: hidden; font-size:0; padding-top:1px; padding-left: 1px;  }
.tabmenu li { position: relative; vertical-align: middle; display: inline-block; width:calc(100% / 4); max-width: 250px; margin-top: -1px; margin-left: -1px;
                    border: 1px solid #dee6e9; text-align: center; }
.tabmenu li a { text-decoration: none; width:100%; height:60px; display: flex; justify-content: center; align-items: center; background:#fff;
                      color:#525252; font-size:1.7rem;  font-weight: 600; line-height: 1em;
                      box-sizing: border-box; /*text-overflow:ellipsis; overflow:hidden; white-space:nowrap;*/}
.tabmenu li a:hover { color:#004ddf ; }

.tabmenu.fs-s li a { font-size: 1.5rem; }

.tabmenu.col5 li { width:calc(100% / 5); max-width: 280px; }
.tabmenu.col6 li { width:calc(100% / 6); max-width: 280px; }
.tabmenu.col7 li { width:calc(100% / 7); float: left; }


.tabmenu.floor.floor li a { height: 80px; line-height: 80px; font-size: 1.5rem; font-weight: 400; }
.tabmenu.floor.floor li a p { display: inline-block; line-height: 1.3em; vertical-align: middle; }
.tabmenu.floor.floor li a p span { font-size: 2.1rem; font-weight: 900; color:#004ddf; }


/* 페이지 인식을 위한 부분 */
.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,
.tab11 .tabmenu  a.menu11,
.tab12 .tabmenu  a.menu12 { color:#fff; background:#004ddf; font-weight:600; border-color: #004ddf !important; z-index:98; }

.tab01 .tabmenu  a.menu1 small,
.tab02 .tabmenu  a.menu2 small,
.tab03 .tabmenu  a.menu3 small,
.tab04 .tabmenu  a.menu4 small,
.tab05 .tabmenu  a.menu5 small,
.tab06 .tabmenu  a.menu6 small,
.tab07 .tabmenu  a.menu7 small,
.tab08 .tabmenu  a.menu8 small,
.tab09 .tabmenu  a.menu9 small,
.tab10 .tabmenu  a.menu10 small,
.tab11 .tabmenu  a.menu11 small,
.tab12 .tabmenu  a.menu12 small { color:#fff; background:#004ddf; font-weight:600; border-color: #004ddf !important; z-index:98; }

@media all and (max-width:1280px) {
  .tabmenu.col6 li { width:calc(100% / 4); }
}

@media all and (max-width:1080px) {
  .tabmenu { margin-top: 0; margin-bottom: 5%; }
  .tabmenu li a { height:55px;  }
}


@media all and (max-width:976px) {
  .tabmenu li { width:calc(100% / 5); }
  .tabmenu li a { font-size: 1.6rem;  }

  .tabmenu.col3 li { width:calc(100% / 3);  float: inherit; }
  .tabmenu.col5 li { width:calc(100% / 3); }
  .tabmenu.col6 li { width:calc(100% / 3); }
}

@media all and (max-width:767px) {
  .tabmenu li { width:calc(100% / 4); }

}

@media all and (max-width:640px) {
  .tabmenu li a { height:50px;  }
}
@media all and (max-width:480px) {
  .tabmenu li { width:calc(100% / 2); }

}