@charset "utf-8";
/* CSS Document */
.header-cat-menu{
	font-family:'游ゴシック Medium', '游ゴシック体', 'Yu Gothic Medium', YuGothic, 'ヒラギノ角ゴ ProN', 'Hiragino Kaku Gothic ProN', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
	background-color: #00b0bd;
	font-size:1.1em;
	width: 100%;
}
.header-cat-menu ul{
	margin:5px auto;
	display: flex;
	max-width: 1120px;
	list-style: none;
}
.header-cat-menu li{
	margin:7px 0;
	width: calc(100%/9);
	border-right: #fff dotted 1px;
	position:relative;

}

.header-cat-menu li a{
	width: 100%;
	line-height: 1rem;
	display: block;
	color:#fff;
	text-decoration: none;
	padding:8px;
	margin:3px;
}

.header-cat-menu li a:hover{
	width: 100%;
	line-height: 1rem;
	display: block;
	color:#fff;
	text-decoration: none;
	padding-left: 20%;
}

.header-cat-menu li p{
	font-size: 1.3rem;
}
.header-cat-menu li:after{
   font-family: "Font Awesome 5 Free";
   font-weight: 900;
   font-size: 1.8rem;
   content: "\f0da";
   color: #fff;
   position:absolute;
   top:7px;
   right:10%;


}

.header-cat-menu .last-child {
	border-right: none;
}


.header-cat-menu ul li:visited,
.header-cat-menu ul li:active{
	color: #fff;
}

@media screen and (min-width: 320px) and (max-width: 767px) {
.header-cat-menu{
		display: none;
}
}	

@media screen and (min-width: 768px) and (max-width: 1024px){
.header-cat-menu li a{
	width: 100%;
	font-size: 0.9rem;
	line-height: 1.8rem;
	display: block;
	color:#fff;
	text-decoration: none;
	padding-left: 10%;
}	
}