/* 탑메뉴 */

/* Mobile 환경 */
@media screen and (max-width:800px){
	#wrap > #top_menu{
		position:fixed;
		top:0px;
		left:0px;
		width:100%;
		height:80px;
		background-color:rgba(255, 255, 255, 0.95);
		z-index:200;
	}
	#wrap > #top_menu > #top_menu_content{
		width:100%;
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_local_wrap{
		display:none;
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_global_wrap{
		width:100%;
		height:80px;
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_global_wrap::before{
		position:absolute;
		top:80px;
		left:0px;
		display:block;
		width:100%;
		height:1px;
		background-color:#ddd;
		z-index:3;
		content:"";
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_global_wrap > #top_menu_global{
		position:relative;
		width:100%;
		margin-left:10px;
		margin-right:10px;
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_global_wrap > #top_menu_global > div#logo{
		position:absolute;
		top:25px;
		left:0px;
		height:100%;
		font-family:"고딕","HY견고딕","Impact";
		font-size:24px;
		text-align:left;
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_global_wrap > #top_menu_global > div#logo img{
		height:30px;
		vertical-align:middle;
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_global_wrap > #top_menu_global > div#logo font{
		color:#54a6f2;
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_global_wrap > #top_menu_global > div#top_menu_left{
		position:absolute;
		top:25px;
		right:20px;
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_global_wrap > #top_menu_global > div#top_menu_left img{
		height:22px;
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_global_wrap > #top_menu_global > ul{
		display:none;
	}
	#wrap > #top_menu.on > #top_menu_content > #top_menu_global_wrap > #top_menu_global{
	}
	#wrap > #top_menu.on > #top_menu_content > #top_menu_global_wrap > #top_menu_global > ul{
		position:fixed;
		top:60px;
		left:10px;
		display:block;
		width:calc(100% - 20px);
		height:calc(100% - 60px);
		font-size:18px;
		font-weight:500;
		text-align:center;
		overflow-Y:auto;
		z-index:5;
	}
	#wrap > #top_menu.on > #top_menu_content > #top_menu_global_wrap > #top_menu_global > ul > li{
		list-style:none;
	}
	#wrap > #top_menu.on > #top_menu_content > #top_menu_global_wrap > #top_menu_global > ul > li:last-child{
		margin-bottom:100px;
	}
	#wrap > #top_menu.on > #top_menu_content > #top_menu_global_wrap > #top_menu_global > ul > li a,
	#wrap > #top_menu.on > #top_menu_content > #top_menu_global_wrap > #top_menu_global > ul > li a:visited{
		color:#fff;
		text-decoration:none;
	}
	#wrap > #top_menu.on > #top_menu_content > #top_menu_global_wrap > #top_menu_global > ul > li a:hover{
		color:#e56850;
		text-decoration:none;
	}
	#wrap > #top_menu.on > #top_menu_content > #top_menu_global_wrap > #top_menu_global > ul > li > div.global_menu_title{
		color:#fff;
		font-weight:500;
		text-align:left;
		border-bottom:1px solid #111;
		padding-bottom:10px;
		margin-top:20px;
	}
	#wrap > #top_menu.on > #top_menu_content > #top_menu_global_wrap > #top_menu_global > ul > li > ul.global_sub_menu{
		font-size:0px;
		text-align:left;
		margin-top:-10px;
	}
	#wrap > #top_menu.on > #top_menu_content > #top_menu_global_wrap > #top_menu_global > ul > li > ul.global_sub_menu > li{
		display:inline-block;
		list-style:none;
		font-size:16px;
		font-weight:500;
		margin-top:5px;
		margin-right:10px;
	}
	#wrap > #top_menu.on > #top_menu_content > #top_menu_global_wrap > #top_menu_global > ul > li > ul.global_sub_menu > li a,
	#wrap > #top_menu.on > #top_menu_content > #top_menu_global_wrap > #top_menu_global > ul > li > ul.global_sub_menu > li a:visited{
		color:#aaa;
	}
	#wrap > #top_menu.on > #top_menu_content > #top_menu_global_wrap > #top_menu_global > ul > li > ul.global_sub_menu > li a:hover{
		color:#e56850;
	}
	#wrap > #top_menu.on > #top_menu_content > #top_memu_left_wrap{
		position:fixed;
		top:0px;
		left:0px;
		width:100%;
		height:100%;
		background-color:rgba(0, 0, 0, 0.9);
		z-index:3;
	}
	#wrap > #top_menu.on > #top_menu_content > #top_memu_left_wrap > .btn_close{
		display:block;
		width:100%;
		height:60px;
		background-image:url(/data/shop_img/btn_close.png);
		background-repeat:no-repeat;
		background-size:25px 25px;
		background-position:center center;
		background-color:#d81449;
		margin:0px auto 0px auto;
		cursor:pointer;
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_global_wrap > #top_menu_global > ul{
		display:none;
	}

	/* 사이드바 */
	#wrap > #side_bar{
		display:none;
	}
}

