@charset "utf-8";

/* item-list
----------------------------------------------------------------------------------*/
#cat01 .ttl{background: #ff0000;}
#cat02 .ttl{background: #ff6600;}

.item-list{
	width: 960px;
	margin:0 -10px 0 0;
	letter-spacing: -0.4em;
	overflow: hidden;
}
.item-list li{
	display: inline-block;
	width: 230px;
	margin: 0 10px 30px 0;
	letter-spacing: normal;
	vertical-align: top;
}
.item-list li p{
	-webkit-box-sizing: content-box;
	-moz-box-sizing: content-box;
	-ms-box-sizing: content-box;
	-o-box-sizing: content-box;
	box-sizing: content-box;
}
.item-list li .name,
.item-list li .comment{
	padding: 10px;
	background: url(../img/bg-w.png) repeat 0 0;
}
.item-list li .price{
	padding: 5px;
	background: url(../img/bg-r.png) repeat 0 0;
}
.item-list li .btn a{
	display: block;
	padding: 10px;
	color: #fff;
	text-align: center;
	border: 1px solid #fff;
}
.item-list li .btn a:hover,
.checkBt:hover img{
	color: #fff;
    opacity:0.70;
    filter: alpha(opacity=70);
	cursor: pointer;
}

#cat01 .item-list .btn{border: 1px solid #d16b6b;}
#cat02 .item-list .btn{border: 1px solid #ff6600;}
#cat01 .item-list .btn a{background: #d16b6b;}
#cat02 .item-list .btn a{background: #ff6600;}



/* item-detail
----------------------------------------------------------------------------------*/
#main-img{
	max-width: 750px;
	margin: 0 0 20px;
}
#main-img img{
	max-width: 100%;
	height: auto;
}
#sub-img{
	margin: 0 -10px;
	overflow: hidden;
}
#sub-img li{
	float: left;
	width: 33.333%;
	padding: 0 10px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-o-box-sizing: border-box;
	box-sizing: border-box;
 }
#sub-img li:first-child{margin: 0;}
#sub-img li img{
	max-width: 100%;
	height: auto;
}
#detail{margin: 22px 0 30px;}
#detail table{
	width: 100%;
	border-top: 1px solid #999999;
	border-bottom: 1px solid #999999;
	border-left: 1px solid #999999;
}
#detail table .odd {background: url(../img/bg-w.png) repeat 0 0;}
#detail table .even{background: url(../img/bg-r.png) repeat 0 0;}

#detail table th,
#detail table td{
	padding: 10px;
	border-right: 1px solid #999999;
}
#detail table th{width: 20%;}
#detail table td{width: 80%;}
#detail #back{
	text-align: center;
}
#cart-area{
	margin: 0 0 30px;
	padding: 15px;
	border-bottom: 1px solid #999999;
	border-right: 1px solid #999999;
	border-left: 1px solid #999999;
	background: #fff;
}
#cart-area ul{text-align: right;}
#cart-area ul li{
	display: inline;
	vertical-align: middle;
}
#cart-area input:hover{
    opacity:0.70;
    filter: alpha(opacity=70);	
}
@media screen and (max-width:768px){
#main-img{
	max-width: 100%;
	margin: 0 0 10px;
}
#sub-img{
	margin: 0 -5px;
}
#sub-img li{
	padding: 0 5px;
}
}