/* st-navi style */
#st-navi {
	background-color: #f6f6f6;
	border-top: solid 1px #dddddd;
	border-bottom: solid 1px #dddddd;
	}

#st-navi ul {
	display: block;
	margin: 0px auto;
  padding: 0;
	width: 800px;
	}

#st-navi li {
	float: left;
  list-style: none;
  margin: 0;
  padding: 0;
	text-align: center;
	width: 80px;
	border-left: none;
}
#st-navi li a {
  display: block;
  transition-property: background-color;
  transition-duration: 0.6s;
  transition-timing-function: ease-in-out;
}
#st-navi li#topNavi1 a:hover {
  background-color: #FFCDD2;
}
#st-navi li#topNavi2 a:hover {
  background-color: #F8BBD0;
}
#st-navi li#topNavi3 a:hover {
  background-color: #E1BEE7;
}
#st-navi li#topNavi4 a:hover {
  background-color: #D1C4E9;
}
#st-navi li#topNavi5 a:hover {
  background-color: #C5CAE9;
}
#st-navi li#topNavi6 a:hover {
  background-color: #BBDEFB;
}
#st-navi li#topNavi7 a:hover {
  background-color: #B3E5FC;
}
#st-navi li#topNavi8 a:hover {
  background-color: #B2EBF2;
}
#st-navi li#topNavi9 a:hover {
  background-color: #B2DFDB;
}
#st-navi li#topNavi10 a:hover {
  background-color: #C8E6C9;
}
#st-navi li#topNavi11 a:hover {
  background-color: #DCEDC8;
}
#st-navi li#topNavi12 a:hover {
  background-color: #F0F4C3;
}
#st-navi li#topNavi13 a:hover {
  background-color: #FFF9C4;
}
#st-navi li#topNavi14 a:hover {
  background-color: #FFECB3;
}
#st-navi li#topNavi15 a:hover {
  background-color: #FFE0B2;
}

#st-navi li img {
	width: 70px;
}
ul.clearfix:before,
ul.clearfix:after {
	content: "";
	display: table;
}
ul.clearfix:after {
	clear: both;
}
@media screen and (max-width: 1119px) {
	#st-navi {
    overflow-y: hidden;
    overflow-x: scroll;
    -ms-overflow-style: -ms-autohiding-scrollbar;
    -webkit-overflow-scrolling: touch;
    width: 100%;
  }
  #st-navi ul {
    display: block;
  }
}