/*CSS:humbugermenu*/

/* チェックボックスを非表示にする */
.drawer_hidden {
  display: none;
}

#hamburger_menu.nav{
	position: absolute;
	top:0;
	right:0;
	border-style:none !important;}

#hamburger_menu.nav .hamburger_menu-navigation #menu-hamburger_menu,
#hamburger_menu.nav .hamburger_menu-navigation #menu-hamburger_menu_en{
	width:100%;
	display:block;
	list-style:none;
	text-align:left !important;
	border-style:none;
	margin:70px 0 0 0;
	padding:0;
	float:none;}

#hamburger_menu.nav .hamburger_menu-navigation #yaotsu_menu{
	width:100%;
	display:block;
	list-style:none;
	text-align:left !important;
	border-style:none;
	margin:30px 0 0 0;
	padding:0;
	float:none;}

#hamburger_menu.nav .hamburger_menu-navigation #menu-hamburger_menu li,
#hamburger_menu.nav .hamburger_menu-navigation #menu-hamburger_menu_en li{
	display:block;
	text-align:left !important;
	vertical-align:top;
	border-bottom:dotted 1px #fff;
	position:relative;
	}

#hamburger_menu.nav .hamburger_menu-navigation #menu-hamburger_menu li ul li,
#hamburger_menu.nav .hamburger_menu-navigation #menu-hamburger_menu_en li ul li{
	display:block;
	text-align:left !important;
	vertical-align:top;
	border-top:dotted 1px #fff;
	border-bottom-style:none !important;
	position:relative;
	}

#hamburger_menu.nav .hamburger_menu-navigation #menu-hamburger_menu li a:link,
#hamburger_menu.nav .hamburger_menu-navigation #menu-hamburger_menu li a:visited,
#hamburger_menu.nav .hamburger_menu-navigation #menu-hamburger_menu_en li a:link,
#hamburger_menu.nav .hamburger_menu-navigation #menu-hamburger_menu_en li a:visited{
	display:block;
	font-size:100%;
	text-decoration:none;
	color:#fff;
	text-align:left !important;
	background-color:transparent;
	border-style:none;
	margin:8px 30px 3px 15px !important;}

#hamburger_menu.nav .hamburger_menu-navigation #menu-hamburger_menu li a:hover,
#hamburger_menu.nav .hamburger_menu-navigation #menu-hamburger_menu li a:active,
#hamburger_menu.nav .hamburger_menu-navigation #menu-hamburger_menu_en li a:hover,
#hamburger_menu.nav .hamburger_menu-navigation #menu-hamburger_menu_en li a:active{
	color:#e16a52;}

#hamburger_menu.nav .hamburger_menu-navigation #menu-hamburger_menu li a:after,
#hamburger_menu.nav .hamburger_menu-navigation #menu-hamburger_menu_en li a:after{
	content:"";
	display:block;
	background-color:#fff;
	width:10px;
	height:1px;
	transform: rotate(45deg);
	position:absolute;
	bottom:16px;
	right:5px;
	}

#hamburger_menu.nav .hamburger_menu-navigation #menu-hamburger_menu li a:before,
#hamburger_menu.nav .hamburger_menu-navigation #menu-hamburger_menu_en li a:before{
	content:"";
	display:block;
	background-color:#fff;
	width:10px;
	height:1px;
	transform: rotate(-45deg);
	position:absolute;
	bottom:10px;
	right:5px;
	}

/* ハンバーガーアイコンの設置スペース */
#hamburger_menu.nav .drawer_open {
  display: flex;
  height: 60px;
  width: 60px;
  justify-content: center;
  align-items: center;
  position: absolute;
  top:5px;
  right:0;
  z-index: 1000001;/* 重なり順を一番上にする */
  cursor: pointer;
}

/* ハンバーガーメニューのアイコン */
#hamburger_menu.nav .drawer_open span,
#hamburger_menu.nav .drawer_open span:before,
#hamburger_menu.nav .drawer_open span:after {
  content: '';
  display: block;
  height: 3px;
  width: 25px;
  border-radius: 3px;
  background: #333;
  transition: 0.5s;
  position: absolute;
}

/* 三本線の一番上の棒の位置調整 */
#hamburger_menu.nav .drawer_open span:before {
  bottom: 8px;
}

/* 三本線の一番下の棒の位置調整 */
#hamburger_menu.nav .drawer_open span:after {
  top: 8px;
}

/* アイコンがクリックされたら真ん中の線を透明にする */
#hamburger_menu.nav #drawer_input:checked ~ .drawer_open span {
  background: rgba(255, 255, 255, 0);
}

/* アイコンがクリックされたらアイコンが×印になように上下の線を回転 */
#hamburger_menu.nav #drawer_input:checked ~ .drawer_open span::before {
  bottom: 0;
  transform: rotate(45deg);
  background: #fff;
}

#hamburger_menu.nav #drawer_input:checked ~ .drawer_open span::after {
  top: 0;
  transform: rotate(-45deg);
  background: #fff;
}
  
/* メニューのデザイン*/
#hamburger_menu.nav .hamburger_menu-navigation {
	width: 50%;
	height: 100%;
	position: fixed;
	left: 100%; /* メニューを画面の外に飛ばす */
	z-index: 1000000;
        background:rgba(0,0,0,0.8);
	transition: .5s;
}

/* メニュー黒ポチを消す */
#hamburger_menu.nav .nav_list {
  list-style: none;
}

/* アイコンがクリックされたらメニューを表示 */
#hamburger_menu.nav #drawer_input:checked ~ .hamburger_menu-navigation {
  left: 50%;/* メニューを画面に入れる */
}


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

/* メニューのデザイン*/
#hamburger_menu.nav .hamburger_menu-navigation {
	width: 100%;
	height: 100%;
	position: fixed;
	left: 100%; /* メニューを画面の外に飛ばす */
	z-index: 999999;
        background:rgba(0,0,0,0.8);
	transition: .5s;
}

/* メニュー黒ポチを消す */
#hamburger_menu.nav .nav_list {
  list-style: none;
}

/* アイコンがクリックされたらメニューを表示 */
#hamburger_menu.nav #drawer_input:checked ~ .hamburger_menu-navigation {
  left: 0;/* メニューを画面に入れる */
}}