/*PC背景*/
@media screen and (min-width:767px){
  .bg_fix {z-index: 0;position:absolute;top: 0;left:0;width:100%;height: 100%;background-repeat:no-repeat;background-position: center top;pointer-events:none;}
  .bgtop_fixed { z-index:-1; position:fixed; top:0; left:0; width:100%; min-width:1220px; height:100%; background-repeat:repeat-y; background-position:center top; pointer-events:none; }
  .bg_deco {z-index:-1;position:absolute;top:850px;left:0;width:100%;height:100%;background-position:center 0px;background-repeat:repeat-y;pointer-events:none;}	
  }
  
  /*mb背景*/
  @media screen and ( max-width:767px) {
  .bgtop01 { z-index:0; position:absolute; top:44px; left:0; width:100%; height:100%; background-repeat:no-repeat; background-position:center top; background-size:100%; }	
  .bgtop02 { z-index:0; position:absolute; top:10vw; left:0; width:100%; height:100%; background-repeat:no-repeat; background-position:center top; background-size:100%; }	
  .bg03{ z-index:-1; position:fixed; top:0vw; left:0; width:100%; height:100%; background-repeat:repeat-y; background-position:center top; background-size:100%; }	
  .bg02{ z-index:-1; position:absolute; top:0vw; left:0; width:100%; height:100%; background-repeat:repeat-y; background-position:center top; background-size:100%;  }	
  }
  

/*版頭區塊*/
.topdeco{ position:absolute; pointer-events: none; z-index: 1;}  
@media screen and (min-width:768px){
.Area_top {height:484px; }
.deco01 { top: 108px; left: 812px;  animation: pd 8s infinite ease-in-out; transform-origin: bottom; animation-delay: 1s;}
.deco02 { top: 308px; left: 165px; animation: pd3 1s ease-in-out infinite alternate-reverse; animation-delay: 1s; transform-origin: right bottom;}
.deco03 { top: 73px; left: 742px; animation: pd2 2s ease-in-out infinite alternate-reverse; animation-delay: 1s; }

}
@media screen and (max-width:767px){
.Area_top {height:53.5vw;}
.Area_top .mb_01{position:absolute; top:0; left:0 ;width: 100%; z-index:0;}
.deco01 {top: 16.5vw; left: 74vw; width: 27vw; animation: pd 8s infinite ease-in-out; transform-origin: bottom; animation-delay: 1s;}
.deco02 {top: 31vw; left:4vw; width: 10vw;  animation: pd3 1s ease-in-out infinite alternate-reverse; animation-delay: 1s; transform-origin: right bottom;}
.deco03 {top: 6vw; left:66vw; width: 9vw;  animation: pd2 2s ease-in-out infinite alternate-reverse; animation-delay: 1s; }
}

@keyframes pd2{
  0%{  transform:translate(10px,-5px);  }
  33%{  transform:translate(12px,-3px);  }
  66%{  transform:translate(0,-5px);  }
  100%{  transform:translate(0,0);  }
}
@keyframes pd{
  0%{  transform: rotate(0deg);  }
  2%{  transform: rotate(4deg);  }
  4%{  transform: rotate(0deg);  }
  6%{  transform: rotate(4deg);  }
  8%{  transform: rotate(0deg);  }
  100%{  transform: rotate(0deg);  }
}
@keyframes pd3{
  0%{  transform: rotate(0deg);  }
  100%{  transform: rotate(6deg);  }
}



/*版頭主標微調*/
.title01{ z-index:2;  position: absolute;}
.title01 .PD_layout .PD img { width:100%!important; }
.title01 .PD_layout .PD a { pointer-events: none; }
.title01 .PD_layout .PD_slide:hover {transform: translateY(0); }
.title01 .PD_layout .PD_slide {min-width: 100%;}
@media screen and (min-width: 768px){
.title01 { top:16px;left:91px; width:82%; }
}
@media screen and (max-width:767px){
.title01{width: 100%; }
.title01 ul{ padding: 0!important; }
.title01 .PD_layout {position: relative;top:0;left:0;width: 100%; }
.title01 .PD_layout .PD img { width: 100%!important; }

}

