@charset "utf-8";

::-moz-selection {
   background: #000000;
   color: #2ca5d3;
}
::selection {
   background: #000000;
   color: #2ca5d3;
}


/*해더*/
#header{
    background:transparent;
    position:relative;
    position:absolute;
    z-index:9;
    width:100%;
    height:80px;
	font-weight: 300;
}
#header h1{
    font-size:18px;
    font-weight:bold;
    padding-top:15px;
    float:left;
    z-index:99;
    
}
#header h1 img{}
#header h1 a{color:#eeeeee;}
#header .nav_wrap p{display:inline-block;padding-top:48px;}
#header h1 a {
    width:118px;
    height:52px;
    display: block;
    background: url(../images/logo.png)no-repeat;}

#header .menu_warp{
    font-size:17px;
    color:#eeeeee;
    _padding-left: 415px;
    _line-height:95px;
    float:left;
}

#header .menu_warp>li{
    float:left;
    font-weight:500;
    color:#ff;
}

#header .gnb{height:80px;float:right;z-index:0;}

#header .gnb_btn{padding-top:42px;display: inline-block;padding-left:27px;cursor:pointer;}



#header .menu_warp li a{
    color: #373737;
    _line-height:162px;
}





#header .gnb .gnb-bg{
    display: none;
    position: absolute;
    top: 51px;
    _background:#ffffff;
    background-color: rgba(0,0,0,.5);
    width: 100%;
    left: 0;
    height: auto;
}



#header .gnb_wrap{z-index: 1000;transition: all 0.3s;}
#header.fix .gnb_wrap{position: fixed;width: 100% !important;background: #ffffff; 
	background-size:cover; top: 0;left: 0;transition: all 0.3s;}
#header.fix .gnb_wrap:hover{}
#header.fix h1{_z-index:99999;}
#header .gnb_wrap .home{position:absolute;top:0;left:50%;margin-left:-600px;z-index:10;background-color:#5580ce;opacity:0;transition:opacity 0.2s;}
#header .gnb_wrap .gnb{position:relative;font-family: 'SCoreDream', sans-serif;}
#header .gnb_wrap .gnb>ul{}
#header .gnb_wrap .gnb .menu{width:170px;position: relative;float: left; font-size: 17px;text-align: center;line-height: 80px;}
#header .gnb_wrap .gnb .menu>a{color: #ffffff;display: block;z-index: 11;}
#header .gnb_wrap .gnb .menu>a:hover{color:#3052B6;}
#header .gnb_wrap .gnb .menu:hover .menu>a{color:#3052B6;border-bottom:1px solid #3052B6}
#header .gnb_wrap .gnb .depth2:hover{color:#3052B6;}
#header .gnb_wrap .gnb .depth3:hover .depth2{background:#888888;}
#header .gnb_wrap .gnb-bg{display:none;position: absolute;
    top: 80px;
	left:0;
    background:#ffffff;
	background-size:100%;
	width:100%;_height:230px;z-index: -1;
	border-top: 1px solid rgba(255,255,255,0.2);}
#header .menu_warp .s_bg{display: none;
    position: absolute;
    width: 1920px;
    height:500px;
    left:50%;
    transform:translateX(-50%,-50%);
    background:#ffffff;
    opacity: 0;
    transition: opacity 1s;}
