/* 各頁面CSS */

:root {
  --base: #ffde00; /* 版頭主標 */ 
  --text: #FFF; /* 說明字 */ 
  --bnbg: #ffde00; /* 按鈕底色 */ 
  --bntext: #000; /* 按鈕字 */ 
  --Areabg: #f9f9f9; /*  區塊底色 */ 
  --headbg: #4e9935;  /*  卡片標題底 */ 
  --black: #252529; /* 黑色 */
  }

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

/*切換PC置頂選單*/
.cantantBase1 ul { display: none !important;}
.cantantBase2 { display: none;}
.fixarea_off  { display: none;}
.Fixedfooter { display: none !important;}


/* 01版頭入稿 */
.Area01 { position: relative; font-family: "Century Gothic", "微軟正黑體"; margin-bottom: 140px;}
.Area01 .PD_layout ul { padding: 0; background-color: transparent; grid-gap: 10px; display: flex; flex-wrap: nowrap;}
.Area01 .PD_layout .PD_slide { font-family: "Century Gothic","微軟正黑體","Microsoft JhengHei","Helvetica";}
.Area01 .PD_layout .PD a { display: flex; flex-direction: column; align-items: center;}
.Area01 .PD_layout .PD_img { width: 60%; padding: 0;}
.Area01 .PD_layout .PD_into { margin: 0 auto; padding: 0 35px; width: 100%;}
.Area01 .date .PD_layout li { border: none;}
.Area01 .date .PD_layout .PD .txt1 { color: var(--text); font-size: 2.7em; font-weight: 900; letter-spacing: .05em; text-align: center; line-height: 0.5em;margin-top: 20px;}
.Area01 .date .PD_layout .PD .txt2 { color: var(--text); font-size: 2.2em; font-weight: 900; letter-spacing: .05em; text-align: center;}

