/* Y'S GEAR : category-contents-top.css */


/*======================================================================*
 *  [ contentsTopBox | コンテンツTOP ]
 *======================================================================*/

.contentsTopBox {
	margin: -1px 0 20px -20px;
	padding: 1px 0 0 0;
}
.contentsTopBox section {
	float: left;
	width: 50%;
	margin: 0 0 20px 0;
	padding: 0 0 0 20px;
	box-sizing: border-box;
}
.contentsTopBox a {
	display: block;
	padding: 5px 15px 15px 15px;
	border: 3px solid #ebebeb;
	box-sizing: border-box;
}
.contentsTopBox section a:hover {
	border-color: #ebebeb !important;
}
.contentsTopBox h2, 
.contentsTopBox h3 {
	position: relative;
	padding: 7px 15px 7px 0;
	border-bottom: 1px solid #ebebeb;
	font-size: 16px;
	font-size: 1.6rem;
}
.contentsTopBox h2:after, 
.contentsTopBox h3:after {
	display: block;
	position: absolute;
	top: 50%;
	right: 0;
	width: 10px;
	height: 10px;
	margin: -6px 3px 0 0;
	border-top: 2px solid #ccc;
	border-right: 2px solid #ccc;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	content: "";
}
html>/**/body .contentsTopBox h2:after, 
html>/**/body .contentsTopBox h3:after { /* [ IE8ハック ] */
	width /*\**/: 9px \9;
	height /*\**/: 18px \9;
	margin /*\**/: -10px 0 0 0 \9;
	border /*\**/: none \9;
	background /*\**/: url(/shared/img/ie8/category-contents-top/icon_arrow.png) \9;
}
.contentsTopBox h2 span, 
.contentsTopBox h3 span {
	font-size: 13px;
	font-size: 1.3rem;
}
.contentsTopBox p {
	margin: 7px 0;
	font-size: 13px;
	font-size: 1.3rem;
	line-height: 1.6;
}

/* [ download | ダウンロードバージョン ] */
.contentsTopBox.download h2:after, 
.contentsTopBox.download h3:after {
	width: 18px;
	height: 16px;
	margin: -9px 0 0 0;
	border-top: none;
	border-right: none;
	-webkit-transform: rotate(0deg);
	transform: rotate(0deg);
}
html>/**/body .contentsTopBox.download h2:after, 
html>/**/body .contentsTopBox.download h3:after { /* [ IE8ハック ] */
	width /*\**/: 18px \9;
	height /*\**/: 16px \9;
	margin /*\**/: -9px 0 0 0 \9;
	border /*\**/: none \9;
	background /*\**/: url(/shared/img/ie8/icon_download.png) \9;
}


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

@media screen and (max-width: 568px) {
	
	/*==================================================================*
	 *  [ contentsTopBox | コンテンツTOP ]
	 *==================================================================*/
	
	.contentsTopBox {
		margin: 0 0 40px 0;
	}
	.contentsTopBox section {
		float: none;
		width: 100%;
		padding: 0;
	}
	
}