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


/*--================ rwd grid レスポンジブグリッドシステム new================-- */


/*---------------トップページ column--------------------*/

.col_wrap_misc{
	  padding:20px;
  }

/* --column 1--  */

.col1_plain
{ display:table-cell;
	width:32.2%;
	}

@media handheld, only screen and (max-width: 768px) {
	
.col1_plain
{ width:97%;
	}
	
}

.col1
{
	width:100%;
	}

/* --column 2 expand--  */
.col2_plain_expd,
.col2_expd
{
	width:48.5%;
	margin-right:3%;
	}
	
/* --column 2 expand--  */
.col2_plain_expd,
.col2_non_expd
{
	width:47%;
	margin-right:6%;
	}
	
/* --column 2 break--  */
.col2_plain_brk
{
	width:48.5%;
	margin-right:3%;
	}
	
.col2_brk
{
	width:48.5%;
	margin-right:3%;
	}
	


/*---------------/index column--------------------*/

/*---------------↓対象商品のコラム--------------------*/

/* =====================  ul.column  ========================  */	

ul.column{
    text-align: center;
}

ul.column img{
	width:100%;
	height:auto;
	display:inline-block;
}

ul.column a:hover img{
	opacity:0.8;
}

ul.column li{
    /*border:#dddddd 1px solid;←2025/01/23春CPより削除。製品内に２画像を入れたりする要望のため、仕切りがあると混乱するため*/
	margin-left:0.2%;
	margin-right:0.2%;
	margin-bottom:10px; 
	padding:10px;
	list-style:none;
	text-align:center;
	display:inline-block;
	vertical-align:top;
	box-sizing:border-box;
}

@media handheld, only screen and (max-width: 768px) {
	
  ul.column img{
      width:100%;
      height:auto;
  }
	
}


	
/* =====================  li.col_(num) ーcolumnー  ========================  */	

/*1,2列→モバイル1列*/
li.col_2_to1{ width:32.2%; }

/*1,2列→モバイル2列*/
li.col_2_to2{ width:32.2%; }

/*3列→モバイル2列*/
li.col_3_to2{ width:32.2%; }

/*4列→モバイル2列*/
li.col_4_to2{ width:24%; display: inline; }

/*5列→モバイル2列*/
li.col_5_to2{ width:19%; display: inline; }


/*!--製品サムネイル画像の高さを指定のピクセルサイズに揃えるクラス--*/
.thumbnail_1{height:220px;}
.thumbnail_2{height:180px;}
.thumbnail_2B{height:160px;}
.thumbnail_3{height:150px;}

.thumbnail_1,
.thumbnail_2,.thumbnail_2B,
.thumbnail_3{
    display: inline-block;
}

.thumbnail_1 img,
.thumbnail_2 img,.thumbnail_2B img,
.thumbnail_3 img{
	object-fit: contain;
	max-width: 100%;
	max-height: 100%;
}


@media handheld, only screen and (max-width: 768px) {
	
	li.col_1{ 
		width:80%;
		margin-bottom:2em;
	}
	
	li.col_2_to2,
	li.col_3_to2,
	li.col_4_to2,
	li.col_5_to2{ 
		width:48%;
		margin-bottom:2em;
	}
	
	.thumbnail_1{height:170px;}
	.thumbnail_2{height:150px;}
	.thumbnail_2B{height:130px;}
	.thumbnail_3{height:100px;}
	
}

/* =====================  /li.col_(num) ーcolumnー  ========================  */