@charset "utf-8";
/* CSS Document */

/*基本*/
body{ margin: 0; padding: 0;}


/*全BOX版面*/
.WRAPPER { position: relative; display: block; margin: 0 auto; padding: 0; width: 100%;  min-width: 1220px; overflow: hidden; font-family: "微軟正黑體","Microsoft JhengHei",Helvetica; background: url(bgrepeat.jpg?t=1758768619998)top center repeat-y;}
.WRAPPER img { border: 0; vertical-align: top;}
.WRAPPER a { text-decoration: none;}
@media screen and (max-width:767px){
  .WRAPPER { min-width: inherit; padding-bottom: 10vw; background: url(bgrepeat_m.jpg?t=1758768619998)top center repeat-y; background-size: 100%;}
  .WRAPPER img {  width: 100%;  height: auto;}
}

/*背景*/
@media screen and (min-width:787px){
.bgtop { z-index: 0; position: absolute; top: 0; left: 0; width: 100%; min-width: 1220px; height: 100%; background: url(bgtop.jpg?t=1758768619998) no-repeat center top;}
.leaf_R { z-index: 0; position: absolute; top: 335px; right: 105px;}
.bgglass {z-index: 0;position: absolute;top: 0;left: 0;width: 100%;min-width: 1220px;height: 100%;background: url(bgglass.png?t=1758768619998) no-repeat center top;pointer-events: none;mix-blend-mode: darken;}
.curtains01 { z-index: 0; position: absolute; top: 0; left: -550px;}
.curtains02 { z-index: 0; position: absolute; top: 0; right: -390px;}
.bglight { z-index: 0; position: absolute; top: 0; left: 0; width: 100%; min-width: 1220px; height: 100%; background: url(bglight.png?t=1758768619998) no-repeat center top; pointer-events: none; mix-blend-mode: screen;}
.bgsun { z-index: 0; position: absolute; top: 0; left: 0; width: 100%; min-width: 1220px; height: 100%; background: url(bgsun.png?t=1758768619998) no-repeat center top; pointer-events: none; mix-blend-mode: screen;}
.bgdeco { z-index: 0; position: absolute; top: 700px; left: 0; width: 100%; min-width: 1220px; height: 100%; background: url(bgdeco.png?t=1758768619998) repeat-y center top; transition: 0.5s linear; pointer-events: none;}
}
@media screen and (max-width:767px){
  .bgtop { z-index: 0; position: absolute; top: 0; left: 0; width: 100%; min-width: inherit; height: 100%; background: url(bgtop_m.jpg?t=1758768619998) no-repeat center 44px; background-size: 100%;}
  .leaf_R {position: absolute;top: 30vw;left: 80vw;width: 27%;z-index: 5;}
  .leaf_L {position: absolute;top: 22vw;left: -19vw;width: 27%;z-index: 5;pointer-events: none;transform: rotate(20deg);}
  .bglight { z-index: 0; position: absolute; top: 0; left: 0; width: 100%; min-width: inherit; height: 100%; background: url(bglight_m.png?t=1758768619998) no-repeat center 44px; background-size: 100%; pointer-events: none; mix-blend-mode: screen;}
  .bgsun { z-index: 0; position: absolute; top: 0; left: 0; width: 100%; min-width: inherit; height: 100%; background: url(bgsun_m.png?t=1758768619998) no-repeat center 44px; background-size: 100%; pointer-events: none; mix-blend-mode: screen;}
}
	
/*區塊_all*/
.Area { position: relative; margin: 0 auto; padding: 0; border-radius: 0; text-align: center; }
.Area a { display: block;} 
.Area .go_bt {
  -webkit-transition: all 0.4s ease;
     -moz-transition: all 0.4s ease;
      -ms-transition: all 0.4s ease;
       -o-transition: all 0.4s ease;
          transition: all 0.4s ease;}
.Area .go_bt:hover {
  -webkit-transform: scale(0.95);
     -moz-transform: scale(0.95);
      -ms-transform: scale(0.95);
       -o-transform: scale(0.95);
          transform: scale(0.95);}