/* Tablet 환경 */
@media screen and (min-width:801px) and (max-width:1200px){
	#wrap > #top_menu{
		position:fixed;
		top:0px;
		left:0px;
		width:100%;
		height:135px;
		z-index:200;
	}
	#wrap > #top_menu > #top_menu_content{
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_local_wrap{
		position:relative;
		height:40px;
		line-height:40px;
		text-align:right;
		background-color:rgba(32, 38, 62, 0.9);
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_local_wrap > #top_menu_local{
		font-size:15px;
		margin-left:20px;
		margin-right:20px;
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_local_wrap > #top_menu_local a,
	#wrap > #top_menu > #top_menu_content > #top_menu_local_wrap > #top_menu_local a:visited,
	#wrap > #top_menu > #top_menu_content > #top_menu_local_wrap > #top_menu_local a:hover{
		color:#ddd;
		text-decoration:none;
	}		
	#wrap > #top_menu > #top_menu_content > #top_menu_local_wrap > #top_menu_local > ul{
		font-size:0px;
	}		
	#wrap > #top_menu > #top_menu_content > #top_menu_local_wrap > #top_menu_local > ul > li{
		display:inline-block;
		list-style:none;
		font-size:14px;
		padding:0 10px;
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_local_wrap > #top_menu_local > ul > li .admin{
		color:#4f9ce4;
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_local_wrap > #top_menu_local > ul > li .user{
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_global_wrap{
		width:100%;
		background-color:#e4e4e4;
		box-sizing:border-box;
		border-bottom:1px solid #ddd;
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_global_wrap > #top_menu_global{
		position:relative;
		height:100%;
		font-size:0px;
		margin-left:20px;
		margin-right:20px;
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_global_wrap > #top_menu_global > div#logo{
		display:inline-block;
		width:220px;
		height:100%;
		line-height:90px;
		font-family:"고딕","HY견고딕","Impact";
		font-size:24px;
		text-align:left;
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_global_wrap > #top_menu_global > div#logo img{
		height:40px;
		vertical-align:middle;
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_global_wrap > #top_menu_global > div#logo font{
		color:#54a6f2;
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_global_wrap::before{
		position:absolute;
		top:135px;
		left:0px;
		display:block;
		width:100%;
		height:1px;
		background-color:#aaa;
		/*z-index:3; 인덱스값 주면 마우스 오버시에 버그 발생함*/
		content:"";
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_global_wrap > #top_menu_global > ul{
		display:inline-block;
		width:calc(100% - 220px);
		height:100%;
		font-size:0px;
		margin-left:0px;
		vertical-align:top;
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_global_wrap > #top_menu_global > ul > li{
		display:inline-block;
		position:relative;
		list-style:none;
		width:12.5%;
		font-size:18px;
		font-weight:500;
		text-align:center;
		vertical-align:top;
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_global_wrap > #top_menu_global > ul > li.mobile{
		display:none;
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_global_wrap > #top_menu_global > ul > li a,
	#wrap > #top_menu > #top_menu_content > #top_menu_global_wrap > #top_menu_global > ul > li a:visited{
		color:#111;
		text-decoration:none;
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_global_wrap > #top_menu_global > ul > li a:hover{
		color:#e56850;
		text-decoration:none;
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_global_wrap > #top_menu_global > ul > li > div.global_menu_title{
		font-weight:bold;
		margin-top:35px;
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_global_wrap > #top_menu_global:hover{
		display:block;
		padding-bottom:30px;
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_global_wrap > #top_menu_global:hover ul.global_sub_menu{
		display:block;
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_global_wrap > #top_menu_global > ul > li > div.global_menu_title_bar{
		width:70%;
		border-bottom:3px solid #fff;
		margin:31px auto 0;
		opacity:0;
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_global_wrap > #top_menu_global > ul > li:hover > div.global_menu_title_bar{
		width:70%;
		border-bottom:3px solid #e56850;
		margin:31px auto 0;
		opacity:1;
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_global_wrap > #top_menu_global > ul > li > ul.global_sub_menu{
		display:none;
		width:100%;
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_global_wrap > #top_menu_global > ul > li > ul.global_sub_menu > li{
		list-style:none;
		line-height:20px;
		font-size:15px;
		font-weight:500;
		text-align:center;
		padding:5px 0px;
		overflow:hidden;
		opacity:1.0;
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_global_wrap > #top_menu_global > ul > li > ul.global_sub_menu > li:hover{
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_global_wrap > #top_menu_global > ul > li > ul.global_sub_menu > li:first-child{
		padding-top:30px;
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_global_wrap > #top_menu_global > ul > li > ul.global_sub_menu > li a,
	#wrap > #top_menu > #top_menu_content > #top_menu_global_wrap > #top_menu_global > ul > li > ul.global_sub_menu > li a:visited{
		color:#666;
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_global_wrap > #top_menu_global > ul > li > ul.global_sub_menu > li a:hover{
		color:#e56850;
	}

	/* 사이드바 */
	#wrap > #side_bar{
		display:none;
	}
}