/*副標輪播*/
.Area_top .topPD2 {position: absolute; top: 324px; left:118px; width:569px;height: 120px;overflow: hidden; z-index:2;}
.Area_top .topPD2 ul.PD_wrapper { display: flex; flex-wrap: nowrap; margin: 0; padding: 0; width: 100%; box-sizing: content-box; grid-gap: inherit;}
.Area_top .topPD2 ul.PD_wrapper li { flex-shrink: 0; margin: 0; padding: 0; opacity: 0; transform: translate(5%,0);}
.Area_top .topPD2 ul.PD_wrapper li.swiper-slide-active { opacity: 1; transition: .8s ease-out; transform: translate(0,0);}
@media screen and (min-width: 768px){
  .Area_top .topPD2 ul.PD_wrapper li img{ width: 61%; }
}

@media screen and (max-width:767px){
  .Area_top .topPD2 {width: 51%; height: 14vw; position: absolute; top: 33vw; left: 3.5vw; overflow: hidden;}
  .Area_top .topPD2 ul.PD_wrapper li img{ width: 71%; }
}


/*版頭輪播*/
.pdTop .Area_content { padding: 0 0 0 60px; }
@media screen and (max-width: 767px) {
  .pdTop .Area_content { padding: 0 0 0 10vw; }
}
  /*輪播物件小標*/
.topPDtitle{ position: absolute; left: -18px; top: -13px; width: 85px;}
@media screen and (max-width: 767px) {
  .topPDtitle{ left: -3.5vw; top: -3vw; width: 16vw!important; }
}


/*日期*/
.TIMER_DAY {display:flex; justify-content: center; flex-wrap:nowrap; position: absolute; top: 313px; left: 549px; width:25%; height: 206px;   
  padding: 30px 16px 0 34px; font-size:57px; font-weight: bold; font-family: "Century Gothic"; z-index: 3;  transform: rotate(-7deg) scale(1.3);
   box-sizing: border-box;color: #ffef3a;/* background: url(datebg.png?t=1782813694900)no-repeat center / 88% ;*/} 
.TIMER_DAY small {font-size: 40px; font-weight: 100; position: relative;}
.TIMER_DAY #sendMonth { display: inline-block; text-align: right;  letter-spacing: -2px;} 
.TIMER_DAY #sendToday { display: inline-block;  text-align: left; letter-spacing: -2px;}
.TIMER_DAY .sendtxt { font-size: 0.8em; font-weight: 500; margin:4px 0 0 3px; text-align: left; width: 90%;}
.TIMER_DAY .box{ width: 100%; display: flex; justify-content: right; align-items: center;height: 80px; }
@media screen and (max-width: 736px){ 
.TIMER_DAY { position: absolute;width: 34%;top: 31.5vw;left: 44vw;font-size: 6.5vw;letter-spacing: 0; padding:4vw 1vw 0 2vw; text-align: left;margin: 0;font-weight: 900; height:22vw;  transform: rotate(-7deg) scale(1.1);}
.TIMER_DAY small {font-size: 4vw;}    
.TIMER_DAY #sendMonth {display: inline-block; font-size: 1em; }
.TIMER_DAY #sendToday {display: inline-block; font-size: 1em; }
.TIMER_DAY .sendtxt {font-weight: 500;font-size: 0.9em;  margin:-0.3vw 0 0 0.5vw;}	
.TIMER_DAY .box{ height: 8vw; }
}


/*區背景*/
.Area .bg, .Area .bg_btom{ position: absolute;pointer-events: none;z-index:0; }
@media screen and (min-width: 768px){
  .Area .bg, .Area .bg_btom{ left: 50%; transform: translateX(-50%); width: 2000px;}
  .Area_hot:before{ left: 50%; transform: translateX(-50%); }
}

.Area_hot .bg {top:-19px;left: 50%;}	
.Area_hot .bg_btom {bottom:-50px;}	
.Area_hot:before{ content:''; width: 2000px; height: 63%; background:url(Area_hot_center.png?t=1782813694900) repeat-y center / 100%; position: absolute; top: 510px;} 

.AreaPD01 .bg {top:-19px;left: 50%;}	


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

  .Area_hot .bg {top:-2vw;left:0;width:100%;  }	
  .Area_hot .bg_btom {bottom:-5vw;left:0;width:100%; }	
  .Area_hot:before{ content:''; width: 100%; height: 95%; background:url(mArea_hot_center.png?t=1782813694900) repeat-y center / 100%; position: absolute; top: 26vw; left: 0;}

  .AreaPD01 .bg {top:5vw;left:0;width:100%;  }	

}