.Area .go_bt2 {
  -webkit-transition: all 0.4s ease;
     -moz-transition: all 0.4s ease;
      -ms-transition: all 0.4s ease;
       -o-transition: all 0.4s ease;
          transition: all 0.4s ease;}
.Area .go_bt2:hover { 
  filter: brightness(130%);
  -webkit-transform: translateY(-10px);
     -moz-transform: translateY(-10px);
      -ms-transform: translateY(-10px);
       -o-transform: translateY(-10px);
          transform: translateY(-10px);
		  }
.Area1220 { margin: 0 auto; width: 1220px; position: relative;}
.Area960 { margin: 0 auto; width: 960px; position: relative;}
@media screen and (max-width:767px){
  .Area .go_bt:hover {  
    -webkit-transform: none;
     -moz-transform: none;
      -ms-transform: none;
       -o-transform: none;
          transform: none;}
  .Area .go_bt2:hover { 
    filter: brightness(1);
    -webkit-transform: none;
       -moz-transform: none;
        -ms-transform: none;
         -o-transform: none;
            transform: none;
        }
  .Area1220 { width: 100%;}
  .Area960 { width: 100%;}
  /*區塊_切割*/
  .Area_1bn { margin: 0 auto; padding: 0; overflow: hidden;}
  .Area_1bn a { float: left; margin: 0 0 2% 0; padding: 0; width: 100%; list-style: none;}
  .Area_2bn { margin: 0 auto; padding: 0; overflow: hidden;}
  .Area_2bn a { float: left; margin: 0 1% 2%; padding: 0; width: 48%; list-style: none;}
  .Area_3bn { margin: 0 auto; padding: 0; overflow: hidden;}
  .Area_3bn a { float: left; margin: 0 1% 2% ; padding: 0; width: 31.3%; list-style: none;}
  .Area_1bn_nopadding { margin: 0 auto; padding: 0; overflow: hidden;}
  .Area_1bn_nopadding a { float: left; margin: 0; padding: 0; width: 100%; list-style: none;}
  .Area_2bn_nopadding { margin: 0 auto; padding: 0; overflow: hidden;}
  .Area_2bn_nopadding a { float: left; margin: 0; padding: 0; width: 50%; list-style: none;}
  .Area_3bn_nopadding { margin: 0 auto; padding: 0; overflow: hidden;}
  .Area_3bn_nopadding a { float: left; margin: 0; padding: 0; width: 33.3%; list-style: none;}
}

/*間距*/
.Area_bottom { margin-bottom: 50px;}
@media screen and (max-width:767px){
  .Area_bottom { margin-bottom: 8vw;}
}

/*共用樣式*/
.boxdeco { position: absolute; bottom: 0; left: 0; z-index: 0;}
.boxrepeat { position: relative; background: url(boxrepeat.png?t=1758768619998)top center repeat-y; z-index: 1;}
.boxbottom { position: relative; z-index: 1;}
@media screen and (max-width:767px){
  .boxrepeat { background: url(boxrepeat.png?t=1758768619998)top center repeat-y; background-size: 100%;}

}

/*公版樣式*/
.PD_layout[data-pd-li=BN] ul,
.PD_layout[data-pd-li=BN-AWD] ul { padding: 0; grid-gap: 0;}
@media screen and (max-width:767px){
  .PD_layout ul { width: 100%;}
}

