@charset "utf-8";

/* ===================================================================
CSS information
 file name  :  list.css
 style info :  
=================================================================== */

/* ************************************************ 
 *	部位選択テーブル追加処理2021-02-06 oda
 * ************************************************ */
.table4-2 {
	width:100%;
}
.table4-2 td {
	border: 1px solid #595959;
	border-radius:5px;
	padding: 3px;
	text-align: center;
}
.table4-2 tr {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr;
	grid-template-rows: 1fr 1fr;
}
@media screen and (max-width: 560px) {
.table4-2 tr {
	display: grid;
	grid-template-columns: 1fr 1fr;
	grid-template-rows: 1fr 1fr 1fr;
}
}
.table4-2 img {
	border: 0 !important;
}

/* ************************************************ 
 *	容量・部位選択テーブル用ボタン追加 2022-12-31 oda
 *	改良2025-03-25 oda
 * ************************************************ */
.container4-3 {
	display: flex;
	flex-wrap: wrap;
}
.container4-3 div {
	padding: 1px;
}

.btn-ex {
/*  font-size: 1.6rem; */
/*  font-weight: 700; */
/*  line-height: 1.5; */
  position: relative;
  display: inline-block;
  padding: 2px;
  white-space: nowrap; /* safari対応 */
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
  letter-spacing: 0.1em;
/*  color: #212529; */
  border-radius: 0.5rem;
  border: 1px solid #000000;
  width: calc(100% - 6px);
}
.btn-ex > img {
  pointer-events: none;
}
a.btn-ex {
  cursor: pointer;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}
a.btn-ex--select {
  color: #000;
  background-color: #e8e8e8;
  border-bottom: 5px solid #000000;
}

a.btn-ex--select:hover {
  margin-top: 3px;
  color: #000;
  background: #fff20a;
  border-bottom: 2px solid #000000;
  text-decoration: none;
}

.btn-ex--on {
  margin-top: 3px;
  color: #000;
  background: #ff80ff;
  border-bottom: 2px solid #000000;
}

/* ************************************************ 
 *	カテゴリーメニュー用 2025-04-08 oda
 *	改良2025-04-17 oda
 * ************************************************ */
.cat-menu {
  width:154px;
}
.cat-menu-img {
  max-width:146px !important;
  height:110px !important;
  object-fit: cover;
}
@media screen and (max-width: 355px) {
.cat-menu {
  width:136px;
  font-size:11px;
}
.cat-menu-img {
  max-width:128px !important;
}
}

/* ************************************************ 
 *	商品一覧・検索結果・詳細ページ
 * ************************************************ */

/* ------------------------------------- 
 *	商品一覧・検索結果//アイテムリストの設定（一行表示の設定）
 * ------------------------------------- */

table.list {
	width:99.5%;
	border-top:1px #FF6600 solid;
	border-bottom:1px #FF6600 solid;
}

table.list td {padding:10px 5px;}

/* 商品の名前 */
table.list div.name {
	margin-right:100px;
}

/* 商品の値段 */
table.list div.price {
	color:#CC0000;
	width:170px;
	float:right;
	text-align:right;
}
/* 商品の簡易説明 */
table.list {margin-top:10px;}


/* 並び順 */
.sort {
	text-align:right;
	margin-bottom:5px;
}
.sort span,strong {
	padding:0px 7px;
}

/* ページナビ（全 [*] 商品中 [*-*] 商品を表示しています。） */
.pagenavi {
margin:5px 0;
}

.pagenavi span {
	padding:0px 7px;
	color:#FF6600;
}

/* ------------------------------------- 
 *	商品一覧・検索結果・詳細ページ共通
 * ------------------------------------- */

/* カテゴリーの名前（背景：薄オレンジ） */
.category_title {
	background:#FFD5AC url(https://img.shop-pro.jp/tmpl_img/17/category_title.gif) no-repeat;
	background-position:6px;
	color:#333; /*商品カテゴリー名・商品名文字色(商品詳細・商品一覧結果共通)*/
	font-weight:bolder;
	padding:3px 20px;
}

dd#group-list {
	border-top:#FFF dotted 2px;
	padding:0px;
	margin:0px;
	height:1px;
	line-height:0px;
}

.group-list-link {
	margin:5px 0px 0px;
}

/* カテゴリ・グループのフリースペース内全体の指定 */
.cg_freespace_01 {
	padding:0 5px 0 5px;
	margin-bottom:20px;
}
.cg_freespace_02 {
	padding:0 5px 0 5px;
	margin-bottom:20px;
}
/* カテゴリ・グループのフリースペース内の画像につける枠線の指定 */
.cg_freespace_01 img,
.cg_freespace_02 img {
	border:1px solid #CCCCCC;
}
/* カテゴリ・グループのフリースペース内の<p>タグの余白設定 */
.cg_freespace_01 p,
.cg_freespace_02 p {
	margin:0 0 10px 0;
}
/* カテゴリ・グループのフリースペース内の<ul>タグの余白設定 */
.cg_freespace_01 ul,
.cg_freespace_02 ul {
	margin:0 0 10px 20px;
	padding:0;
}