@charset "utf-8";
#wrap {}
#header {position:absolute; top:0; left:0; width:100%; height:auto; background:#f9f9f9; z-index:100}
#footer {clear:both; padding:20px 0px 50px 0px; background:#000;text-align:center;color:#AAAAAA}
#header.scroll {position:fixed; left:0; width:100%; background:rgba(255,255,255,.8)}
#header > .topbar {background:#444}
#header > .topbar > .inner {max-width:1400px; margin:0 auto; padding:0 50px}
#header > .topbar > .inner:after {clear:both; display:block; content:''}
#header > .topbar > .inner ul li {display:inline-block; font-size:12px; color:#aaa; line-height:40px}
#header > .topbar > .inner ul li a {font-size:12px; color:#aaa; transition:all .3s ease}
#header > .topbar > .inner ul li a:hover {font-size:12px; color:#eee}
#header > .topbar > .inner ul li i {margin-right:8px}
#header > .topbar > .inner .left {float:left}
#header > .topbar > .inner .right {float:right}
#header > .topbar > .inner .left ul li {margin-right:15px}
#header > .topbar > .inner .right ul li {margin-left:15px}
#header > .topbar > .inner .right ul li i {margin:0}
#header > .navbar {position:relative; max-width:1400px; height:70px; margin:0 auto; padding:0 50px}
#header > .navbar:after {clear:both; display:block; content:''}
#header h1 {float:left; width:100px;}
#header h1 img {display:block; width:100%}
#header .head_lang.pcmenu{
	margin-top:27px;
	background: #35161a;
	color: #fff;
	width: 64px;
}
#header .head_lang.mobilemenu{
	margin-top:17px;
	background: #35161a;
	color: #fff;
	width: 64px;
	height:40px;
	position:absolute;
}
#gnb_wrap {height:100%}
#gnb_wrap:after {clear:both; display:block; content:''}
#gnb_wrap a.gnb_top {display:none}
#gnb_wrap button {display:none}
#gnb {float:right; height:100%}
#gnb > li {position:relative; float:left; height:100%}
#gnb > li > a > span {position:relative; padding-bottom:10px}
#gnb > li > a > span:before {position:absolute; bottom:0; left:0; width:0; height:2px; content:''; background:#000; transition:all .4s ease}
#gnb > li:hover > a > span:before {width:100%}
/*#gnb > li.on > a > span:before {position:absolute; bottom:0; left:0; width:0; height:2px; content:''; background:#000; transition:all .4s ease;width:100%}
*/#gnb > li > a {display:block; position:relative; padding:25px 25px 0 25px; height:100%; font-family:'Montserrat'; color:#444; z-index:50}
#gnb > li > ul.submnu {display:none; position:absolute; top:69px; left:0; min-width:150px; padding:0 20px; border-bottom:1px solid #aaa; background:#fff; opacity:0; filter:alpha(opacity='0'); z-index:110}
#gnb > li.on > ul.submnu {display:block}
#gnb > li > ul.submnu li {position:relative; padding:5px 0; border-bottom:1px solid #eee}
#gnb > li > ul.submnu li:last-child {border-bottom:none}
#gnb > li > ul.submnu li:last-child:before {display:none}
#gnb > li > ul.submnu li:before {position:absolute; bottom:0; left:0; width:0; height:1px; content:''; background:#aaa; transition:all .3s ease}
#gnb > li > ul.submnu li:hover:before {width:100%}
#gnb > li > ul.submnu li:hover a{color:#333}
#gnb > li > ul.submnu li a {display:block; width:100%; height:100%; line-height:30px; color:#888}
#btnNav {display:none; position:absolute; top:20px; right:50px; width:40px; height:40px; border:none; border-radius:2px; background:#333; cursor:pointer; z-index:1000}
#btnNav span {position:absolute; display:block; left:10px; width:20px; height:2px; background:#fff; transition:all .4s ease}
#btnNav span.bar1 {top:12px}
#btnNav span.bar2 {top:18px}
#btnNav span.bar3 {top:24px}
#btnNav.active span.bar1 {top:18px; transform:rotate(45deg)}
#btnNav.active span.bar2 {display:none}
#btnNav.active span.bar3 {top:18px; transform:rotate(-45deg)}
#scrollTop {display:none; position:fixed; bottom:80px; left:0; width:100%; height:50px; z-index:100; pointer-events: none }
#scrollTop .inner {max-width:1400px; margin:0 auto; padding:0 50px; text-align:right}
#scrollTop .inner a {position:relative; display:inline-block; width:45px; height:45px; text-align:center; color:#fff; line-height:45px; border-radius:50%; background:#555; pointer-events: auto}
#scrollTop .inner a img {position:absolute;width:auto; top:35%; left:35%; transition:all .4s ease}
#scrollTop .inner a span {position:absolute; width:100%; top:0; left:50%; font-size:13px; font-weight:600; margin-left:-22px; line-height:45px; opacity:0; filter:alpha(opacity='0'); transform:rotate(-360deg); transition:all .4s ease}
#scrollTop .inner a.on img {opacity:0; transform:rotate(360deg)}
#scrollTop .inner a.on span {display:block; opacity:1; filter:alpha(opacity='100'); transform:rotate(0deg)}
#footer .inner {width:100%; margin:0 auto; padding:0 50px;}
#footer .inner:after {clear:both; display:block; content:''}
#footer .logo {float:left; padding-top:10px; width:120px}
#footer .logo img {display:block; width:100%}
#footer .info {float:left; margin-left:50px; color:#aaa;margin-left:152px;width: calc(100% - 153px);}
#footer .info:not(.foot){
	margin-left:152px;
}
#footer .info address {color:#aaa}
#footer .info ul li {display:inline-block; margin-right:10px; color:#aaa}
#footer .info ul li span {color:#ddd}
#footer .info p.copyright {color:#787878}
#footer a {color:#aaa}
#footer p {color:#aaa}
#footer .flex-jcsb{
	display:flex;
	justify-content: space-between;
}
#footer .pc_footer .xsolla-text{
	margin-top: 53px;
    color: #aaa;
}
#footer .mobile_footer .xsolla-text{
    color: #aaa;
}


