/**************************************** ヘッダー ****************************************/
.headerarea {position:fixed;top:0px;left:0px;width:100%;height:10vh;z-index:7000;background:rgba(255,255,255,0.85);transition:0.4s;
 -webkit-backdrop-filter: blur(5px);backdrop-filter: blur(5px);}
.toppage .headerarea {}
.logoarea {position:absolute;top:1vh;left:3vw;}
.logoarea a {display:block;float:left;}
.logoarea img {height:8vh;display:block;margin:0px auto;}

.menu {position:fixed;top:0px;right:0px;width:80vw;height:10vh;padding:0px 3vw 0px 3vw;z-index:7100;}
.menu .reservebtn {float:right;padding-top:2vh;padding-left:1.5vw;height:100%;width:11vw; }
.menu .reservebtnarea {position:relative;display:inline-block;border:solid #000 0.4vh;height:6vh;width:100%;cursor:pointer;overflow:hidden;}
.menu .reservebtn:hover .reservebtnarea {background:#f2f2f2;height:12.7vh;transition:0.3s;}
.menu .reservebtn span {display:inline-block;height:6vh;font-size:0.9rem;width:100%;
	line-height:5.2vh;padding:0em 0em;text-align:center;color:#000;font-weight:bold;}
.menu .reservebtn:hover span {opacity:0;}
.menu .reservebtn a {position:absolute;top:0;left:0; background:#fff;border:none;font-size:0.9rem;width:100%;line-height:6vh;
	text-align:center;color:#000;font-weight:bold;margin-bottom:0.1rem;height:6vh;display:inline-block;opacity:0; }
.menu .reservebtn:hover a {text-decoration:none;position:absolute;opacity:1;transition:0.3s;}
.menu .reservebtn:hover a:hover {background:#000;color:#fff;}

.menu .reservebtn:hover a:nth-child(2) {top:0vh;}
.menu .reservebtn:hover a:nth-child(3) {top:6vh;}

.menu .upmenu {width:63vw;height:6vh;float:right;}
.menu .upmenu a {font-size:0.9rem;font-weight:bold;color:#000;display:inline-block;padding:0px 1rem;}
.menu .upmenu a:hover {text-decoration:none;}
.menu .upmenu .languagearea {float:right;padding:2vh 0px 1vh 0px;color:#000;}
.menu .upmenu .language {height:6vh;}
.menu .upmenu .language a {line-height:3vh;font-size:1.2rem;}
.menu .upmenu .snsarea {float:right;height:6vh;padding:2vh 0px 1vh 0px;line-height:0;margin-right:0.2vw;}
.menu .upmenu .snsarea a {line-height:0;}
.menu .upmenu .snsarea img {height:3vh;display:block;}
.menu .menulist {width:63vw;float:right;height:4vh;text-align:right;}
.menu .menulist .menuwrap {}
.menu .menulist .menuwrap ul.menuitem {}
.menu .menulist .menuwrap ul.menuitem li {display:inline-block;}
.menu .menulist .menuwrap ul.menuitem li a {font-size:1rem;line-height:4vh;font-weight:normal;color:#000;display:inline-block;padding:0px 1rem;}
.menu .menulist .menuwrap ul.menuitem li a:hover {text-decoration:none;}

.toppage .headerarea {background:none; }
.toppage.wrapper {margin-top:0px;}
.toppage .menu .upmenu a {color:#fff;}
.toppage .menu .upmenu .languagearea {color:#fff;}
.toppage .menu .menulist .menuwrap ul.menuitem li a {color:#fff;}
.toppage .headerarea.on {background:rgba(255,255,255,0.85);transition:2s;}
.toppage .headerarea.on .menu .upmenu a {color:#000;}
.toppage .headerarea.on .menu .upmenu .languagearea {color:#000;}
.toppage .headerarea.on .menu .menulist .menuwrap ul.menuitem li a {color:#000;}

/*.toppage .menu .reservebtnarea a {border:solid #000 0.1vh;color:#000;margin:0px 2%;width:96%;}*/
.menu .reservebtn span {color:#000;background:#fff;}
/*SP*/
@media (max-width: 896px){
	.menu {width:100%;height:100vh;background:#000;padding:10vh 0px 10vh 0px;transform:translateX(300vw) scale(2);filter:blur(10rem);transition:0.2s;overflow:scroll;
		-ms-overflow-style:none; scrollbar-width:none;}
	.menu::-webkit-scrollbar{display:none;}
	.menu.on {transform:translateX(0vw) scale(1);filter:blur(0rem);transition:0.4s;}
	.menu .menulist {width:100%;float:none;height:auto;text-align:center;}
	.menu .menulist .campaignbnr {padding:0vh 3vh 3vh 3vh;}
	.menu .menulist .campaignbnr img {width:100%;}
	.menu .menulist .menuwrap ul.menuitem {display:flex;flex-wrap:wrap;padding:0px 7vw;}
	.menu .menulist .menuwrap ul.menuitem li {display:block;width:49%;margin:0px 0.5%; border-bottom:solid #000 1px;}
	.menu .menulist .menuwrap ul.menuitem li a {font-size:1.4rem;display:block;width:100%;padding:0.5em 0px;color:#fff;}
	.menu .reservebtn {float:none;position:fixed;top:0px;right:11vh;padding-left:0%;width:30vw;height:auto;}
	.menu .upmenu {width:100%;height:auto;float:none;}
	.menu .upmenu a {color:#fff;}
	.menu .upmenu .languagearea {float:none;font-size:2.4rem;text-align:center;color:#fff;}
	.menu .upmenu .language {height:auto;}
	.menu .upmenu .languagearea a {font-size:2.0rem;}
	.menu .upmenu .snsarea {float:none;text-align:center;height:auto;margin-bottom:3vh; }
	.menu .upmenu .snsarea a {}
	.menu .upmenu .snsarea img {height:auto;width:9vw; }
	.menu .headercontact {text-align:center;padding-top:5vh;}
	.menu .headercontact a.btn {width:80%;margin-bottom:0.5rem;padding:2em 0px;}
	.menubtn {position:fixed;top:0%;right:0%;z-index:9900;width:10vh;height:10vh;background:rgba(255,255,255,0.0);}
	.menubtn .bar {position:absolute;height:2px;width:5vh;background:#000;transition:0.2s;}
	.menubtn .bar.bar1 {top:43%;left:30%;}
	.menubtn .bar.bar2 {top:57%;left:20%;}
	.menubtn.on .bar {position:absolute;height:2px;width:5vh;background:#fff;transition:0.4s;}
	.menubtn.on .bar.bar1 {top:50%;left:50%;transform:translateX(-50%) translateY(-50%) rotateZ(45deg);}
	.menubtn.on .bar.bar2 {top:50%;left:50%;transform:translateX(-50%) translateY(-50%) rotateZ(135deg);}

	.toppage .menubtn .bar {position:absolute;height:2px;width:5vh;background:#fff;transition:0.2s;}
	.toppage .headerarea.on .menubtn .bar {background:#000;}
	.toppage .headerarea.on .menubtn.on .bar {background:#fff;}
	.toppage .menu .menulist .menuwrap ul.menuitem li {border-bottom:solid #fff 1px;}
	.toppage .headerarea.on .menu .upmenu a {color:#fff;}
	.toppage .headerarea.on .menu .upmenu .languagearea {color:#fff;}
	.toppage .headerarea.on .menu .menulist .menuwrap ul.menuitem li a {color:#fff;}

}


/*
.submenu {}
.submenuarea {position:fixed;top:10vh;left:0px;width:100%;height:6vh;z-index:7000;
background:linear-gradient(45deg,#fdfdfd,#eee);}
.submenuarea .submenubox {position:relative;}
.submenuarea ul {text-align:right;padding-right:4rem;}
.submenuarea ul li {display:inline-block;}
.submenuarea ul li a {color:#000;font-size:0.9rem;line-height:6vh;height:6vh;display:block;padding:0px 2rem;border-bottom:solid #fff 0.3rem;box-sizing:border-box;}
.submenuarea ul li.on a {text-decoration:none;border-bottom:solid #000 0.3rem;}
.submenuarea ul li a:hover {text-decoration:none;border-bottom:solid #000 0.3rem;}
*/

/*PC*/
@media (min-width: 897px){
	@media (max-width: 1200px){
	}
}
/*SP*/
@media (max-width: 896px){

}