#header .menu_warp .menu:hover .s_bg{display: block;opacity: 1; transition: opacity 1s;}
#header .menu_warp .menu .s_bg li a{display: block;line-height: 60px;padding: 0 20px; color: #555;font-size: 18px;}
#header .menu_warp .menu .s_bg li:hover a{color: #006ab6;}
#header .gnb_wrap .depth2{width:170px;display:none;font-size:16px;font-weight:normal;line-height: 40px;padding-top:10px;}
#header .gnb_wrap .depth2 li a{font-size:16px; letter-spacing:-0.5px;padding:0 5px;border-radius:5px;transition:0.1s;}
#header .gnb_wrap .depth2 li:hover a{_background:url(../images/gnb_bg.png)no-repeat center left;}
#header .gnb_wrap .depth2 li a:hover{color:#2656B6;}
#header .gnb_wrap .depth2 .title_img{position:absolute;left:-230px;top:10px;color:#373737;text-align:left;}
#header .gnb_wrap .depth2 .title_img p{padding-bottom:10px;}
#header .gnb_wrap .depth2 .title_img h4{font-size:20px;font-weight:400;}
#header .gnb_wrap .depth2 .title_img p{font-size:14px;}
.kor_eng_wrap li.on a{color:#2656B6;}
#header .gnb_wrap .depth3 li:hover a{color:#2656B6;background:#f1f1f1;border-radius: 0; transition:0.1s;}
#header .gnb_wrap:hover{background:#ffffff;border-bottom:1px solid rgba(255,255,255,0.2);}



#header .gnb .menu:hover{color:#3052B6;z-index:1;transition: all 0.2s;}
#header .gnb .menu .m{position:relative;}
#header .gnb .menu:hover .m{color:#3052B6;z-index:1;transition: all 0.2s;}
#header .gnb .depth2 a:hover{color:#3052B6;}





#header.sc{border-bottom: 1px solid #e2e2e2;box-shadow: rgb(0 0 0 / 15%) 2px 0px 5px;}
#header.ms{border-bottom: 1px solid #e2e2e2;}
#header.sc .gnb_wrap{border-bottom: 1px solid #e2e2e2;box-shadow: rgb(0 0 0 / 15%) 2px 0px 5px;}
#header.ms .gnb_wrap{border-bottom: 1px solid #e2e2e2;}
#header.sc .gnb .menu .m{position: relative;color: #222;}
#header.ms .gnb .menu .m{position: relative;color: #222;}
#header.ms h1 a{background-image: url(../images/logo_b.png);}
#header.sc h1 a{background-image: url(../images/logo_b.png);}



.ko_en{display:inline-block;padding-left: 40px;}
.ko_en li{float:left;margin:0 10px;line-height: 80px;font-weight:400;}
.ko_en li::after{    content: "";
    display: inline-block;
    width: 1px;
    height: 11px;
    background: #b5b5b5;
    margin-left:20px;

}
.ko_en li:nth-child(2)::after{display:none;}
.ko_en li:nth-child(3)::after{display:none;}
.ko_en li:nth-child(3){}
.ko_en li a{color:#ffffff;text-align:center;}
.ko_en li.on a{color:#2656B6;}





#menuToggle
{z-index: 9999999;
  display: block;
  position: absolute;
  top: 20px;
  right: -40px;
  float:right;
  
  -webkit-user-select: none;
  user-select: none;
}

#menuToggle a
{
  text-decoration: none;
  color: #717171;
  
  transition: color 0.3s ease;
}

#menuToggle a:hover
{
  color: #FB9098;
}


#menuToggle .line3
{
  display: block;
  width: 40px;
  height: 32px;
  position: absolute;
  top: -7px;
  left: -5px;
  background: none;
  cursor: pointer;
  
  opacity: 0; /* hide this */
  z-index: 999; /* and place it over the hamburger */
  
  -webkit-touch-callout: none;
}

/*
 * Just a quick hamburger
 */
#menuToggle span
{
  display: block;
  width: 24px;
  height: 2px;
  margin-bottom: 4px;
  position: relative;
  
  background: #e0e0e0;
  border-radius: 3px;
  
  z-index: 1;
  
  transform-origin: 4px 0px;
  
  transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
              background 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
              opacity 0.55s ease;
}

#menuToggle span:first-child
{
  transform-origin: 0% 0%;
}

#menuToggle span:nth-last-child(2)
{
  transform-origin: 0% 100%;
}

#header.sc #menuToggle span{background:#5b5b5b;}


/* 
 * Transform all the slices of hamburger
 * into a crossmark.
 */
#menuToggle input:checked ~ span
{
  opacity: 1;
  transform: rotate(45deg) translate(-2px, -1px);
  background: #5b5b5b;
}

/*
 * But let's hide the middle one.
 */
#menuToggle input:checked ~ span:nth-last-child(3)
{
  opacity: 0;
  transform: rotate(0deg) scale(0.2, 0.2);
}

/*
 * Ohyeah and the last one should go the other direction
 */
#menuToggle input:checked ~ span:nth-last-child(2)
{
  transform: rotate(-45deg) translate(0, -1px);
}

/*
 * Make this absolute positioned
 * at the top left of the screen
 */
#menu
{height: 1000px;
    top: 0px;
    right: -192px;
  position: absolute;
  width: 460px;
  margin: -100px 0 0 -50px;
  _padding: 50px;
  padding-top: 215px;
  _padding-left:64px;
  list-style-type: none;
  -webkit-font-smoothing: antialiased;
  transform-origin: 0% 0%;
  transform: translate(100%, 0);
  transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0);
    background:#ffffff;
    font-weight:300;
}

#menu>li
{
  font-size: 22px;

}

#menu>li:hover{background:url(../images/nav_on.png)no-repeat left;
}



/*
 * And let's slide it in from the left
 */
#menuToggle input:checked ~ ul
{
  transform: none;
}

#menuToggle .menu_in li{padding:0px;margin-bottom:10px; }
#menuToggle .menu_in li a{display: block;padding-left: 16px;font-size: 16px;opacity: 0.8}
.mo_logo{width:30px;height:30px; background:url(../images/logo_mo2.png)no-repeat !important;background-size:cover !important;}
.mo-gnb{position: absolute; width: 100%;top: 70px;border-top: 1px solid rgba(255, 255, 255, 0.1);}
#menu .d1{}
#menu .d1 .m{display: block;padding: 10px 0; border-bottom: 1px solid rgba(255, 255, 255, 0.1);font-size: 18px;padding-left:35px;background:#ffffff;border-bottom:1px solid #e6e6e6;}
#menu .d1 .m2{display: block;padding: 10px 0; border-bottom: 1px solid rgba(255, 255, 255, 0.1);font-size: 18px;padding-left:35px;background:#ffffff;border-bottom:1px solid #e6e6e6;}
#menu .d1{}
#menu .d1 .m.active{/*background-color: #059b04;color:#fff; border-bottom: 1px solid #059b04;배경초록색*/color: #373737;}
#menu .d1 .sub{display:none;background-color: #eee;}
#menu .d1 .sub li{border-bottom:1px solid #ddd;}
#menu .d1 .sub li:last-child{border-bottom:0;}
#menu .d1 .sub li a{display: block;font-size: 16px;color: #555;padding: 10px 0;/*font-family: 'GmarketSansMedium';*/font-weight:500;padding-left:35px;}
#menu .d1 .m{transition:all 0.2s;}
#menu .d1 .m i{transition:all 0.2s;float:right;}
#menu .d1 .m i.rightico{transform:rotate(180deg);transition:all 0.2s;}

.box_m{padding-top: 90px;background:#0081BE;padding-bottom: 14px;}
#menuToggle .box_m a{color:#ffffff !important;}
#menuToggle .box_m li{float:left;}




@import url(http://fonts.googleapis.com/css?family=Raleway:400,200);
#cssmenu,
#cssmenu ul,
#cssmenu ul li,
#cssmenu ul li a {
  margin: 0;
  padding: 0;
  border: 0;
  list-style: none;
  line-height: 1;
  display: block;
  position: relative;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
#cssmenu {
  width: 288px;
  font-family: Raleway, sans-serif;
  color: #ffffff;
}
#cssmenu ul ul {
  display: none;
}
#cssmenu > ul > li.active > ul {
  display: block;
}
.align-right {
  float: right;
}
#cssmenu > ul > li > a {
  padding: 16px 22px;
  cursor: pointer;
  z-index: 2;
  font-size: 16px;
  text-decoration: none;
  color: #ffffff;
  background: linear-gradient(to right, #ff1ccd, #9134e5);
  -webkit-transition: color .2s ease;
  -o-transition: color .2s ease;
  transition: color .2s ease;
  border-bottom:1px solid rgba(255,255,255,0.2)	;
}
#cssmenu > ul > li > a:hover {
  color: #ffffff;
}
#cssmenu ul > li.has-sub > a:after {
  position: absolute;
  right: 26px;
  top: 19px;
  z-index: 5;
  display: block;
  height: 10px;
  width: 2px;
  background: #ffffff;
  content: "";
  -webkit-transition: all 0.1s ease-out;
  -moz-transition: all 0.1s ease-out;
  -ms-transition: all 0.1s ease-out;
  -o-transition: all 0.1s ease-out;
  transition: all 0.1s ease-out;
}
#cssmenu ul > li.has-sub > a:before {
  position: absolute;
  right: 22px;
  top: 23px;
  display: block;
  width: 10px;
  height: 2px;
  background: #ffffff;
  content: "";
  -webkit-transition: all 0.1s ease-out;
  -moz-transition: all 0.1s ease-out;
  -ms-transition: all 0.1s ease-out;
  -o-transition: all 0.1s ease-out;
  transition: all 0.1s ease-out;
}
#cssmenu ul > li.has-sub.open > a:after,
#cssmenu ul > li.has-sub.open > a:before {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
}
#cssmenu ul ul li a {
  padding: 14px 22px;
  cursor: pointer;
  z-index: 2;
  font-size: 14px;
  text-decoration: none;
  color: #dddddd;
  background: #49505a;
  -webkit-transition: color .2s ease;
  -o-transition: color .2s ease;
  transition: color .2s ease;
}
#cssmenu ul ul ul li a {
  padding-left: 32px;
}
#cssmenu ul ul li a:hover {
  color: #ffffff;
}
#cssmenu ul ul > li.has-sub > a:after {
  top: 16px;
  right: 26px;
  background: #dddddd;
}
#cssmenu ul ul > li.has-sub > a:before {
  top: 20px;
  background: #dddddd;
}

