.sub_top_img {
    height: 284px;
}

.whereBuy {
    position: relative;
    display: block;
    width: 100%;
}

.whereBuy * {
    position: relative;
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}

/******篩選列******/
.whereBuy__head {
    display: block;
    width: 100%;
    background: #f2f3f3;
}

.whereBuy__head__filter {
    display: flex;
    align-items: flex-start;
    align-content: flex-start;
    justify-items: flex-start;
    justify-content: space-between;
    width: calc(100% - 40px);
    max-width: 1200px;
    margin: 0 auto;
    padding: 50px 2%;
}

.whereBuy__head__filter__select {
    display: block;
    width: 100%;
    height: 40px;
    font-size: .8em;
    line-height: inherit;
    color: inherit;
    font-family: inherit;
    font-weight: 400;
    text-align: left;
    border: 1px solid #dbdbdb;
    background: #fff;
    cursor: pointer;
    flex: 0 0 auto;
    overflow: visible;
}

.whereBuy__head__filter__select__current {
    position: absolute;
    top: 0;
    left: 0;
    display: flex;
    align-items: center;
    align-content: center;
    justify-items: flex-start;
    justify-content: flex-start;
    width: 100%;
    height: 100%;
    padding: 0 25px 0 15px;
    font-size: inherit;
    line-height: inherit;
    color: inherit;
    font-family: inherit;
    font-weight: inherit;
    text-align: inherit;
}

.whereBuy__head__filter__select__current::after {
    content: '';
    position: absolute;
    top: calc(50% - 1.5px);
    right: 15px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 3px 3px 0 3px;
    border-color: #000 transparent transparent transparent;
    transform-origin: center;
}

.whereBuy__head__filter__select.active .whereBuy__head__filter__select__current::after {
    transform: scaleY(-1);
}

.whereBuy__head__filter__select:nth-child(1) {
    width: calc(33.33% - 25px);
}

.whereBuy__head__filter__select:nth-child(2) {
    width: calc(66.66% - 25px);
}

.whereBuy__head__filter__select__current__list {
    position: absolute;
    top: calc(100% + 1px);
    left: -1px;
    display: none;
    width: calc(100% + 2px);
    background: #fff;
    border: 1px solid #dbdbdb;
    border-top: none;
    z-index: 5;
}

.whereBuy__head__filter__select__current__list li {
    display: flex;
    align-items: center;
    align-content: center;
    justify-items: flex-start;
    justify-content: flex-start;
    width: 100%;
    height: 40px;
    padding: 0 25px 0 15px;
    font-size: inherit;
    line-height: inherit;
    color: inherit;
    font-family: inherit;
    font-weight: inherit;
    text-align: inherit;
    border-bottom: 1px solid #dbdbdb;
}

.whereBuy__head__filter__select__current__list li:last-child {
    border: none;
}

/******主文案******/
.whereBuy__body {
    display: block;
    width: calc(100% - 40px);
    max-width: 1200px;
    margin: 140px auto 80px auto;
}

/******通路標題******/
.whereBuy__body__title {
    display: block;
    width: 100%;
    margin: 0 auto 75px auto;
}

.whereBuy__body__title__main {
    display: block;
    width: 100%;
    font-size: 2.4em;
    line-height: 1.2;
    color: #000;
    font-family: inherit;
    font-weight: 700;
}

.whereBuy__body__title__sub {
    display: block;
    width: 100%;
    margin: 15px auto 0 auto;
    font-size: .95em;
    line-height: 1.2;
    color: #000;
    font-family: inherit;
    font-weight: 400;
}

.whereBuy__body__title__sub__item {
    display: inline;
    width: auto;
    max-width: 100%;
    font-size: inherit;
    line-height: inherit;
    color: inherit;
    font-family: inherit;
}

.whereBuy__body__title__sub__item.hide {
    display: none;
}

.whereBuy__body__title__sub__item::before {
    content: '\00A0&\00A0';
    display: none;
}

.whereBuy__body__title__sub__item:not(.hide)~.whereBuy__body__title__sub__item::before {
    display: inline;
}

/******通路容器******/
.whereBuy__body__box {
    left: .5px;
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    align-content: stretch;
    justify-items: flex-start;
    justify-content: flex-start;
    width: 100%;
}

/******通路item******/
.whereBuy__body__box__item {
    display: flex;
    flex-direction: column;
    align-items: center;
    align-content: center;
    justify-items: center;
    justify-content: center;
    width: 25%;
    height: auto;
    margin: -.5px;
    padding: 2%;
    text-align: center;
    border: 1px solid #dbdbdb;
    flex: 0 0 auto;
}

.whereBuy__body__box__item.hide {
    display: none;
}

.whereBuy__body__box__item__main {
    display: block;
    width: 100%;
    padding: 0 0 21px 0;
}

/****通路LOGO****/
.whereBuy__body__box__item__main__logo {
    display: flex;
    align-items: center;
    align-content: center;
    justify-items: center;
    justify-content: center;
    width: 100%;
    height: 95px;
    max-width: 200px;
    margin: 18px auto;
}

.whereBuy__body__box__item__main__logo img {
    object-fit: contain;
    object-position: center;
    display: block;
    width: 100%;
    height: 100%;
}

