.poi{max-width: 1400px;margin: 0 auto;}
.poiMenu {background-color: #f8eedf; margin: 0 auto; padding: 0; position: relative; }
.poiMenu * {transition: 0.3s;}
.poiMenu ul {width: 90%; margin: 0 auto; list-style: none; display: block; overflow-x: auto; white-space: nowrap; text-align: center; -webkit-overflow-scrolling: touch; }
.poiMenu ul li {display: inline-block; padding:5px 10px; color: #000; font: normal 18px/1.2 "微軟正黑體", sans-serif;margin:2px ; /*border-left: 1px solid #fff;*/cursor: pointer;position: relative;}
.poiMenu ul li:first-child  {border-left: 0; }


.poiMenu ul li:hover::before{content: "";width: 100%;height: 3px;background: #02c7c9;position: absolute;bottom: 0;left: 0;z-index: 0;}




/*tab切換*/
.tabChange .poiMenu ul li.on::before{content: "";width: 100%;height: 3px;background: #02c7c9;position: absolute;bottom: 0;left: 0;z-index: 0;}
.tabChange .item{display: none;}
.tabChange .item.on{display: block;}




.poiGoods{border-radius: 20px;/*margin: 20px auto*/;}
.poiGoods > article {padding: 0px 0;margin: 0 auto;width: 100%;}

.ph-group  {width: 100%;margin: 20px auto 20px auto;padding: 10px 10px;position: relative;display: inline-flex;justify-content:center;flex-wrap: wrap;}
.ph{margin: 0px auto;width: 100%;}
.ph:hover{transform: none;}
.slidecontain {display:none;}

.ph .ph-group-content{margin: 15px 10px;transition: 0.2s;padding: 0px 0px 48px 0px; width: 23%;position: relative;flex-shrink: 1;background:#FFF;box-shadow: 0 0 5px rgba(0,0,0,0.3);border-radius: 20px;overflow: hidden;}
.ph .ph-group-content-photo {display: block;}
.ph .ph-group-content-photo img{width: 100%;}
.ph .ph-group-content-text{}
.ph .ph-group-content-text-name{color:#FFF;font: 18px/1.4 "微軟正黑體";/*margin: 10px auto;*/display: block;background: #02c7c9;padding: 10px;}
.ph .ph-group-content-text-detail{color:#000;font:15px/1.4 "微軟正黑體";/*padding: 5px 10px 10px 10px;*/background: #FFF;padding:0 10px 10px 10px;}
.ph .ph-group-content-text-detail a {color: #000;}
.ph .ph-group-content-text-price {color:#ff3333;position: absolute;padding:0px 10px;font:bold 20px/1.4 "微軟正黑體";text-align: center;display: block;left: 10%;bottom: 10px;background:none;width: 100%;border-radius: 20px;border:1px solid #ff3333;width: 80%;}
.ph .ph-group-content-text-price span{font-size: 80%;line-height: 1.8;}
.ph .ph-group-content-tag {position: absolute;left: 0%; top: 15px; background: #fbffa4;font:15px/1.4 "微軟正黑體";color:#000;padding: 3px 10px;border-radius: 0 20px 20px 0;}
.ph .ph-group-content-text-sale{font: bold 16px/1.4 "微軟正黑體"; color: #f5565a; background: #FFF;    padding: 0 10px;margin: 5px auto; }
.ph .ph-group-content-text-sale a {color: #f5565a;}

.ph .ph-group-content:hover .ph-group-content-text-price {background: #ff3333;color: #FFF;}
.ph-group-title {margin: 0px auto 0 auto;display: block;text-align: center;}
.ph-group-title span {font:bold 36px/1.6 "微軟正黑體";color:#02c7c9;text-align: center;position: relative;border-bottom: 1px dashed #02c7c9;}
.ph-group-title span::before{content: ""; display: inline-block; width:50px;  height:55px; background: url(../images/title-left.png) left top no-repeat; position: absolute;left: -60px;top: 3px;background-size:100%;}
.ph-group-title span::after{content: ""; display: inline-block; width: 40px; height: 41px; background: url(../images/title-right.png) left top no-repeat; position: absolute; right: -50px; top:5px;background-size:100%;}




/*長榮活動*/

.evair .ph .ph-group:nth-of-type(1) .ph-group-content{width: 100%;display: inline-flex;flex-wrap: wrap;position: relative; padding: 50px;box-shadow: none;/*border:1px solid  #02c7c9;*/}
.evair .ph .ph-group:nth-of-type(1) .ph-group-content:nth-of-type(even) {background:url(../images/stripe.jpg) left top repeat;}
.evair .ph .ph-group:nth-of-type(1) .ph-group-content-photo {width: 30%;order: 1;background: #FFF;}
.evair .ph .ph-group:nth-of-type(1) .ph-group-content-text {width: 60%;flex-grow: 1;order: 2;background: #FFF;}
.evair .ph .ph-group:nth-of-type(1) .ph-group-content-text-name {font: bold 22px/1.4 "微軟正黑體";}
.evair .ph .ph-group:nth-of-type(1) .ph-group-content-text-price {display: none;}
.evair .ph .ph-group:nth-of-type(1) .ph-group-content-text-detail{padding:10px 20px;font:16px/1.4 "微軟正黑體";}
.evair .ph .ph-group:nth-of-type(1) .ph-group-content:nth-of-type(2) .ph-group-content-photo{order: 2;}
.evair .ph .ph-group:nth-of-type(1) .ph-group-content:nth-of-type(2) .ph-group-content-text {order: 1;}



@media screen and (max-width:1450px) { 
.ph .ph-group-content{width: 28%;}
}


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


}


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

.poiMenu li{font:16px/1.4 "微軟正黑體";margin:0px 3px;padding: 3px 10px;}
.poiGoods > article{width: 100%;margin: 0 auto;}

}

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

}


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


}

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

.poi {padding: 0 0 10px 0;width: 90%;margin: 0 auto;}

.poiMenu{/*background:#fff1db;*/white-space:nowrap;-webkit-overflow-scrolling: touch; overflow-scrolling: touch;overflow-x: scroll;border: none;}
.poiMenu li {margin:0px 10px;font:15px/1.6 "微軟正黑體";padding: 0px;}

.ph .ph-group-content{width: 44%;}

.evair .ph .ph-group:nth-of-type(1) .ph-group-content-text-name{font:bold 16px/1.4 "微軟正黑體";text-align: censter;}
.evair .ph .ph-group:nth-of-type(1)  .ph-group-content{width: 100%;flex-wrap: wrap;padding: 20px;border:1px solid #02c7c9;}
.evair .ph .ph-group:nth-of-type(1)  .ph-group-content-photo {width: 100%;}
.evair .ph .ph-group:nth-of-type(1)  .ph-group-content-text {width: 100%;flex-grow: 0;}
.evair .ph .ph-group:nth-of-type(1) .ph-group-content:nth-of-type(2) .ph-group-content-photo{order: 1;}
.evair .ph .ph-group:nth-of-type(1) .ph-group-content:nth-of-type(2) .ph-group-content-text {order: 2;}

}

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

.poiMenu li{font:14px/1.4 "微軟正黑體";}
.ph .ph-group-content-text-name{font:bold 16px/1.4 "微軟正黑體";}
.ph .ph-group-content-text{}
.ph .ph-group-content-text-detail{font:14px/1.4 "微軟正黑體";}
.ph .ph-group-content-text-price{font:bold 20px/1.4 "微軟正黑體";}
.ph-group-content-text-sale{font:14px/1.4 "微軟正黑體";}
/*.ph-group-title span{font:bold 20px/1.6 "微軟正黑體";}*/

.ph-group{padding: 0% 3%;width: 100%;}
.poi .ph{width: 100%;}
.ph .ph-group-content{width: 100%;margin: 10px auto;}
.ph .ph-group-content-text-sale{font: 14px/1.4 "微軟正黑體";}

.ph-group-title span::before{width:30px;  height:35px; left: -35px;top: 3px;}
.ph-group-title span::after{width: 30px; height: 35px; right: -35px; top: 3px;}


}



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

/*.poiMenu ul:before, .poiMenu ul:after {content: '«'; color: #000; font-size: 16px; line-height: 1.4; vertical-align: middle; }
.poiMenu ul:after {content: '»'; }*/

.ph-group-title{margin: 10px auto;}
.ph-group-title span {font:bold 26px/1.6 "微軟正黑體";/*padding:10px 30px;*/}

.poiMenu ul li{font:normal 16px/1.2 "微軟正黑體", sans-serif;}



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


}