@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:#fb474f;}
.WRAPPER img {width: 100%; border:0; vertical-align:top;}
.WRAPPER a { text-decoration: none;}
@media screen and (max-width: 767px){
	.WRAPPER { min-width: inherit; padding-bottom:0;}
	.WRAPPER img { width: 100%; height: auto;}
}
		
/*區塊_all*/
.Area { position: relative; margin: 0 auto; padding: 0; border-radius: 0; text-align: center;}
.Area a { display: block; margin: auto;} 
.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);}
.Area1220 { margin: 0 auto; width: 1220px;}
.Area960 { margin: 0 auto; width: 960px;}
.Areabottom { margin-bottom: 80px;}
@media screen and (max-width: 767px){
	.Area1220 { width: 100%;}
	.Area960 { width: 100%;}
	.Areabottom { margin-bottom: 8vw;}
}


/*LOGO*/
.momologo { z-index: 2; position: absolute; top: 15px; left:15px;}
.momologo a { display: block; width: 140px; height: 21px;}
.momologo a svg { width:140px; height:21px;}
.momologo a path { fill: #EA27C2;}
.momologo-pink  a path { fill: #EA27C2;}/*LOGO 桃紅色*/
.momologo-white a path { fill: #ffffff;}/*LOGO 白色*/
@media screen and (max-width: 767px){
	.momologo { display: none;}
} 


/*版頭*/
.Area_top {height:400px;}
@media screen and (max-width: 767px){
	.Area_top { height: 16vw; z-index: 0;}
}
@media screen and (min-width: 768px){
	.main { position: absolute; top: 20px; width: 90%; margin: 0; left: 30px;}	 
	.main .deco { position: absolute; top: 105px; width: 8.4%; left: 480px; z-index: 1;}	 
}
@media screen and (max-width: 767px){
	.main { position: absolute; top: 2vw; width: 96%; margin: 0;}	
	.main .deco { position: absolute; top: 2.6vw; width: 5.6%; left: 26.3vw; z-index: 1;}  	  
}



/*活動倒數*/
.TimerNick {position: absolute;top: 300px;left: 440px;display: inline-block;z-index: 8;text-align: center;color: #e1161f;}
.TimerNick .FontStyle { display: inline-block; margin: 0 0 0 10px; padding: 0; border: 0; font: bold 51px/40px Arial; letter-spacing: 0; text-align: center;}
.TimerNick span { padding-left: 2px; font: bold 29px/30px "微軟正黑體","Microsoft JhengHei", Arial, Helvetica; letter-spacing: -0.025em;}
@media screen and (min-width: 768px){
	.Area_top .time_bg {position: absolute;top: 280px;right: 0px;width: 40%;margin: 0 30%;}
}
@media screen and (max-width: 767px){
	.TimerNick { width: 100%; top: 5.5vw; left: 30vw;}
  .TimerNick .FontStyle { margin: 0; padding: 0; border: 0; font: bold 4.5vw/0vw Arial;}
  .TimerNick span { padding-left: 0; font: bold 3.5vw/5vw "微軟正黑體","Microsoft JhengHei", Arial, Helvetica;/*letter-spacing: -0.05em;*/}
	.Area_top .time_bg { position: absolute; top: 3vw; width: 60%; margin: 0 58%;}
}






/* --------------------------------------
* Page 頁籤_202405291900
* -------------------------------------- */
.NavArea_tabbar_page { margin: 0 auto 20px; width: 94%;}  
@media screen and (max-width: 767px){
  .NavArea_tabbar_page { margin: 0 auto 1.5vw ; width: 96%;}  
  .content_swiper { width: 96%; margin: 0 auto;}
}
.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 .Nav .swiper-slide-active a { color: #fff;}
.NavArea_tabbar_page .Nav .swiper-slide-active i { display: block; border: 1px solid #000 !important; background-color: #000 !important;}
/*推編輯按鈕*/  
.NavArea_tabbar_page .Nav input { position: fixed; left: 30%;}
/*頁籤位置修正*/
.NavArea_tabbar_page  .Nav-wrapper { left: unset !important;}


/*強檔店家按鈕*/
.hot_btn .PD_layout .PD_into { display: flex; flex-direction: row; padding: 0;}
.hot_btn .PD_layout ul { padding: 0; background-color: transparent; grid-gap: 0;}
.hot_btn .PD_layout li { padding: 0.08em 0; border-radius: 10em; background: #fcf042; border: none;}
.hot_btn .PD_layout .txt1 { font-style: italic !important; color:#921914; letter-spacing: -0.05em; text-align: center; padding: .3em 0 .2em;}
.hot_btn .PD_layout .txt2 { font-style: italic !important; color:#000000; letter-spacing: -0.05em; text-align: center; padding: .3em 0;}
@media screen and (min-width: 768px){ 
	.hot_btn .PD_layout { margin-bottom: 15px;}
	.hot_btn .PD_layout .PD_into { height: 37px;}
	.hot_btn .PD_layout ul { width: 45%;}
	.hot_btn .PD_layout .txt1 { font: 28px / 18px "Noto Sans"; font-weight: 700; margin-right: 0.5em;}
	.hot_btn .PD_layout .txt2 { font: 24px / 24px "Noto Sans"; font-weight: 600; margin-right: 0.5em;}
	.hot_btn .PD_layout .txt3 { font-style: italic !important; margin: .25em 0 0; color:#fcf042; letter-spacing: -0.05em; text-align: center; width: 16%; height: 75%; font: 19px / 23px "Noto Sans"; font-weight: 600; padding: .2em 0; border-radius: 10em; background: #000;}
	.hot_btn .PD_layout .txt3::after { content: ''; display: block; border-width: .25em 0 .25em .4em; border-style: solid; border-color: transparent transparent transparent #fcf042; float: right; margin-top: .4em; margin-right: .6em; margin-left: -0.6em;}
}
@media screen and (max-width: 767px){
	.hot_btn .PD_layout { margin-bottom: 2vw;}
	.hot_btn .PD_layout .PD_into { height: 7.5vw;}
	.hot_btn .PD_layout ul { width: 80%;}
	.hot_btn .PD_layout .txt1 { font: 23px / 16px "Noto Sans"; font-weight: 700; margin-right: 0.4em;}
	.hot_btn .PD_layout .txt2 { font: 19px / 20px "Noto Sans"; font-weight: 600; margin-right: 0.5em;}
	.hot_btn .PD_layout .txt3 { font-style: italic !important; margin: .3em 0 0; color:#fcf042; letter-spacing: -0.05em; text-align: center; width: 16%; height: 75%; font: 14px / 20px "Noto Sans"; font-weight: 600; padding: .1em 0; border-radius: 10em; background: #000;}
	.hot_btn .PD_layout .txt3::after { content: ''; display: block; border-width: .25em 0 .25em .4em; border-style: solid; border-color: transparent transparent transparent #fcf042; float: right; margin-top: .45em; margin-right: .6em; margin-left: -0.6em;}
}

/*商品宮格*/
@media screen and (min-width: 768px){
  .Area00 { overflow: hidden; /* 防止超出容器 */}
  .Area00 .PD_Aerea { margin-bottom: 40px;}
  .Area00 .PD_layout li {padding: 0 !important;}
  .Area00 .PD_layout .PD_btn.more{ position: absolute;width: 23% !important;margin: 0 0px 0 230px;}
  .Area00 .PD_layout .PD_btn.PD_go{ position: absolute;width: 23% !important;margin: 0 0px 0;}
}
@media screen and (max-width: 767px){
	.Area00 { width: 97%;}
	.Area00 .PD_Aerea { margin-bottom: 3vw;}
	.Area00 .PD_layout li  {padding: 0 !important;}
	.Area00 .PD_layout .PD_btn.more{ position: absolute;width: 23% !important;margin: 0 46vw 0;}
	.Area00 .PD_layout .PD_btn.PD_go{ position: absolute;width: 23% !important;margin: 0 0 0;}
}

/*瘋搶區進店逛*/
.Area00 .PD_layout[data-pd-btn][data-pd-btn-more] .PD_btn.more b::after { content: "進店逛";}




/*今日秒殺標*/
@media screen and (min-width: 768px){		
.PD_Aerea .PD_into { margin-top: 44px;}
.PD_Aerea .PD-1 .PD h3 { font-size: 30px;}
.PD_box .onlytoday { position: absolute; left: 0; width: 20%; z-index: 99;}
.onlytoday { position: absolute; left: 0; width: 20%; z-index: 99;}
}
@media screen and (max-width: 767px){
	.PD_Aerea .PD_into { margin-top: 3vw;}
	.PD_box .onlytoday { position: absolute; left: -1vw; width: 33%; z-index: 99;}
}


/*區標線上入稿*/
.box_txt .PD_layout ul { padding: 0;}	
@media screen and (min-width: 768px){
	.box_txt { position: relative; display: flex; width: 100%; height: 113px; justify-content: center; z-index: 0;}
	.box_txt img { width: 100%!important; padding: 0;}
	.box_txt ul li h5 { font: bold 47px / 47px "Noto Sans CJK SC", "Microsoft JhengHei", Arial, Helvetica; transform: rotate(0deg); color: #fff; letter-spacing: 1px; text-align: center; background-color: #000; border-radius: 3em; padding: 20px 150px; margin: 0;}	
	.box_txt2 { position: relative; display: flex; height: 181px; margin: 0 auto; width: 100%; justify-content: center; z-index: 50; padding: 0;}
	.box_txt2 img { width: 88%!important; padding: 0;}
	.box_txt2::before { content:""; position: absolute; display:block; top: 13px; left: 0; width: 100%; height: 100%; pointer-events: none; z-index: -10; background: url("m_box_txt_bg2.png?t=1782273691936") center top / 100% no-repeat scroll;}
	.box_txt2 .PD_layout .PD h5 { color:#fff; font-size: 3em; font-family: "Century Gothic"; letter-spacing: -1px;}
}
@media screen and (max-width:767px){	
	.box_txt { position: relative; margin: 0 auto; width: 100%; z-index: 0;}
	.box_txt img { width: 100%;}
	.box_txt { z-index: 50; height: auto; width: 90%;}
	.box_txt ul li h5 { font: bold 5.5vw / 5.5vw "Noto Sans CJK SC", "Microsoft JhengHei", Arial, Helvetica; color: #fff; letter-spacing: 1px; text-align: center; background-color: #000; border-radius: 3em; padding: 2vw 15vw; margin: 0;}	
	.box_txt2 { position: relative; width: 100%; height: 23vw;	z-index: 30; padding: 1% 0 0 0;}
	.box_txt2 img { width: 100%;}
	.box_txt2::before {  content:""; position: absolute; display: block; top: 5vw; left: 0; width: 100%; height: 100%; pointer-events: none; z-index: -10; background: url("m_box_txt_bg2.png?t=1782273691936") center top / 100% no-repeat scroll;}
	.box_txt2 .PD_layout .PD h5 { color:#fff; font-size: 1.6em; letter-spacing: -1px; line-height: 20vw; font-family: "Century Gothic","微軟正黑體"; max-height: 13vw; font-weight: bold; top: -6vw; position: relative;}
}



/*編輯按鈕移動*/
#eWriterBtn_bt_B_000_p01 { margin-left:0px!important; margin-top:250px!important; z-index: 99!important; }

/*調整公版看更多*/
.Area01 .PD_layout[data-pd-btn][data-pd-btn-pdgo] .PD .PD_btn b::after { content: "進店逛";}

@media screen and (min-width: 768px) {
  .Area01 .Area_swiper li { flex-shrink: 0; margin: 0; padding: 0; min-width: auto; background-color:transparent; border: none; border-radius: 10px;background: url("pdbg.png?t=1782273691936") center top/ 100% no-repeat scroll;}
  .Area01 {overflow: hidden;/* background-color: #f5f5f5; *//* border-radius: 20px; */}
  .Area01 .Area_swiper_box{width: 90%;margin: 0 0 0 9vw;}
  .Area01 .today_only {position: absolute;z-index: 9;width: 16%;left: -22px;top: 4px;}
  .Area01 .today_only img { width:100%!important; }
  
    /* 公版調整 */
    .Area01 .PD_layout ul { padding: 3% 0% 0% 0%;}
    .Area01 .Area_swiper {width: 100%;background-color: #f5f5f5;border-radius: 20px;margin: 21px 0 0 0;}
    .Area01 .Area_swiper_box {margin: 20px 0 0 90px;}
	.Area01 .PD_layout .PD_into {margin: 0 0 -10px 0;}
	.Area01 .PD_layout[data-pd-btn*=box-0] .PD_btn {background: #ffffff00;margin-bottom: 0vw;}
	.Area01 .PD_layout[data-pd-h4="2"] .PD h4 b, .PD_layout[data-pd-h4="2"] .PD h4 span {
		display: block;
		font-weight: inherit;
		font-size: 20px;
		line-height: 2em;
	}
    .Area01 .PD_layout[data-pd-btn][data-pd-btn-pdgo] .PD .PD_btn {
        bottom: -0.7em;
        right: .275em;
        width: 54%;
        margin: 0 20%;
    }

  }
    

  @media screen and (max-width: 767px) { 
  .Area01 .Area_swiper li {flex-shrink: 0;margin: 0;padding: 0;min-width: auto;background-color:transparent;border: none;border-radius: 10px;background: url("pdbg.png?t=1782273691936") center top/ 100% no-repeat scroll;height: 47vw;}
  .Area01 {overflow: hidden;/* background-color: #f5f5f5; *//* border-radius: 20px; *//* width: 96%; */}
  .Area01 .today_only{position: absolute;width: 18%;top: 0vw;left: 1vw;z-index: 9;}
  .Area01 .today_only img { width:100%!important; }
  
  /* 公版調整 */
  .Area01 .PD_layout ul { padding: 6% 0% 5% 0%; }
  .Area01 .Area_swiper {background-color: #f5f5f5;border-radius: 20px;width: 92%;margin: 3% 0 0 4%;}
  .Area01 .Area_swiper_box {margin: 4vw 0 0 10vw;}  
  .Area01 .PD_layout .PD_into {margin: -0.3em 0 -1.3em 0;}
  .Area01 .PD_layout[data-pd-btn*=box-0] .PD_btn {background: #ffffff00;margin-bottom: -2vw;}
  .Area01 .PD_layout .PD h4 { line-height: 2em}
  .Area01 .PD_layout[data-pd-h4="2"] .PD h4 b, .PD_layout[data-pd-h4="2"] .PD h4 span {display: block;font-weight: inherit;line-height: 1em;/*font-size: 1.1em;*/}




  }

 
  .Area01 .PD_layout-btn {position: absolute;right: 20px;top: 430px;}
  .Area01 .PD_layout-btn ul {background-color: #ffffff00;}
 /* .Area01 .Area_swiper .PD_img:after {content: "";position: absolute;top:10px;left:8px;display: block;width:20%;height: 100%;background-image: url(icon_good.png?t=1782273691936);background-repeat: no-repeat;background-size: 100%;pointer-events: none;}*/
  
  @media screen and (max-width: 767px) {
    .Area01 .PD_layout-btn {position: absolute;right: 3vw;top: 80vw;}
    /*.Area01 .Area_swiper .PD_img:after {content: "";position: absolute;top:2vw;left:2vw;display: block;width: 20%;height: 100%;background-image: url(icon_good.png?t=1782273691936);background-repeat: no-repeat;background-size: 100%;pointer-events: none;}*/
	.Area01 .PD_layout[data-pd-btn][data-pd-btn-pdgo] .PD .PD_btn b::before {
		content: "";
		position: relative;
		top: .075em;
		display: inline-block;
		margin-right: .2em;
		width: 1em;
		height: 1em;
		background-size: auto 100%;
		background-repeat: no-repeat;
		display: none;
	}
	.Area01 .PD_layout[data-pd-btn][data-pd-btn-pdgo] .PD .PD_btn {
        bottom: -0.6em;
        right: .275em;
        width: 54%;
        margin: 0 20%;
    }

    
  }




/*BN*/
.Area_bn { margin-bottom: 40px; height: 100%;}
@media screen and (max-width: 767px){
.Area_bn { margin-bottom:0; height: 77vw; overflow: hidden;}
}
/*輪播BN*/
.BN_swiper { position: relative; width:960px; margin: 0 auto; overflow: hidden; z-index: 1;}
.BN_swiper ul.PD_wrapper { display: flex; flex-wrap: nowrap; margin: 0; padding: 0 0 20px; width: 100%; grid-gap: 0; box-sizing: content-box; height: 228px;}
.BN_swiper ul.PD_wrapper li { position: relative; flex-shrink: 0; margin: 0; padding: 0; pointer-events: inherit;}
.BN_swiper ul.PD_wrapper li.PD_slide { min-width: inherit;}
.BN_swiper ul.PD_wrapper li.PD_slide:hover { box-shadow: 0 3px 30px rgba(0, 0, 0, 0);}
@media screen and (max-width:767px){
  .BN_swiper { width: 100%; margin: 0 auto;        padding-top:0vw;}
  .BN_swiper ul.PD_wrapper { margin: 0; padding: 0 0 4%; height: 45vw;}
}


/*03-100格商品*/
@media screen and (max-width:767px){ 
	.Area03 .box {width: 96%;margin: 0 auto;}
	.Area03 .box .PD_btn span { flex-direction: column;}
	.Area03 .PD_layout[data-pd-col-pc="4"] ul.PD_wrapper {background-color: #fff34300;gap: 3vw 2.5vw;border-radius: 3vw;}
	.Area03 .PD_layout[data-pd-col-pc="4"] ul.PD_wrapper::after { content: ""; display: block; position: relative; width: 100%; background-size: 100%;}
	.Area03 .PD_layout[data-pd-col-pc="4"] ul.PD_wrapper li.PD_slide { border: 0; background: #fff; border-radius: 2vw;padding-bottom: 0;}
	.Area03 .PD_layout[data-pd-col-pc="4"] ul.PD_wrapper li .PD_btn.PD_go {width: 90%;margin: 5% 7% 0%;bottom: 0.6em;height: 8vw;position: relative;background-image: repeating-linear-gradient(45deg, #000000 -2%, #000000 120%);}
	.Area03 .PD_layout[data-pd-col-pc="4"] ul.PD_wrapper li.PD_slide .PD_img { padding: .5em;}
	.Area03 .PD_layout[data-pd-h4="1"] .PD h4 { max-height: 1.5em;}
	.Area03 .PD_layout[data-pd-h3="5"] .PD h3 {margin-bottom: 0.7em; margin-top: 0em;}
	.Area03 .PD_layout[data-pd-h3="5"] .PD h3 span { max-width: 100%;}



	}

@media screen and (min-width:768px){
	.Area03 .box { width: 100%; margin: 0 auto;}	
	.Area03 .PD_layout[data-pd-col-pc="4"] ul.PD_wrapper {background-color: #fff343;padding: 12px;gap: 12px 8px;}
	.Area03 .PD_layout[data-pd-col-pc="4"] ul.PD_wrapper::after { content: ""; display: block; position: relative; width: 100%; background-size: 96%;}  
	.Area03 .PD_layout[data-pd-col-pc="4"] ul.PD_wrapper li.PD_slide { border: 0; background: #fff; border-radius: 8px;padding-bottom: 0;}
	.Area03 .PD_layout[data-pd-col-pc="4"] ul.PD_wrapper li .PD_btn.PD_go{left: 50%;transform: translateX(-50%);width: 92%;position: relative;background-image: repeating-linear-gradient(45deg, #000000 -2%, #000000 120%);}
	.Area03 .PD_layout[data-pd-col-pc="4"] ul.PD_wrapper li.PD_slide:nth-child(4n+3) { border-right: 0;}
	.Area03 .PD_layout[data-pd-col-pc="4"] ul.PD_wrapper li.PD_slide:last-child { border-right: 0;}
	.Area03 .PD_layout[data-pd-h4="1"] .PD h4 { max-height: 1.5em;}
	.Area03 .PD_layout .PD p {height: 2em;line-height: 2em;	color: #d62672;}
	.Area03 .PD_layout[data-pd-h3="5"] .PD h3 { margin-bottom: 0.7em;margin-top: 0em;}
	.Area03 .PD_layout .PD_into {padding: 0.3125em;	padding-bottom: 1em;}
}


/*可拖移廣告icon*/
.Area_hammerAD { z-index: 9999; position: fixed; bottom: 2%; right: 0;}
.Area_hammerAD .box { position: relative; margin-right: 10px; opacity: 1;}
.Area_hammerAD img { width: 100%; height: auto;}
.Area_hammerAD .closeButton a { display: block; cursor: pointer; position: absolute; width: 20px; height: 20px; border-radius: 50%; font: bold 20px/1em "Century Gothic"; color: #FFF; text-align: center; background-color: rgba(0%,0%,0%,0.5); text-decoration: none; z-index:2;}
@media screen and (min-width:768px){
  .Area_hammerAD { display: block; width: 120px;}
  .Area_hammerAD .closeButton a { top: 0; right: 0;}
}
@media screen and (max-width:767px){
  .Area_hammerAD { display: block; width: 22%;}
  .Area_hammerAD .closeButton a { top: 1vw; right: 1vw;}
}


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