@charset "UTF-8";
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  list-style-type: none;
  text-decoration: none;
  font-family: "Noto Sans JP"; }

.globalMenuSp {
  display: none; }

@media (min-width: 768px) {
  /*　ハンバーガーボタン　*/
  .hamburger {
    display: none; } }
@media (max-width: 768px) {
  /*　ハンバーガーボタン　*/
  .hamburger {
    display: block;
    position: fixed;
    z-index: 20000;
    right: 20px;
    top: 20px;
    width: 52px;
    height: 52px;
    cursor: pointer;
    text-align: center;
    width: 52px;
    height: 51px;
    background: white;
    border-radius: 3px; }
    .hamburger:after {
      content: "MENU";
      position: absolute;
      font-size: 10px;
      color: black;
      top: 30px;
      left: 11px; }

  .hamburger span {
    display: block;
    position: absolute;
    width: 28px;
    height: 2px;
    left: 12px;
    background: black;
    -webkit-transition: 0.3s ease-in-out;
    -moz-transition: 0.3s ease-in-out;
    transition: 0.3s ease-in-out; }

  .hamburger span:nth-child(1) {
    top: 10px; }

  .hamburger span:nth-child(2) {
    top: 18px; }

  .hamburger span:nth-child(3) {
    top: 26px; }

  /* ナビ開いてる時のボタン */
  .hamburger.active span:nth-child(1) {
    top: 18px;
    left: 12px;
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    transform: rotate(-45deg);
    background: black; }

  .hamburger.active span:nth-child(2),
  .hamburger.active span:nth-child(3) {
    top: 18px;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    transform: rotate(45deg);
    background: black; }

  .hamburger.active:after {
    content: "CLOSE";
    top: 30px;
    left: 10px;
    color: black; }

  nav.globalMenuSp {
    display: block;
    position: fixed;
    overflow: auto;
    z-index: 9999;
    top: 0;
    left: 0;
    color: #000;
    /*background: linear-gradient(-45deg, rgba(249,233,197,1) 0%, rgba(234,138,151,1) 75%, rgba(189,147,236,1) 100%);*/
    background-color: #2F74B3;
    text-align: center;
    transform: translateX(100%);
    transition: all 0.6s;
    width: 100%;
    height: 100vh;
    padding-top: 50px; }
    nav.globalMenuSp .d0 {
      float: left;
      width: 100%;
      margin: 0 0 5px 0;
      padding: 10px 0;
      border-bottom: 1px solid #999;
      color: #eee; }
    nav.globalMenuSp .d1:last-of-type a {
      border-bottom: none; }
    nav.globalMenuSp .d1 a {
      float: left;
      width: 100%;
      margin: 0 0 0 0;
      padding: 8px 0;
      border-bottom: 1px solid white;
      color: #eee;
      text-align: left; }
    nav.globalMenuSp .d2 {
      float: left;
      width: 100%;
      margin: 0;
      padding: 0 0 0 20px;
      box-sizing: border-box;
      color: #eee; }
    nav.globalMenuSp .d2 a {
      float: left;
      width: 100%;
      margin: 0;
      padding: 10px 0 10px 0px;
      box-sizing: border-box;
      color: white; }
    nav.globalMenuSp .d2 a i {
      color: white; }
    nav.globalMenuSp .level01 li {
      float: left;
      width: 100%;
      margin: 0 0 5px 0;
      padding: 11px 0;
      border-bottom: 1px solid white;
      color: #eee; }
    nav.globalMenuSp .level02 li {
      float: left;
      width: 100%;
      margin: 0 0 0 1.5em;
      padding: 0;
      color: #eee; }
    nav.globalMenuSp .level02 li a {
      margin-left: 20px; }
    nav.globalMenuSp .level02 {
      margin: 0 0 0 0;
      padding: 0; }
    nav.globalMenuSp .d-menu {
      width: 100%;
      height: calc(100vh);
      padding: 50px 25px 0 25px;
      box-sizing: border-box;
      overflow: auto;
      -webkit-overflow-scrolling: touch; }
    nav.globalMenuSp dl.accordion {
      float: left;
      width: 100%;
      margin: 0 auto;
      padding: 0 0;
      font-size: 15px; }
    nav.globalMenuSp dl.accordion dt {
      width: 100%;
      padding: 12px 0 10px 0px;
      border-bottom: 1px solid white;
      height: auto;
      text-indent: 0;
      line-height: 1.5em;
      color: #eee;
      cursor: pointer;
      text-align: left; }
    nav.globalMenuSp dl.accordion dt.d2 {
      margin-left: 20px; }
    nav.globalMenuSp dl.accordion dt.open {
      color: #eee; }
    nav.globalMenuSp dl.accordion dt span {
      color: white; }
    nav.globalMenuSp dl.accordion dt.open svg {
      transform: rotate(90deg); }
    nav.globalMenuSp dl.accordion dd {
      float: left;
      width: 100%;
      padding: 0;
      line-height: 1.5em;
      display: none;
      text-align: left;
      overflow: hidden;
      color: white; }

  /*	nav.globalMenuSp ul{
  		
  		position: absolute;	
  		text-align:left;
  		
  		    li {
          
          list-style-type: none;
    padding: 0;
  		text-align: left;
  		display: inline-block;
  		vertical-align: top;
  		width: 165px;
  		text-align: left;
          
             a {
          
            display: inline-block;
  			   vertical-align: middle;
    color: white;
    padding: 3px 0;
    text-decoration :none;
      font-size: 14px;
      font-weight: bold;
  	text-align: left;
  			   
  			   &:before {
  				   
  				   content: url("../img/naviArrow.svg");
  				   width: 20px;
  				   height: 20px;
  				   display: inline-block;
  				   vertical-align: middle;
  				   text-align: left;
  				   margin-right: 10px;
  				   margin-top: -1px;
  			   }
          
      }
  
  
      }
  
  		
  	}*/
  /*nav.globalMenuSp ul:first-of-type {
    position: absolute;
  	top: 90px;
  	left: 20px;
  	text-align:left;
      
  
  
  
  }
      
      nav.globalMenuSp ul:nth-of-type(2) {
      position: absolute;
  		top: 220px;
  		left: 20px;
      
      li {
          
          list-style-type: none;
    padding: 0;
    width: 100%;
      margin-bottom: 8px;
          
          dl {
              
              dt {
                  
                  color: yellow;
                  font-size: 12px;
      font-weight: bold;
  	text-align: left;
  				margin-bottom: 5px;
                  
                  span {
                      
                      font-size: 14px;
  					color: yellow;
                      
                  }
  				
  			}
                  
                  dd {
                      
                               a {
          
            display: block;
    color: white;
    padding: 3px 0;
    text-decoration :none;
      font-size: 14px;
      font-weight: bold;
  	text-align: left;
  	width: auto;
  								 
  								 
  								    &:before {
  				   
  				   content: url("../img/naviArrow.svg");
  				   width: 20px;
  				   height: 20px;
  				   display: inline-block;
  				   vertical-align: middle;
  				   text-align: left;
  				   margin-right: 10px;
  										margin-top: -1px;
  			   }
          
      }
                      
                      
                  }
          }
          
      }
  		
  		li:nth-of-type(2) {
  			
  			position: absolute;
  			top: 0;
  			left: 167px;
  
  			dl {
  				
  				dd {
  					
  					width: 165px;
  				}
  			}
  			
  		}
  		
  				li:nth-of-type(3) {
  			
  			position: absolute;
  			top: 204px;
  			left: 165px;
  
  			dl {
  				
  				dd {
  					
  					width: 185px;
  				}
  			}
  			
  		}
  		
  						li:nth-of-type(4) {
  			
  			position: absolute;
  			top: 250px;
  			left: 0px;
  
  			dl {
  				
  				dd {
  					
  					width: 185px;
  				}
  			}
  			
  		}
  		
  				li:nth-of-type(5) {
  			
  			position: absolute;
  			top: 324px;
  			left: 0px;
  					width: 200px;
  
  			dl {
  				
  				dd {
  					
  					width: 255px;
  				}
  			}
  			
  		}*/
  /* このクラスを、jQueryで付与・削除する */
  nav.globalMenuSp.active {
    transform: translateX(0%); } }