/*區標*/
.Area_title h3{ font-family:"Century Gothic","Noto Sans TC"; font-weight: 600;}
@media screen and (min-width: 768px){
  .Area_title h3{ font-size: 53px;}
  .Area_title_all .PD_img{ width: 90%; margin: auto; }
  .Area_title01.Area_title h3{ transform: translateX(-186px) rotate(-4deg); }
  .Area_title02 h3{ top:8px; }
  .Area_title03 h3{ top:-2px; }
  .Area_title04 h3{ top:4px; }
  .Area_title04 { margin-bottom: -4px; }
}
@media screen and (max-width: 736px){ 
  .Area_title h3{ font-size: 6.5vw;}
  .Area_title01.Area_title h3{ transform: translateX(-20vw) rotate(-4deg); }
  .Area_title02 h3{ top:1vw; }
  .Area_title03 h3{ top:-.5vw; }
  .Area_title04 h3{ top:.5vw; }
}



/*品類按鈕*/
.Area_bn-grid-3x1 ul{ grid-gap:15px!important; }
@media screen and (max-width: 736px){ 
  .Area_bn-grid-3x1 ul{ grid-gap:1.8vw!important; }
}

/*輪播BN*/
.Area_bn-carousel ul{ height: 267px; }
@media screen and (max-width: 736px){ 
.Area_bn-carousel ul{ height: 25vw; }
}



