@charset "euc-jp";
/* 標準可変メディア
   メモ : 可変メディアでは、HTML からメディアの高さおよび幅の属性を削除する必要がある
   http://www.alistapart.com/articles/fluid-images/ 
*/
.product-box {
    background: #FFF;
    padding: 30px 5px 30px 5px;
    overflow: hidden;
	width: 100%;
}
		
.productimg {
    float: left;
	width: 100%;
}

.productimg img {
    width: 60%;
    margin:0 auto;
	display: block;	
}

.productsummary {
    font-size: 14px;
    overflow: hidden;
	width: 100%;	
}
.productname {
    font-size: 14px;
    font-weight: bold;
	vertical-align:text-top;
}



/* デスクトップレイアウト : 769 px 〜最大 1232 px。モバイルレイアウトとタブレットレイアウトからスタイルを継承。 */

@media only screen and (min-width: 769px) {

.productimg {
    float: left;
    margin-right: 20px;
	width: 30%;
}
.productsummary {
    font-size: 14px;	
    overflow: hidden;
	width: 60%;	
}
.productname {
    font-size: 14px;
    font-weight: bold;
    margin: 8px;
	vertical-align:text-top;
}
.product-box {
    background: #FFF;
    padding: 50px 10px 50px 22px;
    overflow: hidden;
	width: 50%;
	float: left;
}
	
.product-box img{
  width: 100%;
  cursor: pointer;
  transition-duration: 0.3s;
}

.product-box:hover img{
  opacity: 0.6;
  transition-duration: 0.3s;
}

	
}