/* 各頁面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=1786332306251) 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=1786332306251) top center / 100% no-repeat, url(Area_boxstyle_hasbg_bottom-B.png?t=1786332306251) bottom center / 100% no-repeat, url(Area_boxstyle_hasbg_bottom-B.png?t=1786332306251) 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=1786332306251) top center / 100% no-repeat, url(m_Area_boxstyle_hasbg_bottom-B.png?t=1786332306251) bottom center / 100% no-repeat, url(m_Area_boxstyle_hasbg_bottom-B.png?t=1786332306251) 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=1786332306251)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=1786332306251)top center no-repeat;background-size: 100%;width: 60%;}
  .top_pd{background: url(top_pd_01.png?t=1786332306251)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=1786332306251)top center no-repeat;background-size: 100%;}
.fixarea .fix_top a::before{background: url(fixed_Area_top-main.png?t=1786332306251)top center no-repeat;background-size: 100%;}

.ts_03 .Area_logo a::before{display: block;background: url(logo-2.png?t=1786332306251)top center no-repeat;background-size: 100%;}
.ts_03 .fixarea .fix_top a::before{background: url(fixed_Area_top-main-2.png?t=1786332306251)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=1786332306251);
  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;
  }
}










#eWriterBtn_bt_B_000_1000 { margin-left: 163px!important; z-index: 99!important; }


.PD_layout ul::after {  position: relative; width: 100%; background: url(Area_bg.png?t=1786332306251) no-repeat center; background-size: 100%; }


.acty .PD_layout {overflow: hidden;}
.acty .swiper-container-horizontal>.swiper-pagination-bullets {left: 24px;}


@media screen and (max-width:767px){
.Area .Area_swiper_box { padding-bottom: 5vw; }
.acty .Area_swiper_box {padding-bottom:9vw;}
.acty .swiper-container-horizontal>.swiper-pagination-bullets {left: 3vw;}
}


/* 今日主打 */
.Area_Department .PD .PD_into p {height: 2em; line-height: 2em; color: #d93c85; bottom: 0; left: 0;  width: 100%; background-color:transparent;}
.Area_Department .PD .PD_into .Price { color: #d93c85; font-size: 30px;}
.Area_Department .PD .PD_into .money{ color: #d93c85;}

.Area_Department .PD .PD_into h3 { font-size: 15px; margin-bottom: .25em; max-height: 1.9em;  line-height: 1.9em;}

.Area_Department .PD .PD_into {background-color:transparent;}

.Area_Department .swiper-container-horizontal>.swiper-pagination-bullets {top: -25px; position: relative; }



@media screen and (max-width:767px){
/* .Area_Department.withBG2 .Area_swiper { background-size: 121%;} */

.Area_Department .swiper-container-horizontal>.swiper-pagination-bullets {top: -4vw; position: relative; }

.Area_Department.withBG2 {margin-bottom: -5vw;}
.Area_Department.withBG2::after {height: 77vw; width: 126%;}

.Area_Department.withBG2 .Area_swiper {padding: 8vw 0vw 0 15vw;}

}



/*Area01*/
.Area01 {margin-top: 40px;}
.Area01 .sale .PD_layout[data-pd-li=BN] ul {grid-gap: 54px;}

.step{margin: auto auto 0;height: auto;padding-bottom: 30px;}


    @media screen and (max-width:767px){
    .Area01 {margin-top: -4vw;}

    .step{position: relative;padding:0 0 5vw 0;}
    }



/** 倒數 **/
.TimerNick3 {z-index:0;display:inline-block;height: 100%;text-align: center;padding-bottom: 2%;}
.TimerNick3 .FontStyle3 {display:inline-block;border:0px;width:60px;font: bold 35px/38px Century Gothic;color:#ffdf74;text-align: center;/*background: #ffffff;border-radius: 25px; */}
.TimerNick3 div:nth-of-type(2),
.TimerNick3 div:nth-of-type(3) { width:60px;}
.TimerNick3 span {padding-left:2px;font: bold 25px/38px  "微軟正黑體","Microsoft JhengHei", Arial, Helvetica;letter-spacing: -0.05em;color: #ffffff;}
@media screen and (max-width:767px){
.TimerNick3 {z-index:2;position: relative;left:0%;display:inline-block;margin:0;padding-right:0%;height: 100%;padding-bottom: 0;overflow:hidden;text-align:center;background-size:100%;}
.TimerNick3 .FontStyle3 {display:inline-block;margin:0px 0 0 0;padding:0;border:0px;width:10vw;font: bold 6vw/8vw Century Gothic;color: #ffdf74;letter-spacing:-1px;text-align:center; /*background-color: #ffffff;border-radius: 0.5em; */ }
.TimerNick3 div:nth-of-type(2),
.TimerNick3 div:nth-of-type(3) { width:9vw;}
.TimerNick3 span {padding-left:1vw;font: bold 4vw/8vw  "微軟正黑體","Microsoft JhengHei", Arial, Helvetica;letter-spacing: -0.05em;color: #ffffff;}
}  





/** 日韓美妝大賞 **/
.Area04 {margin-bottom: 28px;}
.Area04 .title2 .PD img{ width: 100%!important;}
.Area04 .PD_layout.PD_layout-D3_01 .PD h3 {top: 64%; color: #000000; font-size: 41px;}
.Area04 .Area_boxstyle_box {padding-right: 0; padding-left: 0; }
@media screen and (max-width:767px){
    .Area04 {margin-bottom: 0vw;}
    .Area04 .PD_layout-D3_01 {  margin-bottom: -4vw;}
    .Area04 .title2 .PD img{ width: 154% !important; left: -24vw; position: relative; top: -4vw; }
    .Area04 .PD_layout.PD_layout-D3_01 .PD h3 {   font-size: 1.5em; top: 44%; color: #000000;}
    }


.Area04 .box2{position: relative;  margin-bottom: 60px;} 
.Area04 .box .title{ position: absolute; width: 17.5%; top: -53px; left: -48px; }
.Area04 .title .PD img{ width: 100%!important;}
.Area04 .Area_swiper {  margin-left: 80px;  }

@media screen and (max-width:767px){
    .Area04 .box2{position: relative;  margin-bottom: 10vw;} 
    .Area04 .box .title{ position: absolute; width: 16.5%; top: -9vw; left: 0vw; }
    .Area04 .title .PD img{ width: 100%!important;}
    .Area04 .Area_swiper {  margin-left: 15vw;  }
}



/** 人氣大牌推薦 **/
.Area02 .PD_layout.PD_layout-D3_02 ul li .PD h3 {width: 43%;}
.Area02 .title { margin-top: 50px; }

@media screen and (max-width:767px){
.Area02 .Area_boxstyle_box {padding-left: 0; padding-right: 0;}
.Area02 .title { margin-top: 7vw; }
}





/** 日本必買美食 **/
.Area03 .title { margin-top: 50px; }
.Area03 .title2 .PD_wrapper,.Area03 .title3 .PD_wrapper { margin-bottom: -21px; }
.Area03 .title2 .PD img,.Area03 .title3 .PD img { width: 100%!important;}

.Area03 .PD_layout.title2 .PD h3 {top: 50%; color: #000000; font-size: 41px;}

/* .Area03 .pdborder2 { border: 3px solid #ffd634; box-shadow: 0px 1px 0 0 #ffd634; border-radius: 21px; }
.Area03 .pdborder3 { border: 3px solid #dd1270;  box-shadow: 0px 1px 0 0 #dd1270; border-radius: 21px; } */


@media screen and (max-width:767px){
    .Area03 .title { margin-top: 8vw; }
    .Area03 .title2 .PD_wrapper,.Area03 .title3 .PD_wrapper { margin-bottom: -8vw; }
    .Area03 .title2 .PD img,.Area03 .title3 .PD img{ position: relative; top: -4.5vw; }

    .Area03 .PD_layout.title2 .PD h3 {   font-size: 1.3em; top: 23%;color: #000000;}

    /* .Area03 .pdborder2 { border: 1vw solid #ffd634; border-radius: 4vw; }
    .Area03 .pdborder3 { border: 1vw solid #dd1270; border-radius: 4vw; } */


    }




/*商品分類X8*/
.Area05 {margin: 60px auto 20px auto;}
.Area05 .PD_layout{ width: 90%;}
.Area05 .PD_layout[data-pd-li=BN] ul { grid-gap: 28px;}

@media screen and (max-width:767px){
    .Area05 {margin: auto auto 5vw auto ;}
    .Area05 .PD_layout{ width: 100%;}
    .Area05 .PD_layout[data-pd-li=BN] ul { grid-gap: 2vw; padding: 0;}
    
    }




.Area06 .Area_boxstyle_box {padding-left: 0; padding-right: 0;}