body:before {
    content: '';
}

#page-item_list .title_ {
    font-family: 'A1 Gothic L';
    font-size: 3.75rem;
    line-height: 1.23343;
    letter-spacing: -0.03em;
    margin-bottom: 4.6875rem;
    line-height: 68px;
    letter-spacing: -0.1875rem;
}

#page-item_list .item_header_ {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1.25rem;
}

#page-item_list .filter_ {
    display: flex;
    align-items: center;
}

#page-item_list .filter_ .checkbox_label_ {
    margin-right: 2.6875rem;
}

#page-item_list .filter_ .simple-select_ {
    width: 10rem;
}

#page-item_list .filter_ .simple-select_ select {
    border-color: #ccced3;
}

#page-item_list .filter_ .simple-select_:after {
    right: 23px;
}

.material_txt_ {
    font-size: .875rem;
    line-height: 1.55566;
    letter-spacing: -0.03em;
    margin-bottom: 1.5625rem;
}
.item_Banner_ {
    margin-bottom: 95px;
}
.item_Banner_group_ {
    display: flex;
    flex-direction: column;
    gap: 35px;
    margin-bottom: 95px;
}
.item_Banner_group_ .item_Banner_ {
    margin-bottom: 0;
}
.item_Banner_.top {
    margin-bottom: 35px;
}
.item_Banner_link_ {
    display: block;
}
.item_Banner_image_ {
    width: 100%;
    height: auto;
}

#page-item_list .item_Frame_ {
    position: relative;
    margin-bottom: 2.5rem;
}

#page-item_list .item_Line_ {
    display: flex;
    flex-wrap: wrap;
}

#page-item_list .item_Item_ {
    display: flex;
    flex-direction: column;
    width: 22.65625%;
    margin-right: 3.125%;
    margin-bottom: 2.4375rem;
}

#page-item_list .item_Item_:nth-child(4n) {
    margin-right: 0;
}

#page-item_list .item_Item_ .img_ {
    position: relative;
    padding-top: 131.03448%;
    margin-bottom: 1.25rem;
}

#page-item_list .item_Item_ .text_ {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

#page-item_list .item_Item_ .text_ .upper_ {
    display: flex;
    align-items: flex-start;
    padding-bottom: 1.0625rem;
}

#page-item_list .item_Item_ .text_ .lower_ {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

#page-item_list .item_Item_ .text_ .lower_ .name_ {
    font-size: 0.875rem;
    line-height: 1.85724;
    letter-spacing: -0.03em;
    padding-bottom: 1px;
}

#page-item_list .item_Item_ .text_ .lower_ .price_ {
    font-size: 0.75rem;
    line-height: 1.66677;
    letter-spacing: 0.04em;
}

#page-item_list .item_Item_ .text_ .lower_ .price_ .price_down_ {
    color: #ff0000;
}

#page-item_list .item_Item_ .text_ .lower_ .price_ .price_down_:after {
    content: '';
    margin-right: 0.625rem;
}

#page-item_list .item_Item_ .text_ .lower_ .price_ .line_through_ {
    text-decoration: line-through;
}

#page-item_list .pager_ {
    margin-bottom: 11.75rem;
}
#page-item_list .categories_ {
    display: none;
}
#page-item_list .categories_ .other_categories_ {
    font-family: 'A1 Gothic L';
    font-size: 3.125rem;
    line-height: 2.0001;
    letter-spacing: -0.03em;
    text-align: center;
    margin-bottom: 2.6875rem;
}

#page-item_list .categories_ ul {
    display: flex;
    flex-wrap: wrap;
}

#page-item_list .categories_ ul li {
    width: 31.25%;
    margin-right: 3.125%;
    margin-bottom: 1.5625%;
}

#page-item_list .categories_ ul li:nth-child(3n) {
    margin-right: 0;
}

@media screen and (max-width: 1679.8px) {
    body:before {
        font-family: 'xl';
    }
}

