@charset "utf-8";
/* CSS Document */

/* ドロワーメニュー
------------------------------------------------- */
#wrap {
  height: 100%;
  overflow-x: hidden;
  position: relative;
}
.overlay {
  content: "";
  display: block;
  width: 0;
  height: 0;
  background-color: rgba(0, 0, 0, 0.5);
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1000;
  opacity: 0;
  transition: opacity .5s;
}
.overlay.open {
  width: 100%;
  height: 100%;
  opacity: 1;
}

.menu-trigger {
	background: url(../images/common/btn_menu.png) no-repeat center top;
	display: block;
	width: 77px;
	height: 66px;
	vertical-align: middle;
	text-indent: -9999px;
	cursor: pointer;
	position: fixed;
	top: 0;
	right: 0;
	z-index: 2000;
	transform: translateX(0);
	transition: transform .5s;
 }
 .menu-trigger.active {
  transform: translateX(-250px);
}

#dnav {
  width: 250px;
  height: 100%;
  padding-top: 100px;
  background-color: rgb(255,255,255);
  position: fixed;
  top: 0;
  right: 0;
  z-index: 2000;
  transform: translate(250px);
  transition: all .5s;
}
#dnav.open {
  transform: translateZ(0);
}
#dnav li {
  color: #fff;
  text-align: left;
  padding: 10px 20px;
}