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

  #nav .navGlobal{
    display: flex;
    justify-content: space-between;
    background: none;
  }
  #nav .navGlobal li {
    padding: 0;
    margin: 0;
    width: 185px;
    height: 38px;
    background-size: contain;
  }

  #nav .navGlobal li img{
    display: none;
    
  }
  #nav .navGlobal li a{
    display: block;
    height: 100%;
    
  }


.navHome{
  background: url("../img/gnav01.jpg") no-repeat left top;
}
.navHome:hover{
  background: url("../img/gnav01_on.jpg") no-repeat left top;
}

.navItem1{
  background: url("../img/gnav02.jpg") no-repeat left top;
}
.navItem1:hover{
  background: url("../img/gnav02_on.jpg") no-repeat left top;
}

.navItem2{
  background: url("../img/gnav03.jpg") no-repeat left top;
}
.navItem2:hover{
  background: url("../img/gnav03_on.jpg") no-repeat left top;
}

.navItem3{
  background: url("../img/gnav04.jpg") no-repeat left top;
}
.navItem3:hover{
  background: url("../img/gnav04_on.jpg") no-repeat left top;
}

.navItem5{
  background: url("../img/gnav05.jpg") no-repeat left top;
}
.navItem5:hover{
  background: url("../img/gnav05_on.jpg") no-repeat left top;
}



/* navのhover用画像を裏で読み込ませる */
#nav::after {
  content: "";
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
  background:
    url("../img/gnav01_on.jpg") no-repeat -9999px -9999px,
    url("../img/gnav02_on.jpg") no-repeat -9999px -9999px,
    url("../img/gnav03_on.jpg") no-repeat -9999px -9999px,
    url("../img/gnav04_on.jpg") no-repeat -9999px -9999px,
    url("../img/gnav05_on.jpg") no-repeat -9999px -9999px;
}