@charset "Shift_JIS";

/***************************
全体
***************************/
.category_base {

  width: 100%;

  h3 {
    border-left: solid 5px #2153b6;
    padding-left: 7px;
  }

  .more {
    margin-left: 10px;
  }

  /* h2.inner_title,
  h3.inner_title{
      font-size: 25px;
      padding-left: 20px;
      border-bottom: 3px dashed #000;
      position: relative;
      font-weight: 600;
      padding-bottom: 6px;
      margin-bottom: 1%;
  } */

  /* h2::before,
  h3::before {
      content: "";
      position: absolute;
      top: 40%;
      left: 2%;
      transform: translate(-50%, -50%);
      width: 60px;
      height: 60px;
      background-color: #fffdc2;
      border-radius: 50%;
      z-index: -1;
  } */

  /***************************
注目のカテゴリ
***************************/
  /* .featured_category {

      margin-block: 3% 10%;

      ul {
          display: grid;
          grid-template-columns: repeat(4, 1fr);
          gap: 10px;

          li {
              p.categry_text {
                  text-align: center;
              }
          }
      }
  } */

  /***************************
カテゴリから選ぶ
***************************/


  .category_area {

    margin-bottom: 30px;

    ul.cate_box {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      align-items: center;
      gap: 15px;

      li {
        text-align: center;

        a {
          display: block;
          border: 1px solid #000;
          padding: 10px 0;
          border-radius: 5px;
          height: 30px !important;
        }
      }

    /* ul:not(.cate_box):not(.swiper-wrapper) {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      align-items: center;
      gap: 15px;

      li {
        text-align: center;

        a {
          display: block;
        }
      }
    }

    ul {
      p {
        font-size: 13px;
      }
    }

    ul:not(.cate_box):not(.swiper-wrapper).col_5 {
      display: grid;
      grid-template-columns: repeat(5, 1fr);
    }

    ul.cate_box.col_4 {
      display: grid;
      grid-template-columns: repeat(4,1fr);
    }


    ul.cate_box.col_5 {
      display: grid;
      grid-template-columns: repeat(5, 1fr);
    } */
  }

  ul.col_4 {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    align-items: center;
    gap: 8px;
}


  /***************************
$カテゴリ$の関連カテゴリの商品を探す
***************************/
  /* .connection_category {
    ul.col3 {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 10px;
    }
  }
*/
}
}