/* 各頁面CSS */

body {
  font-size: inherit !important;
  background-color:  #105459;
}

body.ts_02  {
  font-size: inherit !important;
  background-color:  #271967;
}


.ts_A {}
.ts_B { display: none;}

.ts_02 .ts_A { display: none;}
.ts_02 .ts_B { display: block;}

.ts_C {}
.ts_D { display: none;}

.ts_02 .ts_C { display: none;}
.ts_02 .ts_D { display: block;}


/*切換PC置頂選單*/
.cantantBase1 { display: block;background-color: #59421a;}
.cantantBase2 { display: none;}



/* 版頭 */
@media screen and (min-width: 768px){
  .hero { height: 1517px; }
  .hero-title { top:90px; left:370px;margin:0 auto ;}
  .ts_02 .hero-title { top:105px; left:190px; transform-origin: 50% 50%;/*傾斜*/transform: skew(-6deg, -10deg);/*傾斜*/}
 
  .hero-title .lg-text { width: 530px;}
  .ts_02 .hero-title{}
}
@media screen and (max-width: 767px){
  .hero-title {padding: 10vw 0 0;width: 100%;left:0%;}
  .ts_02 .hero-title {padding: 8vw 0 0;width: 54%;left:9%;  
    transform-origin: 50% 50%;/*傾斜*/
    transform: skew(-6deg, -7deg);/*傾斜*/}
}


/* 倒數 */
/** 倒數 **/
.TimerNick { z-index:0; display:inline-block;  height:96px;width:102% ;margin: 0 auto;padding-top:115px;right: 30px;font-weight:500 !important ;}
.ts_02 .TimerNick { z-index:0; display:inline-block; position: absolute; padding-right:14px; height:96px;text-align:right;width:100% ;top:93px;right: 504px;
  font-weight: 900; transform-origin: 50% 50%;transform: skew(-6deg, -9deg);font-weight:500 !important ;}
.TimerNick .FontStyle { display:inline-block; margin:0px 0 0 0 ; padding:0; border:0px;font: bold 35px/38px Century Gothic; color:#FFF; letter-spacing:-1px; text-align:center; background:transparent; width:50px ;font-weight:500 }
.TimerNick div:nth-of-type(2),
.TimerNick div:nth-of-type(3) { width:60px;}
.TimerNick span { display:inline-block; margin:0px 0 0 0 ; padding:0; border:0px; font: bold 35px/38px Century Gothic; color:#FFF;letter-spacing:-1px; text-align:right; background:transparent;font-weight:500 }
.ts_02 .TimerNick span { padding-left:2px; font: bold 35px/38px "微軟正黑體","Microsoft JhengHei", Arial, Helvetica; letter-spacing: -0.05em;color: #FFF;  font-weight: 900; transform-origin: 50% 50%; transform: skew(-6deg, -3deg);}
.TimerNick .time_day { font-size: 35px; letter-spacing: .05rem;}
.ts_02 .TimerNick .time_day { font-size: 35px; letter-spacing: .05rem;transform-origin: 50% 50%; transform: skew(-6deg, -3deg);}
    @media screen and (max-width:767px){
        .TimerNick { z-index:2; position: absolute; top:8vw; left:0%; display:inline-block; margin:0; padding-right:0%; width:78%; height:0; padding-bottom:13%; overflow:hidden; text-align:right; color:#FFF;background-size:100%;padding-top:0vw}
        .ts_02  .TimerNick { z-index:2; position: absolute; top:9vw; left:-23vw; display:inline-block; margin:0; padding-right:0%; width:85%; height:0; padding-bottom:13%; overflow:hidden; text-align:right;  /*background:url(m_time_bg.png?t=1786333507532) no-repeat center top; */background-size:100%; transform-origin: 50% 50%; transform: skew(-6deg, -7deg);}
        .TimerNick .FontStyle { display:inline-block; margin:0px 0 0 0 ; padding:0; border:0px; font:  4.5vw/11vw Century Gothic; color:#FFF; /*text-shadow:1px 1px 0px #fff;*/ letter-spacing:-1px; text-align:right; background:transparent;width:5vw ;}
        .TimerNick div:nth-of-type(2),
        .TimerNick div:nth-of-type(3) { width:4vw;}
        .TimerNick span { padding-left:1vw; font: bold 4vw/11vw "微軟正黑體","Microsoft JhengHei", Arial, Helvetica; letter-spacing: -0.05em;color: #FFF;}
        .ts_02  .TimerNick span { padding-left:1vw; font: bold 4vw/7vw "微軟正黑體","Microsoft JhengHei", Arial, Helvetica; letter-spacing: -0.05em;color: #FFF;transform-origin: 50% 50%; transform: skew(-6deg, -7deg);}
        .TimerNick .time_day { font-size: 4vw; letter-spacing: .05rem;}
        .ts_02 .TimerNick .time_day { font-size: 4vw; letter-spacing: .05rem;margin-top:0.5vw ;}
    }




/* 版頭品輪播 */
.top_pd .Area_swiper_box .PD_layout li, .Area_swiper_box .PD_layout li .PD_img img { border-radius: 0!important;}
@media screen and (min-width:768px){
  .top_pd { position: absolute; top: 75px; left: 758px; width: 316px; height: 385px; overflow: hidden; z-index: 9;}
  .top_pd .ly ul, .top_pd .ly ul li { padding: 0;}
  .top_pd .ly ul li .PD_into {text-align: center;}
  .top_pd .ly ul li .PD_into .PD_logo { display: none;}
  .top_pd .ly ul li .PD_into { width: 100%; position: relative; top: 6px;}
  .top_pd .ly ul li .PD_img { width:100%; height: auto;padding: 0px 0.2px 0px;}
  /* 文字 */	
  .top_pd .ly.PD_layout .PD_into h3 {color: #ce2227; width: 100%; font-size: 1.8em;text-align: center;}
}

@media screen and (max-width:767px){
  .top_pd .ly ul li { padding: 0;}
  .top_pd .ly ul li .PD_into .PD_logo { display: none;}
  .top_pd .ly  ul li .PD_into  { padding: .05em 0 0;}
  .top_pd .ly ul li .PD_img { width: 100%; height: auto; padding: 0.3em .2em 0em}
  /*文字*/	
  .top_pd .ly  ul li .PD_into h3 { color: #ce2227; font-size: .9em;}
}

/* hasBG調整 */
@media screen and (min-width:768px){
  .Area_boxstyle.Area_boxstyle--hasBackdrop .Area_boxstyle_box {
    }
  .Area_boxstyle.Area_boxstyle--hasBackdrop:before { background: url(Area_boxstyle_hasbg_top-B.png?t=1786333507532) top center / 100% no-repeat, url(Area_boxstyle_hasbg_bottom-B.png?t=1786333507532) bottom center / 100% no-repeat, url(Area_boxstyle_hasbg_bottom-B.png?t=1786333507532) center top 80px / 100% calc(100% - 80px) no-repeat !important;border-radius: 0 !important;}
}
@media screen and (max-width:767px){
  .Area_boxstyle.Area_boxstyle--hasBackdrop .Area_boxstyle_box {}
  .Area_boxstyle.Area_boxstyle--hasBackdrop:before { background: url(m_Area_boxstyle_hasbg_top-B.png?t=1786333507532) top center / 100% no-repeat, url(m_Area_boxstyle_hasbg_bottom-B.png?t=1786333507532) bottom center / 100% no-repeat, url(m_Area_boxstyle_hasbg_bottom-B.png?t=1786333507532) center top 5vw / 100% calc(100% - 5vw) no-repeat !important;border-radius: 0 !important;}

}

/* 移除公版設定 */
.Area .remove_box_style ul { background-color: transparent; grid-gap: 0;}
.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%; padding: 0;}
}

/* 品牌公版背景設定 */
.PD_layout-D1_01 .PD_slide { background-color: #fcd206;}
.PD_layout-D1_01 .PD h4 { color: #060606; font-weight: 900;}
.PD_layout-D1_01 .PD h4:hover { color: #d71163 !important;}
.PD_layout-D1_01 { padding-bottom: 30px;}
.PD_layout-D1_01 ul { width: 100%;}
.Area_grabmoney_NUM2 .PD_layout-btn li .PD h3 { color: #ffffff; background: #000000;}
@media screen and (max-width:767px){
  .Area_grabmoney_NUM2 .PD_layout-btn { margin-top: -5vw;}
}

/* 熱銷排行 */
.Area_PD3 .PD_layout-btn li .PD h3 { color: #000; background: #fff;}
@media screen and (min-width:768px){ 
  .Area_PD3 .PD_layout-btn { margin-top: 25px;}
}
@media screen and (max-width:767px){
  .Area_PD3 .PD_layout-btn { margin-top: 3vw;}
}

.Area_AD {padding:10px ;}
.Area_AD .Area_swiper_box .PD_layout li .PD_img img{border-radius:20px !important ; }

@media screen and (max-width:767px){
  .Area_AD {padding:3vw 3vw 3vw 1vw;}
}


/* --------------共用素材---自行新增區------------------ */




.top_pd{background: url(top_pd_01.png?t=1786333507532)top center no-repeat;background-size: 100%;height: 360px;position: absolute; top: 95px; right: 5px; z-index: 0;width:18%;}


@media screen and (max-width:767px){
  .Area_logo a::before{display: block;background: url(logo_orange.png?t=1786333507532)top center no-repeat;background-size: 100%;width: 60%;}
  .top_pd{background: url(top_pd_01.png?t=1786333507532)top center no-repeat;background-size: 100%;height: 41vw;position: absolute; top: 2vw; right: 7vw; z-index: 0;width: 28%;}


}


.Area_logo a::before{display: block;background: url(logo.png?t=1786333507532)top center no-repeat;background-size: 100%;}
.fixarea .fix_top a::before{background: url(fixed_Area_top-main.png?t=1786333507532)top center no-repeat;background-size: 100%;}

.ts_03 .Area_logo a::before{display: block;background: url(logo-2.png?t=1786333507532)top center no-repeat;background-size: 100%;}
.ts_03 .fixarea .fix_top a::before{background: url(fixed_Area_top-main-2.png?t=1786333507532)top center no-repeat;background-size: 100%;}




/*登記贈品文案顏色*/
.Area_danji .danji_box ul li .activityText .gifts span { color: #905d00;}          



/* MB選單 */
.Fixedfooter_box {
  background-image: url(Fixedfooter_bg.png?t=1786333507532);
  background-size: cover;
  background-position: center top;
}



/*-----------------------------看更多按鈕從這邊開始------------------------------*/

/*各區看更多按鈕，哪一區不要就:not(.Area17) > .PD_layout-btn*/

.PD_layout-btn li {
  list-style-type: none;
}

.PD_layout-btn .PD h3 {
  color: var(--font-white);
  background-color: #937130 !important;
  transition: all .5s ease-in-out;
}
.PD_layout-btn ul
 { background-color: transparent !important; }
@media screen and (min-width: 768px) {
  .PD_layout-btn .PD h3:hover {
    cursor: pointer;
    color: var(--font-black);
    background-color: #ffe389 !important;
  }
}


@media screen and (min-width:768px){ 
.Area_boxstyle_title{font-size:42px;}
}
@media screen and (max-width:767px){
.Area_boxstyle_title{}
}



/* 超大牌曝光(BN+4品輪播)、嚴選好物(情境6品輪播)、備用區塊(BN+10品輪播) */
.Area03 .Area_swiper .PD_layout li {background-color: #FFF; }
@media screen and (max-width:767px){
.Area03 .BN03 {margin:0vw auto 1vw!important;}
}



/* 嚴選好物(情境6品輪播) */
.box5_swiper {position: relative;width: 98%;margin: 0 auto 40px;overflow: hidden;z-index: 1;}
.box5_swiper ul.PD_wrapper {display: flex;flex-wrap: nowrap;margin: 0 auto;padding: 0 0 40px;width: 100%;grid-gap: 0;box-sizing: content-box;height: 369px;}
.box5_swiper ul.PD_wrapper li { flex-shrink: 0; margin: 0; padding: 0; pointer-events: inherit;border-radius: 15px !important;overflow: hidden;}
.box5_swiper ul.PD_wrapper li.PD_slide { min-width: inherit;}
.box5_swiper ul.PD_wrapper li.PD_slide:hover { box-shadow: 0 1em 2em rgba(0, 0, 0, 0);}
@media screen and (max-width:767px){
.box5_swiper { width: 100%;margin: 0 auto 0}
.box5_swiper ul.PD_wrapper {padding: 0 0 8.5%;height: 66vw;}
.box5_swiper ul.PD_wrapper li { border-radius: 4vw !important;}
} 


/* 倒數容器 */
.TimerNick3{display:inline-flex;align-items:center;gap:6px;margin-bottom: 20px;}
/* 數字方塊 */
.TimerNick3 .FontStyle{display:inline-flex;justify-content:center;align-items:center;width: 52px;height: 50px;font: bold 32px "Century Gothic";color: #ffffff;background: #8c5800;border-radius:6px;}
/* 時分秒文字 */
.TimerNick3 span{margin-right: 6px;font: bold 20px "微軟正黑體","Microsoft JhengHei";color: #ffffff;}
@media screen and (max-width:767px){
.TimerNick3{justify-content:flex-end;gap:1vw;margin-bottom: 2vw;}  
.TimerNick3 .FontStyle{width: 9vw;height:8vw;font-size: 5.5vw;border-radius:1vw;}
}


 /* 一日激省價(6品) */
 /* .Area02 .PD_layout ul {background-color: #FFF !important; } */



/*折價券左邊文案*/
/* .PD_layout.PD_layout-coupon3 .PD .divine_coupon, .PD_layout.PD_layout-coupon3 .PD .threshold {color: #000000;} */
.Area04 .Area_coupon {margin-bottom: 20px;}
/* 聰明購物(折價券) */
@media screen and (max-width:767px){
.Area04 {margin-bottom: 4vw !important;}
.Area04 .btnx2 {margin-bottom: 2vw;}
.Area04 .Area_coupon {margin-bottom: 3vw;}
}



/* 熱搜強牌(1帶2_X6) */
.box_box{width: 100%;display: flex;justify-content: center;align-items: center;}
.box_box .box{ margin: 0 5px 40px;}
.box_box .box .PD_layout{ padding: 0 15px;}
.PD_layout.PD_layout-D3_02 ul .PD .PD_logo  {width: 50% !important;}
.box_box .BN_box {width: 108%;margin: auto -19px;}
.box_box .BN_box .PD_layout .js-PD_txt3 {  color: #ffffff !important; font-size: 25px;}
.PD_layout.PD_layout-D3_02 ul .PD .PD_into { gap: 1em;}
.bg_B {background-image: repeating-linear-gradient(180deg, #dcbe89  0%, #dcbe89 100%);border-radius: 20px 20px 20px 20px;padding: 0px 0 15px;position: relative;z-index: 2;}
	@media screen and (max-width:767px){
.box_box{width: auto;justify-content: center;align-items: center;flex-direction: column;}
.box_box .box{ margin: 1vw 1.5vw 5vw;}
.box_box .box .PD_layout{ padding: 0 2vw;}
.PD_layout.PD_layout-D3_02 ul .PD .PD_logo  {width: 40% !important;}
.box_box .BN_box {width: 100%;margin: auto -2vw;}
.box_box .BN_box .PD_layout .js-PD_txt3 {color: #ffffff !important;font-size: 22px;}
.PD_layout.PD_layout-D3_02 ul .PD .PD_into { gap: 0.6em;}
.bg_B { width: 100%; /*border: #ffd534;*/ border-radius: 10px 10px 10px 10px; padding: 2% 0;}

}



/* 下方公版 */
.Area05 .Area_swiper .PD_layout li {background-color: #ffffff; }
@media screen and (max-width:767px){
.Area05 .Area_swiper_box .swiper-pagination { bottom: -0.5vw !important;}
/* .Area .Area_swiper_box { padding-bottom: 5vw;} */
}


/* mo店+ 熱銷首選 背景 */
@media screen and (min-width:768px){
.Area_mo ,.Area02 ,.Areabig ,.Area04 {background-color: #dcbe89;border-radius: 20px;padding-bottom: 20px;}
}
@media screen and (max-width:767px){
.Area_mo ,.Area02 ,.Areabig ,.Area04 {width: 96%;background-color: #dcbe89;border-radius: 10px;padding-bottom: 0vw;}
}	
     


/* 館連結 */
@media screen and (min-width:768px){
.Area_guan .PD_layout ul{width: 60%;}
.Area_guan{margin-top: 30px;margin-bottom: 20px;}
}
@media screen and (max-width:767px){
.Area_guan {width: 90%;margin-top: 6vw;margin-bottom: 4vw;}
.Area_guan .PD_layout ul { padding: 0 .4em; grid-gap: .5em;}
}	



/* 輪播點點 */
.Area .swiper-pagination-bullet-active { background: #ffffff;}
.Area .swiper-pagination-bullet {	background: #ffffff; }
@media screen and (max-width:767px){  
.Area .Area_swiper_box { padding-bottom: 6vw;}
}	

