@charset "utf-8";

/* mobile gnb ani */
@-webkit-keyframes fade {
  0% { opacity: 0;}
  100% { opacity: 1;}
}
@keyframes fade {
  0% { opacity: 0;}
  100% { opacity: 1;}
}



/* layout */
.inner {	width: 100%; max-width:1400px;	position:relative;	margin-left:auto;	margin-right:auto;}
.s-inner {	width:95%; max-width:1400px;	position:relative;	margin-left:auto;	margin-right:auto;}

@media all and (max-width:1380px) {
	body#wrap { font-size: 14px; }
}

@media all and (max-width:1280px) {
	body#wrap { font-size: 13px; }
}

@media all and (max-width:976px) {
	body#wrap { font-size: 12px; }
}

/* 타블렛 가로 미만 ~ 모바일 */
@media all and (max-width:767px) {

}

@media all and (max-width:640px) {
	body#wrap { font-size: 0.8rem; }
}



/*Header*/
#header { position:relative; width:100%; height:80px; line-height:80px;z-index:150; background:#fff;}

#header #logo {position:absolute; top:0; line-height:62px; left: 14%; z-index:89}
#header #logo img{ vertical-align:middle;   }
#header #logo img.on{ display:none; }
#header .hd_mbx { display:none; }

#gnb_pc { position:relative; overflow:hidden; width:100%; box-sizing:border-box; color:#232323; text-align:center; }


#gnb_pc .t_menu { position: absolute; right:14%;  z-index:999; }
#gnb_pc .t_menu li { float: left; margin-left:5px;}
#gnb_pc .t_menu li a {display:inline; font-size:0.9375em; padding:0.3em 1em; color:#FFF; font-family: 'Poppins', sans-serif; font-weight:500;  background:#aab7c7; border-radius:30px }
#gnb_pc .t_menu li a.box1 {  background:#0b4da3;} 
#gnb_pc .t_menu li a.box1:hover {color:#80dfff}
#gnb_pc .t_menu li a:hover {color:#0b4da3}


#gnb_mo .t_menu {  overflow: hidden; margin-top:3em   }
#gnb_mo .t_menu li { float: left; margin-left:5px;}
#gnb_mo .t_menu li a {display:inline-block;; font-size:1em; padding:0.2em 1em; color:#FFF; font-family: 'Poppins', sans-serif; font-weight:500;  background:#26a9da; border-radius:5px }



#gnb_pc .gnb_dp1{ display:inline-block; vertical-align:top; text-align:center;}
#gnb_pc .gnb_dp1>div { font-size:1.125em; padding:0 40px; height:80px; line-height:80px;font-weight:500; box-sizing:border-box; cursor:pointer;}
/*#gnb_pc .gnb_dp1>div>span{display:inline-block; position:relative}*/
#gnb_pc .gnb_dp1>div>a{display:inline-block; position:relative; color: #222;}
/*#gnb_pc .gnb_dp1>div>span:after{display:block; content:''; width:100%; height:3px; position:absolute; left:0%; bottom:0px; background:#0b4da3; transition:all .3s; transform:scaleX(0);}*/
#gnb_pc .gnb_dp1>div>a:after{display:block; content:''; width:100%; height:3px; position:absolute; left:0%; bottom:0px; background:#0b4da3; transition:all .3s; transform:scaleX(0);}
#gnb_pc .gnb_dp1 .smenu { display:none; padding:30px 0; color:#fff; }
#gnb_pc .gnb_dp1 .smenu li { line-height: 1.0em; margin-bottom: 15px; }
#gnb_pc .gnb_dp1 .smenu li a { font-size:0.95em; font-weight:400;  color:#fff; }
#gnb_pc .gnb_dp1 .smenu li a:hover{text-decoration:underline; }

#gnb_pc li.gnb_dp1:hover span{color:#0b4da3; font-weight:500;}
#gnb_pc li.gnb_dp1:hover a:after{ transform:scaleX(1);}

#header.scroll #logo img.on,
#header.menu_on #logo img.on { display:inline-block;}
#header.scroll #logo img.off,
#header.menu_on #logo img.off { display:none; }

#header.scroll #gnb_pc,
#header.menu_on #gnb_pc { background:rgba(24,22,43, 0.8); color:#212121; }
#header.scroll #gnb_pc:before,
#header.menu_on #gnb_pc:before {content:""; width:100%; height:80px; background:rgba(255,255,255,1); position:absolute; top:0; left:0; border-bottom:1px solid #e9e9e9}

#header.scroll #gnb_pc:before { height: 80px; }


#header.scroll { height: 80px;  }
#header.scroll #logo { line-height: 80px; }
#header.scroll #logo img { height: 50px; }

#header.scroll #gnb_pc .gnb_dp1>div { height:80px; line-height: 80px; }
#header.scroll #gnb_pc .t_menu li { line-height: 80px; }


#gnb_mo{ position:fixed; height:100%; z-index:999; right:0;  top:75px; padding:20px;  background:rgba(24,22,43, 0.8); 
                color:#FFF; width:100%; max-width:580px; box-sizing:border-box; transition: all 0.4s ease;
            	-webkit-transform: translateX(100%) rotate(0); -moz-transform: translateX(100%) rotate(0); -ms-transform: translateX(100%) rotate(0); -o-transform: translateX(100%) rotate(0);
               transform: translateX(100%) rotate(0);
}

