
/*
上部固定ナビゲーションのスタイル
*/

#floatNav{
    width:100%;
}

#floatNav nav{
    max-width: 1300px;
    margin: 0 auto;
    background:rgba(242, 242, 242, 0.9);
}

#floatNav li{
    width:16.666666%;
    float:left;
    display: block;
    box-sizing: border-box;
    /* font-size: 14px; */
}
#floatNav li a{
    display: block;
    padding: 10px 0;
    box-sizing: border-box;
    cursor: pointer;
    position: relative;
    text-decoration: none; /* 下戦なし　*/
    text-align: center ;
    color: #333333 ;
    background:rgba(242, 242, 242, 0.9);
}

#floatNav li a div{
    vertical-align: middle;
    text-align: center;
    min-height: 26px;
}

#floatNav li a:hover{
    color: #00b0f0;
    border-bottom: 3px solid #00b0f0 ;
}


#floatNav li:not(:last-child) a div{
    border-right: 1px solid #999999;
}

#floatNav.fixed{
    position:fixed;
    top:0;
    left:0;
    z-index: 9999;
}

/* 選択中の強調色 */
.company #floatNav li a.company{
    color: #00b0f0;
    cursor: default;
    border-bottom: 3px solid #00b0f0 ;
}
.message #floatNav li a.message{
    color: #00b0f0;
    cursor: default;
    border-bottom: 3px solid #00b0f0 ;
}
.vision #floatNav li a.vision{
    color: #00b0f0;
    cursor: default;
    border-bottom: 3px solid #00b0f0 ;
}
.charm #floatNav li a.charm{
    color: #00b0f0;
    cursor: default;
    border-bottom: 3px solid #00b0f0 ;
}
.access #floatNav li a.access{
    color: #00b0f0;
    cursor: default;
    border-bottom: 3px solid #00b0f0 ;
}
/*以下、スマホ対応*/
@media screen and (max-width:600px){
	#floatNav nav {
		font-size: 12px;
	}
}
@media screen and (max-width:450px){
	#floatNav li a.education div {
		padding-left: 4px;
	}
	#floatNav li a.welfare div {
		padding-left: 4px;
	}	
	#floatNav li:not(:last-child) a div {
		border-right: none;
	}
	/* 選択中の強調色 */
	.company #floatNav li a.company{
	    border-bottom: none ;
	}
	.charm #floatNav li a.charm{
	    border-bottom: none ;
	}
	.education #floatNav li a.education{
		border-bottom: none ;
	}
	.welfare #floatNav li a.welfare{
	    border-bottom: none ;
	}
	.access #floatNav li a.access{
	    border-bottom: none ;
	}
	#floatNav li a:hover {
		border-bottom: none ;
	}
}
