/* Y'S GEAR | Y'S GEAR CLUB WEB : category.css */


/*======================================================================*
 *  [ categoryList ] 
 *======================================================================*/

.categoryList {
	float: left;
	/* width: 73.06122449%; */
	width: 75%;
	margin: 0 0 30px 0;
	padding: 0 19px 0 0;
	box-sizing: border-box;
}

.categoryList .categoryMain { margin: 0 0 15px 0; }

.categoryList article { margin: 0 0 15px 0; }
.categoryList figure {
	box-sizing: border-box;
	float: left;
	margin: 0;
	width: 31.2%; }
.categoryList h2, 
.categoryList p {
	box-sizing: border-box;
	float: right;
	margin: 0;
	padding: 0 0 0 15px;
	width: 68.8%; }
.categoryList h2 { margin: 1% 0; }
.categoryList p {
	font-size: 14px;
	font-size: 1.4rem;
	line-height: 1.4;
}


/*======================================================================*
 *  [ sideCategory ] 
 *======================================================================*/

.sideCategory {
	float: right;
	/* width: 26.93877551%; */
	width: 25%;
	margin: 0 0 75px 0;
	/* padding: 0 0 0 20px; */
	box-sizing: border-box;
}
.sideCategory h2 {
	background: #e3e3e3;
	color: #656565;
	font-size: 15px;
	font-size: 1.5rem;
	font-family: Arial;
	margin: 0;
	padding: 5px;
	text-align: center;
}
.sideCategory li { list-style-type: none; }
.sideCategory li img { float: right; }
.sideCategory li p {
	display: table-cell;
	font-size: 14px;
	font-size: 1.4rem;
	height: 50px;
	line-height: 110%;
	margin: 0;
	padding: 0 5px 0 1em;
	text-indent: -1em;
	vertical-align: middle;
}

.sideCategory > div {
	padding: 20px 0 0 0;
}
.sideCategory > div a {
	padding: 0;
}


/*======================================================================*
 *  [ Media Queries 980 ] 
 *======================================================================*/

@media screen and (max-width: 980px) {
	
	.categoryList {
		padding: 0 9px 0 10px;
	}

}


/*======================================================================*
 *  [ Media Queries 716 ] 
 *======================================================================*/

@media screen and (max-width: 716px) {
	
	.categoryList {
		float: none;
		width: 100%;
		padding: 0 20px;
	}
	
	.sideCategory {
		float: none;
		width: 100%;
		padding: 0 20px;
	}
	.sideCategory h2 {
		font-size: 18px;
		font-size: 1.8rem;
		line-height: 1.8;
		position: relative;
	}
	.sideCategory li {
		float: left;
		width: 33.33%;
	}
	
	.sideCategory > div {
		clear: both;
	}
	.sideCategory > div a {
		width: 243px;
		margin: 0 auto;
	}

}


/*======================================================================*
 *  [ Media Queries 568 ] 
 *======================================================================*/

@media screen and (max-width: 568px) {
	
	.categoryList { padding: 0 10px; }
	.categoryList .categoryMain { margin: 0 -10px 15px -10px; }
	
	.sideCategory { padding: 0 10px; }
	.sideCategory li { width: 50%; }
	
}


/*======================================================================*
 *  [ Media Queries 375 ] 
 *======================================================================*/

@media screen and (max-width: 375px) {
	
	.sideCategory li { width: 100%; }
	
}