#google_translate_element{margin-bottom: 15px;}
.goog-te-gadget .goog-te-combo {
    margin: 4px 0;
    padding: 4px;
    border-radius: 10px;}
.skiptranslate.goog-te-gadget{font-size:0;display: flex;flex-direction: column-reverse;}
.skiptranslate.goog-te-gadget span{_display:none;}
.goog-te-combo{font-size:13pt !important;width:100% !important;}
.VIpgJd-ZVi9od-l4eHX-hSRGPd{cursor:auto;color:#929292 !important;}
#goog-gt-tt {display:none !important}
.goog-te-banner-frame {display:none !important}
.goog-te-menu-value:hover {text-decoration:none !important}
body {top:0 !important}
#google_translate_element2 {display:none !important}
.skiptranslate {display:none;}




/*푸터*/
#footer{background:#282828;font-size:16px;clear:both;color:#d7d7d7;padding:20px 0;}
#footer .inner{position:relative;}
#footer .f_b_bottom{border-bottom:1px solid #666666;padding:30px 0;}
#footer .f_b_bottom a{color:#d7d7d7;}
#footer .f_b_bottom li{font-weight:200;float:left;margin-right:60px;}
.f_info_ad{font-size:26px;font-weight:bold;}
.f_info_list{font-size:14px;padding-top:20px;}
.f_info_list li{font-size:16px;}
.f_info_list li a{color:#d7d7d7;}
.f_info_ad{padding-top:30px;padding-bottom:10px;}
.copyr{font-size:12px;color:#999999;padding-bottom:50px;}
.f_logo_img{position:absolute;top:105px;right:0;display:flex;align-items: center;}
.f_logo_img span{font-size:18px;margin-top:5px;margin-left:10px;font-family:'GmarketSans', sans-serif !important;font-style: italic;
    font-weight: 500;}


#menuToggle{display:none;}
.s_box_mo{display:none;}



/*반응형*/

@media screen and (min-width: 1200px) and (max-width: 1400px){
	.inner{width:auto;}
}



@media screen and (min-width: 1052px) and (max-width: 1200px){
	.inner{width:auto;}
	#header .gnb_wrap .gnb-bg{top:131px;}
	#header .gnb{float:none;}
	.ko_en{position:absolute;right:0;top:0;}
	.con_title{padding-left:20px;}
	
}


@media screen and (min-width: 769px) and (max-width: 1052px){
	.inner{width:auto;}
	#header .gnb_wrap .gnb .menu{width:130px;}	
	#header .gnb_wrap .depth2{width:130px;}
	.con_title{padding-left:20px;}
	
}


@media screen and (min-width: 769px) and (max-width: 1000px){
	.inner{width:auto;}
	#header .gnb_wrap .gnb .menu{width:130px;}	
	#header .gnb_wrap .depth2{width:130px;}
	.con_title{padding-left:20px;}
	#header{height:auto;}
	#header .gnb{display:none;}
	#header .gnb_wrap{border:none;}
	#menuToggle{display:block;position: fixed;right: 20px;
    top: 18px;top: 25px;}
	#menu{padding-top:132px;}
	#menu #cssmenu>ul{border-top:1px solid rgba(255,255,255,0.2);}
	#header h1{padding-left:20px;}
	#header h1 a{background-size:70%;}
}



/* --- 768px --- */
@media screen and (max-width: 768px) {
	.inner{width:auto;}
	.gnb_wrap .inner{margin:0;}
	#header{height:auto;}
	#header h1{padding-top: 14px;}
	#header h1 a{width:100px;background-size:100%;height: 36px;}
	#header .login{font-size:14px;right:43px;top:7px;width:123px;}
    #header .login li{float:none;margin-bottom:3px;font-size:14px;}
	#header .login li a{color:#D09A13;}
	#header .login li .fa-user-cog{margin-right:4px;}
	#header .gnb_wrap{border:none;}
	#menuToggle{display:block;position: fixed;right: 20px;
    top: 18px;}
	#menu{padding-top:132px;}
	#menu #cssmenu>ul{border-top:1px solid rgba(255,255,255,0.2);}

	#header .gnb{height:auto;}
	#google_translate_element{margin-top: 7px;}
	
	
	/*푸터*/
	#footer{padding:0 20px;}
	#footer .f_b_bottom li{margin-right:15px;font-size:15px;}
	.f_info_list li{margin-bottom:10px;}
	.copyr{padding-bottom:30px;}
	.f_logo_img{position:static;text-align: center;margin-bottom:20px;}
	
	
	
}

