/*상단 네비게이션*/
#head{position:absolute; z-index:10000; width:100%; background:rgba(0,0,0,0.7); height:110px; border-bottom:1px solid #fff; /*background:rgba(0,0,0,0.5); position:fixed; height:125px;*/}
/*#head:hover{transition:0.2s; background:rgba(255,255,255,1);}*/
#head .logo_area{/*height:50px;*/ position:relative; max-width:1300px;}
.top_logo{width:100%; padding:10px 0px 10px;}
.top_logo a{position:absolute;  width:174px;  height:32px; z-index:10002; left:20px; top:62px;  /*background:url(../images/common/logo.png); background-size:174px 32px !important;*/ /*top:69px;*/}
/*#head:hover .top_logo a{position:absolute; width:264px; height:44px; z-index:10003; background:url(../images/common/logo.png);}*/
.top_logo img{position:absolute; /*max-width:202px; max-width:140px; */ width:100%; z-index:10002;}

.top_icon_link_1{position:relative; top:-15px;}
.top_icon_link_2{position:relative; top:-17px;}

#head #top{width:100%; max-height:50px; border-bottom:1px solid #b7b7b7;}

#global_menu{position:absolute; z-index:10001; right:0px; background:#161616; width:100%; height:41px; top:0px;}
#global_menu .globalmenu{position:absolute; font-size:15px; color:#ccc; right:0px;}
#global_menu .globalmenu a{color:#bdbdbd;  /*font-size:13px;*/}

#global_menu .libar{padding:0px !important;  }
#global_menu .wrt{padding:0px !important; font-weight:500;}
#global_menu .wrt a{font-weight:500;}
#global_menu .wrt .wrt_btn{background:#000; padding:0px 10px;  position:relative; line-height:40px; top:0px; /*line-height:43px; top:-2px;*/}

#global_menu .globalmenu p{color:#888; margin:0px; font-size:15px;}
#global_menu .glblist li{display:inline-block; text-align:center; padding:5px 12px;}
#global_menu .glblist li a:link{text-decoration:none;}
#global_menu .pn_ico{padding-top:10px;}
#global_menu .glblist li.sns{padding:5px 5px;}

#skipNavi {height:0; position:absolute; top:0; left:0; width:100%; z-index:20000;}
#skipNavi .skipLink {position:absolute; top:-9999px; left:-9999px;}
#skipNavi .skipLink a{color:#fff;}
#skipNavi .skipLink:hover, #skipNavi .skipLink:focus, #skipNavi .skipLink:active {top:0;left:0;background:#174BA1;color:#fff;}

/*#head:hover{transition:0.2s; background:rgba(0,0,0,1);}*/
#head.fixed-gnb{position:fixed; width:100%; margin:0; top:0; /*height:105px;*/ background:#000;}

.top_ico{width:18px;}

.menuBtn {
    width:22px;
    height:22px;
    overflow:hidden;
    cursor:pointer;
}


.menuBtn span.bar {
    margin:0 auto;
    display:block;
    width:22px;
    height:2px;
    background-color:#fff;
    transition:0.3s;
}

/*#head:hover .menuBtn span.bar {
    background-color:#000;
}*/

.menuBtn span.bar:nth-child(1) {
    margin-top:1px;
}
.menuBtn span.bar:nth-child(2) {
    margin:6px 0px  6px auto;
	background-color:#8052c9;
	width:11px;
}

.menuBtn span.bar:nth-child(3) {
	background-color:#fff;
	width:11px;
	margin:6px 0px  6px auto;
}


/*#head:hover .menuBtn span.bar:nth-child(2) {
    margin:6px  auto 6px 0px;
	background-color:#4dd2c9;
	width:11px;
}*/

.join_box{position:relative; max-width:1200px; margin:0 auto;}

.top_searchbt{position:absolute; right:40px; top:-15px; z-index:10500; /*top:61px; top:64px;*/}

