/* 各頁面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;}

}
@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=1786093585875) 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 { display: none;}
}
@media screen and (max-width:767px){
  .Area_boxstyle.Area_boxstyle--hasBackdrop .Area_boxstyle_box {}
  .Area_boxstyle.Area_boxstyle--hasBackdrop:before { display: none;}

}

/* 移除公版設定 */
.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=1786093585875)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=1786093585875)top center no-repeat;background-size: 100%;width: 60%;}
  .top_pd{background: url(top_pd_01.png?t=1786093585875)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=1786093585875)top center no-repeat;background-size: 100%;}
.fixarea .fix_top a::before{background: url(fixed_Area_top-main.png?t=1786093585875)top center no-repeat;background-size: 100%;}

.ts_03 .Area_logo a::before{display: block;background: url(logo-2.png?t=1786093585875)top center no-repeat;background-size: 100%;}
.ts_03 .fixarea .fix_top a::before{background: url(fixed_Area_top-main-2.png?t=1786093585875)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=1786093585875);
  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 (max-width: 767px){
 .Area_Department.withBG2 {
  position: relative;
  padding: 0 0 3vw 0;
}
}

 @media screen and (max-width: 767px){
  .NavArea_tabbar { padding-bottom: 5vw;}
  .hero-title .md-text{font-size: 5vw;}
  }
    
  @media screen and (min-width:768px){
  .Area_coupon { margin-bottom: 36px;}
  }
  @media screen and (max-width: 767px){
  .Area_coupon { margin-bottom: 4vw; }
  .Area_coupon .PD_layout .PD_img {padding: 0em;}
  }
  
  .Area01 .PD_layout ul::after { background: none;}
  /*一日激殺價*/
  .Area01  {z-index: 22;background: linear-gradient(181deg, #957330 0%, #3e3018 100%);border-radius: 10px;border: 1px solid #ffebc7;margin-top: 50px;margin-bottom: 50px;}
  .Area01 .bg {z-index: 0;position: absolute; width: 68%; left: -42px; top: 22px; }
  .Area01 .box {margin: 0 0 0 120px; position: relative;}
  .Area01 .Area_swiper {padding: 30px 0;}
  
  @media screen and (max-width: 767px){
    .Area01  {z-index: 22;background: linear-gradient(181deg, #957330 0%, #3e3018 100%);border-radius: 10px;border: 1px solid #ffebc7;margin: 5vw 2vw;}
    .Area01 .bg { width: 48%; position: absolute; left: -5vw; top: 5vw;  z-index: 10; }
    .Area01 .box {margin: 4vw 0 4vw 12vw;}
    .Area01 .Area_swiper {padding: 0;}
    .Area01 .Area_swiper_box{ padding-bottom:4vw;}
    /* .Area_swiper_box .swiper-pagination {bottom: -1vw !important;} */
  }



/* 輪播BN */
.BN .Area_swiper_box .PD_layout li, .Area_swiper_box .PD_layout li .PD_img img {
  border-radius: 10px !important;
}
@media screen and (max-width:767px){
.BN .PD_layout ul{height: 26vw;}
}

/* 郵票 */
.Area_hot .layout_text ul { grid-gap: 0 !important ; padding: 0 !important ; }
.Area_hot .layout_hot_tt ul { padding: 0 !important ;}
@media screen and (min-width: 768px) {
.Area_hot .layout_hot_tt {position: absolute;width: 7%;left: 10px;padding-top: 68px;}
.Area_hot .Area_swiper { padding-left: 90px ; }
.Area_hot .layout_hot {/* margin-bottom: 20px ; */}
.Area_hot .layout_photo ul li { background-color: transparent ; background-image: url(hot_bn_bg.png?t=1786093585875); background-size: 100% ;background-repeat: no-repeat ; height: 385px ; border-radius: 0 !important ;  }
.Area_hot .hot_top { position: absolute ; margin-top: -4px ; }
.Area_hot .layout_photo .PD_logo { position: absolute ; right: 0 ; bottom: 0 ; width: 20% ;  }
.Area_hot .layout_photo ul li h3{ color: #745424 ; font-size: 30px; margin-top: -5px ; }
.Area_hot .layout_photo ul li h4{ color: #000 ; font-size: 25px; margin-top: -13px ; }
.Area_hot .layout_photo .PD_img img { margin: 35px 0 0 ; width: 95% ; }
}
@media screen and (max-width:767px){
.Area_hot .layout_hot_tt {position: absolute;width: 8%;left: 2vw;padding-top: 8vw;}
.Area_hot .Area_swiper { padding-left: 12vw ; }
.Area_hot .layout_hot { margin-bottom: 0 ; }
.Area_hot .hot_top { position: absolute ; left: 0vw;}
.Area_hot .layout_photo ul li { border-radius: 2vw ; background: transparent ; }
.Area_hot .layout_photo .PD_logo { position: absolute ; right: 0 ; bottom: 0 ; width: 20% ; pointer-events: none ;  }
.Area_hot .layout_photo .PD_into { padding-bottom: 2vw ; }
.Area_hot .layout_photo ul li { background-color: transparent ; background-image: url(hot_bn_bg.png?t=1786093585875); background-size: 100% ;background-repeat: no-repeat ; height: 46vw ; border-radius: 0 !important ;  }
.Area_hot .layout_photo ul li h3{color: #745424;font-size: 17px;margin-top: 27.5vw;}
.Area_hot .layout_photo ul li h4{ color: #000 ; margin-top: -2vw ; }
.Area_hot .layout_photo .PD_img { position: absolute ; top: 3vw ; }
.Area_hot .layout_photo .PD_img img { border-radius: 0 !important ; padding: 0 ; }
.Area_hot .Area_swiper_box .swiper-pagination { bottom: 2vw !important ; }
.Area_hot .Area_swiper_box .swiper-pagination-bullet { width: 6px ; height: 6px ; }
}

    
/* BTN */

  .BTN .PD_layout[data-pd-li=BN] ul, .PD_layout[data-pd-li=BN-AWD] ul, .PD_layout[data-pd-li=PDBN] ul {padding: 0;}
  .BTN {padding-bottom: 25px;} 
  @media screen and (max-width:767px){
    .BTN {padding-bottom: 2vw;} 
  }
    
  /*時尚mo店+*/
  .Area06 .box{position: relative; } 
  .Area06 .box .title{ position: absolute;  width: 20%; top: -53px; left: -51px;}
  .Area06 .box6_swiper{ position: absolute; right: 80px;}
  .Area06 .Area05PD {margin-left: 84px;}
  .Area06 .Area05PD .PD .js-PD_txt2{ display: none;}
  .Area06 .morebtn { width: 70%; margin-top: 10px;}
  .Area06 .motitle {position: absolute;top: 50px;left: 92px;}
  .Area06 .motitle img { width: 100%;}
  @media screen and (max-width:767px){
  .Area06 .box{ padding-left: 0; padding-right: 0; } 
  .Area06 .Area05PD {margin-left: 13vw;}
  .Area06 .motitle {position: absolute;top: 4vw;left: 9vw;}
  .Area06 .box .PD_layout ul li .PD_into{ padding: 1vw 2vw;}
  .Area06 .box .title{ width: 15%; top: 0; left: 0;}
  .Area06 .box6_swiper{ right: -18vw;}
  .Area06 .Area05PD ul li{ padding: 0;}
  .Area06 .morebtn { width: 100%;}
  .Area06 .boxtop {margin-bottom: 4vw;margin-top: -20vw;}
  }
    
    
  /* 區標01 */
  .title {height: 139px; }
  .title .PD img{ width: 100%!important;}
  .title  .PD_layout.PD_layout-D3_01 .PD h3 {top: 49%;color: #ffffff;/* position: absolute; */font-style: italic;left: 142px;font-size: 50px;}
  .PD_layout .PD h3 span {padding-right: 10px;}
  .title .PD_layout-D3_01 .PD_img{position: relative;left: -58px;}
  @media screen and (max-width:767px){
  .title {height: 17vw;}
  .title .PD_layout-D3_01 {margin-bottom: 0vw;}
  .title .PD_layout-D3_01 .PD_img{position: relative;left: 0;}
  .title .PD img{ width: 113% !important; left: -5vw; position: relative;}
  .title .PD_layout.PD_layout-D3_01 .PD h3 {font-size: 1.5em;top: 50%;color: #ffffff;position: absolute;left: 20vw;font-size: 6vw;font-style: normal;}
  .PD_layout .PD h3 span {padding-right: 0;}
  }
     
  /* 區標02 */
  .title02 { height:155px;}
  .title02 .PD img{ width: 100%!important;}
  .title02  .PD_layout.PD_layout-D3_01 .PD h3 {top: 50%;color: #ffffff;}
  @media screen and (max-width:767px){
  .title02 { height:20vw;}
  .title02 .PD_layout-D3_01 {  margin-bottom: 0vw;}
  .title02 .PD img{ width: 113% !important; left: -5vw; position: relative;}
  .title02 .PD_layout.PD_layout-D3_01 .PD h3 {   font-size: 6vw; top: 50%;color: #ffffff;}
    
  }

/*Phone錨點*/
.Area_floorPD_NavArea_tabbar {margin: 0 auto 5vw ;width: 94%;padding-bottom: 30px;
}
.Area_floorPD_NavArea_tabbar.cate-fixed { width: 100%;}
.Area_floorPD_NavArea_tabbar .Nav_box { border-radius: 8px;
-webkit-box-shadow: -1px 0 10px rgba(150, 150, 150, 0.2);
box-shadow: -1px 0 10px rgba(150, 150, 150, 0.2);
}
.Area_floorPD_NavArea_tabbar .Nav li {overflow: visible;}
.Area_floorPD_NavArea_tabbar.cate-fixed .Nav_box {
border-radius: 0;
background-color: rgba(255, 255, 255, 1);
-webkit-box-shadow: -1px 0 10px rgba(150, 150, 150, 0.2);
		box-shadow: -1px 0 10px rgba(150, 150, 150, 0.2);
}
	  
@media screen and (min-width: 768px){
.Area_floorPD_NavArea_tabbar .Nav ul {display: flex;justify-content: center;}
}
	   
@media screen and (max-width:767px){
.Area_floorPD_NavArea_tabbar {padding-bottom: 3vw;}
}


.Area_boxstyle.Area_boxstyle--hasBackdrop::after{background: none;}

/*按鈕*/
.Area07 .PD_layout{width: 85%;}
@media screen and (max-width: 767px){
  .Area07 .PD_layout{width: 96%;}
  }
    
