/*
Theme Name: Muum Child
Theme URI: https://tcd-theme.com/tcd085
Template: muum_tcd085
Author: TCD
Author URI: https://tcd-theme.com/
Description: WordPress theme "Muum" allows you to create blog sites with rich variations. You can combine three types of headers and two types of post layouts, and even switch the left and right columns, so you can create a completely different site with just one theme.
Version: 3.7.2.1752138278
Updated: 2025-07-10 18:04:38

*/
/* ブロックエディタ全体のデフォルト文字色を黒に */
body.block-editor-page .editor-styles-wrapper {
    color: #000000 !important; /* 黒色を強制適用 */
}

/* 特定のブロック（例: 段落ブロック）の文字色を黒に */
body.block-editor-page .wp-block-paragraph {
    color: #000000 !important;
}

/* その他のテキスト要素も対象にする場合 */
body.block-editor-page p,
body.block-editor-page li,
body.block-editor-page h1,
body.block-editor-page h2,
body.block-editor-page h3,
body.block-editor-page h4,
body.block-editor-page h5,
body.block-editor-page h6 {
    color: #000000 !important;
}

/* これが編集画面に適用されるかはテーマによる */
.editor-styles-wrapper {
    color: #000000 !important;
}

/* より具体的なセレクタで試す */
.block-editor-page .editor-styles-wrapper .wp-block {
    color: #000000 !important;
}

.block-editor-page .wp-block-paragraph {
    color: #000000 !important;
}

.toppage {
  margin: 0 auto;          /* 中央寄せ */
  max-width: 800px;       /* PC・タブレットで最大幅を1100pxに制限 */
  width: 100%;             /* 基本は100%幅 */
  box-sizing: border-box;  /* paddingを含めて幅を計算 */
　line-height: 300%!important;  
}

/* まだ効かないなら */
.toppage,
.toppage * {
  line-height: 2 !important;
}

/* スマホ（幅767px以下）でpaddingを8px */
@media (max-width: 767px) {
  .toppage {
    padding-left: 8px;
    padding-right: 8px;
  }
}

.meta_top li.update {
  display: none !important;
}

.bottom_post_list {
  display: none !important;
}

/* Welcart 商品ページの画像をカラム幅いっぱいに */
#ittempage .post_content img,
#ittempage .post_content figure img,
#ittempage .itemimg img {
  width: 100%;
  height: auto;
  display: block;
}

/* 画像の左右回り込みを無効化（小さくなるのを防ぐ） */
#ittempage .post_content .alignleft,
#ittempage .post_content .alignright {
  float: none;
  margin: 0;
}

.product-hero img { width:100%; height:auto; display:block; }

#ittempage .itemimg img {
  width: 100% !important;
  height: auto !important;
}

/* Welcart 商品ページ：代表画像をカラムいっぱいに */
#ittempage .itemimg,
#ittempage .itemimg a { display:block !important; width:100% !important; }

#ittempage .itemimg img {
  width:100% !important;
  height:auto !important;
  max-width:none !important;
}

#ittempage .itemimg,
#ittempage .itemimg a { display:block !important; width:100% !important; }
#ittempage .itemimg img { width:100% !important; height:auto !important; max-width:none !important; }

#ittempage .itemimg img { width:100%; height:auto; }

.top-products {
  display:grid; gap:16px;
}
.top-products.cols-3 { grid-template-columns: repeat(3, minmax(0,1fr)); }
.top-products.cols-4 { grid-template-columns: repeat(4, minmax(0,1fr)); }
@media (max-width: 1024px) { .top-products { grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (max-width: 640px)  { .top-products { grid-template-columns: 1fr; } }

.tp-card { display:block; border:1px solid #eee; border-radius:12px; overflow:hidden; text-decoration:none; background:#fff; }
.tp-thumb { aspect-ratio: 4/3; background:#f6f6f6; display:flex; align-items:center; justify-content:center; }
.tp-thumb img { width:100%; height:100%; object-fit:cover; display:block; }
.tp-noimg { color:#aaa; font-size:12px; letter-spacing:.08em; }
.tp-meta { padding:12px 14px 14px; }
.tp-title { font-size:16px; line-height:1.5; margin:0 0 6px; color:#111; }
.tp-price { font-weight:700; color:#e65100; }

.top-products {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
}
.top-products.cols-4 .tp-card {
  flex: 1 1 calc(25% - 20px);
  box-sizing: border-box;
}

/* 共通レイアウト */
.top-products {
  display: grid;
  gap: 20px; /* 商品の間隔 */
}

/* カラムごとの設定 */
.top-products.cols-2 {
  grid-template-columns: repeat(2, 1fr);
}
.top-products.cols-3 {
  grid-template-columns: repeat(3, 1fr);
}
.top-products.cols-4 {
  grid-template-columns: repeat(4, 1fr);
}

/* 商品カードの基本デザイン */
.tp-card {
  display: block;
  border: 1px solid #ddd;
  padding: 10px;
  text-align: center;
  background: #fff;
  text-decoration: none;
  color: inherit;
}

.tp-thumb img {
  max-width: 100%;
  height: auto;
  display: block;
  margin: 0 auto 10px;
}

.tp-title {
  font-size: 16px;
  margin: 5px 0;
}

.tp-price {
  font-weight: bold;
  color: #e60000;
}

/* ===== Online shop: product cards ===== */

/* モバイル（デフォルト）: 1カラム + 左右8pxの余白 */
.top-products{
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;            /* カード間の隙間 */
  padding: 0 8px;      /* たかさん指定の左右8px余白 */
  max-width: 100%;
  box-sizing: border-box;
}

.tp-card{
  display: block;
  border: 1px solid #e5e5e5;
  background: #fff;
  text-decoration: none;
  color: inherit;
  overflow: hidden;
}

.tp-thumb img{
  width: 100%;
  height: auto;
  display: block;      /* 画像下のスキマ防止 */
}

/* タイトル・価格 */
.tp-meta{ padding: 10px 12px; }
.tp-title{ font-size: 16px; margin: 0 0 4px; }
.tp-price{ font-weight: 700; color: #e60000; }

/* タブレット以上はショートコードの cols 値をそのまま使う */
@media (min-width: 768px){
  .top-products{ padding: 0; } /* サイトのグリッドに揃える場合は余白を消す */
  .top-products.cols-2{ grid-template-columns: repeat(2, minmax(0,1fr)); }
  .top-products.cols-3{ grid-template-columns: repeat(3, minmax(0,1fr)); }
  .top-products.cols-4{ grid-template-columns: repeat(4, minmax(0,1fr)); }
  /* もっと増やすなら .cols-5, .cols-6 … を追加 */
}

/* --- 強制：スマホは常に1カラム + 左右8px余白 --- */
@media (max-width: 767.98px){
  .top-products{
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 16px !important;
    padding: 0 8px !important;
    box-sizing: border-box;
  }
  /* cols-○ が付いていても1カラムに固定 */
  .top-products[class*="cols-"]{
    grid-template-columns: 1fr !important;
  }

  .tp-thumb img{
    width: 100% !important;
    height: auto !important;
    display: block;
  }
}