.depth2_morebt{border-radius:20px; border:1px solid #fff; background:rgba(255,255,255,0.2); padding:3px 10px; color:#fff; display:inline-block; text-align:center; font-size:14px; font-weight:400;}
.depth2_morebt:hover{background:#7742cc; border:1px solid #7742cc; font-size:15px;  color:#fff; padding:4px 11px; font-weight:500;}

.depth2_fmtp_1{color:#00aeef;}
.depth2_fmtp_2{color:#ff40b3;}

/* Desktop Device : 690이하 */
@media screen and (max-width:690px){
	
	.default_box_topnavi{position:relative; margin:0 20px;}

	#head .logo_area{/*height:90px;*/ height:75px;}

	.top_logo{padding:0px 0px 0px;}
	.top_logo a{/*left:20px; top:5px; background:url(../images/common/logo_m.png);  */ left:0px;}
	/*#head:hover .top_logo a{left:20px; top:25px; background:url(../images/common/logo_m.png); background-size:264px;}*/
	.top_logo .logo_web{display:none;}

	#head{min-width:370px; border-bottom:1px solid #ccc;}
	#header{display:none;}
	#header #navi{display:none;}

	.panel_bnt{display:none;}

	#panel_butt{position:relative; top:68px;}


	.globalmenu{/*display:none;*/}
	#global_menu .glblist li{display:inline-block; text-align:center; padding:5px 7px;}
	#global_menu .glblist li.sns{padding:5px 2px;}

	#global_menu .wrt .wrt_btn{padding:0px 2.5px;}

}



/* Desktop Device : 691 이상 1314 이하 */
@media screen and (min-width:691px) and (max-width:1314px){

	
	.default_box_topnavi{position:relative; margin:0 20px;}

	#head .logo_area{/*height:90px;*/ height:75px;}

	.top_logo{padding:0px 0px 0px;}
	.top_logo a{/*left:20px; top:5px; background:url(../images/common/logo_m.png); */ left:0px;}
	/*#head:hover .top_logo a{left:20px; top:25px;  background:url(../images/common/logo_m.png); background-size:264px;}*/
	

	#head{border-bottom:1px solid #ccc;}
	#header{display:none;}
	#header #navi{display:none;}

	.panel_bnt{display:none;}

	#panel_butt{position:relative; top:68px;}

	.globalmenu{/*display:none;*/}
	/*#global_menu .glb_mbl{display:none;}
	.globalmenu a{padding-left:0px; padding-right:0px;}
	.prg_bn{position:relative; top:-10px;}*/

}

/* Desktop Device : 1315 이상 프린트 사이즈 */
@media screen and (min-width:1315px), only print{

	#panel_butt {display:none;}

	#global_menu{/*right:30px;*/}
	.top_searchbt{top:35px;}

	.default_box_topnavi{position:relative; max-width:1340px; padding:0 20px; margin:0px auto;}
	.default_box_topnavi .depth2_box{margin-left:19%; position:relative; /*margin-left:10.5%;*/}

	/**/
	#global_menu .globalmenu{right:20px;}
	.top_logo a{margin:0px auto;}

	#head{/*overflow:hidden;*/}
	#header {position:absolute; z-index:100; width:100%; height:90px; overflow:hidden; top:20px; /*height:105px;*/}
	#header::after{
		display:block;
		content:'';
		position:absolute;
		top:59px;
		width:100%;
		height:0;
		background:#000;
		z-index:-1;
		transition:0.3s;
		color:#000;
	}

	#header #navi{clear:both; background:url(../images/common/top_bg.png); background-repeat:repeat-x; background-position:top center; overflow:hidden;}
	#header #navi .bt_menu{display:none;}
	#header #navi ul.depth1 {margin-left:19%;  position:relative;}
	#header #navi ul.depth1 li{color:#222; float:left; font-weight:normal; vertical-align:top; /*margin-right:8.4%;*/}
	#header #navi ul.depth1 li.on{/*background:url(../images/common/topmenu_on.png); background-repeat:repeat-x;*/}
	#header #navi ul.depth1 #sm1{width:14.3%;}
	#header #navi ul.depth1 #sm2{width:14.3%;}
	#header #navi ul.depth1 #sm3{width:14.3%;}
	#header #navi ul.depth1 #sm4{width:15.3%;}
	#header #navi ul.depth1 #sm5{width:15%;}
	#header #navi ul.depth1 #sm6{width:14.3%;}
	#header #navi ul.depth1 #sm7{width:8%;}
	/*#header #navi ul.depth1 #sm1{width:12%;}
	#header #navi ul.depth1 #sm2{width:12%;}
	#header #navi ul.depth1 #sm3{width:12%;}
	#header #navi ul.depth1 #sm4{width:16%;}
	#header #navi ul.depth1 #sm5{width:17%;}
	#header #navi ul.depth1 #sm6{width:15%;}
	#header #navi ul.depth1 #sm7{width:19%;}
	#header #navi ul.depth1 #sm8{width:17%;}*/


	#header #navi ul.depth1 li.bg_1{background:#f1f1f1; background-size:contain;}
	#header #navi ul.depth1 li.bg_2{background:#f1f1f1;}
	#header #navi ul.depth1 li a{width:100%; color:#fff; text-decoration:none;}
	#header #navi ul.depth1 li a div.depth1{font-size:18px;  width:100%; text-decoration:none; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; padding:45px 0px 24px; letter-spacing:-0.2px; font-weight:700;/*padding:53px 0px 24px;*/}
	#header #navi ul.depth1 li a div.depth1:hover,active{/*background:url(../images/common/topmenu_on.png); background-repeat:repeat-x;*/}
	#header #navi ul.depth1 li a:hover, #header #navi ul.depth1 li.on div a div.depth1{color:#8f83ff; text-decoration:none; text-decoration:none;}

	#header #navi .depth2_bar{border-left:1px solid #fff; height:100%; padding-top:8px; min-height:324px; margin-right:5px; /*min-height:754px;*/}
	#header #navi ul.depth2{min-height:754px; margin:10px 0px; background-attachment: scroll; background-repeat: repeat; background-position-x: 0%; background-position-y: 0%; background-size: auto;
		background-origin: padding-box; background-clip: border-box; font-weight:bold; display:inline-block;  vertical-align:top; /*margin-right:0.2%; width:13.7%;  float:left; width:10%;  width:8%;*/}
	#header #navi ul.depth2 h3{font-size:17px; margin:10px 0px 10px; font-weight:500;}
	#header #navi ul.depth2 a li{width:100%; text-align:left; /*background:url(../images/common/depth_liico.png) 0px 16px; background-repeat:no-repeat;*/} 
	#header #navi ul.depth2 a li p{padding:5px 5px 5px; margin:0px 0px 0px 5px; /*text-align:center;*/ line-height:140%; color:#fff; font-size:14px; font-weight:400 !important;}
	#header #navi ul.depth2 a li p:hover{font-size:16px; background:#eee; color:#6706d3; /*background:#7742cc;*/ text-decoration:none; font-weight:500 !important;}
	#header #navi ul.depth2 a:link{text-decoration:none;}
	#header #navi ul.depth2 li.tit{margin-left:5px;}
	#header #navi ul.depth2 li.tit p{color:#bcbcbc; font-size:14px; font-weight:500 !important; padding:5px 8px 5px 3px; margin:0px; background:rgba(0,0,0,0.3);/*padding:4px 8px 4px 3px; border-top:1px solid #fff; border-bottom:1px solid #fff;*/}
	
	#header #navi #depth2_4{/*width:15%;*/}
	#header #navi #depth2_5{/*width:14.5%;*/}
	#header #navi #depth2_7{/*width:8%;*/ margin-right:0px;}

	#header #navi ul.depth3 a li{background:url(../images/common/depth_liico.png) 0px 16px; background-repeat:no-repeat; width:100%; text-align:left; border-left:0px !important; } 
	#header #navi ul.depth3 a li p{padding:2px 14px 2px !important; margin:0px; /*text-align:center;*/ line-height:150%; color:#bcbcbc !important; font-size:12px !important; font-weight:400 !important;}
	#header #navi ul.depth3 a:link{text-decoration:none;}
	
	/*#header #navi ul.depth1 #sm1 ul.depth2 a li p{margin:6px 0px 5px 50px; }
	#header #navi ul.depth1 #sm2 ul.depth2 a li p{margin:6px 0px 5px 50px; }
	#header #navi ul.depth1 #sm3 ul.depth2 a li p{margin:6px 0px 5px 55px; }
	#header #navi ul.depth1 #sm4 ul.depth2 a li p{margin:6px 0px 5px 60px; }
	#header #navi ul.depth1 #sm5 ul.depth2 a li p{margin:6px 0px 5px 50px; }
	#header #navi ul.depth1 #sm6 ul.depth2 a li p{margin:6px 0px 5px 60px; }
	#header #navi ul.depth1 #sm7 ul.depth2 a li p{margin:6px 0px 5px 60px; }
	#header #navi ul.depth1 #sm8 ul.depth2 a li p{margin:6px 0px 5px 60px; }*/

	#header #navi ul.depth1 li ul.depth2 a li:hover,active{background-repeat:no-repeat; }	
	#header #navi ul.depth1 li ul.depth2 a li{display:block;}
	#header #navi ul.depth1 li ul.depth2 a li, #header #navi ul.depth1 li.on ul.depth2  a li{color:#fff;  text-decoration:none; font-size:15px;}
	#header #navi ul.depth1 li ul.depth2 a li:hover, #header #navi ul.depth1 li.on ul.depth2 a li.on{ color:#fff; /*text-decoration:underline;*/ }
	.depth2 li a{text-decoration:none;}
	
	.top_searchbt{right:0px;}

	.depth2_scroll{overflow-y:scroll; height:316px; /*height:284px;*/}

	
	#nav_menu_btn{}	
	.headermenu_close{background:#000; width:40px; height:40px; border-radius:80px; line-height:40px;  position:absolute; z-index:100; right:20px; top:130px; text-align:center; color:#fff;}
	#nav_menu_btn:focus-visible .headermenu_close{box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);}
	
}