@charset "UTF-8";
/*黄色*/
/*茶色*/
/*明るい緑*/
/*薄いベージュ*/
/*薄い黄色*/
/*薄いグレー*/
/*薄いグレー*/
/*薄いグレー*/
/*青*/
#spmenu { display: none; }

@media screen and (max-width: 420px) { #spmenu { display: block; }
  body.fixed { position: fixed; width: 100%; height: 100%; }
  .overlay { background: rgba(0, 0, 0, 0.5); width: 100vw; height: 100vh; position: fixed; top: 0; left: 0; z-index: 3; display: none; overflow: hidden; }
  .overlay.active { display: block; }
  #header_over { position: relative; z-index: 99; }
  #spmenu { position: absolute; top: 0; right: 0; z-index: 9999; font-size: 14px; }
  #spmenu nav.globalMenuSp { position: fixed; z-index: 9999; top: 0; left: 0; background: #fff; color: #000; text-align: center; transform: translateY(-100%); transition: all 0.6s; width: 100%; max-height: calc(100% - 55px); overflow-y: scroll; overflow-x: hidden; }
  #spmenu nav.globalMenuSp ul { background: #fff; margin: 0 auto; padding: 0; width: 100%; }
  #spmenu nav.globalMenuSp ul li { list-style-type: none; text-align: left; position: relative; padding: 0; width: 100%; }
  #spmenu nav.globalMenuSp ul li span { position: absolute; right: 17px; top: 0; }
  #spmenu nav.globalMenuSp ul li:last-child { padding-bottom: 0; border-bottom: none; }
  #spmenu nav.globalMenuSp ul li a { display: block; padding: 5px 0 5px 10px; }
  #spmenu nav.globalMenuSp.active { transform: translateY(50px); }
  #spmenu .navToggle { display: block; position: absolute; right: 5px; top: 0px; width: 42px; height: 51px; cursor: pointer; z-index: 3; text-align: center; }
  #spmenu .navToggle span { display: block; position: absolute; width: 30px; border-bottom: solid 4px #eee; -webkit-transition: .35s ease-in-out; -moz-transition: .35s ease-in-out; transition: .35s ease-in-out; left: 6px; }
  #spmenu .navToggle span:nth-child(1) { top: 9px; }
  #spmenu .navToggle span:nth-child(2) { top: 18px; }
  #spmenu .navToggle span:nth-child(3) { top: 27px; }
  #spmenu .navToggle span:nth-child(4) { border: none; color: #eee; font-size: 10px; line-height: 1; font-weight: normal; top: 34px; }
  #spmenu .navToggle.active span:nth-child(1) { top: 18px; left: 6px; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); transform: rotate(-45deg); }
  #spmenu .navToggle.active span:nth-child(2), #spmenu .navToggle.active span:nth-child(3) { top: 18px; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); transform: rotate(45deg); }
  #spmenu #mdropmenu { width: 100%; max-width: 500px; list-style-type: none; border: 1px solid #ccc; border-top: 0; }
  #spmenu #mdropmenu a { color: #434343; text-decoration: none; }
  #spmenu #mdropmenu a:hover { color: #434343; }
  #spmenu #mdropmenu i { font-size: 1.4em; color: #554614; }
  #spmenu #mdropmenu i.fa-angle-right { font-size: 2em; }
  #spmenu #mdropmenu li { border-bottom: 1px solid #E3C126; }
  #spmenu #mdropmenu li:last-child { border-bottom: none; }
  #spmenu #mdropmenu li ul { display: none; list-style-type: none; }
  #spmenu #mdropmenu .secondmenu { background-color: #FFFCF4; width: 95%; margin: 0 auto 10px auto; border: 1px solid #E3C126; }
  #spmenu #mdropmenu .secondmenu li { border-bottom: 1px #E3C126 dotted; }
  #spmenu #mdropmenu .secondmenu li:last-child { border-bottom: none; }
  #spmenu #mdropmenu .secondmenu li i { color: #E3C126; }
  #spmenu #mdropmenu .secondmenu li a { display: block; position: relative; }
  #spmenu #mdropmenu .secondmenu li a:after { content: '\f105'; font-family: 'Font Awesome 5 Free'; font-weight: 900; padding: 0; margin: 0 auto; color: #E3C126; position: absolute; top: 50%; right: 10px; transform: translateY(-50%); text-align: center; }
  #spmenu #mdropmenu .secondmenu li a.telnumber:after { content: '\f095'; }
  #spmenu #mdropmenu .secondmenu li a .minitext { font-size: 0.8em; line-height: 1.2; }
  #spmenu #mdropmenu .listcaption { font-size: 0.9em; line-height: 1.2; padding: 20px; }
  #spmenu #mdropmenu .thirdmenu { background-color: #FFFCF4; width: 95%; margin: 0 auto 10px auto; }
  #spmenu #mdropmenu .thirdmenu i { color: #E3C126; }
  #spmenu .closebtn { background-color: #554614; color: #fff; padding: 10px; margin-top: 40px; }
  #spmenu .mlist-left { width: 80%; padding: 5px; vertical-align: middle; }
  #spmenu .mlist-right { vertical-align: middle; text-align: center; padding: 5px; }
  #spmenu .mlist-full { width: 100%; padding: 5px; vertical-align: middle; }
  #spmenu .mleft-second, #spmenu .mright-second { background-color: #F2F2F2; }
  #spmenu .mleft-third, #spmenu .mright-third { background-color: #D8D8D8; }
  #spmenu .mleft-second { padding-left: 10px; }
  #spmenu .mleft-third { padding-left: 15px; } }
