/*###### mbl_header #########*/
#mbl_header {width:100%; position:absolute; top:0; background-color:#fcfcfc;  display:none; z-index: 100;}
#mbl_header > .inner {height:100%; z-index:1;}
	/*로고*/
	#mbl_logo {width:100%; position:relative; float:left; text-align:center; padding:10px 0; z-index:1; border-bottom:1px solid #dedede;}
	#mbl_logo a img {height: 40px;}
	/*###메인메뉴###*/
	#menu_btn {position:absolute; top:10px; left:30px; cursor:pointer; z-index:1000; display: none;}

		/*메인카테고리*/
		#mbl_gnb {position: fixed; width: 240px; z-index: 1000; height: 100%; background: #ffffff; left: -240px; overflow:scroll; top:10px;}

		#mbl_gnb .m_logo{text-align:center; margin: 20px 0;}

		#mbl_gnb .m_logo img{height:40px;}

		#mbl_gnb .m_join{background-color:#eaeaea; width:100%; height:50px; text-align:center;}
		#mbl_gnb .m_join .join_button_group{width:100%;  padding-top:13px;}
		#mbl_gnb .m_join .join_button_group a{text-align:center; padding:3px 20px; display:inline-block;}
		#mbl_gnb .m_join .join_button_group .m_login {width:40%;background-color:#b788ad; margin-right:0; color:#ffffff;}
		#mbl_gnb .m_join .join_button_group .m_joinin{width:40%;background-color:#ffffff; margin-left:0;}

		#mbl_gnb .m_menu > ul > li{color:#474747; font-size:14px; border-bottom:1px solid #e8e8e8; padding:8px 0 8px 14px;}
		#mbl_gnb .m_menu ul li:hover{color:#6b1686;}

		#mbl_gnb .m_menu_footer{background-color:#bfd36b;}
		#mbl_gnb .m_menu_footer .tal_area{padding:10px 0 10px 5px;}
		#mbl_gnb .m_menu_footer .tal_area img{margin-top:-10px;}
		#mbl_gnb .m_menu_footer .tal_area span{font-size:24px; font-weight:bold; margin-left:10px; color :#2f3028;}
		#mbl_gnb .m_menu_footer .tal_area p{font-size:11px; color:#f5f5f5; margin-top: 10px;}


	/*#mbl_gnb {position:relative;float:left; width:100%; z-index:20; display:none;}
		#mbl_gnb > ul {position:relative; width:100%;}
		#mbl_gnb > ul > li {float:left; position:relative; width:100%;}
		#mbl_gnb > ul > li > a {
			border-bottom:1px solid #dedede; background-color:#fcfcfc; width:100%; text-indent:10%; font-size:16px; height:35px; line-height:35px;
			float:left; background-color:#fcfcfc; font-weight:bold;}
		#mbl_gnb > ul > li > a:hover {font-weight:bold; color:#6e4e78;}
		*/
		/*서브카테고리
		ul.mbl_sub_gnb {position:relative; display:block; padding:10px 0 10px 32px; clear:both; display:none; border-bottom:1px solid #dedede; background-color:white; padding-left:12%;}
		ul.mbl_sub_gnb > li > a {font-size:14px; height:30px; line-height:30px; white-space:nowrap; width:100%; z-index:1; }
		ul.mbl_sub_gnb > li > a:hover {color: #6e4e78;}
		*/
		ul.mbl_sub_gnb {display: none; margin-top: 5px;}
		ul.mbl_sub_gnb > li {border-bottom: 1px solid #e8e8e8; padding: 3px 0;}
		ul.mbl_sub_gnb > li:last-child {border-bottom: 0;}
		ul.mbl_sub_gnb > li > a {font-size: 13px; padding-left: 5px; color: #949494;}
	/* 모바일메뉴 오버레이 */
	.pm_overlay {
	width: 100%;
	height: 100%;
	padding: 0;
	margin: 0;
	position: fixed;
	z-index: 500;
	background: rgba(0,0,0,0.5);
	left: 0;
	top: 0;
	animation: fadeOut .5s both ease;
	-webkit-animation: fadeOut .5s both ease;
	-moz-animation: fadeOut .5s both ease;
	}
	.pm_overlay.pm_show {
	display: block;
	animation: fadeIn .3s both ease;
	-webkit-animation: fadeIn .3s both ease;
	-moz-animation: fadeIn .3s both ease;
	}
	.pm_overlay.pm_hide {display: none;}

	/* 햄버거 메뉴 */
#menu_btn > div {
background: #bfd36b;
padding: 5px;
width: 40px; 
height: 40px;
font-size: 0;
text-indent: -9999px;
position: relative;
-webkit-transition: background .3s;
transition: background .3s;
display: block;
overflow: hidden;
margin-left:-12px;
}
#menu_btn > div > span {
-webkit-transition: background 0s .3s;
transition: background 0s .3s;
display: block;
position:absolute;
width: 24px;
top: 18px;
left: 8px;
height: 3px;
background: #ffffff;
}

#menu_btn > div > span:before, #menu_btn > div > span:after {
	position: absolute;
	display: block;
	left: 0;
	height: 3px;
	background: #ffffff;
	width: 24px;
	content: '';
	transition-duration: .3s, .3s;
	-webkit-transition-duration: .3s, .3s;
	transtion-delay: .3s, 0s;
	-webkit-transition-delay: .3s, 0s;
}

#menu_btn > div > span:before {top: -8px; transition-property: top, transform; -webkit-transition-property: top, transform; }


#menu_btn > div > span:after {bottom: -8px; transition-property: bottom, transform; -webkit-transition-property: bottom, transform;}

/* 눌렀을때 */
#menu_btn > div.is-active {background-color: #7c8945;}
#menu_btn > div.is-active > span {background: 0 0;}

#menu_btn > div.is-active > span:before, #menu_btn > div.is-active > span:after {
	transition-duration: .3s, .3s;
	-webkit-transition-duration: .3s, .3s;
	transtion-delay: 0s, .3s;
	-webkit-transition-delay: 0s, .3s;
}

#menu_btn > div.is-active > span:before {top: 0; transform: rotate(45deg); -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg);} 
#menu_btn > div.is-active > span:after {bottom: 0; transform: rotate(-45deg); -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg);}