@charset "UTF-8";
/* CSS Document */

.product {
	margin:50px 0;
	border:solid 1px #ABABAB;
}

.product-box {
	overflow:hidden;
}

.product-box-b {
	border-top:solid 1px #ABABAB;
}

.product-box img {
	margin:10px;
	float:left;
}

.product-r-box {
	height:100%;
	margin:10px;
}

.product-r-box a {
	text-decoration:none;
}

.product-r-box a:hover {
	color:#CCCCCC;
	text-decoration:underline;
}

.product-r-box h3 {
	margin-top:5px;
}
	
.subject {
	width:100%;
	border-bottom:solid 1px #ABABAB;
	padding-bottom:10px;
}

.text {
	width:100%;
	margin:10px 0;
}



/* smartphone  */
@media screen and (max-width:480px){
	.product-box img {
	width:94.5%;
	margin:10px;
	}
}

/* tablet */
@media screen and (min-width:480px) and ( max-width:768px) {
	.product-box img {
	width:95.8%;
	margin-right:-10px;
	}
}

/* below 769px~1169px */
@media screen and (min-width:769px) and ( max-width:1169px) {
	.product-box img {
	width:62%;
	margin:10px;
	float:left;
	}
	
	.product-r-box {
	width:30%;
	max-height:220px;
	height:auto;
	margin:10px;
	float:left;
	}
	
	.subject {
	width:100%;
	}

	.text {
	width:100%;
	}
}

/* above 1170px */
@media screen and (min-width:1170px) {
	.product-box img {
	margin:10px;
	float:left;
	}

	.product-r-box {
	width:288px;
	height:230px;
	float:left;
	}
}