@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;}
.WRAPPER img { border:0px; vertical-align:top;}
.WRAPPER a { text-decoration:none;}
		@media screen and (max-width:767px){
		.WRAPPER { min-width: inherit; padding-bottom:0px; }
		.WRAPPER img {  width:100%;  height:auto;}
	}
	
	
/*背景*/
@media screen and (min-width:767px){
.pctop_bg{ z-index:0; position:absolute;top:0; width:100%; min-width:1220px; height:100%; background:url(top_bg.png?t=1779092806243) no-repeat center top ; pointer-events: none;}
.m_bg{z-index: -1;position:absolute;top: 0;width:100%; height: 100%;background:repeat-y center top;background-size: 100%;pointer-events: none;}
}

@media screen and (max-width:767px){
.mtop_bg{z-index:0;position:absolute;top: 10vw;width:100%;max-width:960px;height: 100%;background:no-repeat center top;background-size: 100%;pointer-events: none;}
.m_bg{z-index: -1;position:absolute;top: 0;width:100%; max-width:960px; height: 100%;background:repeat-y center top;background-size: 100%;pointer-events: none;}
}


/*背景*/
.bgtop  { z-index:0; position:absolute; top:0; left:0; width:100%; min-width:1220px; height:100%;}
	@media screen and (max-width:767px){
		.bgtop { min-width: inherit; background-size:100%;}
	}
	

