
/*----------------------------------
ハンバーガーメニュー用
-----------------------------------*/
@media only screen and  (max-width: 600px) {

	header .inner nav {
		position: fixed;
		top: 0;
		bottom: 0;
		right: 0;
		left: 0;
		visibility: hidden;
		opacity: 0;
		transition: 0.5s;
		background-color: rgba(44, 52, 55, 0.99); 
		z-index:10;
	}

	header .inner nav ul {
		position: absolute;
		top: 0vh;
		left:0
		transform: translateY(-50%);
		flex-direction: column;
		width: 100%;
		text-align: center;
	}

	header .inner nav ul li {
		margin-bottom: 2vw;
	}

	header .inner nav ul li a {
		font-size: 4.0vw;
	}

	header .inner nav .sp_nav_sns {
		position: absolute;
		bottom:25vw;
		width:30vw;
		left:calc(50% - 15vw);
		border-top:1px #dfff solid;
		padding-top: 5vw;
	}

	header .inner nav .sp_nav_sns a{
		box-sizing: border-box;
		margin:0 2vw;
		display: block;
	}

	header .inner nav .sp_nav_sns a img{
		width:10vw;
	}


	.btn-trigger {
		position: absolute;
		top: -20.8vh;
		right: 4vw;
		width: 36px;
		height: 28px;
		transform: translateY(-50%);
		cursor: pointer; 
	}

	.btn-trigger span {
		position: absolute;
		left: 0;
		width: 100%;
		height: 2px;
		background-color: #fff;
		border-radius: 2px; 
	}

	.btn-trigger, .btn-trigger span {
		display: inline-block;
		transition: all .5s;
		box-sizing: border-box; 
	}

	.btn-trigger span:nth-of-type(1) {
		top: 0; 
	}

	.btn-trigger span:nth-of-type(2) {
		top: 12px;
	}

	.btn-trigger span:nth-of-type(3) {
		bottom: 0; 
	}



	#btn03.active {
	  -webkit-transform: rotate(360deg);
	  transform: rotate(360deg);
	  z-index: 11;

	}
	#btn03.active span:nth-of-type(1) {
	  -webkit-transform: translateY(12px) rotate(-45deg);
	  transform: translateY(12px) rotate(-45deg);
	  
	}
	#btn03.active span:nth-of-type(2) {
	  -webkit-transform: translateY(0) rotate(45deg);
	  transform: translateY(0) rotate(45deg);
	 
	}
	#btn03.active span:nth-of-type(3) {
	  opacity: 0;
	}

}

@media only screen and  (min-width:601px) {
  .btn-trigger {
    display: none; } 
}
