#category-navigation-wrapper .category-navigation-list {
	width: 56%;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	text-align: justify
} 
#category-navigation-wrapper .category-navigation-list .category-item {
	width: 16rem; margin-bottom: 1.5rem;
}


/* #category-navigation-wrapper .category-navigation-list {
	width: 100%;max-width: 1080px; 
	min-height: 8rem;

}

#category-navigation-wrapper .category-navigation-list .category-item {
	width: 16rem; margin-bottom: 1.5rem; display: inline-block; margin:0 auto; text-align: center;
	margin-right: 1.5rem;
} */
#category-navigation-wrapper .category-navigation-list .category-item:last-child{margin-right: 0rem;}
#category-navigation-wrapper .category-navigation-list .category-item img {
	width:16rem;
}

 #category-navigation-wrapper .category-navigation-list .category-item a{
	width: 16rem;height: 8rem; border:1px solid #373737; display: inline-block; text-align: center;
} 
 #category-navigation-wrapper .category-navigation-list .category-item a h2 {
	padding-top:2.2rem ; line-height: 2.4rem; font-size: 1.8rem;
} 
 #category-navigation-wrapper .category-navigation-list .category-item a p {
	padding-top:0.5rem ; line-height: 1.2rem; font-size: 0.8rem; color: #999;
} 
#category-navigation-wrapper .category-navigation-list .change_c {}
#category-navigation-wrapper .category-navigation-list .change_c a, 
 #category-navigation-wrapper .category-navigation-list .category-item:hover a {background:#99cc33; border:1px solid #99cc33;}
#category-navigation-wrapper .category-navigation-list .change_c a h2,
#category-navigation-wrapper .category-navigation-list .change_c a p,
#category-navigation-wrapper .category-navigation-list .category-item:hover:hover a h2,
#category-navigation-wrapper .category-navigation-list .category-item:hover:hover a p{color:#fff;}

#category-content .new-project-list {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	width: 100%
}

#category-content .new-project-list .project-item {
	position: relative;
	width: 240px;
	height: 240px;
	background-size: contain;
	overflow: hidden
}

#category-content .new-project-list .project-item:hover .project-item-mask {
	display: none;
	top: 0
}

#category-content .new-project-list .project-item a {
	width: 100%;
	height: 100%;
	display: block
}

#category-content .new-project-list .project-item .project-item-mask {
	position: absolute;
	-webkit-transition: all 1s;
	transition: all 1s;
	top: 100%;
	padding: 1.4rem;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-flow: column;
	flex-flow: column;
	width: 100%;
	height: 100%;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	background-color: #62ad30;
	color: #fff
}

#category-content .new-project-list .project-item .project-item-mask .project-item-type {
	line-height: 1.5em;
	font-size: .9em
}

#category-content .new-project-list .project-item .project-item-mask .project-item-type:after {
	content: '';
	margin-top: .35rem;
	display: block;
	width: 2.5rem;
	height: 0;
	border-top: 1px solid #fff
}

#category-content .new-project-list .project-item .project-item-mask .project-item-title {
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	font-size: 1.2rem;
	text-align: center
}

#category-content .new-project-list {
	-ms-flex-wrap: wrap;
	flex-wrap: wrap
}

@media screen and (max-width:576px) {
	#category-navigation-wrapper {
		padding: 2rem 0
	}
	#category-navigation-wrapper .category-navigation-list {
		-ms-flex-wrap: wrap;
		flex-wrap: wrap
	}
	#category-navigation-wrapper .category-navigation-list li {
		margin-right: .5rem;
		width: 20%
	}
}