/*活動倒數*/
#MS4{ display: none; }
.TimerNick2 {display:inline-block; height: 57px;z-index:99;font-weight: 700; width: 55%; text-align:center; position: absolute; top: 75px; right: -58px;}
.TimerNick2 .FontStyle2 {display: inline-block;margin: 0 0 0 2px;padding: 0;border: 0;font: bold 40px/30px Arial;color: #1a1a1a;/*background-color: #000; */border-radius:5px;/*text-shadow:1px 1px 0px #fff;*/letter-spacing: 0px;text-align: center;}
.TimerNick2 span {padding-left: 2px;font: 400 37px/48px "微軟正黑體","Microsoft JhengHei", Arial, Helvetica;letter-spacing: -0em;color: #1a1a1a;}
@media screen and (max-width:767px){
.TimerNick2 { width: 73%;  height:0; padding-bottom: 7%; background-size:100%;  transform: scale(0.85); top: 7vw; right: -14vw;}
.TimerNick2 .FontStyle2 {margin: 0;padding: 0;border: 0;font: bold 5vw/5vw Arial;}
.TimerNick2 span {padding-left:0;font: normal 5vw/5vw "微軟正黑體","Microsoft JhengHei", Arial, Helvetica;letter-spacing: -0.05em;}
}


/*品牌輪播*/
.Area_brand-swiper .PD_layout.PD_layout-D3_02 ul .PD .PD_logo{ background-color: transparent; margin: -11px 0 0 41px; width: 47%; }
.Area_brand-swiper .box .PD_layout-D3_02 .PD h3{ margin: 9px 39px 31px 64px; width: 55%;}
@media screen and (max-width:767px){
  .Area_brand-swiper .PD_layout.PD_layout-D3_02 ul .PD .PD_logo{ margin: -2.5vw 8vw 0 1.5vw; width: 39%; }
  .Area_brand-swiper .box .PD_layout-D3_02 .PD h3{ margin: 0vw 4vw 4vw -6vw; width: 43%;}
}


/*登記*/
.danji_box .activityText span{ color: rgb(254, 233, 0)!important; }
.Area_danji .danji_box {  margin-bottom: -12px; }
@media screen and (max-width: 767px) {
  .Area_danji .danji_box {  margin-bottom: 0em; }
  .warningTxt h3{ padding: 0 0 1em  }
}


/*攻略輪播品*/
.active_swiper .layout_day ul {width: 100%!important;margin:0 auto!important;padding:0!important;grid-gap:0;height: 438px;}
.active_swiper .layout_day ul li {background:url(Area02_daybg.png?t=1782813694900)top center no-repeat;background-size:100%;padding-bottom: 0; }
.active_swiper .layout_day ul li a {color: #4c2b14;}
.active_swiper .layout_day .PD p {position:absolute;top: 12px;left: 187px;color: #0c4fc7;font-size: 1.1em;}
.active_swiper .layout_day .PD p .Price {font-size: 1.6em;}
.active_swiper .layout_day .PD p .money {display: none !important;;}
.active_swiper .layout_day .PD_img {width: 100%;margin:0 auto;padding-top: 54px;}
.active_swiper .layout_day .PD_img img {border-radius:50%;}
.active_swiper .layout_day .PD_into {padding-top: 0;}
.active_swiper .layout_day .PD h4 {line-height: 2.4em;}
.active_swiper .layout_day .PD_into .js-PD_txt1 {color: #1d1d1d;font-size: 36px;}
.active_swiper .layout_day .PD_into .js-PD_txt2 {font-size: 40px;padding-top: 24px;color: #fff; box-sizing: unset;}
@media screen and (max-width: 767px){
  .active_swiper .layout_day ul {width:100%!important;margin:0 auto!important;padding:0!important;grid-gap: 0;height: 62vw;}
  .active_swiper .layout_day .PD_slide { min-width: inherit; }
  .active_swiper .layout_day ul li {background:url(Area02_daybg.png?t=1782813694900)top center no-repeat;background-size:100%;height:57vw;}
  .active_swiper .layout_day ul li a {color: #492c16;}
  .active_swiper .layout_day .PD p {position:absolute;top: 0vw;left: 23.5vw;color: #0c4fc7;}
  .active_swiper .layout_day .PD p .Price {font-size: 0.9em;}
  .active_swiper .layout_day .PD p .money {display: none !important;;}
  .active_swiper .layout_day .PD_img {padding: 6vw 1vw 0;}
  .active_swiper .layout_day .PD_img img {border-radius: 50%;}
  .active_swiper .layout_day .PD_into {padding-top: 0.5vw;}
  .active_swiper .layout_day .PD h4 {line-height: 1.7em;}
  .active_swiper .layout_day .PD_into .js-PD_txt1 {color: #1d1d1d;font-size: 20px;}
  .active_swiper .layout_day .PD_into .js-PD_txt2 {font-size: 20px;padding-top: 4px;color: #fff;}
  .active_swiper .Area_swiper_box{ padding-bottom: 0; }
}


/*3P*/
@media screen and (min-width:768px){ 
  .Area_coupon_ppp .Area_swiper { width: 100%; }
  .Area_coupon_ppp .Area_swiper_box{ padding-bottom: 9px; }
  .Area_coupon_ppp .get_all{ margin-top:5px; }
  .Area_coupon_ppp .Area_swiper_box .swiper-pagination{ bottom: 12px!important; position: absolute!important; }
}
@media screen and (max-width:767px){
  .Area_coupon_ppp .Area_swiper_box{ padding-bottom: 0; }
  .Area_coupon_ppp .get_all{ margin-top: 1vw; transform: scale(.97);}
  .Area_coupon_ppp .Area_swiper_box .swiper-pagination{ bottom: -.5vw!important;  position: absolute!important;}
}
/*mo+輪播*/
.box_mo{ padding: 25px 0 0; }
.box_mo .Area_swiper_box{ padding-bottom: 0; }
.box_mo ul{ padding: 0!important; }
.box_mo .PD_layout ul li { background: url(moPD_bg.png?t=1782813694900) no-repeat left top / 100%; background-color: transparent; padding: 13px 15px 0 14px;}
.box_mo ul li .PD_into{ margin: 36px 0 -1px; }
.box_mo ul li .PD_into h3 {  margin: 6px 0 0; }
.box_mo .PD_layout ul li .PD_into h3 span{ background-color: transparent; max-width: 100%; line-height: 2.5em;}
.box_mo .PD_layout .PD_img{ padding: 5px 15px 10px; }
.box_mo li img{ box-shadow: none!important; border: none!important; background-color: transparent!important;} 
@media screen and (max-width:767px){
  .box_mo{ padding: 1vw 2vw; }
  .box_mo .PD_layout ul li { padding: 1vw .2vw 1vw .2vw;}
  .box_mo ul li .PD_into{ margin: 6.3vw 0 0; }
  .box_mo ul li .PD_into h3 {  margin: 2vw 0 0; }
  .box_mo .PD_logo { width: 75%!important; margin-bottom: -5vw!important; }  
  .box_mo .PD_logo img{ width: 100%!important; height: auto!important;}  
}

.Area_mo .PD_layout-D1_01 .PD h4{ color: #e51326; }
.Area_mo .PD_layout-D1_01 ul{height: 479px;}
@media screen and (max-width:767px){
  .Area_mo .PD_layout-D1_01 ul{height: 51.5vw;}
}