#gnb_mo .gnb_dp1 div { font-weight:500; font-size:1.25em; padding:12px 0; cursor:pointer; border-bottom:1px dotted rgba(255, 255, 255, 0.5);}

#gnb_mo .smenu {display:none; padding:10px 0;}
#gnb_mo .smenu>li br{display:none;}
#gnb_mo .smenu>li>a,
#gnb_mo .smenu>li>span{display:block; padding:4px 10px; font-size:1em; color:#fff;}
#gnb_mo .smenu>li>a:hover,
#gnb_mo .smenu>li>span:hover{background:rgba(0,0,0,0.2); color:#FFF; font-weight:500;}



@media all and (max-width:1480px) {

  #header #logo img { height: 60px; }
	#gnb_pc .gnb_dp1>div {padding:0 30px; font-size: 1.2em; }

}

@media all and (max-width:1280px) {
	#header #gnb_pc {display:none;}

	#header {height:75px; border-bottom:1px solid rgba(255,255,255,0.2);}

	#header .hd_bx{line-height:75px; }
  #header #logo { left: 0; width:100%; text-align:center; line-height: 65px; }
  #header #logo img { height: 50px; }

	#header .hd_mbx{display:inline-block;  position:absolute; top:0; width:75px; height:75px; line-height:75px; text-align:center; padding:0;}
	#header .hd_mbx img,
	#header .hd_mbx img.mo{display:inline-block; width:100%; max-width:65px; vertical-align:middle;}

	#header .hd_tel{right:unset; left:0; z-index:90; border-right:1px solid rgba(255,255,255,0.2); background-repeat: no-repeat; background-position: center center;
                              background-image:url("/images/common/t_tel.png"); background-size: 100% auto;  }
  #header .hd_tel a { display: block; width:100%; height:100%;}
	#header .hd_full {display:inline-block; right:0; z-index:90; border-left:1px solid rgba(255,255,255,0.2); background-repeat: no-repeat; background-position: center center;
                              background-image:url("/images/common/allmenu.png"); background-size: 100% auto; }

	#header.on,
  #header.scroll { height: 75px; line-height: 75px; background:#FFF; border-bottom-color:transparent;}

  #header.on #logo,
  #header.scroll #logo { line-height: 75px;  }

  #header.on #logo img.on,
  #header.scroll #logo img.on { display: inline-block; }

  #header.on #logo img.off,
  #header.scroll #logo img.off { display: none; }

  #header.on .hd_tel,
  #header.scroll .hd_tel { background-color:#26a9da;  background-image:url("/images/common/t_tel-w.png");}
  #header.on .hd_full,
  #header.scroll .hd_full { background-color:#0b4da3; background-image:url("/images/common/allmenu-w.png");  }
  #gnb_mo.m_menuOn{	-webkit-transform: translateX(0) rotate(0); -moz-transform: translateX(0) rotate(0);	-ms-transform: translateX(0) rotate(0);	-o-transform: translateX(0) rotate(0);	transform: translateX(0) rotate(0); }

 }
@media all and (max-width:767px) {
	#header{height:60px; }
   #gnb_mo { top: 60px; }

	#header .hd_bx{line-height:60px; padding:0; }
	#header .hd_mbx{width:60px; height:60px; line-height:60px;}
   #header #logo { line-height:50px; }
	#header #logo img {height:40px;}

   #header.on, #header.scroll { height: 60px; }
   #header.on #logo, #header.scroll #logo { line-height: 60px; }
   #header.on #logo img, #header.scroll #logo img {height:40px;}
   #header.scroll #gnb_pc .gnb_dp1>div { height:60px; line-height: 60px; }

}
@media all and (max-width:568px) {
  #header{height:55px; }
  #gnb_mo { top: 55px; }

  #header .hd_bx{line-height:55px; padding:0; }
  #header .hd_mbx{width:55px; height:55px; line-height:55px;}
  #header #logo { line-height:55px; }
  #header #logo img {height:35px; margin-top: -5px; }

  #header.on, #header.scroll { height: 55px; }
  #header.on #logo, #header.scroll #logo { line-height: 55px; }
  #header.on #logo img, #header.scroll #logo img {height:35px;}
  #header.scroll #gnb_pc .gnb_dp1>div { height:55px; line-height: 55px; }
}





#footer {padding:2.5em 0; background: #2a2d31; overflow:hidden; }
#footer .logo {width:180px; float:left;}
#footer .cont {width:calc(100% - 180px); float:left;}
#footer .cont .line {padding-bottom:10px; margin-bottom:10px;  border-bottom:1px solid rgba(85,85,85,0.3)}
#footer .cont ul li {display:inline-block; margin:5px 8px; font-size:0.9375em; line-height:1.2em;  }
#footer .cont ul li a {color:#DDD; opacity:.6; }
#footer .cont ul li.copy {display:block; font-size:0.9em; opacity:.7; padding-top:0.7em;  font-family: 'Poppins', sans-serif; text-transform:uppercase}



@media all and (max-width:840px) {
	#footer .logo {width:100%; text-align:center; margin-bottom:1.5em;}
	#footer .cont {width:100%;}

}