/*----------▽ 0px以上  */
@media screen and (min-width: 0px){

	#header{
		position: sticky;
		top: 0;
		background-color:  rgba(255,255,255,0.9);
		z-index: 3;
	}
	#menu{
		display: flex;
		justify-content: space-between;
		align-items: flex-end;
		margin: 0.3em 0.5em 0 0.5em;
		padding-bottom: 0.3em;
		font-size: 0.8em;
	}
	#menu a{
		text-decoration: none;
		background-color: inherit;
		color: #333;
	}
	#logo img{
		width: 15vw;
		vertical-align: bottom;
	}
	#logo{
		display: flex;
		align-items: flex-end;
		font-size: 3vw;
	}
	#logoText{
		display: block;
	}
	#contact{
		margin-right: 0.5em;
		margin-bottom: 0.3em;
	}

	#navToggle{
		position: absolute;
		top: 0;
		right: 0;
		width: 20vw;
		height: 14vw;
		z-index: 100;
		background-color: rgba(255,255,255,0.7);
		border-radius: 50%;
	}
	#navToggle span{
		display: block;
		position: absolute;
		height: 2px;
		width: 56%;
		transition: 0.35s 0s ease-in-out;
		left: 0;
		right: 0;
		margin: auto;
		border-radius: 2px;
		filter: drop-shadow(0.1rem 0.1rem 0.1rem #aaa);
	}
	#navToggle.is_gray span{
		/*background-color: #666;*/
	}
	#navToggle span:nth-child(1){
		top: 3vw;/*15px;*/
		background-color: #4badef;
	}
	#navToggle span:nth-child(2){
		top: 6vw;/*23px;*/
		background-color: #4badef;
	}
	#navToggle span:nth-child(3){
		top: 9vw;/*31px;*/
		background-color: #4badef;
	}
	#navToggle span:nth-child(4){
		top: 10vw;/*33px;*/
		font-size: 2.5vw;
		color: #1a1406;
	}
	#navToggle.open span{
		background-color: #666;
	}
	#navToggle.open span:nth-child(1){
		top: 28px;
		transform: rotate(315deg);
	}
	#navToggle.open span:nth-child(2){
		opacity: 0;
	}
	#navToggle.open span:nth-child(3){
		top: 28px;
		transform: rotate(-315deg);
	}
	#navToggle.open span:nth-child(4){
		opacity: 0;
	}


}
/*--▽ 768px超過 */
@media screen and (min-width: 769px){


	.tcy{/* 縦中横 */
		text-combine-upright: all;
	}
	.material-icons.md-24 { vertical-align: baseline !important; }
	#menu a{
		font-size: 1.1em;
	}
	#menu{
		display: flex;
		justify-content: space-between;
		align-items: flex-end;
		margin: 0.3em 0.5em 0 1em;
		padding-bottom: 0.3em;
		font-size: 0.9em;
		transition: all 1s 1s ease;
	}
	#logo img{
		width: 3vw;
		vertical-align: bottom;
	}
	#logo{
		font-size: 1vw;
		margin-left: 30vw;
		transition: margin-left 2s 0.5s ease;
	}
	#logoText{
		display: inline;
	}
	.show #logo{
		margin-left: 5vw;
		transition: margin-left 2s 0.5s ease;
	}
	#contact{
		margin-right: 30vw;
		transition: margin-right 2s 0.5s ease;
	}
	.show #contact{
		margin-right: 5vw;
		transition: margin-right 2s 0.5s ease;
	}



	#navToggle{
		top: 5px;
		width: 13vw;
		height: 6vw;
		cursor: pointer;
	}
	#navToggle span{
		width: 80px;
	}
	#navToggle span:nth-child(1){
		top: 20px;
	}
	#navToggle span:nth-child(2){
		top: 44px;
	}
	#navToggle span:nth-child(3){
		top: 68px;
	}
	#navToggle span:nth-child(4){
		display: none;
	}
	#navToggle.open span{
		background-color: #666;
	}
	#navToggle.open span:nth-child(1){
		top: 40px;
		transform: rotate(315deg);
	}
	#navToggle.open span:nth-child(2){
		opacity: 0;
	}
	#navToggle.open span:nth-child(3){
		top: 40px;
		transform: rotate(-315deg);
	}


}