@charset "UTF-8";
/* ---------- */
/* .box__search input[type='checkbox'] {
    position: relative;
    display: block;
    z-index: 10000;
} */
.filter__item[data-fid="filter-category"] .item__panel .panel__wrap .wrap__data {
    flex-direction: column;
    padding: calc(var(--fsize) * 1.3) 0 calc(var(--fsize) * 1) 0;
}

.filter__item[data-fid="filter-label"] .item__panel .panel__wrap .wrap__data {
    /* flex-direction: column; */
    padding: calc(var(--fsize) * 1.3) 0 calc(var(--fsize) * 1) 0;
}

.filter__item[data-fid="filter-label"] .item__panel .panel__wrap .wrap__data .data__list,
.filter__item[data-fid="filter-category"] .item__panel .panel__wrap .wrap__data .data__list {
    position: relative;
    width: 100%;
    padding: 0 calc(var(--fsize) * 1.5);

    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
}

/* .filter__item[data-fid="filter-label"] .item__panel .panel__wrap .wrap__data .data__list {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
} */

.filter__item[data-fid="filter-label"] .item__panel .panel__wrap .wrap__data .data__list .list__item,
.filter__item[data-fid="filter-category"] .item__panel .panel__wrap .wrap__data .data__list .list__item {
    --row-num: 3;
    --space: calc(var(--fsize) * 1);
    --w: calc((100% - var(--space)) / var(--row-num));
    width: var(--w);
    margin-bottom: calc(var(--space) / 2);
}

.filter__item[data-fid="filter-label"] .item__panel .panel__wrap .wrap__data .data__list .list__item:last-child:nth-child(3n - 1),
.filter__item[data-fid="filter-category"] .item__panel .panel__wrap .wrap__data .data__list .list__item:last-child:nth-child(3n - 1) {
    /* 三欄 兩個間隔 每個間隔  % */
    margin-right: calc(var(--w) + var(--space) * 0.5);
}


/* .box__search .box__container .box__body .body__filter .filter__item[data-fid="filter-category"] .item__panel .panel__wrap .wrap__data .data__list .list__item:not(:first-child) {
    margin-top: calc(var(--fsize) * 0.5);
} */

.box__search .box__container .box__body .body__filter .filter__item[data-fid="filter-label"] .item__panel .panel__wrap .wrap__data .data__list .list__item > label,
.box__search .box__container .box__body .body__filter .filter__item[data-fid="filter-category"] .item__panel .panel__wrap .wrap__data .data__list .list__item > label {
    pointer-events: auto;
    cursor: pointer;
    position: relative;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;

    width: fit-content;
}

.box__search .box__container .box__body .body__filter .filter__item[data-fid="filter-label"] .item__panel .panel__wrap .wrap__data .data__list .list__item > label::before,
.box__search .box__container .box__body .body__filter .filter__item[data-fid="filter-category"] .item__panel .panel__wrap .wrap__data .data__list .list__item > label::before {
    /* --size: calc(max(var(--fsize), 16px) * 0.9); */
    --size: calc(max(var(--fsize), 16px) * 1);
    content: '';
    position: relative;
    width: var(--size);
    height: var(--size);
    top: 0;
    left: 0;

    border: 1px solid;
    box-sizing: border-box;
    display: inline-block;

    border-radius: var(--border-radius-ss2);
    margin-right: calc(var(--fsize) * 0.5);
    border-color: var(--color-gray-light);

    background-color: #fff;
}

.box__search .box__container .box__body .body__filter .filter__item[data-fid="filter-label"] .item__panel .panel__wrap .wrap__data .data__list .list__item > label::after,
.box__search .box__container .box__body .body__filter .filter__item[data-fid="filter-category"] .item__panel .panel__wrap .wrap__data .data__list .list__item > label::after {
    --border-w: 2px;
    content: '';
    position: absolute;
    top: calc(50% - var(--fsize) * 0.4);
    left: 6px;
    width: 4px;
    height: 9px;

    border: solid #fff;
    border-width: 0 var(--border-w) var(--border-w) 0;
    transform: rotate(45deg);
    opacity: 0;
}

.box__search .box__container .box__body .body__filter .filter__item[data-fid="filter-label"] .item__panel .panel__wrap .wrap__data .data__list .list__item > label > p,
.box__search .box__container .box__body .body__filter .filter__item[data-fid="filter-category"] .item__panel .panel__wrap .wrap__data .data__list .list__item > label > p {
    flex: 1;
}

/* filter checked */
#filter-switch-label:checked ~ .box__container .box__body .body__filter .filter__item[data-fid="filter-label"] .item__title > label > svg,
#filter-switch-category:checked ~ .box__container .box__body .body__filter .filter__item[data-fid="filter-category"] .item__title > label > svg {
    transform: scaleY(-1);
}