.Area01 .Area_active .PD_layout .PD_into { flex-direction: row; justify-content: center;}
.Area01 .Area_active .PD_layout .PD .txtl { color: #fff; font-size: 2em; font-weight: 900; letter-spacing: -0.05em; text-align: center; padding: .2em 0; border-radius: 1em; background: #0b0b0f; width: 95%;}
.Area01 .Area01_box { width: 960px;}
.Area01 .Area_active { width: 285px; height: 240px; margin-left: 45px;}
.Area01 .active3 .PD_layout li { border: 2px #fff solid; background: #dfff00; border-radius: 40px 5px;}
.Area01 .active3 .PD_layout li { height: 240px;}
.active3 .PD::before { content:""; position: absolute; display: block; top: 0; left: 0; width: 13%; height: 10%; background: url("deco-active.png?t=1773114143707") center top / 100% no-repeat scroll;}

.Area01 .notice { color: #f1ff93; font-size: 2em; font-weight: 900; text-align: center; line-height: 2em;}
.Area01 .notice ul { list-style: none; padding: 0;}
@media screen and (max-width:767px){
  .Area01 { margin-bottom: 4.5vw;}
  .Area01 .Area01_box { width: 95%; padding: 0 5%;}
  .Area01 .PD_layout .PD_into { padding: 0vw 1vw 2vw 1vw;}
  .Area01 .Area01_date { margin-bottom: 0;}
  .Area01 .date .PD_layout .PD .txt1 { font-size: 1.2em; line-height: 1.5em;margin-top: 0;}
  .Area01 .date .PD_layout .PD .txt2 { font-size: .85em;}
  .Area01 .Area_active { width: 30%; height: auto; margin-left: 0;}
  .Area01 .Area_active .PD_layout .PD_into { padding: .5vw 1vw .75vw 1vw;}
  .Area01 .Area_active .PD_layout .PD .txtl { font-size: 1em;}
  .Area01 .active3 .PD_layout li { width:100%; height: auto; border-radius: 5vw 1vw;}
  .active3 .PD::before { width: 15%;}
  .Area01 .PD_layout ul { grid-gap: 8%; width: 100%;}
  .Area01 .notice { font-size: 1.1em; line-height: 1.6em;}
  .Area01 .notice ul { margin: 2.5vw 0 0 0;}
}
  /* 倒數 */
  .TimerNick { position: absolute; top:220px; left: 161px; transform: none;}
  .TimerNick { text-shadow: none;}
  .TimerNick .TIMER { margin:0 auto; padding: 0; overflow: hidden; text-align: center; color: #134900; font-size: 28px; line-height: 40px; font-weight: 800; font-family:"微軟正黑體","Microsoft JhengHei", Arial, Helvetica;}
  .TimerNick small { position: relative; top: 0; font-size: 36px; padding: 0 5px 0 0;}
  .TimerNick .time_day { font-size:36px; letter-spacing: .05rem; font-weight: 900;}
  .TimerNick .FontStyle { position: relative; padding: 0 5px 0 0; font-size: 36px; font-weight: 900; text-align: center; color: #134900;}
  .TimerNick .FontStyle b { display: inline-block; font-weight: 900; font-family: Century Gothic; font-size: 40px; width: 25px;}
  @media screen and (max-width:767px){
    .TimerNick { position: relative; top: 1vw; left: 0; transform: none; width: 100%; text-align: center;}
    .TimerNick .TIMER { font-size: 4vw;}    
    .TimerNick small { margin: 0; top: inherit; font-size: 4vw; float: none; padding: 0;}
    .TimerNick .time_day { position: relative; font-size: 4vw; letter-spacing: 0; float: none; margin-right: -2px;}
    .TimerNick .FontStyle { padding: 0; font-size: 4vw; float: none; margin: -0.5vw;}
    .TimerNick .FontStyle b { margin: 0; font-size: 4vw; width: 3.5vw; font-family: Helvetica;}
  }


  .li_1 .PD_layout .PD p{display: none;}
  

  /* 錨點 */
  .go2 { position: relative; font-family: "Century Gothic", "微軟正黑體";}
  .go2 .PD ul { padding: 0; background-color: transparent; grid-gap: 0;}
  .go2 .PD .PD_slide { padding: .5em 0em; font-family: "Century Gothic","微軟正黑體","Microsoft JhengHei","Helvetica";}
  .go2 .PD .PD_into { padding: 0; width: 100%; display: flex; flex-direction: row;}
  .go2 .PD_layout .PD p { color: var(--bntext); font-size: 2em; font-weight: 900; height: 2.5em; line-height: 2.5em; width: 100%;text-align: center;background: var(--bnbg); border-radius: 80px;padding: 0 10px;}
  .go2 .PD_layout .PD .txtBtn { width: auto; color: var(--bntext); font-size: 1.6em; font-weight: 900; letter-spacing: 0em; text-align: center; margin: 1em 0.35em 0.5em 0; padding: 0.2em 0.7em; border-radius: 1em; background: var(--bnbg);}
  .go2 .PD_layout .PD p .txtL { font-size: 1.6em;text-align: center;margin:0 auto ;}
  .go2 .PD_layout li { border: none; }
  @media screen and (min-width:768px){
    .go2 { margin: 0 auto; width: 60%; top: 40px;}
    .go2 .PD_layout { font-size: 20px;}
  }
  @media screen and (max-width:767px){
    .go2 { display: block; width: auto; margin: 0 auto; top: -.5vw;}
    .go2::before { top: 8vw; height: 45%;}
    .go2 .PD_layout ul { width: 80%;}
    .go2.PD_layout .PD_slide { padding: 0;}
    .go2 .PD_layout .PD_into { padding: 0 0.5vw;}
    .go2 .PD_layout .PD p { color: var(--bntext); font-size: 2em; font-weight: 900; height: 2.5em; line-height: 2.5em; width: auto;text-align: center;background: var(--bnbg); border-radius: 80px;padding: 0 5vw;}
    .go2 .PD_layout { font-size: 2.3vw;}
    .go2.PD_layout .PD .txtBtn { font-size: 1.9em; margin: .5em 0;}
    .go2.PD_layout .PD .txtL { letter-spacing: -0.05em;}
    .go2 .PD_layout .PD p .txtL { font-size: 1.5em;}
  }


/* 如何使用折價券 */ 
@media screen and (min-width:768px){
  .Area01-2 { margin-bottom: 20px; z-index: 2;}
 }
 @media screen and (max-width: 767px){
 .Area01-2 { width: 52%; margin-top: 2vw; margin-bottom: -1vw; z-index: 2;}
 } 


/* 03必買商品 */ 
@media screen and (min-width:768px){
    .Area03 { margin-bottom: 95px;}
}
@media screen and (max-width: 767px){
  .Area03 { margin-top: 6vw; margin-bottom: 12vw;}
} 


/* 02BN */
.Area02 .Area_swiper_box .PD_layout li { background: transparent;}
@media screen and (min-width:768px){
  .Area02 .Area_swiper_box .PD_layout ul { height: 250px;}
  .Area02 { margin-bottom: 40px;}
}
@media screen and (max-width: 767px){
  .Area02 .Area_swiper_box .PD_layout ul { height: 29vw;}
  .Area02 { }
}


/* 04好康攻略 */
.Area04 { position: relative; font-family: "Century Gothic", "微軟正黑體";}
.Area04 .Area04_box { position: relative; display: flex; flex-direction: row; flex-wrap: wrap; margin: 0 auto; padding: 0; grid-gap: 10px;}
.Area04 .PD_layout ul { padding: 0; background-color: transparent; grid-gap: 20px; width: 960px;}
.Area04 .PD_layout .PD_slide { padding: .5em 0em; font-family: "Century Gothic","微軟正黑體","Microsoft JhengHei","Helvetica";}
.Area04 .PD_layout .PD_into { padding: 0; width: 100%;}
.Area04 .PD_layout .PD .smallTxt { color: var(--bntext); font-size: 1.5em; font-weight: 900; width: 115px; text-align: center; border-radius: 0 25px 25px 25px; padding: 4px 10px; position: absolute; top: -10px; left: -5px;background-color: var(--headbg); }
.Area04 .Area04_g_box .PD_layout .PD_into { padding-top: 45px;}
.Area04 .Area04_g_box .PD_layout .PD .txt2 { color: var(--black); font-size: 1.6em; font-weight: 900; letter-spacing: -0.05em; text-align: center;}
.Area04 .Area04_g_box .PD_layout .PD .txt3 { color: var(--black); font-size: 2.6em; font-weight: 700; letter-spacing: -0.05em; text-align: center; line-height: 1.1em;font-family: "Century Gothic",Noto Sans TC, sans-serif;}
.Area04 .Area04_g_box .PD_layout .PD .gobtn { position: absolute;
top: 70%;left: 35%; width: 30%; color: var(--bntext); font-size: 1.2em;line-height: 1.6em;text-align: center;font-weight: 700;font-family: "Century Gothic";background: var(--bnbg);border-radius: 20em;height: 1.6em;padding: 0 0.5em 0 0.3em;}
.Area04 .Area04_g_box .PD_layout .PD .gobtn::after{content: '';display: block;border-width: 0.25em 0 0.25em 0.4em;border-style: solid;border-color: transparent transparent transparent var(--bntext); float: right;margin-top: 0.53em;margin-right: 0.3em}

@media screen and (min-width:768px){
  .Area04 { margin-bottom: 50px;}
  .Area04 .Area04_box { width: 960px;}
  .Area04 .PD_layout { font-size: 20px;}
  .Area04 .PD_layout li { background:var(--Areabg)/*linear-gradient(180deg, #fff 0%, #fff 30%, #ffc0ce 100%)*/; border-radius: 30px;}
  .gong .PD_layout li { height: 250px;}
}
@media screen and (max-width:767px){
  .Area04 { margin-bottom: 5vw;}
  .Area04 .Area04_box { width: 96%; grid-gap: 0;}
  .Area04 .PD_layout .PD .smallTxt { font-size: 0.9em; width: 15vw; border-radius: 0 15px 15px 15px; padding: 0.4vw 1vw; top: -2vw; left: -1vw;}
  .Area04 .Area04_g_box .PD_layout .PD_into { padding-top: 0;} 
  .Area04 .Area04_g_box .PD_layout .PD .txt2 { font-size: 1.2em; letter-spacing: -.06em;}
  .Area04 .Area04_g_box .PD_layout .PD .txt3 { font-size: 1.3em; letter-spacing: -.06em; max-height: 1.2em; overflow: hidden;}
  .Area04 .Area04_g_box .PD_layout .PD_slide { padding: 1.5em .1em;}
  .Area04 .Area04_g_box { width: 100%; height: auto; margin-bottom: .5vw;}
  .Area04 .PD_layout ul { width: 100%; grid-gap: 5vw 1.5vw;}
  .Area04 .PD_layout li { /*border: 2px #ff89fd solid; */background:var(--Areabg)/*#fff*//*linear-gradient(180deg, #fff 0%, #fff 30%, #ffc0ce 100%)*/; border-radius:  3vw ;}
  .gong .PD_layout li { height: 28vw; width: 100%; }
  .Area04 .Area04_g_box .PD_layout .PD .gobtn { top: 76%; width: 40%; height: 1.6em; font-size: .8em; left: 30%;}
}


/* 08品類熱搜 */
/*.Area08 .box_bg { background: #ef04a9; border-radius: 1.5em; padding: 1.2em 1em;}*/
.Area08 .PD_layout li { border: none;}
@media screen and (min-width: 768px){
  .Area08 .PD_layout ul { padding: 0; grid-gap: 10px 15px;}
  .Area08.Areabottom { margin-bottom: 60px;}    
}
@media screen and (max-width: 767px){
  .Area08 { margin-bottom: 9vw;}
  .Area08 .box_bg { padding: .2em 0; width: 100%;}
  .Area08 .PD_layout ul { grid-gap: .5vw; background: none; width: 100%; padding: .5em;}
}


/*你可能會喜歡*/
.PD_layout-btn { margin: 0;}
.Area_b268 .Area_swiper_box .PD_layout ul {flex-wrap: wrap;grid-gap: 5px;}
.Area_b268 .Area_boxstyle_button.swiper-button-next::before,
.Area_b268 .Area_bigBrand .Area_boxstyle_button.swiper-button-prev::before {background-color: RGB(255 255 255/0.75);}
.Area_b268 .swiper-button-next::after,.Area_b268 .swiper-button-prev::after {color: #fff;}
@media screen and (min-width: 768px) {
  .Area_b268 .Area_swiper .PD .prdName {display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;white-space: normal;overflow: hidden;}
}
@media screen and (max-width: 767px) {
  .Area_b268 .swiper-pagination-bullet {width: 6px !important;height: 6px !important;background: white;opacity: 0.6;margin: 0 2.5px !important;}
  .Area_b268 .swiper-pagination-bullet-active {background-color: white !important;width: 15px !important;height: 6px !important;border-radius: 3px;}
  .Area_b268 .Area_boxstyle_box {padding-left: 0 !important;padding-right: 0 !important;}
  .Area_b268 .PD_layout {padding-top: 0 !important;}
  .Area_b268 .Area_swiper .PD .prdName {display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;white-space: normal;
    overflow: hidden;
  }
}
/*猜你喜歡*/
.Area_b268 .PD_layout-btn ul {background-color: transparent;}
#bt_0_layout_b268 .PD_layout{position:relative;margin:0 auto;font-family:"微軟正黑體","Microsoft JhengHei",Helvetica;text-align:center;overflow:hidden}
#bt_0_layout_b268 .PD_layout a{display:block;text-decoration:none;color:#000}
#bt_0_layout_b268 .PD_layout ul{margin:0 auto;padding:10px 0;min-height:auto;list-style:none}
#bt_0_layout_b268 .PD_layout ul:after{content:"";display:block;clear:both}
#bt_0_layout_b268 .PD_layout li{float:left;display:block;position:relative;margin:0;padding:0;transition:.2s ease}
#bt_0_layout_b268 .PD_layout .BN img{width:175px;height:175px;transition:.2s ease}
#bt_0_layout_b268 .PD_layout .PD .youLikePic img{width:100%}
#bt_0_layout_b268 .PD_layout .PD .youLikePic:hover img{filter:brightness(105%)}
#bt_0_layout_b268 .PD_layout .PD .youLikePic .prdPrice img{width:45px;height:auto}
#bt_0_layout_b268 .PD_layout .PD_slide{background-color:#fff;border-radius:10px}
#bt_0_layout_b268 .PD_layout .PD_slide:hover{z-index:5}
#bt_0_layout_b268 .PD_layout .PD{position:relative}
#bt_0_layout_b268 .PD_layout .PD{margin:10px;margin-bottom:0}
#bt_0_layout_b268 .PD_layout .PD .PD_img{width:100%;height:auto}
#bt_0_layout_b268 .PD_layout .PD h4 b{display:block}
#bt_0_layout_b268 .PD_layout .PD h4 br{display:none}
#bt_0_layout_b268 .PD_layout .PD .prdName{margin:0 auto 5px;padding:0;text-align:left;font-size:16px;line-height:1.4;color:#000}
#bt_0_layout_b268 .PD_layout .PD .prdName{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
#bt_0_layout_b268 .PD_layout .PD .prdName{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;white-space:normal}
#bt_0_layout_b268 .PD_layout .PD:hover .prdName{color:#d92670}
#bt_0_layout_b268 .PD_layout .PD .PD_prdPrice{display:block}
#bt_0_layout_b268 .PD_layout .PD p{padding-right:5px;height:auto;font-family:Century Gothic,"微軟正黑體";color:#5e5e5e}
#bt_0_layout_b268 .PD_layout .PD p .prdPrice{display:block;width:100%;font-size:20px;font-family:Century Gothic;letter-spacing:-1px;overflow:hidden}
#bt_0_layout_b268 .PD_layout .PD p .prdPrice img{display:block;float:left}
#bt_0_layout_b268 .PD_layout .PD p .prdPrice b{display:block;float:right;padding-right:5px}
	@media screen and (min-width: 768px){
		#bt_0_layout_b268 .PD_layout .PD_slide:hover{transform:translateY(-6px)}
		#bt_0_layout_b268 .PD_layout .PD_slide:hover{box-shadow:0 10px 20px rgba(0,0,0,.2)}}
	@media screen and (max-width: 767px){
		#bt_0_layout_b268 .PD_layout,
		#bt_0_layout_b268 .PD_layout *{-ms-box-sizing:border-box;-o-box-sizing:border-box;box-sizing:border-box}
		#bt_0_layout_b268 .PD_layout ul{margin:0 auto;padding:0;min-height:auto;list-style:none;overflow:inherit}
		#bt_0_layout_b268 .PD_layout .PD_slide{text-align:left}
		#bt_0_layout_b268 .PD_layout .PD_slide:hover{transform:none}
		#bt_0_layout_b268 .PD_layout .PD .PD_img{margin:0}
		#bt_0_layout_b268 .PD_layout .PD .prdName{margin:0 auto 5px;padding:0;font-size:16px;line-height:1.4;color:#000}
		#bt_0_layout_b268 .PD_layout .PD p{margin-bottom:8%;padding:0;font-size:15px;line-height:16px}
		#bt_0_layout_b268 .PD_layout .PD p b{font-size:20px;line-height:1}
		#bt_0_layout_b268 .PD_layout .PD p .prdPrice{font-size:24px;font-weight:300;vertical-align:bottom}}
		#bt_0_layout_b268 .b268_swiper ul{display:inline-flex;margin:0 auto;padding:0 0}
		#bt_0_layout_b268 .b268_swiper li{float:none;margin:0;width:190px}
		#bt_0_layout_b268 .b268_swiper{position:static;overflow:hidden;overflow:inherit}
	@media screen and (min-width: 768px){
		#bt_0_layout_b268 .b268_swiper{margin:0;padding:0;padding-top:0px}}
	@media screen and (max-width: 767px){
		#bt_0_layout_b268 .b268_swiper{/*margin:0 2.8vw;*/ margin:0; padding:0 2%;padding-top:10px;padding-bottom:1%}
		#bt_0_layout_b268 .b268_swiper ul{padding:0}
		#bt_0_layout_b268 .b268_swiper li{width:32.4%}}
	@media screen and (max-width: 768px){
		#bt_0_layout_b268 .PD_layout .PD .prdName{height:auto;font-size:3.5vw;line-height:1.3;color:#000;overflow:hidden}
		#bt_0_layout_b268 .PD_layout .PD .youLikePic .prdPrice img{width:8vw;height:auto}
		#bt_0_layout_b268 .PD_layout .PD p .prdPrice b{font-size:4vw;padding-right:2px}}



/*注意事項區*/
.edm_notice { text-align: center; padding: 10px 10px 70px 10px; color:#000; font: 12px/18px Helvetica;}
.edm_notice .apple_notice { padding: 10px 0;}


/*商品區特標長度修正*/
.PD_layout[data-pd-h3="5"] .PD h3 span {max-width: 100%;}