@charset "utf-8";


/*header nav {PC用-文字の位置 右上
	position: absolute;
	right: 0;
}*/
/*header ul {PC用-メニュー横並び
	display: flex;
	padding: 15px 15px;
} */
/*header li {PC用-文字の位置
	padding: 15px 15px;
} */
/*header a {PC用-文字の色など
	color: ;
}*/


/* 750px以下 CSS
@media screen and (max-width: 750px) {
	header li {
	padding: 10px 5px;
	}
} */


/* 481px以上 CSS */
@media screen and (min-width: 481px) {
	header {
		display: none;
	}
}

/* 480px以下 CSS */
@media screen and (max-width: 480px) {
	header nav {
		background: hsla(0, 100%, 100%, 0.85);
		position: fixed;
		z-index: 1;
		display: none;
		width: 100%;
		top: -15px;/*メニューの位置*/
	}
	header nav ul {
		display: block;
		padding: 70px 0 12rem 0;
	}
	header nav li {
		font-size: 0.85rem;
		padding: 20px;
		color: #606060;
		border-bottom: 1px solid rgba(118, 123, 133, 0.3);
		text-align: center;
	}
	header nav a {
		color: #333;
		font-weight: normal;
		text-shadow: none;
		text-decoration: none;
	}
	header nav a:hover {
		color: #1861ae !important;
	}
	#menuwrapper {
		/*width: 100%; */
		/*background: rgba(255, 255, 255, 0.85);*/
		padding: 15px 15px 10px 15px;
		box-sizing: border-box;
		position: fixed;
		z-index: 10000;/* headerより上に表示させるため */
		top: 0px;
		/*left: 0px;メニューを左に配置*/
		right: 0px;/*メニューを右に配置*/
		
	}
	.trigger, .trigger span {
		display: inline-block;
		transition: all .4s;
		box-sizing: border-box;
	}
	.trigger {
		position: relative;
		width: 35px;
		height: 30px;
	}
	.trigger span {
		position: absolute;
		left: 0;
		width: 100%;
		height: 4px;
		background-color: #515151;
		border-radius: 4px;
		opacity: 1;
	}
	.trigger a:hover {
		opacity: 1;
	}
	.trigger span:nth-of-type(1) {
		top: 0;
	}
	.trigger span:nth-of-type(2) {
		top: 12px;
	}
	.trigger span:nth-of-type(3) {
		bottom: 0;
	}
		.trigger.active span:nth-of-type(1) {
		transform: translateY(10px) rotate(-45deg);
	}
	.trigger.active span:nth-of-type(2) {
		left: 50%;
		opacity: 0;
		animation: active-menu-bar02 .8s forwards;
	}
	.trigger.active span:nth-of-type(3) {
		transform: translateY(-15px) rotate(45deg);
	}
	.onanimation {
		display: block;
	}
}













