@charset "utf-8";
.wrap_wrap_btn_menu{
	display: none;
}
.gnav{
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	align-items: stretch;
}
.gnav li{
	padding: 10px 20px 10px 20px;
}
.gnav li:last-child{
	background: #fff;
}
.gnav a{
	position: relative;
	display: block;
	color: #fff;
	text-decoration: none;
	font-size: 1.8rem;
	font-family: 'Yusei Magic', sans-serif;
}
.gnav li:last-child a{
	color: #261211;
	font-weight: 700;
}
.gnav li .material-symbols-outlined{
	vertical-align: -5px;
}
#page_top{
	width: 40px;
	height: 40px;
	position: fixed;
	right: 10px;
	bottom: 10px;
	border-radius: 50px;
	background: #ee841d;
	opacity: 1;
	transition: .5s;
	z-index: 100;
}
#page_top a{
	position: relative;
	display: block;
	width: 40px;
	height: 40px;
	text-decoration: none;
	color: #fff;
	text-align: center;
	z-index: 10;
}
#page_top .material-icons-outlined{
	padding-top: 6px;
}

/*hover*/
@media (hover: hover) and (pointer: fine) {
	.gnav a:hover{
		color: #d2751b;
	}
	.gnav li:last-child a:hover{
		color: #d2751b;
	}
	.gnav a:hover::after{
		opacity: 1;
	}
	#page_top:hover{
		opacity: 1;
	}
	#page_top:hover{
		border-radius: 50px;
		background: #d2751b;
	}
}

@media screen and (max-width: 900px){
	.gnav li{
		padding: 10px 10px 10px 10px;
	}
	.gnav a{
		font-size: 1.6rem;
	}
}

@media screen and (max-width: 768px){
	.wrap_wrap_btn_menu{
		position: fixed;
		right: 0;
		top: 0;
		z-index: 10000;
		display: block;
		cursor: pointer;
	}
	.wrap_btn_menu{
		position: relative;
		background:#fff;
		cursor: pointer;
		width: 70px;
		height:70px;
		/*overflow: hidden;*/
	}
	.btn_menu span{
		display: inline-block;
		transition: all .4s;
		position: absolute;
		left: 15px;
		height: 3px;
		border-radius: 10px;
		background: #261211;
		width: 60%;
		cursor: pointer;
	}
	.btn_menu span:nth-of-type(1){
		top: 20px;
	}
	.btn_menu span:nth-of-type(2){
		top: 33px;
	}
	.btn_menu span:nth-of-type(3){
		top: 46px;
	}
	.btn_menu.active{
		transform: rotateX(360deg);
	}
	.wrap_btn_menu.active span:nth-of-type(1){
		top: 20px;
		transform: translateY(15px) rotate(-135deg);
	}
	.wrap_btn_menu.active span:nth-of-type(2){
		opacity: 0;
	}
	.wrap_btn_menu.active span:nth-of-type(3){
		top: 46px;
		transform: translateY(-11px) rotate(135deg);
	}
	.nav{
		position: fixed;
		top: 0;
		right: -100%;
		z-index: 9000;
		width: 100%;
		max-width: 350px;
		height: 100%;
		background: #a7662e;
		transition: all .6s;
		/*overflow-y: auto;*/
	}
	.nav.active{
		right: 0;
	}
	.gnav{
		margin-top: 60px;
		overflow: auto;
	}
	.gnav li{
		padding: 20px 0;
	}
	.gnav li:last-child{
		padding: 20px 0;
	}
	.gnav li{
		position: relative;
		width: 100%;
		display: inline-block;
	}
	.gnav a{
		width: 100%;
		text-align: center;
		color: #fff;
		/*overflow: hidden;*/
		font-size: 1.8rem;
		transition:all .2s ease-out;
	}
}
@media screen and (max-width:480px){
	.nav{
		max-width: initial;
	}
}