@charset "utf-8";

.gnbWrap{position: relative;overflow: visible;height: 100%;}
#menuBtn{
	position: absolute;
	width: 75px;
	height: 109px;
	top: 90px;
	left:11px;
	background: none;
    
}
#menuBtn button{
	display: block;
	width: 100%;
	height: 100%;


	background:url(../../img/menu/btn_off.png) 0 0 no-repeat;
}
#menuBtn .in{
	background:url(../../img/menu/btn_on.png) 0 0 no-repeat;
}
#menus{
    border: 1px solid skyblue;
	padding-top: 55px;
	position: absolute;
	width: 313px;
	height: 340px;
	left: 85px;
	top:70px;
	background: rgba(255,255,255,0.7);
    border-bottom-left-radius: 20px;
    border-top-left-radius: 20px;
	display: none;
}
#menus>ul>li>button{
	display:block;
	width: 298px;
	height: 40px;
	color:dodgerblue;
	padding-left: 10px;
	margin-left: 8px;
	font-size: 20px;
	font-weight: bold;
	text-align: left;
	border-bottom: 1px;
	background: none;
	letter-spacing: 0px;
	line-height: 44px;
	font-family: "Nanum Barun Gothic";
	/*background: url(../../img/menu/start.png) 220px center  no-repeat;*/
}

#menus>ul>li>ul>li>button:hover{
    transition: 0.5s;
    transform: translateX(20px);
color: dodgerblue;}
    
#menus>ul>li>ul>li>button{
	display:block;
	width: 258px;
	height: 40px;
	color: #3a4451;
	padding-left: 35px;
	margin-left: 28px;
	font-size: 18px;
	letter-spacing: 1px;
	text-align: left;
	font-weight: bold;
    border-bottom: 1px dashed ;
	line-height: 44px;
	border-image: linear-gradient(to right, white 0%, skyblue 50%, white 100%);
    border-image-slice: 1;
	background: none;
	font-family: "Nanum Barun Gothic";
	/*background: url(../../img/menu/start.png) 220px center  no-repeat;*/
}
/*#menus li.com button{background: url(../../img/menu/com.png) 220px center  no-repeat;}
#menus li.ing button{background: url(../../img/menu/ing.png) 220px center  no-repeat;}*/



#menus>ul>li.on>button{
    margin-left: 28px;
    font-size: 25px;
    letter-spacing: 5px;
	text-shadow: -1px 0 dodgerblue, 0 1px dodgerblue, 1px 0 dodgerblue, 0 -1px dodgerblue;
	color:white;
	font-family: "Nanum Barun Gothic";
}
#menus>ul>li>ul>li.on>button{
	border-bottom: 1px solid dodgerblue;
	color:teal;

	font-family: "Nanum Barun Gothic";
    background: url(../../img/menu/start.png) 0px center  no-repeat;
}
#menus ul li{
	display: block;
	text-align: left;

}

.state{
	width: 100%;
	text-align: center;
	margin-top: 50px;
}
