/* =============================== */
/* ★ Sメニュー   start   */
/* =============================== */

	#my-menu-close:not(:target) {
	 display:none;
	}
	 
	#my-menu-close:target {
	 display:inline;
	}
	 
	#my-menu-close:target + #my-menu-list {
	 display:inline;
	}
	 
	#my-menu-close:target + #my-menu-open {
	 display:none;
	}
	 
	#my-menu-close:not(:target) ~ #my-menu-list {
	 display:none;
	}

/* =============================== */
/* ☆ Sメニュー   end   */
/* =============================== */


/* =============================== */
/* ★ ハンバーガーメニュー start   */
/* =============================== */


		nav.NavMenu{
			position: fixed; 	/*表示位置を固定*/
			z-index: 2;		/*重ね順を変更*/
			top: 0;		/*表示位置を指定*/		
			left: 0;	/*表示位置を指定*/
			background: #fff;/*背景を白にする*/
			color: #000;	/*文字色を黒にする*/
			text-align: center;		/*テキストを中央揃え*/
			width: 100%;	/*全幅表示*/
			transform: translateY(-100%);	/*ナビを上に隠す*/
			transition: all 0.6s;	/*アニメーションの時間を指定*/
			
		}

		nav.NavMenu ul{
			background: #ccc;	/*背景をグレーにする*/

			width: 100%;	
			margin: 0 auto;
			padding: 0;
		}

		nav.NavMenu ul li{
			font-size: 1.1em;
			list-style-type: none;
			padding: 0;
			width: 100%;
			border-bottom: 1px dotted #333;		
		}

		nav.NavMenu ul li:last-child{
			padding-bottom: 0;
			border-bottom: none;	/*最後のメニュー項目のみ下線を消す*/
		}

		nav.NavMenu ul li a{
			display: block;		/*クリックできる領域を広げる*/
			color: #000;
			padding: 1em 0;
		}
		
		nav.NavMenu.active{
			transform: translateY(0%);		/*ナビを表示する*/
		}

		.Toggle {
		    display: block;
		    position: fixed;    /* bodyに対しての絶対位置指定 */
		    right: 13px;
		    top: 12px;
		    width: 42px;
		    height: 42px;
		    cursor: pointer;
		    z-index: 3;
		}
		 
		.Toggle span {
		    display: block;
		    position: absolute;
		    width: 30px;
		    border-bottom: solid 3px #000;
		    -webkit-transition: .35s ease-in-out;	/*変化の速度を指定*/
		    -moz-transition: .35s ease-in-out;		/*変化の速度を指定*/
		    transition: .35s ease-in-out;		/*変化の速度を指定*/
		    left: 6px;
		}
		 
		.Toggle span:nth-child(1) {
		    top: 9px;
		}
		 
		.Toggle span:nth-child(2) {
		    top: 18px;
		}
		 
		.Toggle span:nth-child(3) {
		    top: 27px;
		}
		 
		/* 最初のspanをマイナス45度に */
		.Toggle.active span:nth-child(1) {
		    top: 18px;
		    left: 6px;
		    -webkit-transform: rotate(-45deg);
		    -moz-transform: rotate(-45deg);
		    transform: rotate(-45deg);
		}
		 
		/* 2番目と3番目のspanを45度に */
		.Toggle.active span:nth-child(2),
		.Toggle.active span:nth-child(3) {
		    top: 18px;
		    -webkit-transform: rotate(45deg);
		    -moz-transform: rotate(45deg);
		    transform: rotate(45deg);
		}




		#fade{
			display: none;
		}

/* =============================== */
/* ☆ ハンバーガーメニュー end     */
/* =============================== */


/* ==================== */
/* ★ g-menu start      */
/* ====================	*/

.g-menu{
padding-top:0.1em;padding-bottom:0.1em;margin:auto;text-align:center;
}

/* ----- flexmenu ----- */
.flexmenu01{
  display : -webkit-box;     /* old Android */
  display : -webkit-flex;    /* Safari etc. */
  display : -ms-flexbox;     /* IE10        */
  display : flex;

  width     : 100%;
  margin    :auto;

}


/* ----- 折り返す（左から右） ----- */
#mainmenu {
  -webkit-flex-wrap: wrap;          /* Safari etc. */
  -ms-flex-wrap    : wrap;          /* IE10        */
  flex-wrap        : wrap;
}

.flexmenu01 > div{
  margin     : 3px;
  padding:3px;
  min-width  : 100px;
  height     : 20px;
  text-align : center;
  line-height: 1em;
  background : #02683B;
  color:white;
}

/* ==================== */
/* ☆ g-menu end        */
/* ====================	*/