/*折價券*/
.Area .Area_coupon {width: 94%;margin: 0 auto 30px;padding-top: 8px;}
.Area .Area_coupon:last-child { margin-bottom: 0;}
.Area .Area_coupon ul { grid-gap: 0;}
.Area .Area_coupon ul li .PD_img { padding: 0;}
.Area .Area_coupon .PD_layout.PD_layout-coupon3 .PD .divine_coupon, .PD_layout.PD_layout-coupon3 .PD .threshold { color: #000;}
@media screen and (max-width:767px){
  .Area .Area_coupon { margin: 0 auto 3%;}
}

/*登記*/
.Area .Area_danji .danji_box { margin-bottom: 0;}
.Area .Area_danji .danji_box .box_1 { width: 94%;}
.Area .warningTxt h3 { padding: 0;}
.Area .Area_danji .danji_box ul li .activityText .gifts span { color: #c63300;}
@media screen and (max-width:767px){
}

/*3P折價券*/
.Area_coupon_ppp2 .Area_swiper,
.Area_coupon_ppp .Area_swiper { width: 100%;}
.Area_coupon_ppp { padding-bottom: 30px;}
@media screen and (max-width:767px){
  .Area_coupon_ppp { padding-bottom: 4vw;}
}

/*版頭*/
.Area_top {}
.Area_top .main_box {position: relative;padding-top: 27px;left: 10px;}
.Area_top .main_box .PD_layout ul li { pointer-events: none;}
.Area_top .date {position: absolute;top: 30px;left: -5px;}
.Area_top .mainsubtitle {position: absolute;top: 422px;left: 0;width: 100%;overflow: hidden;background: url(mainsubtitle_bg.png?t=1758768619998)top center no-repeat;background-size: 100%;}
.Area_top .mainsubtitle ul.PD_wrapper { display: flex; flex-wrap: nowrap; margin: 0; padding: 0; width: 100%; grid-gap: 0; box-sizing: content-box; height: 135px;}
.Area_top .mainsubtitle ul.PD_wrapper li { position: relative; flex-shrink: 0; margin: 0; padding: 0; pointer-events: none;}
.Area_top .mainsubtitle ul.PD_wrapper li.PD_slide { min-width: inherit;}
.Area_top .mainsubtitle ul.PD_wrapper li.PD_slide:hover { box-shadow: 0 3px 30px rgba(0, 0, 0, 0);}
@media screen and (max-width:767px){
  .Area_top {}
  .Area_top .main_box { padding-top: 0;}
  .Area_top .date { top: 0;}
  .Area_top .mainsubtitle { top: 41.5vw;}
  .Area_top .mainsubtitle ul.PD_wrapper { height: 14vw;}
}


/*版頭品*/
@media screen and (min-width: 768px) {
.Area_top .topPD{width: 90%;position: relative;top: -112px;left: 100px;z-index: 11;height: 630px;}
.Area_top .topPD ul{padding: 0;}
.Area_top .topPD2{width: 100%;position: absolute;top: -21px;left: 10.5px;z-index: 10;}
.Area_top .topPD2 ul{padding: 0;}
}
@media screen and (max-width: 767px) {
  /*版頭品*/
  .Area_top .topPD{width: 88%;position: relative;top: -9.5vw;left: 8vw;z-index: 11;height: 67vw;}
  .Area_top .topPD ul{padding: 0vw;}
  .Area_top .topPD2{width: 100%;position: absolute;top: -1vw;left: 0vw;z-index: 10;}
  .Area_top .topPD2 ul{padding: 0vw;}

  /*窗簾*/
  .curtains{}
  .curtains01{width: 39%;position: absolute;top: -1vw;left: -10vw;z-index: 1;transform-origin: bottom center;pointer-events: none;}
  .curtains01 img{width: 52%;}
  .curtains02{width: 43%;position: absolute;top: 41vw;left: 68vw;z-index: 1;transform-origin: bottom center;pointer-events: none;}
  .curtains02 img{width: 52%;}
  
}



/*01_公版2品*/
.Area01 {position: relative;padding-bottom: 0px;margin-bottom: -6vw;height: 420px;}
.Area01 .title { position: absolute; top: 0; left: 0;}
.Area01 .PD_box {width: 94%;margin: 0 auto;}
@media screen and (max-width:767px){
  .Area01 {height: 73vw;}
}



/*---限搶---*/
@media screen and (min-width:768px){
	.Area_time{margin: 0px auto 60px auto;height: auto;}
  .Area_time .ly{margin: 0 auto 0 auto;width: 100%;}
  .Area_time .ly ul{}
}
@media screen and (max-width:767px){
  .Area_time{margin: 14vw auto 7vw auto;height: auto;}
  .Area_time .ly ul{width: 96%;}
}

/** 倒數 **/
.TimerNick_2 {position: absolute;top: 162px;left: 50%;transform: translateX(-50%);width: 50%;height: 50px;text-align: center;padding: 0;z-index:4;margin: 0;border-radius: 5em;}
.TimerNick_2 .FontStyle {position: relative;display:inline-block;width: 41px;top: 1px;font: normal 42px/42px Arial;color: #be3f2c;letter-spacing: 0px;text-align:right;/*background: #ffffff;*/height: 40px;padding: 0 1% 0 0;border-radius: 0.3em;}
.TimerNick_2 span {padding-left: 4px;font: 30px/40px "微軟正黑體","Microsoft JhengHei", Arial, Helvetica;letter-spacing: -0.05em;font-weight: 600;color: #000000;}
.TimerNick_2 small{  position:relative; font: bold 16px/38px "微軟正黑體","Microsoft JhengHei", Arial, Helvetica; letter-spacing: 0em;color: #2a0d05;}
@media screen and (max-width: 767px){
		.TimerNick_2 {position: absolute;top: 13.5vw;left: 49vw;margin:0;width: 100%;height: 12vw;text-align: center;padding: 0;border: #0000 0px solid;}
		.TimerNick_2 .FontStyle {margin:0;padding: 0 2% 0 0;border:0px;width: 4vw;font: normal 6vw/6vw Arial;letter-spacing:-1px;text-align:right;/* background-color: #ef5b38; */height: 6vw;}
    .TimerNick_2 div:nth-of-type(2),
		.TimerNick_2 div:nth-of-type(3),
		.TimerNick_2 div:nth-of-type(4){width: 3vw;}
		.TimerNick_2 span {padding-left: 2vw;font: bold 4vw/11vw "微軟正黑體","Microsoft JhengHei", Arial, Helvetica;letter-spacing: 0em;}
}


/*優惠一次看*/
.Area02 { position: relative;}
.Area02 .event { margin-bottom: 30px;}
.Area02 .event ul { grid-gap: 0 0.5em; padding: 0 1.8em;}
@media screen and (max-width:767px){
  .Area02 {}
  .Area02 .event { margin-bottom: 5%;}
  .Area02 .event ul { grid-gap: 0 0.2em; padding: 0 0.8em;}
}


/*餐廚特賞 好禮放送*/
.Area04 { position: relative;}
@media screen and (max-width:767px){
  .Area04 {}
}

/*BN輪播*/
.Area05 {}
@media screen and (max-width:767px){
  .Area05 { position: relative;}
  .Area05 .bg { position: absolute; top: -8vw; left: 0;}
}

/*激推商品 手刀購入*/
.Area06 {position: relative;margin-bottom: 60px;}
.Area06 .bg { position: absolute; top: -80px; left: 50%; transform: translateX(-50%);}
.Area06 .PD_box ul { grid-gap: 30px; width: 90%;}
.Area06 .PD_box ul li {background: url(item_bg.png?t=1758768619998)top center no-repeat;background-size: 100%;}
.Area06 .PD_box ul li:before { content: ""; position: absolute; display:block; background: url(item_box.png?t=1758768619998)center top no-repeat; mix-blend-mode: hard-light; height: 100%; top: 1vw; width: 100%; z-index: 1; background-size: 100%; pointer-events: none;}	
.Area06 .PD_box ul li:after { content: ""; position: absolute; display:block; background: url(item_light.png?t=1758768619998)center top no-repeat; mix-blend-mode: screen; height: 100%; top: 1vw; width: 100%; z-index: 1; background-size: 100%; pointer-events: none;}	
.Area06 .PD_box ul li:hover { z-index: auto;}	
.Area06 .PD_box ul li .PD_img { padding: 7em 2.5em 0;}	
.Area06 .PD_box ul li .PD_into { padding: 3.3em 3em 2.8em 2.5em;}
.Area06 .PD_box ul li .PD_into h3,
.Area06 .PD_box ul li .PD_into h4 {color: #000000;font-size: 24px;margin-bottom: 0.3em;}
.Area06 .PD_box ul li .PD_into p { color: #cf5d00;}
.Area06 .PD_box ul li .PD_into p del {color: #c2b181;}
.Area06 .PD_box ul li .PD_into p del,
.Area06 .PD_box ul li .PD_into p b,
.Area06 .PD_box ul li .PD_into p .money,
.Area06 .PD_box ul li .PD_into p small { font-size: 18px;}
.Area06 .PD_box ul li .PD_into p .Price { font-size: 38px;}
@media screen and (max-width:767px){
  .Area06 { margin-bottom: 5vw;}
  .Area06 .bg { top: -2vw; width: 100%;}
  .Area06 .PD_box ul { grid-gap: 0.5em; width: 100%;}
  .Area06 .PD_box ul li .PD_img { padding: 3.2em 1.2em 0;}	
  .Area06 .PD_box ul li .PD_into {padding: 1.1em 0.5em 1em 1.5em;width: 94%;}
  .Area06 .PD_box ul li .PD_into h3,
  .Area06 .PD_box ul li .PD_into h4 { font-size: 15px;margin-bottom: 0em;}
  .Area06 .PD_box ul li .PD_into p del,
  .Area06 .PD_box ul li .PD_into p b,
  .Area06 .PD_box ul li .PD_into p .money,
  .Area06 .PD_box ul li .PD_into p small {font-size: 13px;}
  .Area06 .PD_box ul li .PD_into p .Price {font-size: 27px;}
}

/*餐廚新品 搶先購*/
.Area07 {padding-bottom: 120px;}
.Area07 .PD_layout.PD_layout-D3_02 ul { padding-top: 0;}
.Area07 .PD_layout.PD_layout-D3_02 ul li .PD h3 { color: #000;}
.Area07 .bg { position: absolute; top: 460px; left: 0;}
.Area07 .stagelight { position: absolute; top: 0; left: 0; mix-blend-mode: screen;}
@media screen and (max-width:767px){
  .Area07 {padding-bottom: 4vw;}
  .Area07 .bg { top: 80vw;}
  .Area07 .stagelight { display: none;}
}




/*---上方公版---*/
@media screen and (min-width: 768px) {	
  .Area_ly{margin: 10px auto 0 auto;}
  .Area_ly .text{width: 80%;margin: 0 auto;}
  .Area_ly .start{position: absolute;}
  .Area_ly .end{margin: -1vw auto 0 auto;}
  .Area_ly .PD_layout ul{}
  .Area_ly .PD_layout.ly  {background: repeat-y center top/100% url("pc_ly_rp.png?t=1758768619998");}
  .Area_ly .PD_layout.ly  ul{width: 90%;}
}
@media screen and (max-width:767px){
  .Area_ly{margin: 0vw auto 6vw auto;}
  .Area_ly .start{position: absolute;}
  .Area_ly .end{margin: -1vw auto 0 auto;}
  .Area_ly .PD_layout.ly  {background: repeat-y center top/100% url("ly_rp.png?t=1758768619998");}
  .Area_ly .PD_layout.ly  ul{width: 95%;}
}



/*---1帶2---*/
@media screen and (min-width:768px){
  .Area_brand{margin: 120px auto 0 auto;}
  .Area_brand .text{position: absolute;top: -110px;left: 130px;}
  .Area_brand .box_all{display: flex;flex-wrap: wrap;position: relative;padding: 60px 0 0 0;}
  .Area_brand .box_all .box{width: 48%;position: relative;padding: 0 0 60px 0;margin: 0px auto 0 auto;background: no-repeat right top/100% url("logo_bg.png?t=1758768619998");}
  .Area_brand  .box .ly ul{width:94%;padding: 15px 15px;}
  /*logo*/ 
  .Area_brand  .logo{width: 100%;height: 110px;}
  .Area_brand  .logo ul{grid-gap: 0;}
  .Area_brand  .logo ul .PD_into{padding: 0;}
  .Area_brand  .logo ul .PD_logo{width: 24%;position: relative;top: 25px;left: 93px;}
  .Area_brand  .logo ul li h3{color: #ffffff;width: 50%;position: absolute;right: 21px;top: 17px;margin: 0 auto;font-size: 2.5em;}
  .Area_brand .ly{width: 98%;margin: 0 auto;}
  .Area_brand  .swiper-pagination-bullet {background: #ffffff;}
}
@media screen and (max-width:767px){
  .Area_brand{margin: 8vw auto 0 auto;}
  .Area_brand .text{
    height: 15.5vw;
}
  .Area_brand .tag{padding: 2vw 0 4vw 0;}
  .Area_brand .box_all{position: relative;}
  .Area_brand .box_all .box{position: relative;margin: 0 auto 0 auto;padding: 0 0 10vw 0;background: no-repeat top center/100% url("logo_bg.png?t=1758768619998");}
  /*logo*/ 
  .Area_brand  .logo{width: 100%;height: 13vw;}
  .Area_brand  .logo ul{grid-gap: 0;}
  .Area_brand  .logo ul .PD_into{padding: 0;}
  .Area_brand  .logo ul .PD_logo{width: 20%;position: relative;top: 5vw;left: 17vw;}
  .Area_brand  .logo ul li h3{color: #fff4d8;width: 48%;position: absolute;right: 7vw;top: 3vw;margin: 0 auto;font-size: 1.6em;}
  .Area_brand  .swiper-pagination-bullet {background: #ffffff;}
  /*公版*/ 
  .Area_brand .box_all .box .ly{width: 94%;padding: 4vw 0 0 0;}

}



/*---下方公版---*/
@media screen and (min-width:768px){
  .Area_ly_down{margin: 70px auto 0 auto;}
  .Area_ly_down .text {width: 85%;position: relative;top: -30px;z-index: 2;margin: 0 auto;}
  .Area_ly_down .box{position: relative;margin: 0px auto 60px auto;}
  .Area_ly_down .box .PD_layout.ly{width: 89%;margin: -56px auto 0 auto;padding: 27px 0 20px 0;background-image: repeating-linear-gradient(269deg,  #843a05 0%, #e2711e 50%, #843a05 100%);z-index: 1;}
  .Area_ly_down .box .PD_layout ul {width: 96%;}

  .Area_ly_down .PD_layout-btn{margin: 22px auto 0 auto;}
 
}
@media screen and (max-width:767px){
  .Area_ly_down{margin: 7vw auto 0 auto;}
  .Area_ly_down .text {position: relative;z-index: 20;}
  .Area_ly_down .box{position: relative;margin: 4vw auto 2vw auto;}
  .Area_ly_down .box .PD_layout.ly{width: 100%;margin: -2vw auto 0 auto;padding: 2vw 2vw 2vw 2vw;background-image: repeating-linear-gradient(269deg,  #843a05 0%, #e2711e 50%, #843a05 100%);
  z-index: 1;  }
  .Area_ly_down .box .PD_layout ul {width: 99%;}
  .Area_floorPD_NavArea_tabbar{margin: 0 auto 0 auto!important;}

}




/*---類別---*/
@media screen and (min-width: 768px) {	
  .Area_logo{margin: 60px auto 0 auto;}
  .Area_logo .PD_layout ul{width: 80%;grid-gap: 45px;}
}
@media screen and (max-width:767px){
  .Area_logo{margin: 8vw auto 8vw auto;}
  .Area_logo .PD_layout ul{width: 92%;padding: 0 0 0 0vw;grid-gap: 3vw;}
}



/*隱鑶*/
.for_pc {}
.for_phone { display: none !important;}
	@media screen and (max-width:767px){
		.for_pc { display: none !important;}
		.for_phone { display: inherit !important;}
	}