@charset "UTF-8";
/* CSS Document */
#g-nav ul{
width: 99.996%;
margin:0 auto;
padding: 0;
list-style: none;
text-align: center;
font-size: 0;
box-sizing: border-box;
z-index: 10000000;
position: relative;

}
#g-nav li{
margin: 0;
padding: 0;
width: 20%;
width : -webkit-calc(100% / 5) ;
width : calc(100% / 6) ;
display: inline-block;
box-sizing: border-box;
border: 0;
background-color: #fff;
}

/* Submenu */
 
#g-nav ul li ul{
    position: absolute;
    top: 100%;
    left: 0;
}
#g-nav ul li ul li{
    display: block;
	font-size: 16px;
	width: 100%;
}
#g-nav ul li ul li a{
    color: #fff;
	text-decoration: none;
	display: block;
	padding: 10px;
}

#g-nav ul li ul li a:hover{
    background-color: #fff;
	color: #333;
}
#g-nav ul li ul{
    display: none;
}
#g-nav ul li:hover ul{
    display: block;
}
#g-nav ul li ul.nav-b{
padding: 5px;
background-color:#006AD7;
}
#g-nav ul li ul.nav-g{
padding: 5px;
background-color:#00B697;
}
#g-nav ul li ul.nav-or{
padding: 5px;
background-color:#FFBD2B;
}
.nav-b li a{
background-color:#006AD7;
}
.nav-g li a{
background-color:#00B697;
}
.nav-or li a{
background-color:#FFBD2B;
}
/* 480px〜599px：SP横
------------------------------ */
@media screen and (min-width:480px) and (max-width:599px) { 
#g-nav ul li ul{
    position: absolute;
    top: 100%;
    left: 0;
}
}
  
/* 600px〜959px：タブレット
------------------------------ */
@media screen and (min-width:600px) and (max-width:959px) {
#g-nav ul li ul{
    position: absolute;
    top: 100%;
    left: 0;
	z-index: 100000000;
}
}
/* 1280px〜：大型PC
------------------------------ */
@media screen and (min-width:1280px) {
#g-nav{
max-width: 800px;
margin: 0 auto;
z-index: 10000;
position: relative;
top: -30px;
}
#g-nav ul li ul{
    position: absolute;
    top: 100%;
    left: 0;
	z-index: 100000000;
}
}
/*max-width:800px6個のアイコンの時*/
/*max-width:650px5個のアイコンの時*/