/****通路名稱****/
.whereBuy__body__box__item__main__name {
    display: inline;
    width: auto;
    max-width: 100%;
    font-size: .85em;
    font-family: inherit;
    line-height: inherit;
    color: #5f5f5f;
}

.whereBuy__body__box__item:hover .whereBuy__body__box__item__main__name {
    color: #000;
    text-decoration: underline;
}

/****連結****/
.whereBuy__body__box__item__main__link {
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    cursor: pointer;
}

/****通路類型****/
.whereBuy__body__box__item__type {
    display: block;
    width: 100%;
    font-size: .75em;
    font-family: inherit;
    line-height: inherit;
    color: #424242;
    margin: 0 0 34px 0;
}

/****產品標籤****/
.whereBuy__body__box__item__product {
    display: flex;
    justify-content: center;
    justify-items: center;
    align-items: flex-start;
    align-content: flex-start;
    flex-wrap: wrap;
    width: calc(100% + 5px);
    margin: 0 0 13px 0;
}

.whereBuy__body__box__item__product__tag {
    display: block;
    width: auto;
    max-width: 100%;
    font-size: .55em;
    font-family: inherit;
    line-height: 1;
    border-radius: 1px;
    color: #fff;
    padding: 2px 3px;
    margin: 0 5px 5px 0;
}

.whereBuy__body__box__item__product__tag[data-tag="orange"] {
    background: #e77d43;
}

.whereBuy__body__box__item__product__tag[data-tag="blue"] {
    background: #1557b9;
}

.whereBuy__body__box__item__product__tag[data-tag="green"] {
    background: #469b39;
}

.whereBuy__body__box__item__product__tag[data-tag="red"] {
    background: #e33b3b;
}

@media screen and (max-width: 991px) {

    /******主文案******/
    .whereBuy__body {
        margin: 100px auto 75px auto;
    }

    /******通路item******/
    .whereBuy__body__box__item {
        width: 33.33%;
        padding: 30px 22px;
    }
}


@media screen and (max-width: 768px) {
    .sub_top_img {
        height: 220px;
    }

    /******篩選列******/
    .whereBuy__head__filter {
        display: block;
    }

    .whereBuy__head__filter__select {
        margin: 0 0 10px 0;
    }

    .whereBuy__head__filter__select:last-child {
        margin: 0;
    }

    .whereBuy__head__filter__select:nth-child(1) {
        width: 100%;
    }

    .whereBuy__head__filter__select:nth-child(2) {
        width: 100%;
    }

    /******通路標題******/
    .whereBuy__body__title__main {
        font-size: 2.72em;
    }

    .whereBuy__body__title__sub {
        font-size: 1.06em;
    }

    /******通路item******/
    .whereBuy__body__box__item {
        width: 50%;
    }

    .whereBuy__body__box__item__main {
        padding: 0 0 16px 0;
    }

    /****通路LOGO****/
    .whereBuy__body__box__item__main__logo {
        margin: 13px auto 23px auto;
    }

    /****通路類型****/
    .whereBuy__body__box__item__type {
        margin: 0 0 23px 0;
    }
}

@media screen and (max-width: 640px) {
    .sub_top_img {
        height: 183px;
    }

    .whereBuy__head__filter__select {
        font-size: .65em;
    }

    /******通路標題******/
    .whereBuy__body__title__main {
        font-size: 2.27em;
    }

    .whereBuy__body__title__sub {
        font-size: .9em;
    }
}

@media screen and (max-width: 575px) {

    /******主文案******/
    .whereBuy__body {
        margin: 85px auto 75px auto;
    }

    /******通路item******/
    .whereBuy__body__box__item {
        height: 255px;
        padding: 22px 16px;
    }

    /****通路LOGO****/
    .whereBuy__body__box__item__main__logo {
        width: 100%;
        min-width: 110px;
        margin: 10px auto 17px auto;
    }

    .whereBuy__body__box__item__main {
        padding: 0 0 13px 0;
    }

    /****通路名稱****/
    .whereBuy__body__box__item__main__name {
        font-size: .8em;
    }

    /****產品標籤****/
    .whereBuy__body__box__item__product__tag {
        font-size: .72em;
    }
}

@media screen and (max-width: 414px) {
    .sub_top_img {
        height: 118px;
    }

    /******通路標題******/
    .whereBuy__body__title__main {
        font-size: 1.47em;
    }

    .whereBuy__body__title__sub {
        margin: 10px auto 0 auto;
        font-size: .7em;
    }
}

@media screen and (max-width: 375px) {
    .sub_top_img {
        height: 107px;
    }

    /******通路標題******/
    .whereBuy__body__title {
        margin: 0 auto 40px auto;
    }

    .whereBuy__body__title__main {
        font-size: 1.33em;
    }

    .whereBuy__body__title__sub {
        font-size: .65em;
    }
}

/****觸控螢幕****/
@media (any-hover: none) {

    /****通路名稱****/
    .whereBuy__body__box__item:hover .whereBuy__body__box__item__main__name {
        color: #5f5f5f;
        text-decoration: none;
    }
}