@charset "utf-8";
/* CSS Document */
#drawernav {
	position: fixed;
	top: 0;
	right: -317px;
	width: 317px;
	height: 100%;
	background: #fff;
	color: #d7003a;
	z-index: 1;
	padding-top: 30px;
	-webkit-transition: all 400ms cubic-bezier(1.000, 0.000, 0.000, 1.000);
	-moz-transition: all 400ms cubic-bezier(1.000, 0.000, 0.000, 1.000);
	-o-transition: all 400ms cubic-bezier(1.000, 0.000, 0.000, 1.000);
	transition: all 400ms cubic-bezier(1.000, 0.000, 0.000, 1.000); /* easeInOutExpo */
	-webkit-transition-timing-function: cubic-bezier(1.000, 0.000, 0.000, 1.000);
	-moz-transition-timing-function: cubic-bezier(1.000, 0.000, 0.000, 1.000);
	-o-transition-timing-function: cubic-bezier(1.000, 0.000, 0.000, 1.000);
	transition-timing-function: cubic-bezier(1.000, 0.000, 0.000, 1.000); /* easeInOutExpo */
}
#drawernav ul.nav_list {
	margin-bottom: 10px;
}
#drawernav ul.nav_list li a {
	color: #333;
	display: block;
	text-align: center;
	padding: 10px 0;
	font-weight: 700;
	font-size: 14px;
	border-top: 1px dashed rgba(0,147,212,0.7);
	margin: 0 5%;
}
#drawernav ul.nav_list li:first-child a {
	border-top: none;
}
#drawernav ul.lang {
	margin: 0 auto;
	width: 185px;
}
#drawernav ul.lang li:first-child {
	float: left;
}
#drawernav ul.lang li:last-child {
	float: right;
}
#humberger {
	position: absolute;
	top: 0;
	right: 0;
	z-index: 9999;
	cursor: pointer;
	margin-top: 26px;
	margin-right: 5%;
}
#humberger .burg {
	display: block;
	margin: 0 auto;
}
#humberger .bar {
	width: 24px;
}
.icon-bar {
	height: 2px;
	background: #333;
	display: block;
	-webkit-transition: all 400ms cubic-bezier(1.000, 0.000, 0.000, 1.000);
	-moz-transition: all 400ms cubic-bezier(1.000, 0.000, 0.000, 1.000);
	-o-transition: all 400ms cubic-bezier(1.000, 0.000, 0.000, 1.000);
	transition: all 400ms cubic-bezier(1.000, 0.000, 0.000, 1.000); /* easeInOutExpo */
	-webkit-transition-timing-function: cubic-bezier(1.000, 0.000, 0.000, 1.000);
	-moz-transition-timing-function: cubic-bezier(1.000, 0.000, 0.000, 1.000);
	-o-transition-timing-function: cubic-bezier(1.000, 0.000, 0.000, 1.000);
	transition-timing-function: cubic-bezier(1.000, 0.000, 0.000, 1.000); /* easeInOutExpo */
}
.icon-bar + .icon-bar {
	margin-top: 6px;
}
.fixed-content {
	right: inherit;
	width: 100%;
	z-index: 2;
	-webkit-transition: all 400ms cubic-bezier(1.000, 0.000, 0.000, 1.000);
	-moz-transition: all 400ms cubic-bezier(1.000, 0.000, 0.000, 1.000);
	-o-transition: all 400ms cubic-bezier(1.000, 0.000, 0.000, 1.000);
	transition: all 400ms cubic-bezier(1.000, 0.000, 0.000, 1.000); /* easeInOutExpo */
	-webkit-transition-timing-function: cubic-bezier(1.000, 0.000, 0.000, 1.000);
	-moz-transition-timing-function: cubic-bezier(1.000, 0.000, 0.000, 1.000);
	-o-transition-timing-function: cubic-bezier(1.000, 0.000, 0.000, 1.000);
	transition-timing-function: cubic-bezier(1.000, 0.000, 0.000, 1.000); /* easeInOutExpo */
}
#overlay {
	z-index: -1;
	opacity: 0;
	background: #000;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	position: fixed;
	-webkit-transition: all 400ms cubic-bezier(1.000, 0.000, 0.000, 1.000);
	-moz-transition: all 400ms cubic-bezier(1.000, 0.000, 0.000, 1.000);
	-o-transition: all 400ms cubic-bezier(1.000, 0.000, 0.000, 1.000);
	transition: all 400ms cubic-bezier(1.000, 0.000, 0.000, 1.000); /* easeInOutExpo */
	-webkit-transition-timing-function: cubic-bezier(1.000, 0.000, 0.000, 1.000);
	-moz-transition-timing-function: cubic-bezier(1.000, 0.000, 0.000, 1.000);
	-o-transition-timing-function: cubic-bezier(1.000, 0.000, 0.000, 1.000);
	transition-timing-function: cubic-bezier(1.000, 0.000, 0.000, 1.000); /* easeInOutExpo */
}
/** ドロワー開放時のスタイル **/
body.drawer-opened #page {
	left: -317px;
	box-shadow: 1px 0 2px #000;
	-webkit-box-shadow: 1px 0 2px #000;
}
body.drawer-opened .fixed-content {
	left: -317px;
}
body.drawer-opened #drawernav {
	right: 0;
	z-index: 2;
}
body.drawer-opened #humberger .icon-bar {
	background: #333;
}
body.drawer-opened #humberger span:nth-of-type(1) {
	transform: translate(0, 8px) rotate(45deg);
	-webkit-transform: translate(0, 8px) rotate(45deg);
}
body.drawer-opened #humberger span:nth-of-type(2) {
	transform: translate(-20px, 0);
	-webkit-transform: translate(-20px, 0);
	opacity: 0;
}
body.drawer-opened #humberger span:nth-of-type(3) {
	transform: translate(0, -8px) rotate(-45deg);
	-webkit-transform: translate(0, -8px) rotate(-45deg);
}
body.drawer-opened #overlay {
	z-index: 3;
	opacity: 0.6;
	left: -317px;
}