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

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


/*全BOX版面*/
.WRAPPER { z-index:0; position: relative; display:block; margin: 0 auto; padding:0; overflow:hidden;background-color:#a31312; width:100%; min-width:1220px; text-align:left; font-family:"微軟正黑體","Microsoft JhengHei",Helvetica;}
.WRAPPER img { border:0px; vertical-align:top;}
.WRAPPER a { text-decoration:none; -webkit-tap-highlight-color: transparent}
/*預設清單樣式*/
.Area .list_00 ul {display:inline-block; margin:0; padding:0;}
.Area .list_00 li {list-style:none;float:left;overflow: hidden;}
	@media screen and (max-width:767px){
		.WRAPPER { padding-bottom:30px; min-width: inherit; min-height:100vh; overflow: hidden;background-image: url(m_bg.jpg?t=1767166928092);background-repeat:repeat-y;background-size:100%;}
		.WRAPPER img {  width:100%;  height:auto;}
	}

/*PC背景*/
@media screen and (min-width:768px){
.bg_00 { z-index:0; position:absolute; top:0; left:0; width:100%; height:100%; background-repeat:no-repeat; background-position: center top; pointer-events:none;}
.bg_02 { z-index:-55; position:absolute; top:797px; left:0; width:100%; height:100%; background-repeat:repeat-y; background-position: center top; pointer-events:none;}
.bg_deco { z-index:-50;position:fixed;top:0px; left:0; width:100%; height:100%; background-position:center 0px; background-repeat:repeat-y; transition:0.5s linear; pointer-events:none;}
.bg_fixed { z-index:-1; position:absolute;top:0;left:0; width:100%; height:100%; background-repeat:no-repeat; background-position:center top; pointer-events:none;}

}

@media screen and (max-width:767px){
.m_top{ z-index:0;position:absolute; top:17vw; left:0; width:100%; height:100%; background-repeat:no-repeat; background-position: center top; pointer-events:none; background-size: 100%;}

}





/*共用樣式*/
.Area .prdImgWrap .imgTag,
.Area .prdImgWrap .imgTagRectangle,
.Area .prdImgWrap .imgTagBottom { display: none!important;}
@media screen and (max-width:767px){
}






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



/*公版背景*/
.box_txt .PD_layout ul { padding: 0; }	
@media screen and (min-width: 768px){
.box_txt {position: relative;display: flex;margin: 0 auto;width: 100%;height: auto;justify-content: center; z-index: 50; }
.box_txt img{width: 88%!important;padding: 0;}
}

@media screen and (max-width:767px){
.box_txt {position: relative;margin: 0 auto;width: 100%;z-index: 30;}
.box_txt img{width: 100%;}
}






/*公版背景*/
@media screen and (min-width: 768px){
.box_txt2 {position: absolute;margin: 0 auto;width: 100%;height: auto;}
.box_txt2 img{width: 62%;}
.box_txt3 {position: relative;margin: 0 auto;width: 100%;height: auto;}
.box_txt3 img{width: 85%;}
.box_txt4 {position: relative;margin: 0 auto;width: 100%;height: auto;}
.box_txt4 img{width: 80%;}
.PD_text { position: relative;left: 0;top:0; height: 174px; width: 100%;z-index: 2}
.PD_text.PD_layout .PD_slide:hover {transform: none;box-shadow: none;}
}

@media screen and (max-width:767px){
.box_txt2 {position: absolute;margin: 0 auto;width: 100%;padding: 0% 0;height: 15vw;z-index: 1;}
.box_txt2 img{width: 100%;}
.box_txt3 {position: relative;margin: 0 auto;width: 100%;padding: 0% 0;height: 18vw;}
.box_txt3 img{width: 100;}
.box_txt4 {position: relative;margin: 0 auto;width: 100%;padding: 0% 0;height: 19vw;}
.box_txt4 img{width: 100;}
.PD_text {position: relative;top:0;height: 17vw;width: 100%;}
}





/*版頭區*/
@media screen and (min-width:768px){
.Area_title {}
.Area_title .toptitle {position: relative;top: 69px;left: 38px;width: 72%; z-index: 1;}
.Area_title .sub {z-index: 20;position: relative;width: 100%;top: -66px;right: 32px;animation-delay:0s;}
.Area_title .magnify {z-index: 2;position: absolute;top: 100px;left: -170px;}
}
@media screen and (max-width: 767px){
   .Area_title { width:100%;}
   .Area_title .toptitle {width: 89%;left: 5vw;top: 4vw;z-index: 8;position: relative;}
   .Area_title .sub { z-index: 32;position: relative; top: -10.5vw; left: -2vw; width: 100%; height: 0vw;animation-delay:.8s;}
   .Area_title .sub img {padding: 0;width: 55%;}
   .Area_title .magnify {z-index: 10;position: absolute;top: -4.5vw;left: 3vw;width: 95%;}
}


/*漫畫雲朵*/
.cloud01 { z-index:3; position:absolute; background-repeat:no-repeat; background-position: center top; pointer-events:none;}
.cloud02 { z-index:3; position:absolute; background-repeat:no-repeat; background-position: center top; pointer-events:none;animation-delay:.5s}
    @media screen and (min-width:768px){
      .cloud01 { top:590px; left:40%; margin-left: -1080px; width:549px; height:417px;}
      .cloud02 { top:60px; left:77%; margin-left:357px;  width:418px; height:500px;}
    }
    @media screen and (max-width:767px){
    }


/*行銷宮格*/
@media screen and (min-width:768px){
  .Area_sale3 .sale3 {margin-top: 67px;}
  .Area_sale3 .PD_layout{position: absolute;width: 90%;}
  .Area_sale3 .PD_layout[data-pd-li=BN] ul{padding: 0 0px;grid-gap: 7px;margin-top: -0.7vw;}
  .Area_sale3 {z-index: 2;left: 50px;height: 212px;}
    }
  @media screen and (max-width:767px){
    .Area_sale3 {top: -26vw;height: 29vw;}
    .Area_sale3 .sale3 {width: 99%; position: absolute; left: 0.5vw; margin-top: 7vw;}
    .Area_sale3 .PD_layout{width: 98%;position: absolute;top: 36vw;left: 1vw;}
    .Area_sale3 .PD_layout[data-pd-li=BN] ul{padding: 0 0px;grid-gap: 0.2em;}
  
      }





/*版頭品入稿*/
@media screen and (min-width:768px){
	.Area_title .layout_toppd {position:relative;width: 960px;top: 0px;margin: 0 auto;right: 0;left: 95px;z-index: 5;/*background-color: #25b1ac;*/padding: 0px;/*border-radius: 15px;*/height: 544px;}
  .Area01_PD .TDBG {position: relative;top: -501px;left: -146px;}
  .Area01_PD .Area_swiper_box {margin: 0px 39px 0 0;}
  .Area01_PD .Area_swiper {margin: 0 0 0 -38px;}
}	
	@media screen and (max-width:767px){
	.Area_title .layout_toppd {position:relative;top: 7vw;width: 100%;left: 0vw;right: 0;z-index: 2;/*background-color: #25b1ac;*/padding: 3vw 50vw 0vw 15vw;/*border-radius: 4vw;*/height: 69vw;}
  .Area01_PD .TDBG {position: absolute;top: 0vw;left: 0vw;}

	}







/*版頭主標微調*/
.title01 .PD_layout .PD img { width: auto!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 { z-index: 20; }
.title01 .PD_layout li:nth-of-type(1) {position: relative;top: 50px;left: 220px;z-index: 20;}
.title01 .PD_layout li:nth-of-type(2) {position: relative;top: 30px;left: -260px;z-index: 20;}
.title01 .PD_layout li:nth-of-type(3) {position: absolute;top: 330px;left: 80px;z-index: 10;}
.title01 .PD_layout li:nth-of-type(4) {position: absolute;top: 85px;left: 355px;z-index: 11; display: none; }

}
@media screen and (max-width:767px){
.title01 .PD_layout li:nth-of-type(1) {position: relative;top: 5vw;left: 1vw;width: 60vw;z-index: 20;height: 30vw;}
.title01 .PD_layout li:nth-of-type(1) .PD img{width: 78%!important;}
.title01 .PD_layout li:nth-of-type(2) {position: relative;top: -29vw;left: 9vw;width: 60vw;z-index: 50;}
.title01 .PD_layout li:nth-of-type(2) .PD img{width: 30%!important;}
.title01 .PD_layout li:nth-of-type(3) {position: absolute;top: 28vw;left: 22vw;width: 56%;z-index: 5;}
.title01 .PD_layout li:nth-of-type(4) {position: absolute;top: 2vw;left: 61vw;width: 29%;z-index: 0;}
.title01 .PD_layout ul { display: flex; left: 0;top: 0;}
/*.title01 .PD_layout .PD img { width: 75%!important; }*/
}


/*登記活動*/

/*登記贈品文案顏色*/
.Area_danji .danji_box ul li .activityText .gifts span { color: #ef4e4c;} 
@media screen and (min-width: 768px){
}

@media screen and (max-width:767px){
.Area_danji {margin-top: 7vw!important ; width: 97%!important}
}


/*今日最殺 超省必搶*/

/* --------------------------------------
* Page 頁籤_202405291900
* -------------------------------------- */
.NavArea_tabbar_page { margin: 0 auto 3vw  ; width: 94%; }  
.NavArea_tabbar_page .Nav { overflow: visible; transform: translate3d(-30.5%, 0, 0);}  
.NavArea_tabbar_page .Nav_box { border-radius: 8px; overflow: hidden; padding: 0 2%;}
.NavArea_tabbar_page[data-num="2"] .Nav-wrapper { transform: translate3d(55.5%, 0, 0)!important}
.NavArea_tabbar_page[data-num="3"] .Nav-wrapper { transform: translate3d(43.0%, 0, 0)!important}
.NavArea_tabbar_page[data-num="4"] .Nav-wrapper { transform: translate3d(30.5%, 0, 0)!important}
.NavArea_tabbar_page[data-light="box"] .Nav ul { padding: 0 }
.NavArea_tabbar_page .Nav li { overflow: visible; }
@media screen and (min-width:768px){ 
  .NavArea_tabbar_page { display: block; }
  .NavArea_tabbar_page { margin: 0 auto 20px  ; width: 94%; } 
}
/*頁籤高亮顏色設定 */  
.NavArea_tabbar_page .Nav .swiper-slide-active a { color:#fff;}
.NavArea_tabbar_page .Nav .swiper-slide-active i { display:block; border: 1px solid #000000 !important; background-color: #000000 !important;}
/*推編輯按鈕 */  
.NavArea_tabbar_page .Nav input { position: fixed; left: 30%}
                    


                    

@media screen and (min-width:768px){
  .Area_sale .Area_K1 .PD_layout {width: 97%;}
  .Area_sale {z-index: 30;}
  .Area_sale .Area_sale_bg {overflow: hidden;background-color: #ffe066;padding: 30px 0 25px;border-radius: 1.5em;margin-bottom: 90px;} 
  
  .Area_sale .NavArea_tabbar_page .Nav .swiper-slide-active i {display:block;border: 1.5px solid #fff4c6 !important;background-color: #292729!important;}
}
  

  @media screen and (max-width: 767px){
  .Area_sale .Area_K1 .PD_layout {width: 97%;}
  .Area_sale {width: 100% !important;height:100%;margin-bottom: 8vw !important;}
  .Area_sale .Area_sale_bg {overflow: hidden;background-color: #ffe066;padding: 2.5vw 0;border-radius: 1em;margin-bottom: -1vw;} 
  .Area_sale .NavArea_tabbar_page .Nav .swiper-slide-active i {display:block;border: 0.5vw solid #fdfae0 !important;background-color: #282828 !important;}
    
	
  }



/*經典必Buy作圖區8品*/
.Area_item .Area_Buy .PD_layout-D1_01 .PD_slide {background-color: #ffe066;}
@media screen and (min-width:768px){
.Area_item {margin: 0 0 96px 0px;}

.Area_item .PD_layout .PD_slide:hover { box-shadow: 0 0 0 rgba(0, 0, 0, 0); }	
.Area_item .Area_Buy{margin-bottom: 100px;}
	


/*作圖區*/
.Area_item_top {z-index: 0;position:absolute;top: -60px;width:100%;height: 100%;background-repeat:no-repeat;background-position: center top;pointer-events:none;}			
.Area_item_repeat {z-index: -1;position:absolute;top: 210px;width:100%;height:665px;background-repeat:repeat-y;background-position: center top;pointer-events:none;}			
.Area_item_end {z-index: -1;position:absolute;top: 147px;width:100%;height: 100%;background-repeat:no-repeat;background-position: center bottom;pointer-events:none;}	
	
}

@media screen and (max-width:767px){
.Area_item {height:100%;padding-bottom:2vw !important;}
.Area_item .PD_layout .PD_slide:hover { box-shadow: 0 0 0 rgba(0, 0, 0, 0); }	
	

	
/*作圖區*/

	.Area_item .allbox{margin-top: 0vw;margin:0% 0% 0% 0%;padding: 0% 0 0 0;background: url("m_Area_item_bg.png?t=1767166928092") center top/100% repeat-y scroll;background-size: 100%;}
	.Area_item::before {content:"";position: absolute;display:block;top: 1vw;left: 0;width: 100%;height: 100%;pointer-events:none;z-index: 1;background: url("m_Area_item_top.png?t=1767166928092") center top/100% no-repeat scroll;}
}


/**/
@media screen and (min-width:768px){
.Area_BN {margin-top: 169px !important}
}

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


/*BN*/
.Area_BN .Area_swiper_box .PD_layout li { background-color: #ffffff00;}

@media screen and (min-width:768px){
.Area_BN .Area_swiper_box .PD_layout ul {height: 295px;}

}

@media screen and (max-width:767px){
  .Area_BN .Area_swiper_box .PD_layout ul { height: 39vw; }
}





/*天天好康 特別企劃*/
.Area_tagPD .PD_layout-D1_03 .PD_slide {background-color: #f05451;}
.PD_layout-D1_03 ul::before {content: "熱門推薦：";font-weight: 900;position: relative;display: none;}
@media screen and (min-width:768px){
.Area_tagPD { height:auto;padding-bottom:  10px !important;margin-bottom:50px !important;}
.Area_tagPD .title {z-index: 8; height: auto; position: relative; top:114px; margin: 0px auto; text-align: center; background-position: center top; background-repeat: no-repeat; }
.Area_tagPD .box { overflow: hidden;height: 1089px;padding-bottom: 40px;background: url(Area_tagPD_bg.png?t=1767166928092) top center no-repeat;margin-bottom: 50px;background-size: 100%;width: 100%;}
.Area_tagPD .layout_PD .PD_layout {padding: 0px 0 0px; margin: 0px; top: 0px; }
.Area_tagPD .swiper-slide:nth-of-type(odd) .PD_layout {padding: 15px 0 0px; margin: 0 auto; top: 35px;overflow:hidden;width: 96%;}
.Area_tagPD .swiper-slide:nth-of-type(even) .PD_layout {padding: 15px 0 0px; margin: 0 auto; top: 35px;overflow:hidden;width: 96%;}
.Area_tagPD .PD_layout4x2 .Area_sectionTitle ul {position: relative;padding: 0;margin: 0;list-style: none;height: 100px!important;top:7px;}
.Area_tagPD .PD_layout4x2 .Area_sectionTitle ul li { background-color: transparent; pointer-events: none;}
.Area_tagPD .PD_layout4x2 .Area_sectionTitle ul li h5 {position: relative;top:0px;margin: 0;padding: 0;width: 100%;height: 88px;font: 50px/80px "Noto Sans CJK SC";font-weight: 600;text-align: center;color:#ffffff;letter-spacing: 0px;overflow: hidden;/*text-shadow: 0px 0px 5px #000;*/}
.Area_tagPD .PD_layout-D1_03{position: relative;top: -101px;}
}
@media screen and (max-width: 767px) {
  .Area_tagPD { height:auto; margin-bottom: 5vw!important;padding-bottom: 5vw !important;}
  .Area_tagPD .box {overflow:inherit;margin-bottom: 5vw!important; width: 98%;margin: 0 auto;padding-bottom: 0%;position:relative;background:url(AreatagPD_m.png?t=1767166928092)top center no-repeat;background-size: 100%;}
  .Area_tagPD .title { position: relative; width: 100%; }
  .Area_tagPD .PD_Layout-D2_1f8s-PD .PD_layout .PD img { aspect-ratio: 1 / 1; }
  .Area_tagPD::before{display:none;}
  .Area_tagPD .PD_layout .layout_PD ul {width:95%;padding:0!important;margin:0vw auto 0!important}	
  .Area_tagPD .swiper-slide .layout_bg {padding:0; margin-bottom: 0vw; top: 7vw;background-size:100%!important;width: 100%;background:url(Area_tagPD_repeat.png?t=1767166928092)top center repeat-y;padding-bottom: 4vw;margin-top: 10vw;}
  .Area_tagPD .Area_sectionTitle {position: relative;top: 7vw;}
  .Area_tagPD .PD_layout-D1_03 {margin-top: 6vw;}
  

  .Area_tagPD .PD_layout4x2 h2 {display:block;overflow: hidden;float: none;position: relative;box-sizing: border-box;top:27vw;margin: 0px;padding: 0;width: 100%;height: 17vw;font-size: 7vw;font-family: "Noto Sans CJK SC";font-weight:bold;line-height: 1.7;text-align: center;color: #fff ;letter-spacing: 0;/*background:url(mb_22.jpg?t=1767166928092) no-repeat;background-size:100%;*/}
  .Area_tagPD .PD_layout4x2 .Area_sectionTitle ul {padding: 0;margin: 0;list-style: none;}
  .Area_tagPD .PD_layout4x2 .Area_sectionTitle ul li { background-color: transparent; pointer-events: none;}
  .Area_tagPD .PD_layout4x2 .Area_sectionTitle ul li h5 {position: relative;top:1.5vw;margin: 0;padding: 0;width: 100%;height: 6vw;font: 6vw/6vw "Noto Sans CJK SC";font-weight: 600;text-align: center;color:#ffffff;letter-spacing: 0px;overflow: hidden;z-index: 1;}
  .Area_tagPD .PD_layout ul {width: 93%;}
  .Area_tagPD .box .Area_bottom {background:url(Area_tagPD_bottom.png?t=1767166928092)top center no-repeat;background-size:100%;padding-top:9vw;position: relative;top: -16px;}			
}





/*區塊_all*/
.Area1220 { margin:0 auto; width:1220px;}
.Area960 { margin:0 auto; width:960px;}
.Area { position: relative; margin:0 auto; padding:0; border-radius:0; text-align:center; }
.Area a { position:relative; 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);}
		  
		  
.WRAPPER .go_bt1 {
  -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;}
.WRAPPER .go_bt1:hover { 
  -webkit-transform:translateY(-10px);
     -moz-transform:translateY(-10px);
      -ms-transform:translateY(-10px);
       -o-transform:translateY(-10px);
          transform:translateY(-10px);}
		  
		  
	@media screen and (max-width:767px){
		.Area1220 { width:100%;}
		.Area960 { width:100%;}
		.Area .go_bt:hover {  
			-webkit-transform:none;
			-moz-transform:none;
			-ms-transform:none;
			-o-transform:none;
			transform:none;}


	}




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