#filter-switch-label:checked ~ .box__container .box__body .body__filter .filter__item[data-fid="filter-label"] .item__panel,
#filter-switch-category:checked ~ .box__container .box__body .body__filter .filter__item[data-fid="filter-category"] .item__panel {
    display: flex;
    z-index: 10;
}


.box__search .box__container .box__body .body__filter .filter__item[data-fid="filter-label"] .item__panel .panel__wrap .wrap__data .data__list .list__item > input[type="checkbox"]:checked ~ label::before,
#category-2:checked ~ label[for="category-2"]::before,
#category-1:checked ~ label[for="category-1"]::before,
#category-0:checked ~ label[for="category-0"]::before {
    border-color: var(--color-purple);
    background-color: var(--color-purple);
}


.box__search .box__container .box__body .body__filter .filter__item[data-fid="filter-label"] .item__panel .panel__wrap .wrap__data .data__list .list__item > input[type="checkbox"]:checked ~ label::after,
#category-2:checked ~ label[for="category-2"]::after,
#category-1:checked ~ label[for="category-1"]::after,
#category-0:checked ~ label[for="category-0"]::after {
    opacity: 1;
}

.box__list__recnews {
    padding: calc(var(--section-vside) * 0.5) 0;
    display: none;
}

.box__list__recnews.is-show {
    display: flex;
}

.box__list__recnews .box__container .box__body .body__mtitle {
    display: none;
}

/* box__news */
.box__news {
    padding: 0 0 0 0;
}

.box__news .box__container {
    padding: 0 0;
}

.box__search {
    padding: 0 0 calc(var(--section-vside) * 0.5) 0;
}

.box__list.part-news .box__container .box__body .body__list {
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between
}

.box__list.part-news .box__container .box__body .body__list .list__item {
    --row-num: 3;
    --space: 3%;
    --w: calc((100% - var(--space)) / var(--row-num));
    width: var(--w);
    margin-bottom: calc(var(--space) / 2);
}

.box__list.part-news .box__container .box__body .body__list .list__item:last-child:nth-child(3n - 1) {
    /* 三欄 兩個間隔 每個間隔  % */
    margin-right: calc(var(--w) + var(--space) * 0.5);
}

.box__list.part-news .box__container .box__body .body__list .list__item[data-status='news'] .item__pic {
    aspect-ratio: 460 / 263;
}


.box__list.part-news .box__container .box__body .body__list .list__item[data-status='news'] .item__con .con__detail .detail__action .action__btn.is-news {
    flex: 1;
    justify-content: flex-start;
}
.box__list.part-news .box__container .box__body .body__list .list__item[data-status='news'] .item__con .con__detail .detail__action .action__btn.is-collect {
    width: 38%;
    margin-left: 3%;
    justify-content: flex-end;
}

.box__list.part-news .box__container .box__body .body__loading {
    margin-top: calc(var(--section-vside) * 0.5);
    position: relative;
    display: none;
    justify-content: center;
    align-items: center;
}

.box__list.part-news .box__container .box__body .body__loading .loading__svg {
    position: relative;
    width: 40px;
}

.box__list.part-news .box__container .box__body .body__loading.is-show {
    display: flex;
}
/* -----------------------------------------------------------------
/* ----------------------------------------------------------------- */
@media screen and (min-width:320px) {
    .box__list.part-news .box__container .box__body .body__list {
        flex-direction: column;
        justify-content: initial;
    }

    .box__list.part-news .box__container .box__body .body__list .list__item {
        width: 100%;
        margin-bottom: 0;
        margin-right: 0;
    }

    .box__list.part-news .box__container .box__body .body__list .list__item:not(:first-child) {
        margin-top: calc(var(--space) * 2);
    }

    .filter__item[data-fid="filter-label"] .item__panel .panel__wrap .wrap__data .data__list .list__item {
        --row-num: 2;
    }
    
}
@media screen and (min-width:360px) {}
@media screen and (min-width:390px) {}
@media screen and (min-width:414px) {}
@media screen and (min-width:500px) {}
@media screen and (min-width:600px) {
    .box__list.part-news .box__container .box__body .body__list {
        flex-direction: row;
        justify-content: space-between;
    }
    .box__list.part-news .box__container .box__body .body__list .list__item {
        --row-num: 2;
        width: var(--w);
        margin-bottom: calc(var(--space) / 2);
    }

    .box__list.part-news .box__container .box__body .body__list .list__item:not(:first-child) {
        margin-top: 0;
    }

    .filter__item[data-fid="filter-label"] .item__panel .panel__wrap .wrap__data .data__list .list__item {
        --row-num: 3;
    }
}

@media screen and (min-width:1024px) {
    .box__list.part-news .box__container .box__body .body__list .list__item {
        --row-num: 3;
    }
    
}
@media screen and (min-width:1280px) {

}
@media screen and (min-width:1366px) {}
@media screen and (min-width: 1440px) {}
@media screen and (min-width: 1680px) {}
@media screen and (min-width: 1920px) {}
@media screen and (min-width: 2560px) {}
