/* ==========================================================================
   PC Layout
============================================================================= */
#navigation{
	padding: 0;
	font-size:0;
}

#navigation ul{
	list-style-type: none;
	margin: 0;
	padding: 0;
	background:url(../images/sideL_bg_m.png) repeat-y left center;
}

#navigation ul li{
	margin: 0 0 0 17px;
	padding: 0;
	font-size:0;
}


#menu01 a {
	display: block;
 	overflow: hidden;
	width:207px;
	height:52px;
	background-image: url(../images/navi01.png);
	text-indent:-9999px;
}

#menu01 a:hover {
	background-image: url(../images/navi01_on.png);
}


#menu02 a{
	display: block;
 	overflow: hidden;
	width:207px;
	height:52px;
	background-image: url(../images/navi02.png);
	text-indent:-9999px;
}

#menu02 a:hover {
	background-image: url(../images/navi02_on.png);
}

#menu03 a{
	display: block;
 	overflow: hidden;
	width:207px;
	height:52px;
	background-image: url(../images/navi03.png);
	text-indent:-9999px;
}

#menu03 a:hover {
	background-image: url(../images/navi03_on.png);
}

#menu04 a{
	display: block;
 	overflow: hidden;
	width:207px;
	height:52px;
	background-image: url(../images/navi04.png);
	text-indent:-9999px;
}

#menu04 a:hover {
	background-image: url(../images/navi04_on.png);
}

#menu05 a{
	display: block;
 	overflow: hidden;
	width:207px;
	height:52px;
	background-image: url(../images/navi05.png);
	text-indent:-9999px;
}

#menu05 a:hover {
	background-image: url(../images/navi05_on.png);
}

#menu06 a{
	display: block;
 	overflow: hidden;
	width:207px;
	height:52px;
	background-image: url(../images/navi06.png);
	text-indent:-9999px;
}

#menu06 a:hover {
	background-image: url(../images/navi06_on.png);
}

#menu07 a{
	display: block;
 	overflow: hidden;
	width:207px;
	height:52px;
	background-image: url(../images/navi07.png);
	text-indent:-9999px;
}

#menu07 a:hover {
	background-image: url(../images/navi07_on.png);
}


#menu08 a{
	display: block;
 	overflow: hidden;
	width:207px;
	height:52px;
	background-image: url(../images/navi08.png);
	text-indent:-9999px;
}

#menu08 a:hover {
	background-image: url(../images/navi08_on.png);
}


#toggle{ display: none; }







/* ==========================================================================
   Mobile Layout
============================================================================= */
@media screen and (max-width: 736px) {

#navigation{
	float: none;
	width: 100%;
	background: #8bbe21;
}

#menu { display: none; position: relative; }

#menu:after {
	position: absolute;
	content:"";
	bottom: 0;
	left: 0;
	width: 100%;
	background: #8bbe21;
}

#navigation ul{
	background: #8bbe21;
	}

#navigation ul:before,
#navigation ul:after{
	content: "";
	display: table;
}

#navigation ul:after{ clear: both; }

#navigation ul{ *zoom: 1; }

#navigation ul li{
	border-top: 1px solid #2b3a0a;
	margin-left:0px;
}

#navigation ul li a{
	text-align: center;
	padding: 13px 0px;
}

#navigation ul li a:hover{ background: #677c3a; }


#menu01 a,
#menu02 a,
#menu03 a,
#menu04 a,
#menu05 a,
#menu06 a{ 
	width:auto;
	height:auto;
	text-indent:0;
	background-image: none;
	color:#FFFFFF;
	font-size:14px;
}


#toggle{
	display: block;
	position: relative;
	width: 100%;
	background: #8bbe21;
}

#toggle a{
	display: block;
	position: relative;
	padding: 15px 0 10px 0;
	color: #fff;
	text-align: center;
	text-decoration: none;
	font-size:17px;
	font-weight: bold;
}

#toggle:before{
	display: block;
	content: "";
	position: absolute;
	top: 50%;
	left: 10px;
	width: 20px;
	height: 20px;
	margin-top: -10px;
	background: #fff;
}

#toggle a:before, #toggle a:after{
 	display: block;
	content: "";
	position: absolute;
	top: 50%;
 	left: 10px;
 	width: 20px;
	height: 4px;
	background: #8bbe21;
}

#toggle a:before{ margin-top: -6px; }
#toggle a:after{ margin-top: 2px; }

#menu .sideL_t,
#menu .sideL_b {
	display: none;
}















}