@charset "utf-8";

/*移除公版設定*/
.Area .remove_box_style ul {background-color: transparent;grid-gap: 10px;}
.Area .remove_box_style ul li { border: none!important;background-color: transparent;}
@media screen and (max-width:767px){
  .Area .remove_box_style ul {width: 100%; }
  .Area .remove_box_style ul { padding: 0; }
}

/*輪播公版移除公版樣式設定*/
/*PD_layout 區塊加上swiper_remove_box_style標籤
css貼上以下語法*/

/*輪播移除公版設定*/
.Area .swiper_remove_box_style ul { background-color: transparent; grid-gap: 0;}
.Area .swiper_remove_box_style ul li { border: none!important; background-color:transparent;}
.Area .swiper_remove_box_style ul li,
.Area .swiper_remove_box_style ul li .PD_img img { border-radius: 10px;}
@media screen and (max-width:767px){
  .Area .swiper_remove_box_style ul { width: 100%; grid-gap: 0.2em;}
  .Area .swiper_remove_box_style ul {}
}

/*點黑區關閉*/
.blackBox .Boxclose { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; background-color: transparent;}


/*區塊背景*/
/* .bg01 { position:absolute;z-index: -8;top:0px;left: 50%;transform: translateX(-50%); width: 2000px; height: 1220px; background: url(pc_01.jpg?t=1788231279684) center top / 100% no-repeat;pointer-events: none;} */
.bg01 { position:absolute;z-index: -10;top:0px; width:100%; height: 100%; background: linear-gradient( 90deg, #cc2b1e , #9e0703) center top / 100% repeat-y; pointer-events: none;}
.bg02 { position:absolute;z-index: -8;top:0px;left: 50%;transform: translateX(-50%); width: 2000px; height: 1355px; background: url(top_bg_pc.jpg?t=1788231279684) center top / 100% no-repeat;pointer-events: none;}
@media screen and (max-width:767px) {
  /* .bg00 { z-index: -7; position: absolute; top: 10vw; left: 0; width: 100%;height:190vw; aspect-ratio: 960/1224; background: url(mb_01.jpg?t=1788231279684) center top / 100% no-repeat; } */
  .bg01 { top: 10vw; left: 0; }
  .bg02 { top: 10vw; width: 100%; aspect-ratio: 960/1400;background: url(top_bg_mb.jpg?t=1788231279684) center top / 100% no-repeat; }
}


/*區標/背景共用設定*/
.PD_layout-CSSBG_01 .PD p { line-height: 1; top: 0; height: 4em; }
.PD_into h3, .PD_into h4, .PD_into p { font-family: "Arial","Century Gothic","Noto Sans CJK TC";}
h2:where(.Area_title_lbtclass) h3 { font-family: "Arial","Century Gothic","Noto Sans CJK TC"; top: -5px; }
h2:where(.Area_title_lbtclass) h4 { display: flex; flex-direction: column; position: absolute; top: 15%; left: 16%; align-items: center; justify-content: center; box-sizing: border-box;  font-family: "Arial" ,"Noto Sans CJK TC"; font-size: 1.5em;  }
h2:where(.Area_title_lbtclass) h4 span { z-index: 2; max-height: 1.2em; overflow: visible; transform: skewY(-8deg); }
h2:where(.Area_title_lbtclass) h4::after { content:"";z-index: 0;position: absolute;top: -34px;left: -39px;width: 215%;background: url(star.png?t=1788231279684)center top / 100% no-repeat;aspect-ratio: 167/165; 
  /*animation: rotateBreath 8s ease-in-out infinite;*/++ transform-origin: center center;
}
@keyframes rotateBreath {
  0%   { transform: rotate(0deg)   scale(1); }
  50%  { transform: rotate(180deg) scale(1.05); }
  100% { transform: rotate(360deg) scale(1); }
}
@media screen and (max-width:767px){
  h2:where(.Area_title_lbtclass) h3 { font-size: 1.1em; top: 0; }
  h2:where(.Area_title_lbtclass) h4 { font-size: 1em; top: 1vw; left: 14vw; }
  h2:where(.Area_title_lbtclass) h4 span { width: 100%; transform: skewY(-6deg); }
  h2:where(.Area_title_lbtclass) h4::after {top: -4vw;left: -4.5vw; width: 200%; } 
}

/* 警語 */
@media screen and (max-width:767px){
  .edm_notice { padding: 5vw 1vw;}
  }
  

/*提醒我按鈕*/
.btn_remind {z-index:90;position: absolute!important;top: 150vw;right: 0vw;width: 5vw; }
.btn_remind_icon { width: 2.25em; }

/*-----版頭-----*/
.Area_top {position: relative;height: 1240px;margin:0 auto;box-sizing:border-box;padding: 0 0 0;}
.Area_top img {width: 100%; height: auto; }
/*時間*/
.Area_top .time { z-index: 30; position: absolute;width: 14%;top: 750px;right: 120px; }
/*logo*/
.Area_top .momologo {z-index: 99;position: absolute;top: 1.5%;left: 4%; display: block; }
.Area_top .momologo a{ display: block; width: 190px; height: 80px; background: url(brand_logo.png?t=1788231279684) no-repeat; background-size: 100%;}
/*大標*/ 
.Area_top .tt02 { position: absolute;top: 170px;left: 245px;width: 64.5%; mix-blend-mode: screen; }
.Area_top .title01 { z-index: 5;position:relative; margin: 0 auto; width: 960px; }
.Area_top .title01 .tt01 { position: absolute;top: 55px;left: 375px;width: 25%; }
.Area_top .title01 .tt03 { position: absolute;top: 170px;left: 125px;width: 78.5%; }
  /*副標輪播*/
  .Area_top .title02 {z-index: 32;position:absolute;top: 320px;left: 250px; width: 760px; height: 170px; }
  .Area_top .title02 .PD_layout ul { display: flex; width: 100%;height: 170px; padding: 0; align-items: center; text-align: center; } 
  .Area_top .title02 .PD_layout ul li { pointer-events: none; } 
@media screen and (max-width:767px){
    .Area_top {width:100%;position: relative;height: 138vw;padding:0;}
    .Area_top .momologo { top: 2vw;left: 1.5vw; }
    .Area_top .momologo a { aspect-ratio: 190/80; width: 22vw; height: auto; }
    /*時間*/
    .Area_top .time { top: 77vw; right: 2.5vw; width: 18.5vw;z-index: 5; }  
    /*大標*/ 
    .Area_top .tt02 { top: 18vw;left: 10.5vw;width: 80%;z-index: 5; }
    .Area_top .title01 { position:absolute;top: 0vw;left: 0vw; width: 108%; height: auto;z-index: 12;}
    .Area_top .title01 ul{grid-gap:0;}
    .Area_top .title01 .tt01 {top: 5vw;left: 35.5vw;width: 24%;z-index: 4;}
    .Area_top .title01 .tt03 {top: 18vw;left: 9.4vw;width: 73%;z-index: 4;}
    /*副標輪播*/
    .Area_top .title02 {width: 80vw;height: 21vw;top: 33.5vw;left: 7vw;}
    .Area_top .title02 .PD_layout ul { height: 21vw; } 
    .Area_top .title02 .PD_layout .PD_into {padding: 0;align-items: center;width: 100%;}
    .Area_top .title02 .PD_layout .PD h3 {font-size: 1.5em;letter-spacing: -0.04em;} 
  }


/*---版頭品---*/
.top_pd { z-index: 2; position:relative; width: 1220px; height: auto; }
.top_pd .tpd01 { position: absolute;top: 480px;left: 285px; width: 330px; }  
.top_pd .tpd02 { position: absolute;top: 525px;right: 230px; width: 355px; }  
.top_pd .tpd03 { position: absolute;top: 900px;right: 245px; width: 330px; }  
.light { z-index: 5; position: relative; mix-blend-mode: screen; }
.light .lt01 {  position: absolute;top: 545px;left: 320px; width: 220px; }  
.light .lt02 {  position: absolute;top: 500px;right: 340px; width: 230px; }  
.light .lt03 {  position: absolute;top: 860px;right: 245px; width: 330px; }  
@media screen and (max-width:767px){
.top_pd { width: 100%; }
.top_pd .tpd01 { top: 54vw;left: 12vw;width: 35vw;}  
.top_pd .tpd02 { top: 56vw;right: 11.5vw;width: 38vw;}  
.top_pd .tpd03 { top: 97vw;right: 15vw;width: 34vw;}  
.light .lt01 { top: 61vw;left: 15vw; width: 24vw; }  
.light .lt02 { top: 53.5vw;right: 26vw; width: 27vw; }  
.light .lt03 { top: 93vw;right: 16vw; width: 33vw; }  

}


/*活動倒數*/
/* .Area_time { position: relative; width: 2000px; height: 20px; } */
.TimerNick { aspect-ratio: 650 / 30; position: absolute;top: 1260px;left: 50%; transform: translateX(-50%); display: flex;align-items: center; justify-content: center;z-index:8;text-align: center;letter-spacing: 0.2em;font-family: "Arial" ,"Noto Sans CJK TC";}
.TimerNick .FontStyle {margin: 0;padding: 0;font-size: 2.3em;color: #f5ddbf;font-weight: bold;letter-spacing: 0.02em;text-align: center;}
.TimerNick span {font-size: 1.7em;letter-spacing: 0.1em;color: #f5ddbf;}
.TimerNick b { font-weight: normal; line-height: 1; }
@media screen and (max-width:767px){
  .TimerNick  { top:142vw; width: 60%; letter-spacing: -0.05em; text-align: center; justify-content: center; gap: 0.2vw; line-height: 1; }
  .TimerNick .FontStyle {margin: 0;padding: 0;border: 0;font-size: 1.3em; line-height: 1; }
  .TimerNick span { padding-left: 0;font-size: 1.1em;letter-spacing: -0.015em; margin: 0; font-weight: 600; }
}      
 
.Areatop_pd { margin: 0 auto 120px; }
.Areatop_pd::before { content: "";z-index: -8;position: absolute;top: -25px;left: 50%;width: 2000px;height: calc(100% - -43px);transform: translateX(-50%); border: 5px solid #fff; background: #1ec7ff no-repeat center top;}
.Areatop_pd::after { content:"";z-index: -8;position: absolute; bottom: -130px; left: 50%; transform: translateX(-50%); width: 100%;aspect-ratio: 833/120;background: url(top_bg.png?t=1788231279684) center top / 100% no-repeat; }
@media screen and (max-width:767px){
  .Areatop_pd { margin: 0 auto 10vw; }
  .Areatop_pd::before {  top: -4vw; width: 100%;height: calc(100% - -6vw); border: 3px solid #fff; }
  .Areatop_pd::after { bottom: -14vw; }
}

/* 公式 */
.Area_formula { aspect-ratio: 2000/600; width: 80%; }
.Area_formula .Area_title h3 { top: 5%; }
.Area_formula .Area_content { width: 100%; margin: 0 auto; }
.Area_formula .Area--bg { top: 9%; }
@media screen and (max-width:767px){
  .Area_formula { width: 100%; }
  .Area_formula .Area_content .PD_layout ul { padding: 0; grid-gap:0; }
  }

/* 主打品 */
.main_PD { margin: -20px auto 100px; } 
.main_PD .Area_title { margin-bottom: 0; } 
.main_PD .PD_layout-CSSBG_01 .PD_slide { height: 770px; }  
.main_PD .PD_layout-CSSBG_01 .PD_img { padding: 40px 0 25px; } 
.main_PD .PD_layout-CSSBG_01 .PD_into { grid-gap: 10px; }
.main_PD .PD_layout-CSSBG_01 .PD_into h3 { color: #3a1515; font-size: 34px; font-weight: 600; } 
.main_PD .PD_layout-CSSBG_01 .PD_into h4 b { display: none; } 
.main_PD .PD_layout-CSSBG_01 .PD_into h4 { color: #fff; font-size: 35px; margin: 0 auto; } 
.main_PD .PD_layout-CSSBG_01 .PD_into .oPrice { color: #fff; font-size: 22px; } 
.main_PD .PD_layout-CSSBG_01 .PD_into .money { color: #f8d89a; font-size: 24px; } 
.main_PD .PD_layout-CSSBG_01 .PD_into .Price { color: #f8d89a; font-size: 54px; } 
@media screen and (max-width:767px){
  .main_PD { margin: 0 auto; } 
  .main_PD .Area_title { margin-bottom: 5vw; } 
  .main_PD .PD_layout-CSSBG_01 .PD_slide { width: 100%; height: 76vw; }  
  .main_PD .PD_layout-CSSBG_01 li::after { padding-bottom: 77vw; }
  .main_PD .PD_layout-CSSBG_01 .PD_img { padding: 0; margin: 0 auto 4vw; } 
  .main_PD .PD_layout-CSSBG_01 .PD_into { grid-gap:1.2vw; }
  .main_PD .PD_layout-CSSBG_01 .PD_into h3 { font-size: 4vw; } 
  .main_PD .PD_layout-CSSBG_01 .PD_into h4 { font-size: 4vw; } 
  .main_PD .PD_layout-CSSBG_01 .PD_into .oPrice { font-size: 4vw; } 
  .main_PD .PD_layout-CSSBG_01 .PD_into .money { font-size: 4vw; } 
  .main_PD .PD_layout-CSSBG_01 .PD_into .Price { font-size: 5vw; }   
}


/* 好康攻略 */
.Area_strategy { margin: 0 auto 180px; }
.Area_strategy::before {content: "";z-index: -8;position: absolute;top: -160px;left: 50%;width: 2000px;height: calc(100% - -360px);transform: translateX(-50%);background: url(bga_top.png?t=1788231279684) top center / contain no-repeat, url(bga_bottom.png?t=1788231279684) bottom center / contain no-repeat;}
.Area_strategy::after {content:"";z-index: -8;position: absolute;top: 240px;left: 50%;transform: translateX(-50%);width: 2000px;height: calc(100% - 670px);background: #f3d4ac repeat-y center top;aspect-ratio: 2000/2340;background-size: 100%;}
.Area_strategy .box { width: 95.5%; margin: -33px auto 30px; padding: 2.5% 1.5%; border-radius: 0 0 1em 1em; background: #fff; }
.Area_strategy .Area_danji .danji_box { margin: 0 auto; }
.Area_strategy .Area_danji .danji_box ul li .activityText .gifts span { color: #ffe397; }
.Area_strategy .warningTxt h3 { font-size: 1.5em; padding: 0; }
@media screen and (max-width:767px){
  .Area_strategy { margin: 16vw auto 0; }
  .Area_strategy::before {top: -10.5vw;width: 100%;height: calc(100% - -21.5vw);}
  .Area_strategy::after {top: 8vw;width: 100%;height: calc(100% - 28vw);}
  .Area_strategy .box { width: 94%; margin: -3vw auto 3vw; padding: 3.5vw 2vw; border-radius: 0 0 0.5em 0.5em; background: #fff; }
  .Area_strategy .Areapadding { padding: 0; }
  .Area_strategy .PD_layout-coupon3 { width: 97%; }
  .Area_strategy .ac06 { margin: 1.5vw auto 0; }
  .Area_strategy .warningTxt h3 { font-size: 0.98em; }
  }


/*折價券區*/
.Area_coupon { margin: 0 auto 80px; }
.Area_coupon::after { content:"";z-index: -8;position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 2000px; height: 1480px;background: url(coupon_bg.png?t=1788231279684) center top / 100% no-repeat; }
.Area_coupon .Area_title { margin-bottom: 30px; }
.Area_coupon .date_bar { pointer-events: none; }
.Area_coupon .PD_layout.PD_layout-coupon3 .PD .divine_coupon { color: #bc1313; }
.Area_coupon .PD_layout.PD_layout-coupon3 .PD .threshold { color: #000; }
.Area_coupon .PD_layout.PD_layout-coupon3 .PD h3 { font-weight: 700; }
.Area_coupon .warningTxt h3 { color: #fff; font-size: 1.5em; }
@media screen and (max-width:767px){
  .Area_coupon { margin: 16vw auto 8vw; }
  .Area_coupon::after { top: -3vw;width: 125%; aspect-ratio: 2000/1480; }
  .Area_coupon .Area_title { margin-bottom: 3vw; }
  .Area_coupon .date_bar { margin: 3vw auto 1vw; }
  .Area_coupon .date_bar ul { grid-gap: 0; }
  .Area_coupon .warningTxt h3 { font-size: 1.2em; }
  .Area_coupon3_002 .Area_content { margin: 3vw auto 0vw; padding: 0; }
}

.Area_video { margin: 0 auto 140px; }
.Area_video .Area_title { margin-bottom: 50px; }
.Area_video::after { content:"";z-index: -8;position: absolute; top: 28%; left: 50%; transform: translateX(-50%); width: 2000px; height: 810px;background: url(video_bg.png?t=1788231279684) center top / 100% no-repeat; }
.Area_video .youtubeArea iframe { border-radius: 1em; border: 2px solid #f95f4a; }
.Area_video .video_pd { z-index: 1; position: absolute;top: 400px; left:800px;width: 23%; }
.Area_video .video_pd img { width: 100%; height: auto; }
@media screen and (max-width:767px){
  .Area_video { margin: 1vw auto 23vw; }
  .Area_video.ts_ing { margin: 16vw auto 23vw; }
  .Area_video .Area_title { margin-bottom: 7vw; }
  .Area_video::after { top: 41vw;width: 165%; aspect-ratio: 2000/810; }  
  .Area_video .Area_content { width:96%; margin: 0 auto; }
  .Area_video .youtubeArea iframe { border-radius: 1em; border: 2px solid #f95f4a; }
  .Area_video .video_pd { top: 48vw; left:78vw;width: 21%; }
  }

/* 副打品 */
.sub_PD {  } 
.sub_PD .Area_title { margin-bottom: 40px; } 
.sub_PD .PD_layout-CSSBG_01 .PD_slide { height: 710px; }  
.sub_PD .PD_layout-CSSBG_01 .PD_img { width: 85%; margin: 0 auto; padding: 40px 0 50px; } 
.sub_PD .PD_layout-CSSBG_01 .PD_into { grid-gap: 10px; }
.sub_PD .PD_layout-CSSBG_01 .PD_into h3 { color: #3a1515; font-size: 34px; font-weight: 600; } 
.sub_PD .PD_layout-CSSBG_01 .PD_into h4 b { display: none; } 
.sub_PD .PD_layout-CSSBG_01 .PD_into h4 { color: #fff; font-size: 35px; margin: 0 auto; } 
.sub_PD .PD_layout-CSSBG_01 .PD_into .oPrice { color: #fff; font-size: 22px; } 
.sub_PD .PD_layout-CSSBG_01 .PD_into .money { color: #f8d89a; font-size: 24px; } 
.sub_PD .PD_layout-CSSBG_01 .PD_into .Price { color: #f8d89a; font-size: 54px; } 
@media screen and (max-width:767px){
  .sub_PD { margin: 0 auto; } 
  .sub_PD .Area_title { margin-bottom: 0vw; } 
  .sub_PD .PD_layout-CSSBG_01 .PD_slide { width: 100%; height: 71vw; }  
  .sub_PD .PD_layout-CSSBG_01 .PD_img { padding: 3.5vw 0; margin: 0 auto 5vw; } 
  .sub_PD .PD_layout-CSSBG_01 .PD_into { grid-gap:1.2vw; }
  .sub_PD .PD_layout-CSSBG_01 .PD_into h3 { font-size: 4vw; } 
  .sub_PD .PD_layout-CSSBG_01 .PD_into h4 { font-size: 4vw; } 
  .sub_PD .PD_layout-CSSBG_01 .PD_into .oPrice { font-size: 4vw; } 
  .sub_PD .PD_layout-CSSBG_01 .PD_into .money { font-size: 4vw; } 
  .sub_PD .PD_layout-CSSBG_01 .PD_into .Price { font-size: 5vw; }   
}


/* 下方公版 */
.Area_floor { margin: 0 auto; }
.Area_floor .box_1 { margin: 0 auto; }
.Area_floor .NavArea .Nav .cate-hover a { color: #fff;}
.Area_floor .NavArea_tabbar_page { width: 1100px; }
.Area_floor .NavArea .Nav a { padding: 0 25px; }
.Area_floor .NavArea[data-light="box"] .Nav .cate-hover i { border: 1px solid #d21e17 !important; background-color: #d21e17 !important; }
.Area_floor .box_1 .box .Area_title { margin: 50px auto 30px; }
@media screen and (max-width:767px){
  .Area_floor{ margin: 10vw auto 0vw; }
  .Area_floor .NavArea_tabbar_page { width: 100%; }
  .Area_floor .NavArea .Nav a { padding: 0 2.5vw; }
  .Area_floor .box_1 { margin: 0 auto 10vw; }
  .Area_floor .box_1 .PD_layout.pd, .Area_floor .box_2 .PD_layout.pd { width: 97%; }
  .Area_floor .box_1 .box .Area_title { margin: 5vw auto 3vw; }
  .Area_floor .NavArea_tabbar_floor { margin: 0 auto 0; }
  .Area_floor .Nav_box { width: 95%; margin: 0 auto;}
  .Area_floorPD_NavArea_tabbar{margin: 0 auto 0 auto!important;}
  }


/* 品類區 */
.Area_category { margin: 100px auto 0; }
.Area_category .Area_content .PD_layout ul { grid-gap: 20px; }
@media screen and (max-width:767px){
  .Area_category { margin: 10vw auto 0; }
  .Area_category .Area_content .PD_layout ul { grid-gap: 2vw; }
}


/* 品牌館 */
.Area_brand { margin: 0 auto;  }
.Area_brand .Area_content .PD_layout ul { grid-gap: 0; }
@media screen and (max-width:767px){
  .Area_brand {  }
  .Area_brand .Area_content { width: 200%; margin: 0 0 0 -50vw; }
}