@charset "utf-8";


@media only screen and (max-width:1099px) {

	/* NAVIGATION
	------------------*/
	/* drawer menu */
	.drawer-menu {
		box-sizing: border-box;
		position: fixed;
		top: 0;
		right: 0;
		width: 250px;
		height: 100%;
		padding: 60px 0;
		background: rgba(255, 255, 255, 0.9);
		-webkit-transition-property: all;
		transition-property: all;
		-webkit-transition-duration: .5s;
		transition-duration: .5s;
		-webkit-transition-delay: 0s;
		transition-delay: 0s;
		-webkit-transform-origin: right center;
		-ms-transform-origin: right center;
		transform-origin: right center;
		-webkit-transform: perspective(500px) rotateY(-90deg);
		transform: perspective(500px) rotateY(-90deg);
		opacity: 0;
	}
	.drawer-menu li {
		text-align: center;
	}
	
	.drawer-menu li a {
		display: block;
		height: 46px;
		color: #fff;
		letter-spacing: 0.1em;
		padding: 2px 0;
		-webkit-transition: all .8s;
		transition: all .8s;
		text-decoration: none;
	}
	/* checkbox */
	.check {
		display: none;
	}
	/* menu button - label tag */
	.menu-btn {
		position: fixed;
		display: block;
		top: 10px;
		right: 10px;
		width: 30px;
		height: 30px;
		font-size: 10px;
		text-align: center;
		cursor: pointer;
		z-index: 9999;
	}
	.bar {
		position: absolute;
		top: 0;
		left: 0;
		display: block;
		width: 30px;
		height: 2px;
		background: #484546;
		-webkit-transition: all .5s;
		transition: all .5s;
		-webkit-transform-origin: left top;
		-ms-transform-origin: left top;
		transform-origin: left top;
		-webkit-filter: drop-shadow(0px 0px 2px #fff);
		-moz-filter: drop-shadow(0px 0px 2px #fff);
		filter: drop-shadow(0px 0px 2px #fff);
	}
	.bar.middle {
		top: 10px;
		opacity: 1;
	}
	.bar.bottom {
		top: 20px;
		-webkit-transform-origin: left bottom;
		-ms-transform-origin: left bottom;
		transform-origin: left bottom;
	}
	.menu-btn__text {
		position: absolute;
		bottom: -10px;
		left: 0;
		right: 0;
		margin: auto;
		color: #484546;
		font-weight: bold;
		-webkit-transition: all .5s;
		transition: all .5s;
		display: block;
		visibility: visible;
		opacity: 1;
		-webkit-filter: drop-shadow(0px 0px 4px #fff);
		-moz-filter: drop-shadow(0px 0px 4px #fff);
		filter: drop-shadow(0px 0px 4px #fff);
		-webkit-text-shadow: 0px 0px 4px #fff;
		-moz-text-shadow: 0px 0px 4px #fff;
		text-shadow: 0px 0px 4px #fff;
	}
	.close-menu {
		position: fixed;
		top: 0;
		right: 250px;
		width: 100%;
		height: 100vh;
		background: rgba(0,0,0,0);
		-webkit-transition-property: all;
		transition-property: all;
		-webkit-transition-duration: .3s;
		transition-duration: .3s;
		-webkit-transition-delay: 0s;
		transition-delay: 0s;
		visibility: hidden;
		opacity: 0;
	}
	/* checked */
	.check:checked ~ .drawer-menu {
		-webkit-transition-delay: .3s;
		transition-delay: .3s;
		-webkit-transform: none;
		-ms-transform: none;
		transform: none;
		opacity: 1;
		z-index: 2;
	}
	.check:checked ~ .menu-btn .menu-btn__text {
		visibility: hidden;
		opacity: 0;
	}
	.check:checked ~ .menu-btn .bar.top {
		width: 46px;
		background: #484546;
		-webkit-transform: rotate(45deg);
		-ms-transform: rotate(45deg);
		transform: rotate(45deg);
	}
	.check:checked ~ .menu-btn .bar.middle {
		opacity: 0;
	}
	.check:checked ~ .menu-btn .bar.bottom {
		width: 46px;
		background: #484546;
		top: 32px;
		-webkit-transform: rotate(-45deg);
		-ms-transform: rotate(-45deg);
		transform: rotate(-45deg);
	}
	.check:checked ~ .close-menu {
		-webkit-transition-duration: 1s;
		transition-duration: 1s;
		-webkit-transition-delay: .3s;
		transition-delay: .3s;
		background: rgba(0,0,0,.5);
		visibility: visible;
		opacity: 1;
		z-index: 3;
	}

}