/* base */
.-fixedArea {
	line-height:110%;
	margin-top:0.67em;
}
.-fixedArea-wrap {
	position:relative;
}
.-fixedArea-hidden {
	visibility: hidden !important;
}

/* inner */
.-fixedArea-inner {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	text-align:center;
}
.-fixedArea-inner.-fixedStyle {
	position:fixed;
	padding:0.5em 25px 1.5em 40px;
	z-index:5000;
	animation-duration: 300ms;
	animation-name: fixedStyle-background;
	background:linear-gradient(rgba(255,255,255,1) calc( 100% - 1.5em ),rgba(255,255,255,0));
}
@keyframes fixedStyle-background {
	0% {
		background:none;
		padding-bottom:0;
	}
	80% {
		background:linear-gradient(rgba(255,255,255,1) calc( 100% - 1.5em ),rgba(255,255,255,0));
	}
	100% {
		background:linear-gradient(rgba(255,255,255,1) calc( 100% - 1.5em ),rgba(255,255,255,0));
		padding-bottom:1.5em;
	}
}
@media screen and (min-width: 768px) {
	.-fixedArea-inner.-fixedStyle {
		padding:0.5em 25px 1.5em 75px;
	}
	.drawer-open .-fixedArea-inner.-fixedStyle,
	.drawer-no-animation .-fixedArea-inner.-fixedStyle {
		padding:0.5em 35px 1.5em calc( var(--navimenu-width) + 35px );
	}
}

/* fixedArea */
.-fixedArea-inner .-fixedArea {
	display:inline-block;
	min-width:100%;
	margin-top:0.67em;
	transition: all 200ms;
	text-align:left;
}
.-fixedArea-inner.-fixedStyle .-fixedArea {
	min-width:0;
	font-size:100%;
	margin-top:0;
}

/* leftArea, rightArea */
.-fixedArea-leftArea,
.-fixedArea-rightArea {
	display:inline-block;
	font-size:1px;
	height:1em;
	opacity:0;
}
.-fixedArea-inner.-fixedStyle .-fixedArea-leftArea {
	font-size:1em;
	opacity:1;
}
.-fixedArea-inner.-fixedStyle .-fixedArea-rightArea {
	font-size:0.8em;
	opacity:1;
}