@charset "utf-8"; 
/*//ドロワーメニューのClose時のスタイルシート*/
.drawer {
  position:fixed;
  top:0;
  right: calc(50vw - 648px);
  width: 100%;
  height: 100%;
  background: #f0dbff;
  margin:0;
  -webkit-transform: translateY(-100%);
  transform: translateY(-100%);
  -webkit-transition:ease .3s;
  transition:ease .3s;
  z-index:900;
  width: 184px;
  color:#6a1684;
  height: 344px;
}
.menu_close{
  width: 96px;
  margin: 24px auto 24px;
}
/*//ドロワーメニューをOPENにするスタイルシート*/
.drawer.action {
  -webkit-transform:translateY(0);
  transform:translateY(0);
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  margin: 0 auto 0;

}
.drbtn{
  cursor: pointer;
}
/*//ボタンをドロワーメニュー内に表示*/
.drbtn.action {
    top: 0px;
    right: 10px;
    background:none;

}
 
.drawer .menu{
    margin-top:20px;
	text-align:center;
}
.drawer .menu li{
  margin-bottom: 20px;
  text-align: left;
  padding: 0 30px 0;
  font-size: 16px;
}
.drawer .menu li:nth-child(03){
  margin-bottom: 45px;
}
.drawer .menu li.menu-btn{
  padding: 0 16px 0;
}
.drawer .menu li a{
  color:#6a1684;
}
@media screen and (max-width: 768px){
.drawer {
  top: 0;
  right: 0;
  background: rgba(244, 219, 250, 0.9);
  z-index: 900;
  width: 100vw;
  height: 100%;
  -webkit-transform: translateY(-130%);
  transform: translateY(-130%);

}
.drawer.action {
  -webkit-transform:translateY(0);
  transform:translateY(0);
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  margin: 0 auto 0;

}

.menu_close {
  width: 64px;
  margin: 1px 14px 2px;
  float: right;
}
.drawer .menu {
  clear: right;
}
.menu-logo{
	width:calc(496vw / 7.68);
	margin:calc(100vw / 7.68 + 35px) auto calc(80vw / 7.68);
}
.drawer .menu li {
  margin-bottom: calc(80vw / 7.68);
  text-align: center;
  padding: 0 0 0;
  font-size: calc(58vw / 7.68);
}
.drawer .menu li.menu-btn {
  padding: 0 0 0;
  width: calc(420vw / 7.68);
  margin: 0 auto calc(60vw / 7.68);
}
}

