/*
 Theme Name: Welcart Basic Child
 Template: welcart_basic
 Version: 1.0
*/



.itemimage img {
  width: 100%;
  height: auto;   /* 縦横比を保持 */
  object-fit: contain; /* 枠内に収める（空白ができても良い場合） */
  max-height: 300px;   /* 必要なら縦の最大値を制限 */
}


img {
	margin-bottom: 10px;
	width: 100%;
}

h2.orange_obi{
	background-color: #ff8c00;
	border-bottom:none;
	padding:5px 10px;
	color: #fff;
	font-size:1.5rem;
	font-weight:normal;
}

.wp-block-button__link {
	background-color: #ff8c00;
	font-size: 1em;
	border-radius:5px
}

h1.site-title img, div.site-title img {
	max-width: 100px;
}


.itemprice-ex {
	color: red;
	font-size: 1.5rem;
	text-align: right;
}
.tax {
	font-size: .85rem;
}

/* 1) 商品一覧配下は文字詰めをリセット（根本対策） */
.front-il * { letter-spacing: normal !important; }

/* 2) カテゴリ見出し */
.front-cat-title { margin: 2.5rem 0 1rem; font-size: 1.4rem; font-weight: 700; }

/* 3) 「もっと見る」行の体裁 */
.front-cat-more { text-align: right; margin: 8px 0 24px; }
.front-cat-more a { display: inline-block; white-space: nowrap; line-height: 1.6; text-decoration: none; }
.front-cat-more a::after { content: "→"; margin-left: .25em; }

/* 4) 商品名リンクは行間だけ整える（必要最低限） */
.front-item .itemname a { line-height: 1.6; }



/* 0) 既存レイアウトの影響を打ち消す（重要） */
.front-il { letter-spacing: normal; }                    /* 元の -0.5em を解除 */
.front-cat-grid article { float: none !important;        /* 既存の float 干渉を無効化 */
                         width: auto !important;
                         margin: 0 !important; }

/* 1) グリッド（PC=4列 / タブ=3列 / SP=2列） */
.front-cat-grid{
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 24px;
}
@media (max-width: 1024px){
  .front-cat-grid{ grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 640px){
  .front-cat-grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
  }
}

/* 2) 画像は比率維持で収める */
.front-cat-grid .itemimage img{
  width: 100%;
  height: auto;
  object-fit: contain;
  max-height: 220px; /* 好みで調整 */
}

/* 3) 見出しと「もっと見る」だけ最小限整える */
.front-cat-title{ margin: 2.5rem 0 1rem; font-size: 1.4rem; font-weight: 700; }
.front-cat-more{ text-align: right; margin: 8px 0 24px; }
.front-cat-more a{ display: inline-block; white-space: nowrap; line-height: 1.6; text-decoration: none; }
.front-cat-more a::after{ content: "→"; margin-left: .25em; }




/* 0) 既存テーマの影響を中和 */
.front-il { letter-spacing: normal; }                /* 元の -0.5em を解除 */
.front-cat-grid article { float:none !important;     /* 既存の float を無効化 */
                         width:auto !important; margin:0 !important; }

/* 1) グリッド（PC=4列 / タブ=3列 / スマホ=2列） */
.front-cat-grid{
  display:grid;
  grid-template-columns:repeat(4, minmax(0,1fr));
  gap:24px;
}
@media (max-width:1024px){ .front-cat-grid{ grid-template-columns:repeat(3, minmax(0,1fr)); } }
@media (max-width:640px){ .front-cat-grid{ grid-template-columns:repeat(2, minmax(0,1fr)); gap:16px; } }

/* 2) 画像は比率維持で収める */
.front-cat-grid .itemimage img{
  width:100%; height:auto; object-fit:contain; max-height:220px;
}

/* 3) 見出しと「もっと見る」 */
.front-cat-title{ margin:2.5rem 0 1rem; font-size:1.4rem; font-weight:700; }
.front-cat-more{ text-align:right; margin:8px 0 24px; }
.front-cat-more a{ display:inline-block; white-space:nowrap; line-height:1.6; text-decoration:none; }
.front-cat-more a::after{ content:"→"; margin-left:.25em; }

/* 4) 商品名・価格・在庫の軽い体裁 */
.front-item .itemname{ margin:.5rem 0 .25rem; font-weight:700; line-height:1.5; }
.front-item .itemprice-ex{ font-weight:700; }
.front-item .itemprice-inc{ opacity:.85; font-size:.92rem; }
.front-item .itemstock{ margin-top:.25rem; font-weight:700; }






/* スマホでのはみ出し対策（任意） */
@media (max-width: 480px){
  .front-cat-more{ margin-bottom: 16px; }
}


@media screen and (max-width:620px){
	.wp-block-button__link {
	font-size: .8em;
}
}