/*ハンバーガーメニュー*/

/*SP*/
@media screen and (max-width: 640px) {

body.menu-open {
/*  overflow: hidden;*/
}

img[src$=".svg"] {
/*	width: 100%;*/
width: auto!important;/*メニュー右のアロー・プラス・マイナス用*/
}

/*---------------------------------------------------------------------------*/

/* ハンバーガーメニュー */
.menu-toggle {
width: 9%;
position: fixed;
z-index: 10000;
right: 3%;
top: 2vh;
}

.menu-toggle img {
width: 100%;
}

/*---------------------------------------------------------------------------*/

/* メニュー全体 */
#menu a,
#menu button {
  color: inherit;/*メニューの文字をa:linkなどでの色指定の影響を受けないようにする*/
  text-decoration: none;
}

.menu {
  position: fixed;
  top: 0;
/*  top: 12vh;
/*  top: 60px;*/
  left: 0;
  padding-top: 12vh;/*ヘッダー分の高さ*/
  width: 100%;
  height: calc(100vh - 12vh);
/*  height: calc(100vh - 12vh);
/*  height: calc(100vh - 60px);*/
  background: #f9f9f9;
  overflow-y: auto;/*スクロールさせるための記述*/
  -webkit-overflow-scrolling: touch; /*スクロールさせるための記述（対iOS） */
  transform: scaleY(0);
  transform-origin: top;
  opacity: 0;
  transition: transform 0.6s ease, opacity 0.6s ease;
  z-index: 999;
}

.menu_btm_sp {/*メニュー下のスペース*/
height: 15vh;
}

.menu.open {
  transform: scaleY(1);
  opacity: 1;
}

.menu ul {
  list-style: none;
  padding: 0;
  margin: 0;
  border-top: 1px solid #ccc; /* 罫線を明示的に追加 */
}

/* メニュー項目 */
.menu-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  padding: 0.7em 1em 0.7em 1.5em;
  background: #f9f9f9;
  font-size: 1em;
  font-weight: 800;
  text-align: left;
  border: none;
  outline: none;
  position: relative;
  border-bottom: 1px solid #ccc; /* 罫線を明示的に追加 */
  box-sizing: border-box;
}

.menu-item.clicked,
.submenu li a.clicked {/*タップしたときに一瞬だけをを変えるを*/
  background-color: #c7ebf6;
/*  transition: background-color 0.3s;*/
  transition: background-color 0s;
}

.menu ul > li:last-child .menu-item {
/*  border-bottom: none; /* 最後の項目だけ罫線を非表示 */
}

/*.menu-item::before {
  content: '>';
  position: absolute;
  left: 1em;
  font-size: 1.2em;
  color: #666;
  top: 50%;
  transform: translateY(-50%);
}*/

/* SVGアイコン */
.icon-img {
height:3.5vh;
/*  margin-left: 8px;*/
}

/* サブメニュー */
.submenu {
  overflow: hidden;
  max-height: 0;
  opacity: 0;
  transition: max-height 1s ease, opacity 1s ease;
  background: #eee;
}

.submenu.show {
  max-height: 100vh;
/*  max-height: 500px;*/
  opacity: 1;
}

.submenu li a {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.5em 1em 0.5em 2.5em;
/*  padding: 12px 16px 12px 40px;*/
  border-bottom: 1px solid #ccc;
  text-decoration: none;
  color: #333;
  line-height: 1.3em;
  position: relative;
}

ul.submenu {
  border-top: none;
}
/*
.submenu li a::before {
  content: '>';
  position: absolute;
  left: 2.5em;
  font-size: 1.2em;
  color: #666;
}*/


}