/* menu */

.menu_bar {
    background: #eee;
    display: block;

}

.menu_bar nav {
    width: 100%;
    height: 54px;
    overflow: hidden
}

@media (max-width:641px) {
    .menu_bar nav {
        height: 54px
    }
    #wrapper{
        width: 100%;
    }

}

.menu_bar nav .menu {
    width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    position: relative;
    text-align: center;
    border-bottom: 1px solid #d8d9da;
}

.menu_bar nav .menu ul {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    padding: 0;
    margin: 0 auto;
    text-align: center;
    position: relative;
    white-space: nowrap
}

.menu_bar nav .menu ul li {
    list-style: none;
    padding: 0 1.5rem
}

.menu_bar nav .menu ul li a {
    color: black;
    padding: 1rem 0;
    display: inline-block;
    position: relative
}

.menu_bar nav .menu ul li a.active:before {
    content: "";
    position: absolute;
    display: block;
    height: 4px;
    width: 100%;
    background-color: #60CFF6;
    bottom: 0
}


/*  */
.lazy-img {filter: blur(20px);transition: filter 0.2s ease, opacity 0.2s ease;opacity: 0;}
.lazy-img.loaded {filter: blur(0);opacity: 1;}
.flex{display: -webkit-box;display: -ms-flexbox;display: flex;-ms-flex-wrap: wrap;flex-wrap: wrap}

.wrapper{width: 100%;overflow: hidden;}