/* PC 환경 */
@media screen and (min-width:1201px){
	#wrap > #top_menu{
		position:fixed;
		top:0px;
		left:0px;
		width:100%;
		min-width:1200px;
		height:135px;
		z-index:200;
	}
	#wrap > #top_menu > #top_menu_content{
		width:100%;
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_local_wrap{
		position:relative;
		height:40px;
		line-height:40px;
		text-align:right;
		background-color:rgba(32, 38, 62, 0.9);
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_local_wrap > #top_menu_local{
		width:1200px;
		font-size:15px;
		margin:auto;
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_local_wrap > #top_menu_local a,
	#wrap > #top_menu > #top_menu_content > #top_menu_local_wrap > #top_menu_local a:visited,
	#wrap > #top_menu > #top_menu_content > #top_menu_local_wrap > #top_menu_local a:hover{
		color:#ddd;
		text-decoration:none;
	}		
	#wrap > #top_menu > #top_menu_content > #top_menu_local_wrap > #top_menu_local > ul{
		font-size:0px;
	}		
	#wrap > #top_menu > #top_menu_content > #top_menu_local_wrap > #top_menu_local > ul > li{
		display:inline-block;
		list-style:none;
		font-size:14px;
		padding:0 10px;
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_local_wrap > #top_menu_local > ul > li .admin{
		color:#4f9ce4;
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_local_wrap > #top_menu_local > ul > li .user{
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_global_wrap{
		width:100%;
		background-color:#e4e4e4;
		box-sizing:border-box;
		border-bottom:1px solid #ddd;
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_global_wrap > #top_menu_global{
		position:relative;
		width:1200px;
		height:100%;
		font-size:0px;
		margin:auto;
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_global_wrap > #top_menu_global > div#logo{
		display:inline-block;
		width:200px;
		height:100%;
		line-height:90px;
		font-family:"고딕","HY견고딕","Impact";
		font-size:24px;
		text-align:left;
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_global_wrap > #top_menu_global > div#logo img{
		height:50px;
		vertical-align:middle;
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_global_wrap > #top_menu_global > div#logo font{
		color:#54a6f2;
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_global_wrap::before{
		position:absolute;
		top:135px;
		left:0px;
		display:block;
		width:100%;
		height:1px;
		background-color:#aaa;
		/*z-index:3; 인덱스값 주면 마우스 오버시에 버그 발생함*/
		content:"";
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_global_wrap > #top_menu_global > ul{
		display:inline-block;
		width:calc(100% - 200px);
		height:100%;
		font-size:0px;
		margin-left:0px;
		vertical-align:top;
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_global_wrap > #top_menu_global > ul > li{
		display:inline-block;
		position:relative;
		list-style:none;
		width:12.5%;
		font-size:18px;
		font-weight:500;
		text-align:center;
		vertical-align:top;
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_global_wrap > #top_menu_global > ul > li.mobile{
		display:none;
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_global_wrap > #top_menu_global > ul > li a,
	#wrap > #top_menu > #top_menu_content > #top_menu_global_wrap > #top_menu_global > ul > li a:visited{
		color:#111;
		text-decoration:none;
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_global_wrap > #top_menu_global > ul > li a:hover{
		color:#242951;
		text-decoration:none;
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_global_wrap > #top_menu_global > ul > li > div.global_menu_title{
		font-weight:bold;
		margin-top:35px;
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_global_wrap > #top_menu_global:hover{
		display:block;
		padding-bottom:30px;
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_global_wrap > #top_menu_global:hover ul.global_sub_menu{
		display:block;
		width:100%;
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_global_wrap > #top_menu_global > ul > li > div.global_menu_title_bar{
		width:70%;
		border-bottom:3px solid #fff;
		margin:31px auto 0;
		opacity:0;
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_global_wrap > #top_menu_global > ul > li:hover > div.global_menu_title_bar{
		width:70%;
		border-bottom:3px solid #242951;
		margin:31px auto 0;
		opacity:1;
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_global_wrap > #top_menu_global > ul > li > ul.global_sub_menu{
		display:none;
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_global_wrap > #top_menu_global > ul > li > ul.global_sub_menu > li{
		list-style:none;
		line-height:20px;
		font-size:15px;
		font-weight:500;
		text-align:center;
		padding:5px 0px;
		overflow:hidden;
		opacity:1.0;
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_global_wrap > #top_menu_global > ul > li > ul.global_sub_menu > li:hover{
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_global_wrap > #top_menu_global > ul > li > ul.global_sub_menu > li:first-child{
		padding-top:30px;
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_global_wrap > #top_menu_global > ul > li > ul.global_sub_menu > li a,
	#wrap > #top_menu > #top_menu_content > #top_menu_global_wrap > #top_menu_global > ul > li > ul.global_sub_menu > li a:visited{
		color:#666;
	}
	#wrap > #top_menu > #top_menu_content > #top_menu_global_wrap > #top_menu_global > ul > li > ul.global_sub_menu > li a:hover{
		color:#242951;
	}

	/* 사이드바 */
	#wrap > #side_bar{
		position:fixed;
		top:130px;
		right:0;
		z-index:2;
	}
}