/**************************************** ヘッダー ****************************************/
.headerarea {position:fixed;top:0px;left:0px;width:100%;height:90px;z-index:9000;background:#000;}

.logoarea {position:absolute;top:50%;left:20px;transform:translateY(-50%);}
.logoarea a {}
.logoarea img {height:40px;display:block;}
.logoarea p {font-size:12px;line-height:1em;}

.barwrap {display:none;}

.menuarea {position:absolute;bottom:0px;right:20px;max-width:75%;text-align:right;padding: 0px 0px 0px 0px;z-index:1000;}
.menuarea a {line-height:20px;font-size:14px;font-weight:bold; padding:10px 16px;display:inline-block;color:#fff;border-bottom:solid #000 2px; }
.menuarea a:hover {border-bottom:solid #fff 2px; text-decoration:none;}

.home .headerarea {background:none; }
.home .headerarea.on {background:#000;}
.home .menuarea a {border-bottom:solid rgba(0,0,0,0) 2px;}
.home .menuarea a:hover {border-bottom:solid #fff 2px;}

/*SP*/
@media (max-width: 896px){
	.headerarea {background:#000;}
	.logoarea img {height:auto;width:65vw;}

	.barwrap {position:absolute;top:0px;right:0px;z-index:3000;display:block;height:90px;width:90px;vertical-align:middle;}
	.barwrap .bar {position:absolute;background:#fff;width:35px;height:1px;}
	.barwrap .bar.bar01 {top:40px;right:20px;}
	.barwrap .bar.bar02 {top:50px;right:30px;}

	.barwrap.on .bar {transition:0.6s;}
	.barwrap.on .bar.bar01 {transform:rotateZ(45deg);top:40px;right:20px;}
	.barwrap.on .bar.bar02 {transform:rotateZ(-45deg);top:40px;right:20px;}
	.barwrap.out .bar {transition:0.2s;}
	.barwrap.out .bar.bar01 {transform:rotateZ(0deg);top:40px;right:20px;}
	.barwrap.out .bar.bar02 {transform:rotateZ(0deg);top:50px;right:30px;}
/*
	.menuarea {position:fixed;top:0px;right:0px;width:100%;height:100vh;background:#000;transform:translateX(150vw);padding:60px 50px 0px 50px;}
	.menuarea.on {transform:translateX(0px);transition:0.6s;}
	.menuarea.out {transform:translateX(150vw);transition:0.2s;}
	.menuarea a span {display:none;}
	.menuarea a {position:relative;width:100%;float:none;margin:0px;height:auto;padding:5px 0px 15px 0px;}
	.menuarea a:after {content:"";position:absolute;left:0px;bottom:0px;width:100%;height:1px;background:#fff;transform:scaleX(0);}
*/
.menuarea {position:fixed;top:0px;right:0px;width:100%;height:100vh;background:#000;transform:translateX(150vw);max-width:100%;}
.menuarea.on {transform:translateX(0px);transition:0.6s;}

.menuarea .inner {filter:blur(100px);opacity:0;}
.menuarea .inner.inner01 {transform:translateY(-100vh);}
.menuarea .inner.inner02 {transform:translateY(100vh);}
.menuarea .inner.inner03 {transform:translateY(-100vh);}
.menuarea .inner.inner04 {transform:translateY(100vh);}
.menuarea.on .inner {transform:translateY(0vh);filter:blur(0px);opacity:1;transition:0.8s;}
.menuarea.out .inner {filter:blur(100px);opacity:0;transition:0.3s;}
.menuarea.out .inner.inner01 {transform:translateY(-100vh);}
.menuarea.out .inner.inner02 {transform:translateY(100vh);}
.menuarea.out .inner.inner03 {transform:translateY(-100vh);}
.menuarea.out .inner.inner04 {transform:translateY(100vh);}


.menuarea .inner {height:25vh;background-repeat:no-repeat;background-position:center center;background-size:cover;}
.menuarea .inner.inner01 {background-image:url("../img/cmn/bnr01.jpg");}
.menuarea .inner.inner02 {background-image:url("../img/cmn/bnr02.jpg");}
.menuarea .inner.inner03 {background-image:url("../img/cmn/bnr03.jpg");}
.menuarea .inner.inner04 {background-image:url("../img/cmn/bnr04.jpg");}
.menuarea .inner .box {background:rgba(0,0,0,0.3);height:100%;position:relative;}
.menuarea .inner a {display:block;width:100%;height:100%;}
.menuarea .inner p {color:#fff;font-size:1.4rem;font-weight:bold;
position:absolute;top:50%;left:0px;width:100%;transform:translateY(-50%);text-align:center;}
.menuarea .inner:hover .box {background:rgba(0,0,0,0.8);transition:0.3s;}

}
/*パソコンメニュー*/
@media (min-width: 897px){
}