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

.hm_wrap { display:none;}
/* ↓pcメニュー */
menu { height:60px; width:100%; padding:10px 0 0 0; margin:0;  background-image: -moz-linear-gradient(top, #B90821 0%, #8D0001 80%, #620000 80%, #8D0001 100%);
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #B90821), color-stop(0.80, #8D0001), color-stop(0.80, #620000), color-stop(1, #8D0001)); z-index:1; position:absolute }
menu ul { height:40px; padding:0; margin:0; }
menu ul li {  float:left;  padding:0 10px;  margin:0;  text-align:center; list-style:none; text-shadow:0 -1px 0px #333,0 1px 0px #555;  border-left:1px solid #FFF; width:15%; box-sizing:border-box; cursor:pointer; font-size:90%; color:#FFF }
menu ul li a { color:#FFF; display:block; width:100% }

menu ul li ul{  height: 0; max-height:0;  overflow: hidden;
    /*
  -webkit-transition: 1s linear;
  -moz-transition: 1s linear;
  -o-transition: 1s linear;
  transition: 1s linear;
  */}
menu ul li:hover > ul{  
  margin:0 0 30px 0; padding:0; list-style: none; z-index:1; position:absolute; background-color:#FFF;  height: auto; /* 追加 */
  max-height: 50em;
  /* 追加 */
  -webkit-transition: 0.5s linear;
  -moz-transition: 0.5s linear;
  -o-transition: 0.5s linear;
  transition: 0.5s linear;  
  } 
menu ul li ul li{display:block !important; float:none !important; width:200px !important;text-shadow:none !important; text-align:left !important; padding:0 !important; margin:0 !important;  box-sizing:border-box !important ;}
menu ul li ul li a { color:#000; width:200px; height:100%; padding:10px; display:block; box-sizing:border-box}
menu ul li ul li a:hover{ background:#FCC}
menu ul li ul li a:before{	content:'▼ ';	color: #8D0001; } 

/* ↑アコーディオン */
.menu_l{ border-right:1px solid #FFF; width:25%;}
/* ↑pcメニュー */
@media screen and ( max-width:1024px) {
.hm_menu_check {/* チェックボックスを隠す */
  display: none;}
.hm_wrap {display: inline-block;position :fixed;top :0;left :0;width :100%; z-index:20;padding :0;background :#fff;}
 
/* ▽▽メニューボタン▽▽ */
.hm_btn {position: fixed; top:0; right:0;width: 50px;height: 50px;cursor: pointer;display: block;z-index: 0;}
.hm_btn::before {-webkit-box-shadow:  #FFF 0 12px 0;box-shadow: #FFF 0 12px 0; top:12px; right:4px;}
.hm_btn::after {bottom: 10px; right:4px}
.hm_btn::before,
.hm_btn::after {width: 40px;height: 2px;background:#FFF;display: block;	content: '';
	position: absolute;
	-webkit-transition: -webkit-box-shadow 0.2s linear, -webkit-transform 0.2s 0.2s;
	transition: box-shadow 0.2s linear, transform 0.2s 0.2s;}
/* △△メニューボタン△△ */
 
.hm_menu_wrap {width :100%; z-index:10;	height :90vh;background: #fff;position: absolute;
	left: -100%;top: 50px;-webkit-transition: left 0.4s;transition: left 0.4s; overflow:scroll}
 
/* ▽▽開閉時のアニメーション▽▽ */
.hm_menu_check:checked ~ .hm_title {
	opacity: 1;	-webkit-transform: none;-ms-transform: none;transform: none;}
.hm_menu_check:checked ~ .hm_btn::before {
	-webkit-box-shadow: transparent 0 0 0;
	box-shadow: transparent 0 0 0;
	-webkit-transform: rotate(45deg) translate3d(6px, 13px, 0);
	transform: rotate(45deg) translate3d(6px, 13px, 0);
}
.hm_menu_check:checked ~ .hm_btn::after {
	-webkit-transform: rotate(-45deg) translate3d(6px, -13px, 0);
	transform: rotate(-45deg) translate3d(6px, -13px, 0);
}
.hm_menu_check:checked ~ .hm_menu_wrap {
	left: 0;
}
 
/* △△開閉時のアニメーション△△ */
 
/* ▽▽メニュー内のリストスタイル▽▽ */
.hm_list {
	list-style-type: none; font-size:12px; line-height:20px;
	margin: 50px 0 0 -20px;
	padding: 0; width:100%; overflow:scroll; height:100vh
}
.hm_list li{ margin:0 10px; padding:0;  }
.hm_list li a {	color: #777;	display: block;	overflow: hidden;	padding:5px;	position: relative;
	text-decoration: none; height:30px; box-sizing:border-box}
.hm_list li a::before {/* aタグマウスオーバー時の背景 */
	background: #eee;
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	bottom: 100%;
	left: 0;
	-webkit-transition: bottom 0.4s;
	transition: bottom 0.4s;
	z-index: -2;
}
 
.hm_list li a:hover::before {
	bottom: 0;
}
.hm_list li a:hover::after {
	opacity: 0.5;
	-webkit-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);
}
/* メニュー内のリストスタイル△△ */
/* ↑ハンバーガーメニュー */

/* ↓アコーディオン */

.ac_menu{
  width: 100%; 
}

/* メニューの部分 */
.ac_menu label{ position:fixed; background: #CC131C url(../img/common/search.png) 15px 5px no-repeat; height:50px; width:50px; top:0; right:50px ; color: #fff;  display: block;  margin: 0; cursor:pointer; padding:25px 0 0 0; box-sizing:border-box; font-size:12px; }
.ac_menu input[type="checkbox"].on-off{
  display: none;
}

/* コンテンツの部分 */
.ac_menu div{
  -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s;
  -ms-transition: all 0.5s;
  -o-transition: all 0.5s;
  transition: all 0.5s;
  margin: 0; text-align:right;
  padding: 0 10px; width:96vw;
  list-style: none; font-size:12px;
}
.ac_menu input[type="checkbox"].on-off + div{
  height: 0;
  overflow: hidden;
}
.ac_menu input[type="checkbox"].on-off:checked + div{
  height: 60px;
}
/* ↑アコーディオン */