@charset "utf-8";

/* 同排共用圖片、品名、編號、價格與單位的高度，長文字不裁切。 */
:is(main .in_box1 .swiper-box .swiper2 .swiper-wrapper .swiper-slide, main.main_box4) ul.product-card-grid {
    display: grid;
    grid-template-columns: repeat(var(--product-card-columns, 4), minmax(0, 1fr));
}
main .in_box1 .swiper-box .swiper2 .swiper-wrapper .swiper-slide ul.product-card-grid {
    --product-card-columns: 5;
}
:is(main .in_box1 .swiper-box .swiper2 .swiper-wrapper .swiper-slide, main.main_box4) ul.product-card-grid > li,
:is(main .in_box1 .swiper-box .swiper2 .swiper-wrapper .swiper-slide, main.main_box4) ul.product-card-grid > li > a {
    display: grid;
    grid-template-rows: subgrid;
    grid-row: span 5;
    width: 100%;
    min-width: 0;
}
:is(main .in_box1 .swiper-box .swiper2 .swiper-wrapper .swiper-slide, main.main_box4) ul.product-card-grid > li > a h2 {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    min-height: 66px;
    margin: 15px 0 6px;
    font-size: 16px;
    line-height: 22px;
    overflow: visible;
    overflow-wrap: anywhere;
    -webkit-line-clamp: unset;
}
:is(main .in_box1 .swiper-box .swiper2 .swiper-wrapper .swiper-slide, main.main_box4) ul.product-card-grid > li > a > * {
    min-width: 0;
}
:is(main .in_box1 .swiper-box .swiper2 .swiper-wrapper .swiper-slide, main.main_box4) ul.product-card-grid > li > a p.text {
    display: block;
    min-height: 42px;
    line-height: 21px;
    overflow: visible;
    overflow-wrap: anywhere;
    -webkit-line-clamp: unset;
}
:is(main .in_box1 .swiper-box .swiper2 .swiper-wrapper .swiper-slide, main.main_box4) ul.product-card-grid > li > a p.notice {
    min-height: 22px;
    margin: 6px 0 0;
    line-height: 22px;
    overflow-wrap: anywhere;
}
@media (max-width: 1399px) {
    main.main_box4 ul.list.product-card-grid {
        --product-card-columns: 3;
    }
    main.main_box4 ul.list.a.product-card-grid {
        --product-card-columns: 4;
    }
}
@media (max-width: 799px) {
    main.main_box4 ul.list.product-card-grid,
    main.main_box4 ul.list.a.product-card-grid {
        --product-card-columns: 2;
    }
}
@media (max-width: 767px) {
    main .in_box1 .swiper-box .swiper2 .swiper-wrapper .swiper-slide ul.product-card-grid {
        --product-card-columns: 2;
    }
}