#footer .logo{
    position: absolute;
}
#footer .info.foot {display:flex;width: calc(100% - 133px);height:auto;}
#footer .info.foot .foot_text{color:#fff;margin-right:10px;text-align: left;}
#footer .info.foot img{width:45%;}
#footer .info.foot .foot_img_wrap{padding-top: 20px;}
#footer .footer_menu{
	color:#fff;font-size:15px;
}
#footer .footer_menu a{
	color:#fff;font-size:15px;
}
#footer .policy_wrap{
	color:#fff;font-size:15px;
}
#footer .policy_wrap a{
	color:#fff;font-size:15px;
}
.center{
	text-align:center;
}
#footer .mobile_footer{
	display:none;
}
#footer .footer_table{
	width: 100%;
	margin: 14px 0px;
	border:1px solid #333;
	border-collapse : collapse;
	color:#aaa;
	background:#35161a
}
#footer .footer_table td{
	width: 16.6%;
	padding:5px;
	border:1px solid #333;
	border-collapse : collapse;
	color:#aaa;
}
#footer .footer_table td:nth-child(odd){
	text-align:center;
}

 #footer .info:not(.foot) {margin-left:170px;}

#footer .footer_menu_wrap ul li {display:inline-block; margin-right:10px; color:#aaa}
#footer .footer_menu_wrap ul li span {color:#ddd}
#footer .footer_menu_wrap ul.footer_menu li.menu{
	margin-right:0px;
}

