@charset "utf-8";


/* s_visual */
#sub_top_Wrap{}
.s_visual { position:relative;width:100%; height:360px; line-height:1.4; box-sizing:border-box;overflow:hidden; text-align:center; background:no-repeat center center; background-size:cover; }
.s_visual_in{ position:relative;display:table;width:80%; margin:0 auto; height:100%;  z-index:2}
.sv_tit { display:table-cell;  box-sizing:border-box; vertical-align:middle; color:#fff;  }
.sv_tit h2 { font-size:3em; line-height:1.2em;font-family: 'SB Aggro'; font-weight: 700; letter-spacing:0.03em}
.sv_tit p.t1 { font-size:1.0em; padding-top:1em;  opacity:.6;  line-height:1.6em; display: inline-block; }

.s_visual3 { position:relative;width:100%; height:480px; line-height:1.4; box-sizing:border-box;overflow:hidden; text-align:center; background:no-repeat center center; background-size:cover; }
.s_visual3.sv3-1 { background-image:url("/images/sub/s_visual3-1.jpg")}
.s_visual3.sv3-2 { background-image:url("/images/sub/s_visual3-2.jpg")}
.s_visual3.sv3-3 { background-image:url("/images/sub/s_visual3-3.jpg")}


@media (max-width: 1280px){
.s_visual { height: 50vw; }
.s_visual3 { height: 50vw; }
}

@media (max-width: 976px){
.s_visual { height: 45vw; }
.s_visual3 { height: 45vw; }
.sv_tit { padding-top: 5%; }
.sv_tit p.t2  { bottom: -10px; font-size: 8vw; }
}

@media all and (max-width:767px) {
.sv_tit h2 { font-size:3em; margin-bottom: 0.2em; }
}

@media all and (max-width:568px) {
.s_visual { height: 60vw;  }
.s_visual3 { height: 60vw;  }
.sv_tit h2 { font-size:2.5em;  }
.sv_tit p.t1 { font-size:1.1em; }
.sv_tit p.t1 br {display:none;}
}


#subContent { position: relative; width: 100%; }

/* Sub-Menu */
.sub_menu_wrap {display:none; width:100%; height:80px; line-height:80px; margin: -40px auto 0 ; max-width: 1400px;
                          position:relative; font-weight:400; box-sizing:border-box; z-index:100; background: #0b4da3;}
.sub_menu_wrap .m_dep_tit,
.sub_menu_wrap .m_1dep_box,
.sub_menu_wrap br{display:none;}

.sub_menu_wrap.sub-on {display:block;; }

.sub_menu_wrap .m_home{position:static; display:block; width:80px; height:80px; float:left; background:#312783 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}
.sub_menu_wrap .m_2dep_box li{font-size: 1.063em;  position:relative; display:inline-block; padding:0 30px; font-weight:400;}
.sub_menu_wrap .m_2dep_box li a {color:#cdd1dc}
.sub_menu_wrap .m_2dep_box li:first-child:before{display:none;}
.sub_menu_wrap .m_2dep_box li:hover a{ font-weight: 500; }
.sub_menu_wrap .m_2dep_box li.s_on{color:#86deff}
.sub_menu_wrap .m_2dep_box li a.on{ color:#86deff; }

@media all and (max-width:1280px) {
.sub_menu_wrap .m_2dep_box li { padding: 0 30px; }
}

@media all and (max-width:976px) {
	.sub_menu_wrap{width:100%;  height:60px;  line-height:60px; color:#333; 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; }
	.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: #fff; 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;}
	.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{padding:10px 15px; border:0; font-weight:500;}
	.sub_menu_wrap .m_dep_box .smenu li a.on{background:#312783; color:#FFF; border:0; padding:10px 15px;}
	.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:10px 15px; 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:50%; 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:50%; height:45px; line-height:45px;}
}


#subTitle {  font-size:  2.375em;  padding-top: 4%; text-align: center; color:#212121; font-family: 'SB Aggro'; font-weight: 700; letter-spacing:0.03em; line-height: 1.2em; }
#pageCont { padding: 5em 0; }

@media all and (max-width:976px) {
   #subTitle { padding: 7% 0 4%; font-size: 2.6em; }
}

@media all and (max-width:568px) {
   #subTitle { font-size: 2.4em; padding: 6% 0 7%;}
}

@media all and (max-width:480px) {
   #subTitle { font-size: 2.2em;  padding: 10% 0 12%; }
}


/* 서브탭메뉴 */

/* 페이지 인식을 위한 부분 */
#tab01 .tabmenu a.menu1::before,
#tab02 .tabmenu a.menu2::before,
#tab03 .tabmenu a.menu3::before,
#tab04 .tabmenu a.menu4::before,
#tab05 .tabmenu a.menu5::before,
#tab06 .tabmenu a.menu6::before,
#tab07 .tabmenu a.menu7::before,
#tab08 .tabmenu a.menu8::before,
#tab09 .tabmenu a.menu9::before,
#tab10 .tabmenu a.menu10::before { content: ''; position: absolute; left:0; top:0; border:8px solid #283891; width: 100%; height: 100%; border-radius: 100%; }

@media all and (max-width:976px) {
  .tabmenu li a { width: 120px; height: 120px; padding-top: 20px; }
  .tabmenu li a::before { border-width: 6px !important; }
}

@media all and (max-width:640px) {
  .tabmenu { padding: 0 7%; }
  .tabmenu li a { width: 22vw; height: 22vw; padding-top: 4vw; }
  .tabmenu li p { margin-top: 10px; }
}


.tabmenu2 { text-align: center; width: 100%; max-width: 800px; margin: 0 auto; overflow: hidden; border-top: 3px solid #312783; border-bottom: 1px solid #312783; margin-bottom:7% }
.tabmenu2 li {position: relative; float:left; width:25%; }
.tabmenu2.col2 { width: 80%; }
.tabmenu2.col2 li { width: 50%; }
.tabmenu2.col3 { width: 100%; }
.tabmenu2.col3 li { width: 33.33%; }
.tabmenu2.col5 li { width: 20%; }
.tabmenu2.col6 li { width: 16.66%; }
.tabmenu2 li a {text-decoration: none; width:100%; height:60px; line-height: 60px; display: block; background:#fff; color:#525252; font-size:1.1em; box-sizing: border-box; text-overflow:ellipsis; overflow:hidden; white-space:nowrap;}
.tabmenu2 li a:before { content:''; width: 1px; height: 20px; background-color:#dedede; position: absolute; right:0; top: 50%; margin-top:-10px; }
.tabmenu2 li:last-child a:before{display:none;}


/* 페이지 인식을 위한 부분 */
.tab01 .tabmenu2  a.menu1,
.tab02 .tabmenu2  a.menu2,
.tab03 .tabmenu2  a.menu3,
.tab04 .tabmenu2  a.menu4,
.tab05 .tabmenu2  a.menu5,
.tab06 .tabmenu2  a.menu6,
.tab07 .tabmenu2  a.menu7,
.tab08 .tabmenu2  a.menu8,
.tab09 .tabmenu2  a.menu9,
.tab10 .tabmenu2  a.menu10 { color:#fff; background:#312783; font-weight:400; border:1px solid ##283891; z-index:100; }


@media all and (max-width:976px) {
	.tabmenu2 { margin-bottom:10% }

  .tabmenu2 li a { height:60px; line-height: 60px; }
}

@media all and (max-width:640px) {
  .tabmenu2 li a { border-bottom: 1px solid ##283891; height:50px; line-height: 50px; font-size: 1em;}
}
@media all and (max-width:480px) {
  .tabmenu2 li a {height:40px; line-height: 40px; font-size: 1.05em;}
}

.tabmenu2.tabmenu3 {  max-width: 1400px; border-bottom: 3px solid #062b34; border-top: 1px solid #dedede ;  }
.tabmenu2.tabmenu3 li a { height:60px; line-height: 60px; display: block; background:#fff; color:#525252; font-size: 1.1em;
							  border:1px solid #dedede; border-left-width:0; border-top-width:0;  box-sizing: border-box; }
.tabmenu2.tabmenu3 li a:before { display: none;  }


/* 페이지 인식을 위한 부분 */
.tab01 .tabmenu3  a.menu1,
.tab02 .tabmenu3  a.menu2,
.tab03 .tabmenu3  a.menu3,
.tab04 .tabmenu3  a.menu4,
.tab05 .tabmenu3  a.menu5,
.tab06 .tabmenu3  a.menu6,
.tab07 .tabmenu3  a.menu7,
.tab08 .tabmenu3  a.menu8,
.tab09 .tabmenu3  a.menu9,
.tab10 .tabmenu3  a.menu10 { background:#062b34; border:1px solid #062b34; }


@media all and (max-width:976px) {
  .tabmenu2.tabmenu3 li { width: 33.33%; }
  .tabmenu2.tabmenu3 li a { height:50px; line-height: 50px; }
}


@media all and (max-width:568px) {
.tabmenu2.tabmenu3 li a { height:40px; line-height: 40px; }
}





.quick {position:fixed; right:0; top:30%;  border:1px solid #ddd;  background:#FFF; text-align:center; z-index:999}
.quick h5 { color:#fff; background: #0088c8; line-height: 1.3em; padding: 1.5em 0; letter-spacing: 0; font-size: 0.93em; font-weight: 700; }
.quick ul li {border-top:1px solid #ddd;  }
.quick a {font-size:0.87em; line-height:1.2em; color:#212121; display:block; width:100%; height:100%; padding:20px 5px;}
.quick a:hover {background: #f6f6f6; }
.quick li img {padding-bottom:10px;}
.quick-tel {font-size:0.87em; line-height:1.2em; color:#212121; padding:20px 5px;}
.quick-tel  p.tel {font-size:0.9em; line-height:1.3em;}

.quick .img-mo {display:none;}

@media all and (max-width:720px){
	.quick .img-pc {display:none;}
	.quick .img-mo {display:block; margin:0 auto}
    .quick{top: auto; bottom: 0; width: 100%; overflow:hidden; border:0;  background:#0088c8; }
	.quick h5 { display:none; }
    .quick li{float: left; width: 33%; height:120px; border-top:0; border-left:1px solid #40a6d6; margin-left:-1px }
	.quick a {font-size:1em; color:#FFF; line-height:1.2em;padding:10px 0;}
	.quick a:hover {background: #312783; }
	.quick-tel {font-size:1em;color:#FFF; padding:10px 0;}
	.quick-tel  p.tel {font-size:1.05em;}
}
@media all and (max-width:500px) {
	.quick {font-size:0.9em;}

	.quick a  img {width:30%;}
	.quick-tel  img {width:30%;}
}