#global-header
	{
		color: #fff; font-size: 20px; width: 100%; height: 100px;
		
		&::before{
			content:''; display:block;  width:100%; height:100%;
			position:absolute; top:0; left:0; z-index: -1; transition:.3s;
		}

		.wrap{
			position:relative; z-index: 1;
		}
	}
	/* 一定のスクロール後に固定ヘッダーのスタイルを変更する場合 */
	#global-header.scroll-change{
		transition:.3s;

		&::before{
			background:rgba(129,110,60,.75); filter: brightness(0.7);
		}
	}
	/* グローバルメニューが開かれている状態の固定ヘッダー */
	body.global-menu-active #global-header
	{
		background:var(--black);
		/* 固定ヘッダーの高さがある状態で、かつ、固定ヘッダーを無視してグローバルメニューを全画面表示させる場合に指定 */
		/* height: 0px; */
	}

	/* グローバルメニューの幅と背景色を設定 */
	#global-menu,
	body.iphone-access #global-menu,
	body.android-access #global-menu
	{
		/* background-color: #ecdef7; */
		width: 100%;
		/*width: 400px;*/
	}
	/* グローバルメニューの高さを設定（任意） */
	#global-menu > nav
	{


	}


@media screen and (min-width:768px){
#global-menu {display:none !important;}
	.global-menu-btn{
		opacity: 0; pointer-events: none;
	}
}

@media screen and (max-width:768px){
	.global-menu-btn{
		width:70px; height:70px; background:url(../images/btnBG.jpg); background-size:cover;
		position:absolute; top:0; right:0; z-index: 1000;
		display:flex; align-items: center; justify-content: center;

		.bar{
			width:45%; height:3px; background:var(--black); position:relative; transition:.35s;

			&::before,
			&::after{
				content:''; width:100%; height:100%; position:absolute; left:0; background:var(--black);
				transition:.2s;
			}
			&::before{
				top:-2.5vw;
			}
			&::after{
				bottom:-2.5vw;
			}
		}

		&.active{
			.bar{
				transform:rotate(45deg);

				&::before{
					opacity:0;
				}
				&::after{
					bottom:0; transform:rotate(90deg);
				}
			}
		}
	}/*global-menu-btn*/
}