/*區塊_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;}
	@media screen and (max-width:767px){
		.Area1220 { width:100%;}
		.Area960 { width:100%;}
}



.Area_top {}
	@media screen and (max-width:767px){
		.Area_top { height: auto;}
	}


/*黏人精*/
.Area_hammerAD { z-index: 2; position: fixed; bottom: 0; right: 0;}
.Area_hammerAD .box { position: relative; margin-right: 10px; opacity: 1;}
.Area_hammerAD img { width: 100%; height: auto; position: absolute; top: 0; left: 0;}
.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;}
.Area_hammerAD .Ahammer_text { position: absolute; z-index: 2; display: flex; align-items: center; justify-content: center; width: 90%; color: #000; font-family: "Century Gothic","Noto Sans CJK TC"; font-weight: 700;}
.Area_hammerAD .Ahammer_black .img_0, .Area_hammerAD .img_1 { filter: brightness(0%);}
.Area_hammerAD .Ahammer_black .img_1 { filter: none;}
.Area_hammerAD .Ahammer_black .Ahammer_text { color: #fff;}
@media screen and (min-width:768px){
  .Area_hammerAD { position: fixed; z-index: 300; left: 50%; right: auto; bottom: 50px; display: block; width: 210px; height: 200px; transform: translateX(618px) translate3d(0,200px,0);}
  .Area_hammerAD .closeButton a { top: 0; right: 0;}
  .Area_hammerAD .Ahammer_text { font-size: 2.3em; line-height: 1em; height: 1em; top: 40px;}
}
@media screen and (max-width:767px){
  .Area_hammerAD { display: block; width: 26%; transform: translate3d(0px, -215px, 0px) !important;}
  .Area_hammerAD .closeButton a { top: 1vw; right: 1vw;}
  .Area_hammerAD .Ahammer_text { font-size: 1.5em; line-height: 1.5em; height: 1.5em; top: 3.6vw;}
}





/*版頭區塊*/
.Area_title .sub00 .PD_layout ul li{background-color: transparent;}
.Area_title .toppdx2 .PD_layout ul li{background-color: transparent;}


@media screen and (min-width:768px){
.Area_title {height: 500px;}
/* 超大牌log */
.Area_title .mainlogo{position: absolute;width: 20%;top: 160px;left: 87px;}
/* 4個logo */
.Area_title .maintit {position: absolute;width: 25%;top: 154px;left: 323px;}
/* 副標 */
.Area_title .sub00{position: absolute;width: 42%;top: 241px;left: 79px;}
.Area_title .sub00 .Area_swiper_box .PD_layout li .PD_img img{border-radius: 0;}
/* 日期 */
.Area_title .maindate{position: absolute;width: 29%;top: 34px;right: 181px;}
.Area_title .maindate ul{padding: 0; grid-gap: 0;}
  
}



@media screen and (max-width:767px){
.Area_title {height: 51vw;}
/* 超大牌log */
.Area_title .mainlogo{position: absolute;width: 24%;top: 14.5vw;left: 2vw;}
/* 文案 */
.Area_title .maintit {position: absolute;width: 38%;top: 13.5vw;left: 26vw;}
/* LOGO */
.Area_title .sub00{position: absolute;width: 53%;top: 24.5vw;left: 1vw;}
.Area_title .sub00 .Area_swiper_box .PD_layout li .PD_img img{border-radius: 0;}

/* 日期 */
.Area_title .maindate{position: absolute;width: 56%;top: 2.5vw;right: 0vw;}
.Area_title .maindate ul{padding: 0; grid-gap: 0;}


/*提醒我按鈕*/
a.mo_remind_btn {z-index:99;position: absolute!important;left: 0vw;top: 44vw;width: 16%;}


}


                    
/** 倒數 **/
.TimerNick {position: absolute;z-index:0;display:inline-block;padding-right:14px;height:96px;text-align:right;top: 328px;left: 95px;}
.TimerNick .FontStyle {display:inline-block;margin:0px 0 0 0;padding:0;border:0px;width:60px;font: bold 35px/38px Century Gothic;color:#b9cbd8;/*text-shadow:1px 1px 0px #fff;*/letter-spacing: 1px;text-align:right;background:transparent;}
.TimerNick div:nth-of-type(2),
.TimerNick div:nth-of-type(3) { width:60px;}
.TimerNick span { padding-left:2px; font: bold 16px/38px "微軟正黑體","Microsoft JhengHei", Arial, Helvetica; letter-spacing: -0.05em;color: #b9cbd8;}
@media screen and (max-width:767px){
.TimerNick {z-index:2;position: absolute;top: 32vw;left: 3vw;display:inline-block;height:0;padding-bottom:13%;overflow:hidden;text-align:right;background-size:100%;}
.TimerNick .FontStyle {display:inline-block;margin:0px 0 0 0;padding:0;border:0px;width: 6vw;font: bold 5vw/11vw Century Gothic;color: #b9cbd8;/*text-shadow:1px 1px 0px #fff;*/letter-spacing: 0px;text-align:right;background:transparent;}
.TimerNick div:nth-of-type(2),
.TimerNick div:nth-of-type(3) {width: 5vw;}
.TimerNick span {padding-left:1vw;font: bold 4vw/11vw "微軟正黑體","Microsoft JhengHei", Arial, Helvetica;letter-spacing: -0.05em;color: #b9cbd8;}
}
          



/* 區標 */
@media screen and (min-width:768px){
/* 大區標 */
.PD_layout.txt01{margin-bottom: 0px;z-index: 2;}
.PD_layout.txt01 .PD h3{color: #ffffff;font-size: 31pt;margin-top: 26px;}
}

@media screen and (max-width:767px){
/* 大區標 */
.PD_layout.txt01{z-index: 2;margin-bottom: -2vw;}
.PD_layout.txt01 .PD h3{color: #ffffff;font-size: 18pt;margin-top: 3.5vw;width: 100%;}
}


/* 01_鈔省攻略 */
@media screen and (min-width:768px){
.Area_dec{position:absolute; width: 100%; top:0; mix-blend-mode: screen;}
.Area_active{margin-bottom: 20px;}
.Area_active .PD_layout{padding-top: 120px;}
}
@media screen and (max-width:767px){
.Area_active{margin-bottom: 0vw;}
.Area_active .PD_layout{padding-top: 12vw;}
.Area_dec{position:absolute; width: 100%; top:0; mix-blend-mode: screen; }
}



/* 02_登記活動 */

/*登記贈品文案顏色*/
.danji_box ul li .activityText .gifts span { color: #11387d;}             
.Area_danjiall .box{background-color: #fff4ed;margin: 0 auto;}

@media screen and (min-width:768px){
.Area_danjiall{margin-bottom: 20px;}
.Area_danji {width: 93%;}
}
@media screen and (max-width:767px){
.Area_danjiall{margin-bottom: 1vw;}
.Area_danji {width: 96%;}
}

/* 03_一日限定 大牌主打 */
@media screen and (min-width:768px){
.Area_oneday{margin-bottom: 50px;}
}
@media screen and (max-width:767px){
.Area_oneday{margin-bottom: 3vw;}
.Area_oneday .pdx10{width: 96%;}
}


/* 05_按鈕 */
@media screen and (min-width:768px){
.Area_btn{margin-bottom: -20px;}
}
@media screen and (max-width:767px){
.Area_btn{margin-bottom: -4vw;}
}


/* 06_精選品牌 */
@media screen and (min-width:768px){
.Area_brand{}
.Area_brand .btnx2{width: 90%;}
}

@media screen and (max-width:767px){
.Area_brand{margin-bottom: 5vw;}
.Area_brand .btnx2{width: 85%;}
.Area_brand .btnx2 ul{grid-gap: .7em;}
}







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