@media screen and (max-width: 1439.8px) {
    body:before {
        font-family: 'lg';
    }
}

@media screen and (max-width: 1279.8px) {
    body:before {
        font-family: 'md';
    }
}

@media screen and (max-width: 1023.8px) {
    body:before {
        font-family: 'sm';
    }

    #page-item_list .filter_ .checkbox_label_ {
        margin-right: 0.9375rem;
    }

    #page-item_list .item_Item_ {
        margin-bottom: 7%;
    }
}

@media screen and (max-width: 768.8px) {
    body:before {
        font-family: 'tb';
    }

    #page-item_list .item_header_ {
        display: block;
    }

    #page-item_list .breadcrumb_ {
        margin-bottom: 2.6875rem;
    }

    #page-item_list .item_Item_ {
        margin-bottom: 8.95954%;
    }

    #page-item_list .item_Item_ {
        width: 47.68786%;
        margin-right: 4.62428% !important;
    }

    #page-item_list .item_Item_:nth-child(2n) {
        margin-right: 0 !important;
    }

    #page-item_list .pager_ {
        margin-bottom: 7.8125rem;
    }

    #page-item_list .categories_ .other_categories_ {
        font-size: 2.5rem;
        line-height: 1.5001;
        letter-spacing: -0.02em;
    }

    #page-item_list .categories_ .other_categories_ {
        margin-bottom: 2rem;
    }

    #page-item_list .categories_ ul li {
        width: 49%;
        margin-right: 2% !important;
        margin-bottom: 2% !important;
    }

    #page-item_list .categories_ ul li:nth-child(2n) {
        margin-right: 0 !important;
    }
}

@media screen and (max-width: 559.8px) {
    body:before {
        font-family: 'sp';
    }

    #page-item_list .title_ {
        font-size: 2.5rem;
        line-height: 1.1551;
    }

    #page-item_list .breadcrumb_ {
        font-size: 0.875rem;
        line-height: 1.71439;
    }

    #page-item_list .filter_ {
        justify-content: space-between;
    }

    #page-item_list .filter_ .checkbox_label_ {
        margin-right: 0px;
    }

    #page-item_list .filter_ .simple-select_ {
        width: 39.21387%;
    }

    #page-item_list .filter_ .simple-select_:after {
        right: 15px;
    }

    #page-item_list .filter_ .simple-select_ select {
        font-size: .875rem;
    }

    #page-item_list .item_Frame_ {
        margin-bottom: 1.875rem;
    }

    #page-item_list .item_Item_ .text_ .upper_ {
        padding-bottom: 0.6875rem;
    }

    #page-item_list .item_Item_ .text_ .lower_ .name_ {
        font-size: 0.75rem;
        line-height: 1.5001;
        letter-spacing: -0.04em;
    }

    #page-item_list .item_Item_ .text_ .lower_ .price_ {
        font-size: 0.75rem;
        line-height: 1.66677;
    }

    #page-item_list .categories_ .other_categories_ {
        font-size: 1.875rem;
        line-height: 2.0001;
        letter-spacing: -0.02em;
    }

    #page-item_list .categories_ .other_categories_ {
        margin-bottom: 1.3125rem;
        text-align: left;
    }

    #page-item_list .categories_ ul li {
        width: 100%;
        margin-right: 0 !important;
        margin-bottom: 0.875rem !important;
    }

    #page-item_list .categories_ ul li .button_ {
        letter-spacing: -0.04em;
    }
}

@media screen and (min-width: 769px) and (max-width: 1023.8px) {
    #page-item_list .item_Item_ {
        width: 31%;
        margin-right: 3.5% !important;
    }

    #page-item_list .item_Item_:nth-child(3n) {
        margin-right: 0 !important;
    }
}

@media screen and (max-width: 768.8px) {
    #page-item_list .pc_image {
        display:none;
    }
    #page-item_list .sp_image {
        display:block;
    }
}