@media screen and (min-width:1280px) {
 /* 상단 영역 */
 #gnb {margin-right:-25px}

}
@media (min-width: 1000px) and (max-width: 1400px){

}
@media screen and (max-width:1024px) {
	 #header > .topbar {display:none}
	 #header h1 {
		width:120px; 
		padding-top:10px;
		position: relative;
		display: inline-block;
		left: 50%;
		transform: translateX(-50%);
	}
	 #gnb_wrap {position:fixed; top:0; right:-270px; width:250px; height:100%; background:#fff; box-shadow:-2px 0 6px 0 rgba(0,0,0,.3); z-index:990;}
	 #gnb_wrap .gnb_top {position:relative; display:block !important; padding:0 0 0 25px; height:80px; font-size:16px; color:#fff; line-height:80px; background:#555}
	 #gnb_wrap .gnb_top span.nav-home {display:inline-block; width:17px; height:16px; margin-right:10px; vertical-align:-2px}
	 #gnb_wrap button {display:block; position:absolute; top:20px; right:50px; width:40px; height:40px; border:none; border-radius:2px; background:#333; cursor:pointer}
	 #gnb_wrap button span {position:absolute; display:block; left:10px; width:20px; height:2px; background:#fff; transition:all .4s ease}
	 #gnb_wrap button span.bar1 {top:12px}
	 #gnb_wrap button span.bar2 {top:18px}
	 #gnb_wrap button span.bar3 {top:24px}
	 #gnb_wrap button.active span.bar1 {top:18px; transform:rotate(45deg)}
	 #gnb_wrap button.active span.bar2 {display:none}
	 #gnb_wrap button.active span.bar3 {top:18px; transform:rotate(-45deg)}
	 #gnb {float:none}
	 #gnb > li {float:none; height:auto}
	 #gnb > li > a {height:auto; padding:15px 25px; font-size:16px; border-bottom:1px solid #dedede}
	 #gnb > li > a > span {padding:0}
	 #gnb > li > a > span:before {display:none}
	 #gnb > li > ul.submnu li:before {display:none}
	 #gnb > li.dropdown > a:before {position:absolute; display:block; width:2px; height:14px; right:31px; top:50%; margin-top:-7px; content:''; background:#aaa; transition:all .3s ease}
	 #gnb > li.dropdown > a:after {position:absolute; display:block; width:14px; height:2px; right:25px; top:50%; margin-top:-1px; content:''; background:#aaa}
	 #gnb > li.open > a:before {transform:rotate(90deg)}
	 #gnb > li > ul.submnu {display:none; position:static; width:100%; padding:0; background:#f6f6f6; opacity:1 !important; filter:alpha(opacity='100') !important; box-shadow:none}
	 #gnb > li > ul.submnu li {padding:0; border-color:#dedede}
	 #gnb > li > ul.submnu li a {font-size:15px; padding:10px 25px}
	 #gnb_mask {display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:#000; opacity:.6; filter:alpha(opacity='60'); z-index:200}
	 #btnNav {display:block; top:15px}
	 #footer .logo {float:none; margin:0 auto 30px auto; padding:0; text-align:center;position:relative}
	 #footer .info {float:none; margin:0; text-align:center;width:100%;}
	 #footer .info.foot {justify-content: space-evenly;    margin-top: 10px;}
	 #footer .mobile_footer{display:block}
	 #footer .pc_footer{display:none}
	 #footer .pc_view{display:none}
	#footer .footer_table{
		width: 100%;
		margin: 14px 0px;
		border:1px solid #333;
		border-collapse : collapse;
		color:#aaa;
		background:#35161a
	}
	#footer .footer_table td{
		width:65%;
		padding:5px;
		border:1px solid #333;
		border-collapse : collapse;
		color:#aaa;
	}
	#footer .footer_table td:first-child{
		width:35%;
		text-align:center;
	}
	#footer .copyright_wrap{
		color: #aaa;margin-top: 20px;
	}
	#footer .info:not(.foot) {margin-left:0px;}
	#footer .policy_wrap{
		text-align:center;
	}

}
@media screen and (max-width: 1135px){
	#footer .info.foot {
	}
}

@media screen and (max-width:640px) {
	#header > .navbar {padding:0 20px}
	#header h1 {
		text-align:center;
		position: relative;
		display: inline-block;
		left: 50%;
		transform: translateX(-50%);
	}
	#btnNav {top:15px; right:30px}
	#gnb_wrap button {right:20px}
	#scrollTop .inner {padding:0 20px}
	#footer {padding:30px 0}
	#footer .inner {padding:0 20px}
	#footer .logo {width:95px}
	#footer .info address, #footer .info p {font-size:12px}
	#footer .info.foot {margin:43px 0px 20px 0px;}
	#footer .info.foot .foot_text{font-size:10px;}
	#footer .info.foot img{width:30%;}
	#footer .footer_menu_wrap a{font-size:10px;}
	#footer .footer_menu_wrap{
		margin-left:0px
	}
}

.h_submenu{
	width:100%;height:150px;background: rgba(0,0,0,.3);    position: absolute;
    top: 70px;display:none;
}
.h_submenu .h_submenu_container{
	max-width: 1400px;
	margin: 0 auto;
    padding: 0 130px;
	position:relative;
	display: flex;
	margin-top: 11px;
}
.h_submenu .h_submenu_container .submenu_box .light_line{
	width:100px;
    position: absolute;
    top: -12px;

}
.h_submenu ul{
	width: 100px;
}
.h_submenu ul li{
	text-align:center;
    margin-bottom: 5px;
}
.h_submenu ul li a{
	color:#fff;
	text-align:center;
}

#footer .foot_lang{
	background: #35161a;
    border: 0px;
	color:#fff;
	position:absolute;
	right:0;
	top:4px;
	width:64px;
}
#footer .mobile_foot_lang_wrap{
	text-align:center;
	margin-bottom:10px;
}
#footer .foot_lang.mobile{
	background: #35161a;
    border: 0px;
	color:#fff;
	position:inherit;
    width: 87px;
    height: 40px;
    padding-left: 8px;
}
#footer .foot_lang option{
	background: #35161a;
	color:#fff;
}
.none{
	display:none !important
}