body { min-width: 1200px; color: #333; font: 13px/1.6em "Century Gothic", Arial, 'Microsoft JhengHei', "蘋果儷中黑", "儷黑 Pro", "新細明體", "sans-serif"; }
a { display: block; text-decoration: none;}
:focus { outline: none; }
i { font-style: normal; }
.header, .footer { margin: auto; width: 100%;}
.hd_pc { width: 100%;  margin-bottom: 15px;  -webkit-box-shadow: 0 5px 5px 0 rgba(0,0,0,.3); box-shadow: 0 5px 5px 0 rgba(0,0,0,.3);}
.hd_m, footer { display: none; }
.M_menu_wrap, .M_bar, .M_bar2 { display: none; }
.main { position: relative; width: 100%; }
.gotop { display: none; }

/**kv**/
.kv_wrapper { position: relative; border: 10px solid #f1f1f1;width: 1167px; margin: 0 auto; padding: 15px 0;   -webkit-box-shadow: 0 5px 5px 0 rgba(0,0,0,.3);  box-shadow: 0 5px 5px 0 rgba(0,0,0,.3);}
.kv { position: relative; z-index: 1; margin: auto; width: 1100px; height: 350px;}
.swiper-wrapper {  text-align: center;}
.brandStand_item {  width: 1000px;  margin: auto;  position: relative; padding-top: 20px;  text-align: center;}
.kv .swiper-button{  width: 1120px; position: absolute; z-index: 2; top: 165px; left: -10px; }
.kv .swiper-button-prev.swiper-button-white, .kv .swiper-container-rtl .swiper-button-next.swiper-button-white{  width: 45px;  height: 100px; background-color: rgba(0,0,0,.5); border-radius: 0 10px 10px 0; }
.kv .swiper-button-next.swiper-button-white, .kv .swiper-container-rtl .swiper-button-prev.swiper-button-white{  width: 45px;  height: 100px; background-color: rgba(0,0,0,.5); border-radius: 10px 0 0 10px; }

/**brand**/
.brand_wrapper {  width: 100%; padding: 15px 0; }
.brand{ width: 1100px;  margin: 0 auto;  position: relative; height: 260px;  }
.brand .swiper-container { width: 1000px;  padding-bottom: 32px;}
.swiper-button{ width: 1100px; margin: 0 auto; position: absolute;  z-index: 2;  top: 100px; left: -1px;}
.brand .swiper-slide img{ width:80%; padding-top: 10px;}
.brand .swiper-slide {  width: 16%;}
.brand .swiper-slide a { border: 2px solid #ccc;  font-size: 17px;  line-height: 40px;  color: #333; border-radius: 20px; text-align: center; background: #fff;  }
.brand .swiper-slide a:hover { border: 2px solid #007aff   }



/***prod***/
.prod_wrapper { position: relative; padding: 0;}
.prod_container { position: relative; z-index: 100; overflow: hidden; }
.ProductList {position: relative;z-index: 500;margin: auto;padding-bottom: 20px;width: 1100px;overflow: hidden}
.ProductList:after {clear: both;display: table;content: '';}
.ProductList .item {position: relative;float: left; width: 260px; margin-left: 1.1%; margin-right: 0; margin-bottom: 15px;text-align: center;}
.ProductList .item>a {position: relative;display: block;background: #fff;-webkit-box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.10);-moz-box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.10);box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.10);-webkit-transition-timing-function: ease-out;transition-timing-function: ease-out;-webkit-transition-duration: 0.1s;transition-duration: 0.1s; border: 1px solid #ccc;}
.ProductList .ProductImg {position: relative;overflow: hidden;margin: 0 auto;width: 250px;height: 270px;}
.ProductList .ProductImg img {position: absolute;top: 0;right: 0;bottom: 0;left: 0;margin: auto;max-width: 100%;max-height: 100%;}
.ProductList .item>a:hover, .ProductList .item>a:focus, .ProductList .item>a:active {transform:translateY(-5px)}
.ProductList .ProductDesc {overflow: hidden;padding: 0 5px;height: 36px; background-image: linear-gradient(120deg, #f6d365 0%, #ffa800 100%); color: #fff;font-weight: bold;font-size: 15px;line-height: 36px;}
.item .ProductName {overflow: hidden;padding: 4px 5px;height: 38px;color: #000;text-align: center;font-size: 16px;line-height: 21px;}
.item .ProducPrice, .item .Event_Condition {padding: 3px 2px 7px 2px;height: 35px;color: #d52027;}
.item .ProducPrice label {cursor: pointer;}
.item .ProducPrice i em span {margin: 0 10px 0 0;color: #747474;font-weight: 100;font-size: 13px;}
.item .ProducPrice span, .item .Event_Condition i span {margin: 0 2px 0 2px;font-weight: 500;font-size: 40px;line-height: 30px;}
.item .ProducPrice i em {color: #747474;text-decoration: line-through;font-style: normal;}
.item .ProducPrice .price_txt {color: #d52027;font-size: 15px;line-height: 26px;}

/**title***/
.tit {display: none;margin: auto;}
.ProductList .item .sub_tit { display: none;position: absolute;z-index: 100;width: 1100px;height: 75px;}
.ProductList .item_4 .sub_tit  { display:block; top: -435px !important;}
.ProductList .item_0 .sub_tit,
.ProductList .item_12 .sub_tit,
.ProductList .item_20 .sub_tit,
.ProductList .item_28 .sub_tit,
.ProductList .item_36 .sub_tit { display:block; }
.ProductList .item .sub_tit a {display: inline-block;}
.title_txt a,  .title_txt2 a {font-size: 45px;  line-height: 50px;  font-weight: normal; color: #555;  border: 2px solid #555; border-radius: 50px; padding: 5px 52px 2px 52px;}
.title_txt i:before { content: "★"; color: #555;  font-size: 35px;  padding: 0 10px;}
.item_0 .title_txt a, .item_4 .title_txt a{ border: 2px solid #eaccb9;  font-size: 42px;  color: #fff;  padding: 8px 52px 0px 52px; }
.item_0 .title_txt a span, .item_4 .title_txt a span{ color: #fff197;  font-size: 28px;  padding-right: 10px; }
.title_bule a{ background: #242843;  }
.title_red a{ background: #89291c;  }
.title_cool a{ background: #3087c5;  }

/**產品線區*6區**/
.ProductList .item_0, .ProductList .item_1, .ProductList .item_2, .ProductList .item_3 {margin-top: 110px;}
.ProductList .item_4, .ProductList .item_5, .ProductList .item_6, .ProductList .item_7 {margin-top:495px;}
.ProductList .item_12, .ProductList .item_13, .ProductList .item_14, .ProductList .item_15 {margin-top: 120px;}
.ProductList .item_20, .ProductList .item_21, .ProductList .item_22, .ProductList .item_23 {margin-top: 120px;}
.ProductList .item_28, .ProductList .item_29, .ProductList .item_30, .ProductList .item_31 {margin-top: 120px;}
.ProductList .item_36, .ProductList .item_37, .ProductList .item_38, .ProductList .item_39 {margin-top: 120px;}

/*ProductListBG*/
.prod_container_bg {  position: absolute;  top: 0;  right: 0;  left: 0;  margin: auto;  width: 1200px;}
.prod_container_bg_01 {  background: url("../img/prod_bg1-1.png") top center no-repeat; height: 616px;  padding-top: 0px; }
.prod_container_bg_02 {  background: url("../img/prod_bg1-2.png") top center no-repeat; height: 326px;  padding-top: 0px; }
.prod_container_bg_03 {  background: url("../img/prod_bg2-1.png") top center no-repeat; height: 616px;  padding-top: 0px; }
.prod_container_bg_04 {  background: url("../img/prod_bg2-2.png") top center no-repeat; height: 326px;  padding-top: 0px; }
.prod_container_bg_cool1 {  background: url("../img/prod_bg3-1.png") top center no-repeat; height: 616px;  padding-top: 0px; }
.prod_container_bg_cool2 {  background: url("../img/prod_bg3-2.png") top center no-repeat; height: 326px;  padding-top: 0px; }

/*bn*/
.main_banner {width: 1100px; margin: 0 auto;}
.bn {padding-bottom: 10px;text-align: center;}

/**float**/
.float_wrapper { position: fixed; bottom: 40px; right:10px; z-index: 250; display: block;}
.float_main { width: 138px; opacity: 0.9; filter: alpha(opacity=90);}
.go_top { display: block;cursor: pointer;}
.group_leftmenu { margin: auto; width:73px; }
.group_leftmenu li {position: relative; text-align: center; font-size: 18px; line-height: 20px; background: #969696; border-radius: 50px;  padding: 15px 0; margin-bottom: 4px;}
.group_leftmenu li.highlight1 { background-color: #242843; }
.group_leftmenu li.highlight2 { background-color: #d96245; }
.group_leftmenu li.highlight3 { background-color: #47a0e0; }
.group_leftmenu li.highlight_top { background-color: #fff; border: 1px solid #303752; line-height: 18px;}
.group_leftmenu li.highlight_top a { color: #303752; }
.group_leftmenu li a {position: relative;z-index: 500;color: #fff; cursor: pointer; font-weight: bold;}
.group_leftmenu li:hover { background: #e8b96b; }

/*commonVipMember*/
.eventPage_bn_vipMember_wrapper { position: relative; }
.eventPage_fixTopLeft_vipMember { position: fixed; left: 48.5%; z-index: 999; }
.eventPage_fixTopLeft_vipMember a { position: absolute; top: 100px; right: 600px; display: inline-block; width: 50px; }
/**tag wfe**/
.tag_wfe { position: relative; top: -5px; display: inline-block; width: 20px; height: 20px; background: url(//www.payeasy.com.tw/pezlib/images/tag_wfe_s.png) left;background-size: cover; }
.tag_wfe.checked { background-position: right; }
.tag_wfe .brief { position: absolute; top: -5px; left: 25px; z-index: 10; display: none; width: 64px; background: #E36E1A; color: #f6f6f6 !important; text-align: center; font-size: 12px !important; line-height: 16px!important; }
.tag_wfe:hover .brief { display: block; }
.tag_wfe.checked:hover .brief { display: none; }
.tag_wfe .brief:after { position: absolute; top: 10px; left: -10px; width: 0; height: 0; border-color: transparent #E36E1A transparent transparent; border-style: solid; border-width: 5px; content: ''; font-size: 0; line-height: 0; }
.tag_wfe:before { display: inline-block; height: 100%; content: ''; vertical-align: text-bottom; }
/**vip**/
.promotionBlock { position: relative; }
.promotionBlock .activity {	left: 0px;	position: absolute;	bottom: 0%;	width: 100%; z-index: 90;}
.promotionBlock .activity img { width: 100%; }


@media screen and (max-width:767px) {
body { padding-bottom: 28vw; width: 100vw; min-width: inherit;  }
* { box-sizing: border-box; }
.header { width: 100vw; }
.footer { display: none; }
.hd_pc { display: none; }
.hd_m, footer { display: block; }
.main {background-size: 200vw; }
.gotop { background: url(//www.payeasy.com.tw/pbenefit/in_other/pmedm/106/autumn/images/icon_top.png) no-repeat;  height: 36px; position: fixed; right: 5px; width: 36px; bottom: 107px; z-index: 900; display: none;  }
.gotop a { display: block; width: 48px; height: 36px; }
.eventPage_bn_vipMember_wrapper { display: none; }
   
.kv_wrapper {  border: none; width:100vw; padding: 0; }
.kv { width: 100vw; height: 31.8vw; }
.kv img { width: 100%; height: 31.8vw;}
.kv .swiper-button{  display: none; }

    
.brand_wrapper {padding: 2vw 0;  margin-bottom: 2vw;}
.brand{ width:100vw;  margin: 0 auto;  position: relative; height:48.5vw; }
.bgbule{ background: #3f5687;}
.bgred{ background: #d96245;}
.bgcool{ background: #7ecef4;}
.brand .swiper-container { width: 76vw;  padding-bottom: 7vw; }
.brand .swiper-button{ width: 100vw; top: 22vw;}
.brand .swiper-slide {  width: 50%;}
.brand .swiper-slide img{ width:80% !important; padding-top: 5px;}
.brand .swiper-slide img:before{ height: 133px;} 
.ProductList .item_0 .sub_tit {top: -11vw !important;}
.ProductList .item_4 .sub_tit {top: -73vw !important;}
.brand .swiper-slide a { font-size: 15px;  }

.prod_wrapper { padding: 0;}
.ProductList { width: 100vw; }
.ProductList .item { margin-top: 5px!important; margin-right: 0.5vw; margin-left: 0.5vw; width: 49vw; margin-bottom: 0;}
.ProductList .ProductImg { width: 46vw!important; height:49vw!important; }
.item .ProducPrice span, .item .Event_Condition i span { font-size: 18px; font-weight: bold;}
.item .ProducPrice i em span { margin-right:5px; font-size: 12px; font-weight: bold;}
.item .ProductName { height: 40px; font-size: 14px; line-height: 18px; }
.ProductList .ProductDesc{font-size: 12px;}
.ProductList .item .sub_tit { width:100vw; height: 8.3vw; left: -0.5vw;}
.ProductList .item .sub_tit img { width: 100%; }
    
.ProductList .item_0, .ProductList .item_1{ margin-top: calc(12.3vw + 5px)!important; }
.ProductList .item_4, .ProductList .item_5  { margin-top: calc(75.3vw + 5px)!important; }
.ProductList .item_12, .ProductList .item_13,
.ProductList .item_20, .ProductList .item_21, 
.ProductList .item_28, .ProductList .item_29,
.ProductList .item_36, .ProductList .item_37 { margin-top: calc(14.3vw + 5px)!important; }
.title_txt a,  .title_txt2 a { font-size: 19px; line-height: 16px; padding: 5px 20px 2px; font-weight: bold; }
.title_txt i:before { font-size: 7px; padding: 0 5px; }
.item_0 .title_txt a, .item_4 .title_txt a{ font-size: 19px; line-height: 16px; padding: 7px 30px 5px; font-weight: bold; }
.item_0 .title_txt a span, .item_4 .title_txt a span{ font-size: 14px;   }
    
.prod_container_bg {  position: absolute;  top: 0;  right: 0;  left: 0;  margin: auto;  width: 100vw;}
.prod_container_bg_01 {  background: #3f5687; height: 148vw;  }
.prod_container_bg_02 {  background: #3f5687; height: 80vw   }
.prod_container_bg_03 {  background: #d96245; height: 148vw;  }
.prod_container_bg_04 {  background: #d96245; height: 80vw   }
.prod_container_bg_cool1 {  background: #7ecef4; height: 148vw;  }
.prod_container_bg_cool2 {  background: #7ecef4; height: 80vw   }
    
.main_banner { width: 100vw; overflow: hidden; padding-bottom: 0;  }
.main_banner img, .bn img { width: 100%;  }

/*M版選單*/
.float_wrapper {display: none; left: 100%;}
.M_bar { display: block; width: 100%; height: 72px; background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #555), color-stop(100%, #111)); position: fixed; bottom: 35px; box-shadow: 0px -1px 1px #333; z-index: 200;}
.M_bar ul {list-style: none; width: 100%; overflow: hidden;}
.M_bar li {  float: left;  width: 14.28%;  height: 55px; border-top: 1px solid #999;  border-left: 1px solid #222;  border-right: 1px solid #666; -webkit-box-sizing: border-box;  padding-top: 8px;  font-size: 15px; text-align: center;}
.M_bar li a { color: #fff;}

.M_bar2 {display: block;width: 100%;height:53px;background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e41d3f), color-stop(100%,#a3132c));position: fixed;bottom:0;box-shadow: 0px -1px 1px #333; z-index: 201;}
.M_bar2 ul{	list-style: none; width: 100%; overflow: hidden;}
.M_bar2 li{float: left;width: 16.66%;height: 55px; border-top: 1px solid #ff8ea1; border-left: 1px solid #dd1c3d; border-right: 1px solid #a9142e;-webkit-box-sizing: border-box;padding-top: 8px;font-size: 15px;text-align: center;}
.M_bar2 li a{	color:#fff;}
li.best { border-top: 1px solid #999;  border-left: 1px solid #222; border-right: 1px solid #666; color: #fff; background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #555), color-stop(100%, #111)); padding: 0;
 line-height: 15px; }

/**/
.tag_wfe{top: auto;}
	
}
@media screen and (max-width:320px) {
.item .ProducPrice i em span{font-size: 11px;}
.item .ProducPrice .price_txt{ font-size: 13px;}
.tag_wfe{ width:16px; height: 16px;}
}