@media screen and (min-width: 769px) {
    #page-item_list .pc_image {
        display:block;
    }
    #page-item_list .sp_image {
        display:none;
    }
}

/* ボタン4つ並び
----------------------------------*/

/* ===== 共通（触らない）===== */
.bnnav {
  display: grid;
}
.bnnav a {
  display: block;
}
.bnnav img {
  width: 100%;
  height: auto;
  display: block;
}

/* =========================
   ▼ PC（901px以上）= 4列
   ※「4列」は広い時だけにする
   ========================= */
@media (min-width: 901px) {

  .bnwrap {
    max-width: 2000px;

    /* ★ここをいじる：PC 上下左右余白 */
    margin: 0 auto 50px;
    padding: 0 0;

    /* transform: translateY(0px); */
  }

  .bnnav {
    /* ★ここをいじる：PC 列数 */
    grid-template-columns: repeat(4, minmax(0, 1fr));

    /* ★ここをいじる：PC 横/縦の隙間 */
    column-gap: 24px;
    row-gap: 16px;
  }
}

/* =========================
   ▼ 中間（521px〜900px）= 2列  ←ここが「早めに2列」
   ========================= */
@media (min-width: 521px) and (max-width: 900px) {

  .bnwrap {
    max-width: 2000px;

    /* ★ここをいじる：中間帯 余白（PCに準拠でOK） */
    margin: 0 auto 30px;
    padding: 0 0;
  }

  .bnnav {
    /* ★ここをいじる：中間帯は2列 */
    grid-template-columns: repeat(2, minmax(0, 1fr));

    /* ★ここをいじる：中間帯の隙間（少し詰めても綺麗） */
    column-gap: 16px;
    row-gap: 12px;
  }
}

/* =========================
   ▼ SP（520px以下）= 2列
   ========================= */
@media (max-width: 520px) {

  .bnwrap {
    max-width: none;

    /* ★ここをいじる：SP 上下左右余白 */
    margin: 0 0 30px;
    padding: 0 0;

    /* transform: translateY(-100px); */
  }

  .bnnav {
    /* ★ここをいじる：SP 列数 */
    grid-template-columns: repeat(2, minmax(0, 1fr));

    /* ★ここをいじる：SP 横/縦の隙間 */
    column-gap: 5px;
    row-gap: 5px;
  }
}

/* 全幅、２分割
------------------------------*/
/* ▼ HEROカード（PC） ▼ */
.hero-card {
  width: 100%;
  margin-bottom: 50px;
}

.hero-img-wrapper img {
  width: 100%;
  height: auto;
  border-radius: 6px;
}

.hero-card h3 {
  font-size: 26px;
  margin: 12px 0 8px;
}

.hero-card p {
  font-size: 16px;
  line-height: 1.7;
}

/* ▼ 通常カード（PC） ▼ */
.contents-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 50px 30px;
}

.card img {
  width: 100%;
  height: auto;
  border-radius: 6px;
}

.card h3 {
  font-size: 20px;
  margin: 12px 0 6px;
}

.card p {
  font-size: 14px;
  line-height: 1.7;
}

/* =====================================================================
   【スマホCSS】※編集禁止
===================================================================== */
@media screen and (max-width: 768px) {

  .hero-card {
    margin-bottom: 40px;
  }

  .hero-img-wrapper {
    margin-left: -16px;
    margin-right: -16px;
    width: calc(100% + 32px);
  }

  .hero-img-wrapper img {
    border-radius: 0;
  }

  .hero-card h3 {
    font-size: 22px;
    margin: 14px 0 6px;
  }

  .hero-card p {
    font-size: 15px;
    line-height: 1.8;
  }

  .contents-grid {
    grid-template-columns: 1fr;
    gap: 30px;
  }

  .card h3 {
    font-size: 15px;
    margin: 10px 0 4px;
  }

  .card p {
    font-size: 14px;
    line-height: 1.75;
  }
}