.head_tit{padding: 30px 0;color: #000;text-align: center;font-size: 1.5rem}
.head_tit_small{padding: 30px 0;color: #000;text-align: center;font-size: .8rem}

.retail_wrap{width: 100%;background: #eee;padding: 20px 0}
.retail_cont{max-width: 1080px;margin: 0 auto;justify-content: center;}
.retail_cont a{ overflow: hidden;background: #fff;display: block;padding: 0;margin: 10px 20px;max-width: calc(100%);-ms-flex-preferred-size: calc(100%);flex-basis: calc(100%);box-shadow: 0 6px 16px -8px rgba(0,0,0,.04);
    transition: box-shadow 135ms cubic-bezier(0.4, 0, 0.2, 1);}
.retail_list .txt_wrap{padding: 22px;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;-ms-flex-preferred-size: auto;flex-basis: auto;-webkit-box-flex: 1;-ms-flex-positive: 1;flex-grow: 1;}
.retail_list .txt_wrap h3{color: #212121;margin-bottom: 15px}
.retail_list .txt_wrap p{color: #666;margin-bottom: 20px}
.retail_list .txt_wrap .time{color: #777;-webkit-box-orient: horizontal;-webkit-box-direction: normal;-ms-flex-direction: row;flex-direction: row;-ms-flex-preferred-size: auto;flex-basis: auto;-webkit-box-flex: 1;-ms-flex-positive: 1;flex-grow: 1;-webkit-box-align: end;-ms-flex-align: end;align-items: end;}
.programs_wrap{max-width: 1020px;margin: 0 auto;}
.programs_li{align-items: center;flex-direction: column;background: #eee;margin:20px}
.programs_li .img_wrap{width: 100%;}
.programs_li .txt_wrap{width: 100%;text-align: center;min-height: 160px;align-items: center;justify-content: center;}
.programs_li .txt_wrap a,.programs_li .txt_wrap span{color: #000;font-size: 1.3rem;display: block;}
.programs_li .txt_wrap b{font-family: "宋体";}
.programs_li .txt_wrap a:hover{color: #007cc3;}
.swiper-container{margin-bottom: 50px}
.swiper-pagination-bullet{background: #333;opacity: .1}
.swiper-pagination-bullet-active{opacity: 1}
.swiper-horizontal>.swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal, .swiper-pagination-custom, .swiper-pagination-fraction{bottom: -30px;}

.store_cont{padding: 30px;max-width: 980px}
.store_cont .tit{font-size: 1.2rem;color: #000}
.store_cont > div{width: 100%;}
.storebox{align-content: flex-start;margin-bottom: 20px}
.storebox > div{width: 100%;margin-bottom: 20px}
.storebox a{color: #137EC1 !important;font-size: 15px;}
.store_txt{font-size: 15px;color: #343434}
.store_tel{display: block;margin-bottom: 4px}

#pageSelector {appearance: none;-webkit-appearance: none;-moz-appearance: none;background: transparent;border: none;font-size: 22px;width: auto;height: auto;line-height: 1.2em;padding: 0 20px 0 8px;margin: 66px 0;color: #000;outline: none;cursor: pointer;display: block;text-align: center;font-family: "Oswald", "Roboto", "Noto Sans SC", sans-serif;}
#pageSelector .sele{font-size: 16px;}
.custom-select{display: flex;align-items: center;justify-content: center;}
.seleWrap{position: relative;}
/*.seleWrap::after {
    content: '';
    display: block;
    position: absolute;
    right: -30px;
    top: 40%;transform: rotate(90deg);
    width: 21px;height: 21px;
    background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMCAxNiIgY2xhc3M9Imdsb2JhbC0taWNvbi0tYXJyb3ciPjxwYXRoIGQ9Ik01LjcgOEwwIDEzLjggMi4xIDE2IDEwIDggMi4xIDAgMCAyLjIgNS43IDh6Ii8+PC9zdmc+) no-repeat center;background-size: contain;pointer-events: none;
}*/
.seleWrap::after {
    position: absolute;
    right: -25px;
    top: 40%;
    color: #999;
    margin-top: 4px;
    border-style: solid;
    border-width: 8px 8px 0 8px;
    border-color: #999 transparent transparent transparent;
    content: "";
}
.slider-store .swiper-button-next,.slider-store .swiper-button-prev {color: #fff;transform: scale(.9);opacity: 0;visibility: hidden;transition: opacity 0.3s ease, visibility 0.3s ease;}
.slider-store:hover .swiper-button-next,.slider-store:hover .swiper-button-prev {opacity: 1;visibility: visible;}

/*選單*/
.custom-select {
    width: 100%;
    font-size: 32px;
    position: relative;
    cursor: pointer;
    padding: 10px;
    background: #fff;
    margin: 30px auto;
    z-index: 10;
}

.selected {
    padding: 10px;
    width: 110%;
}

.options {
    position: absolute;
    top: 100%;
    left: 0;
    width: 110%;
    background: #fff;
    border: 1px solid #e8e8e8;
    z-index: 10;
    margin: 0 auto;
    text-align: center;
    background: rgba(255, 255, 255, 1); /* 半透明白色 */
    display: none;
}

.option {
    padding: 10px;
    cursor: pointer;
    font-size: 18px;
    border: 1px solid #e8e8e8;

}

.option:hover {
    background: #000000;
    color: #ffffff;
}
@media (max-width:1024px) {
    .custom-select{
        font-size: 28px;
    }
    .seleWrap::after {
        right: -20px;
        top: 35%;
        
    }
    
}

@media (max-width: 641px) {
    .custom-select {
        font-size: 20px;
        left: -10px;
    }
    .option {
        font-size: 14px;
    }
    .seleWrap::after {
        right: -10px;
        top: 35%;
        border-width: 6px 6px 0 6px;
    }
}

@media screen and (min-width: 768px){
    .head_tit{padding: 30px 0;color: #000;text-align: center;font-size: 1.5rem;}
    .retail_wrap{padding: 40px 0}
    .retail_cont a{max-width: calc(33.33% - 1.5em);-ms-flex-preferred-size: calc(33.33% - 1.5em);flex-basis: calc(33.33% - 1.5em);margin: 0 11px 20px;}
    .programs_li{flex-direction: row;margin-bottom: 30px;}
    .programs_li .img_wrap{width: 50%;}
    .programs_li .txt_wrap{width: 50%;}
    .programs_r {flex-direction: row-reverse;}
    .swiper-container{margin-bottom: 100px}
    .swiper-horizontal>.swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal, .swiper-pagination-custom, .swiper-pagination-fraction{bottom: -40px;}
    .store_cont{margin: 0 auto;}
    .store_cont > div{width: 33.33%;padding-right: 15px;}
    .store_cont > div.storebox_w{width: 100%}
    #pageSelector{font-size: 32px}
}