/*----------------------
   ハンバーガーメニュー
------------------------*/
#hamburger,
#hamburger span{
  display: inline-block;
  box-sizing: border-box;

  transition: all 0.4s ease;
  -webkit-transition: all 0.4s ease;
  -moz-transition: all 0.4s ease;
  -o-transition: all 0.4s ease;
}
#hamburger{
  position: fixed;
  top: 12px;
  right: 10px;
  width: 25px;
  height: 25px;
  z-index: 650;
  cursor: pointer;
}
#hamburger span{
  position: absolute;
  left: 0;
  width: 100%;
  height: 3px;
  border-radius: 0;
}
/*クリック前*/
#hamburger span:nth-of-type(1){
  top: 0;
  background-color: #FFF;
}
#hamburger span:nth-of-type(2){
  top: 8px;
  background-color: #FFF;
}
#hamburger span:nth-of-type(3){
top: 16px;
  bottom: 0;
  background-color: #FFF;
}
/*クリック後*/
#hamburger.active{
  /*position: fixed;*/
}
#hamburger.active span:nth-of-type(1){
  -webkit-transform: translateY(4px) rotate(-45deg);
  transform: translateY(4px) rotate(-45deg);
  background-color: #FFF;
}
#hamburger.active span:nth-of-type(2){
  opacity: 0;
}
#hamburger.active span:nth-of-type(3){
  -webkit-transform: translateY(-12px) rotate(45deg);
  transform: translateY(-12px) rotate(45deg);
  background-color: #FFF;
}


/*---------------------------------
  グローバルナビ（PC・スマホ兼用）
----------------------------------*/
#navigation{
  height: 0;
  overflow: hidden;
  position: fixed;
  top: 43px;
  right: 0;
  z-index: 600;
  color: #fff;
  font-size: 15px;
  text-align:center;
  background-color: #3399ff;
  /*--　width:50%; 左右幅-----*/

  transition: all 0.5s ease-in-out;
  -webkit-transition: all 0.5s ease-in-out;
  -moz-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out;
}


@media screen and (max-width: 768px) {
 #navigation{
 width:100%;

}
}

#navigation.on{
  height: 570px;   /*--　高さ-----*/
}
  #navigation ul,
  #navigation li{
    margin: 0;
    padding: 12px 20px; /*--　0から変更-----*/
    position: relative;
  }
  #navigation li{
    display: block;
    border-right: solid 0 rgba(255, 255, 255, 0.4);
    border-bottom: solid 1px rgba(255, 255, 255, 0.4);  
  }
   #navigation li.first{
   padding-top: 5px
  }
  
  #navigation li.last{
    border-bottom: none;  
  }

    #navigation li a{
      display: block;
      /*--　padding: 15px 55px;-----*/

      transition: all 0.4s ease;
      -webkit-transition: all 0.4s ease;
      -moz-transition: all 0.4s ease;
      -o-transition: all 0.4s ease;
    }
    #navigation li a:link   { text-decoration:none; color: #ffffff; }
    #navigation li a:visited{ text-decoration:none; color: #ffffff; }
    #navigation li a:active { text-decoration:none; color: #ffffff; }
    #navigation li a:hover  { text-decoration:none; color: #ffff00; }
    #navigation li.type02 a:hover  { text-decoration:none; color: #ffffff; background-color: rgba(246, 15, 75, 0.7); }


 #navigation li p.submenu{
   line-height:2.2em; 
  }
