/**************************************** ヘッダー ****************************************/
.headerarea {position:fixed;top:0px;left:0px;width:100%;height:100px;z-index:7000;padding:10px 5vw;
	background:none;}
.headerarea .bgcover {position:absolute;top:0px;left:0px;width:100%;height:100%;background:#000;transform:translateY(-100px);}
.headerarea.on .bgcover {transform:translateY(0px);transition:0.4s;}

.logoarea {height:80px;display:block;float:left;position:relative;padding-top:7px;}
.logoarea a {display:block;}
.logoarea img {height:60px;}

.menu {height:80px;display:block;float:left;padding:10px 0px 0px 50px;position:relative;}
.menu span, .menu a {font-size:1.0rem;line-height:80px;font-weight:bold;color:#fff;display:inline-block;padding:0px 10px;}

/*PC*/
@media (min-width: 897px){
	@media (max-width: 1200px){
	}
}
/*SP*/
@media (max-width: 896px){
	.headerarea {height:80px;}
	.logoarea img {height:auto;width:60vw;}
	.menu {background:#000;position:fixed;top:0px;left:0px;width:100%;height:100%;z-index:7000;padding:100px 0px 0px 0px;text-align:center;
		transform:translateX(120vw);transition:0.2s;}
	.menu.on {display:block;transform:translateX(0vw);transition:0.5s;}
	.menu span {display:block;}
	.menubox {position:fixed;top:0px;right:0px;width:80px;height:80px;z-index:7000;}
	.menubox .bar {width:40px;height:2px;background:#fff;transition:0.4s;}
	.menubox .bar01 {position:absolute;top:34px;left:23px;}
	.menubox .bar02 {position:absolute;top:46px;left:17px;}

	.menubox.on {}
	.menubox.on .bar01 {position:absolute;top:50%;left:50%;transform:translateX(-50%) translateY(-50%) rotate(45deg);}
	.menubox.on .bar02 {position:absolute;top:50%;left:50%;transform:translateX(-50%) translateY(-50%) rotate(-45deg);}
}