/* カスタマイズ用CSS */
.description-table{width:100%;border:1px solid #000;border-collapse:collapse;font-size:.9rem;}
.description-table th{background:#7D7D7D;color:#fff;border:1px solid #000;padding:0.5rem 0.75rem;min-width: 7.75em;}
.description-table td{border:1px solid #000;padding:0.5rem 0.75rem;}
.ec-navList__contact a{display:block;padding:12px 16px;font-size:16px;text-decoration:none;color:#fff;background:#000}
.ec-navList__contact a i{margin-right:8px}
.ec-navList__contact a:hover{background:#222}

@media(min-width:768px){
.ec-borderedDefs dt{width:20%;}
.ec-borderedDefs dd{width:80%;}
.ec-headerRole__contact{margin-right:10px;}
.ec-headerRole__contact a.ec-headerLink__item {padding:10px;background:#f5f5f5;border-radius:20px;align-items:center;display:flex;padding:6px 12px;color:#000;text-decoration:none;font-size:20px;}
.ec-mega{position:relative;--mega-max:1200px;--hover-gap:6px;--row-h:52px;--sub-w:60%}
.ec-itemNav__nav{display:grid;grid-template-columns:repeat(4,1fr);gap:8px 24px;justify-items:stretch}
.ec-itemNav__nav>li{position:static;text-align:center}
.ec-itemNav__nav>li>a{display:block;width:100%;height:100%;padding:12px 14px;font-weight:700;line-height:1.2}
.ec-itemNav__nav>li>ul{position:absolute;left:50%;transform:translateX(-50%);width:100%;max-width:var(--mega-max);display:none;z-index:1500;background:#fff;border:1px solid #e5e7eb;box-shadow:0 10px 25px rgba(0,0,0,.08);padding:16px 18px;grid-template-columns:repeat(2,minmax(300px,1fr));gap:12px 18px;overflow:visible}
.ec-itemNav__nav>li:hover>ul,.ec-itemNav__nav>li>ul:hover{display:grid}
.ec-itemNav__nav>li:nth-child(-n+4)>ul{top:calc(var(--row-h) - 16px + var(--hover-gap))}
.ec-itemNav__nav>li:nth-child(n+5)>ul{top:100%}
.ec-itemNav__nav>li>ul>li{position:relative;min-width:0}
.ec-itemNav__nav>li>ul>li>a{position:relative;display:block;width:100%;padding:10px 28px 10px 12px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.3;background:#111;color:#fff}
.ec-itemNav__nav>li>ul>li.has-child>a::after{content:"";position:absolute;right:8px;top:50%;transform:translateY(-50%);width:0;height:0;border-left:5px solid transparent;border-right:5px solid transparent;border-top:6px solid #9ca3af}
.ec-itemNav__nav>li>ul>li>ul{position:absolute;top:100%;left:auto!important;right:0!important;width:var(--sub-w);min-width:220px;background:#fff;border:1px solid #e5e7eb;box-shadow:0 8px 20px rgba(0,0,0,.15);padding:0;display:none;z-index:2000}
.ec-itemNav__nav>li>ul>li:hover>ul{display:block}
.ec-itemNav__nav li ul li:hover>ul>li{width:100%!important}
.ec-itemNav__nav>li>ul>li>ul>li>a{display:block!important;width:100%!important;padding:8px 12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.3;color:#fff}
.ec-itemNav__nav>li>ul>li>ul>li>a:hover{background:#f3f4f6}
.ec-itemNav__nav>li>ul a:hover{background:#f3f4f6;border-radius:6px}
.ec-itemNav__nav>li>ul>li>ul>li.has-child>a::after{content:"";position:absolute;right:8px;top:50%;transform:translateY(-50%);width:0;height:0;border-left:5px solid transparent;border-right:5px solid transparent;border-top:6px solid #d1d5db}
.ec-itemNav__nav > li:hover > a{background:#bfbfbf;}
.ec-itemNav__nav li ul li ul:before{content:"";}
}
@media(max-width:767.9px){
.ec-headerRole__contact a.ec-headerLink__item {align-items:center;display:flex;padding:5px 7px 0;color:#000;text-decoration:none;font-size:20px;}
.ec-cartNavi{padding:10px 0 0 7px;}
  .ec-itemNav__nav li>a{
    position:relative;
    display:block;
    padding-right:32px; /* 矢印分の余白 */
  }
  /* 子カテゴリを持つ場合 → 下向き矢印 */
  .ec-itemNav__nav li.has-child>a::after{
    content:"";
    position:absolute;
    right:12px;
    top:50%;
    transform:translateY(-50%);
    width:0;
    height:0;
    border-left:6px solid transparent;
    border-right:6px solid transparent;
    border-top:6px solid #333; /* ▼ */
  }
  /* 孫カテゴリを持つ場合も同様に矢印 */
  .ec-itemNav__nav li ul li.has-child>a::after{
    content:"";
    position:absolute;
    right:12px;
    top:50%;
    transform:translateY(-50%);
    width:0;
    height:0;
    border-left:6px solid transparent;
    border-right:6px solid transparent;
    border-top:6px solid #666;
  }
}

/* ==============================
   Footer Categories - Grid Layout
   ============================== */

.footerCats__grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(7, 1fr);
    gap: 8px;
}

.footerCats__block {
  border: 1px solid #ddd;
  background: #fff;
  box-sizing: border-box;
}

/* タイトル */
.footerCats__title a {
  display: block;      /* ブロック要素化 */
  width: 100%;         /* 横幅いっぱい */
  height: 100%;        /* 高さも見出し全体 */
  color: #fff;
  text-decoration: none;
  padding: 0.5rem 0.75rem; /* 余白はaに付与 */
  box-sizing: border-box;
}

.footerCats__title {
  margin: 0;
  padding: 0; /* ←ここで余白をリセット、aに移した */
  background: #222;
  font-size: 15px;
  font-weight: bold;
}

.footerCats__title a:hover {
  text-decoration: underline;
}


/* 子リスト */
.footerCats__list {
  margin: 0;
  padding: 0.5rem 0.75rem;
  list-style: none;
}

.footerCats__item {
  margin: 0.25rem 0;
  font-size: .9em;
}

.footerCats__item a {
  color: #333;
  text-decoration: none;
}

.footerCats__item a:hover {
  color: #000;
  text-decoration: underline;
}

/* ==============================
   固定座標指定（重要カテゴリ）
   ============================== */

.footerCats__block[data-cat-id="1"]{
    grid-row: span 3 / span 3;
}
.footerCats__block[data-cat-id="23"]{
    grid-row: span 3 / span 3;
}
.footerCats__block[data-cat-id="28"]{
    grid-row: span 3 / span 3;
}
.footerCats__block[data-cat-id="32"]{
    grid-row: span 3 / span 3;
}

/* 40: バリエーション冷凍冷蔵庫 → 1列目 2行目 */
.footerCats__block[data-cat-id="40"] {
    grid-row: span 4 / span 4;
    grid-row-start: 4;
}

/* 44: 恒温高湿庫 → 2列目 2行目 */
.footerCats__block[data-cat-id="44"] {
    grid-row: span 3 / span 3;
    grid-row-start: 4;
}

/* 48: 玄米保冷庫 → 恒温高湿庫の下（2列目 3行目） */
.footerCats__block[data-cat-id="48"] {
    grid-column-start: 2;
    grid-row-start: 7;
}

/* 49: 冷凍・冷蔵ショーケース → 横幅2列ぶん（1列目から2列分）4行目 */
.footerCats__block[data-cat-id="49"] {
    grid-column: span 2 / span 2;
    grid-row: span 4 / span 4;
    grid-column-start: 3;
    grid-row-start: 4;
}
.footerCats__item:last-child {
  margin-bottom: 0;
}
/* ==============================
   Responsive (スマホ)
   ============================== */
@media (max-width: 767.9px) {
  .footerCats__grid {
    display: block;   /* ← gridを解除してblockに */
  }

  .footerCats__block {
    margin-bottom: 1rem; /* 各ブロックの間隔を確保 */
  }

  /* スマホでは座標指定は不要なのでリセット */
  .footerCats__block {
    grid-column: auto !important;
    grid-row: auto !important;
  }
 .footerCats__item {
  font-size: .78em;
}
.footerCats__item a{
    display: block;
    padding:.5em 0;
}
}

/* ======================================
   お問い合わせ・お見積り バナー
   ====================================== */

.ec-contact-banner {
  flex: 1;
  margin-left: 30px;
  background: #f8f8f8;
  color: #333;
  text-align: center;
  padding: 1.5rem 1rem;
  border-radius: 8px;
  /*border: 1px solid #ddd;*/
  display: flex;
  flex-direction: column;
  justify-content: center;   /* 上下中央 */
  align-items: center;       /* 左右中央 */
}

.ec-contact-heading {
  font-size: 2rem;
  font-weight: bold;
  margin: 0 0 0.75rem;
  color: #222;
}

.ec-contact-message {
  font-size: 0.95rem;
  margin: 0 0 1.25rem;
  line-height: 1.6;
}

/* ボタン */
.ec-contact-button {
  display: inline-flex;       /* アイコン＋テキストを横並び */
  align-items: center;
  gap: 0.5rem;                /* アイコンと文字の間隔 */
  background: #e53935;        /* CTAカラー */
  color: #fff;
  font-weight: bold;
  padding: 0.75rem 1.5rem;
  border-radius: 6px;
  text-decoration: none;
  font-size: 1.65rem;
  transition: background 0.3s ease;
}

.ec-contact-button:hover {
  background: #d32f2f;        /* ホバー時に少し濃く */
}

.ec-contact-button i {
  font-size: 1.1em;           /* アイコンサイズ調整 */
  line-height: 1;
}

/* ==============================
   Responsive (スマホ)
   ============================== */
@media (max-width: 767.9px) {
  .ec-contact-banner {
    margin-left: 0;
    margin-top: 30px;
    width: 100%;
  }
  .ec-contact-heading {
  font-size: 1.5rem;
}
  .ec-contact-button{
      font-size:1.2rem;
  }
}

/* ==============================
   カテゴリバナー群
   ============================== */

.category-banners {
  display: grid;
  grid-template-columns: repeat(4, 1fr); /* PCは4列 */
  gap: 0px;
  margin: 0 0 40px;
  border-top: 1px solid #ddd;border-left: 1px solid #ddd;
}

.category-banner {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  border-bottom: 1px solid #ddd;border-right: 1px solid #ddd;
  background: #fff;
  padding: 0;
  text-decoration: none;
  color: #000;
  transition: box-shadow 0.2s ease;
}

.category-banner img {
  max-width: 100%;
  height: auto;
}

.category-banner:hover {
  /*box-shadow: 0 0px 4px rgba(0,0,0,0.5);*/
  opacity: .6;
}

/* スマホ: 2列×4行 */
@media (max-width: 767.9px) {
  .category-banners {
    grid-template-columns: repeat(2, 1fr);
  }
}