@charset "utf-8";
/*基本*/
body {margin: 0; padding:0; background-color: #ececec;}

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


/*全BOX版面*/
.WRAPPER { position: relative;margin: 0 auto; padding: 0;	width:100%; min-width:1220px; overflow: hidden;font-family:"微軟正黑體","Microsoft JhengHei",Helvetica;}
.WRAPPER img { border:0; vertical-align:top;}
.WRAPPER a { text-decoration:none;  display:inline-block;}
.WRAPPER .Area_top{position: relative; }
.WRAPPER .mainArea { position:relative; display:block; margin:0 auto; padding: 0; width:1220px;}
@media screen and (max-width:767px){
.WRAPPER { padding-bottom:0px; margin:0 auto; display: block; min-width:100%; /*background-image:url(mb_bg.jpg?t=1756384923744); background-repeat:repeat-y;background-position:center bottom; background-size:100%;z-index: 0;*/}
.WRAPPER .mainArea { position:relative; display:block; margin:0 auto; padding: 0; width:100%;  }
}


.WRAPPER .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;}
.WRAPPER .go_bt:hover { 
   filter:brightness(110%);
  -webkit-transform:translateY(10px);
     -moz-transform:translateY(10px);
      -ms-transform:translateY(10px);
       -o-transform:translateY(10px);
          transform:translateY(10px);}

/*滑過會亮*/	
.WRAPPER .go_bt3 {
  -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;}
.WRAPPER .go_bt3:hover { 
   filter:brightness(105%);
  -webkit-transform:scale(1.08);
     -moz-transform:scale(1.08);
      -ms-transform:scale(1.08);
       -o-transform:scale(1.08);
          transform:scale(1.08);
		  }


/*PC背景*/
@media screen and (min-width:767px){
  .bg_deco00 { z-index:-21; position:absolute; top:0; left:0; width:100%; min-width:1220px; height:100%; background-repeat:repeat-y; background-position:center top;  }
  .bg_deco01 { z-index:-20; position:fixed; top:0; left:0; width:100%; min-width:1220px; height:100%; background-repeat:no-repeat; background-position:center top;  }
	.bgtop01 { z-index:-15; position:absolute; top:0; left:0; width:100%; min-width:1220px; height:100%; background-repeat:repeat-y; background-position:center top; }
	.bgtop_repeat { z-index:-30; position:absolute; top:0; left:0; width:100%; min-width:1220px; height:100%; background-repeat:repeat-y; background-position:center top; pointer-events:none;}
	.pc_fixbn { z-index:-14; position:absolute; top:0; left:0; width:100%; min-width:1220px; height:100%; background-repeat:no-repeat; background-position:center bottom; pointer-events:none;}
	
}

/*mb背景*/
@media screen and ( max-width:767px) {
	.m_bg01 { z-index:0; position:absolute; top:0; left:0; width:100%; height:100%; background-repeat:repeat-y; background-position:center top; background-size:100%; }	
}


/*區塊_all*/
.Area { position: relative; margin:0 auto; padding:0; text-align:center;  }
.Area .box_bg{position:absolute;top:0;left: 0;z-index: 0;} 
.Area1220 { margin:0 auto; width:1220px;}
.Area960 { margin:0 auto; width:960px;}

	@media screen and (max-width:767px){
	.Area .go_bt:hover { 
		-webkit-transform:none;
		 -moz-transform:none;
			-ms-transform:none;
			 -o-transform:none;
				transform:none;}
	.Area1220 { width:100%;}
	.Area960 { width:100%;}
	.Area img{ width:100%;}
	.Area { position: relative;}

	}




/*版頭區塊*/
@media screen and (min-width:768px){
	.Area_title {height:1105px;z-index: 20;}
	.Area_title .pcin {position: absolute; top:0px;left: -54px;z-index: -1;pointer-events: none;}
	.Area_title .sparking01 {position: absolute; top:200px;left: 84px;z-index: -1;animation-delay:0.5s;}
	.Area_title .sparking02 {position: absolute; top:65px;left: 1080px;z-index: -1;}
	.Area_title .eye {position: absolute; top:32px;left: 571px;z-index: 10;}
	
}

@media screen and (max-width:767px){
	.Area_title {height: 123vw;z-index: 20;}
	.Area_title .pcin { position: absolute; top:0; z-index: -8; width: 100%;}	
	.Area_title .sparking01 {position: absolute; top:17vw;left: 4vw;z-index: 0;width: 8%; pointer-events: none;}
	.Area_title .sparking02 {position: absolute; top:3vw;left: 90vw;z-index: 0;width: 6%; pointer-events: none;}
	.Area_title .eye {position: absolute; top:3.7vw;left: 46.5vw;z-index: 10;width: 11%; pointer-events: none;}

}

/*主標微調(線上入稿)*/
.Area_title .toptitle { position: absolute; top:35px; left:80px; width:15%; z-index: 5;}
.Area_title .toptitle .main ul li {width: 820%;top: -9px; left: 30px;}
.Area_title .date ul li {position: absolute; width: 100%;top: -151px; left:810px;}

.Area_title .PD_layout .PD img { width: 100%;}
.Area_title .toptitle .js-PD_url {pointer-events: none;}
.Area_title .PD_layout .PD_slide:hover {transform: translateY(0px);box-shadow: none;}
@media screen and (max-width:767px){
.Area_title .toptitle { position: absolute; top:0vw;left:0; width:21%;height: auto; z-index: 5;}	
.Area_title .toptitle .main ul li {position: absolute;width: 480%;top: 2vw; left: 0vw;}
.Area_title .toptitle .date ul li {position: absolute;width: 105%;top: 17vw; left: 77vw;}

 }






/*版頭背景*/
.pdbg_a {width: 1341px;height: 1025px; position: absolute;top:0px;left: -60px;overflow: hidden;z-index: -10;}
.pdbg_a .PD_layout ul,.pdbg_b .PD_layout ul,.pdbg_d .PD_layout ul {display: flex;padding: 0;grid-gap: 0;}
.pdbg_a .PD_layout .PD img,.pdbg_b .PD_layout .PD img,.pdbg_d .PD_layout .PD img { width: 100%; }
@media screen and (max-width:767px){
.pdbg_a {width: 100%;position: absolute;top: 0vw;left: 0;overflow: hidden;z-index: -10;}	
}

/*版頭品輪播*/
@media screen and (min-width:768px){
.Area_title .topPD {position: absolute; top:340px;left: 0px;}
.Area_title .topPD .Area_swiper_box {margin: 0 auto 0;padding:3% 0 2%;overflow: hidden;grid-gap: 0;}
.Area_title .topPD .Area_swiper_box .PD_layout li{height: auto /*497px*/;}

}
@media screen and (max-width:767px){
.Area_title .topPD  {position: absolute; top:0vw;width: 100%;}
.Area_title .topPD .Area_swiper_box {margin: 0 0 3% 4%;padding: 34.5% 0 6%;} 
.Area_title .topPD .Area_swiper_box .PD_layout li{height: 66vw;}

}






/*活動BNx1(線上入搞)*/
@media screen and (min-width:768px){
.Area_activity { position: relative; height: 215px; margin-bottom:0;}
.Area_activity .layout_activity {top:0;}
.Area_activity .layout_activity ul {width:80%;margin:0 auto; padding:17px 0 0 0; }
.Area_activity .layout_activity ul li {padding:0;margin:0 auto;}
.Area_activity .layout_activity ul li img {width:70%;}
}
@media screen and (max-width:767px){
.Area_activity .layout_activity{width:100%; height: 18vw; margin:0; top: 0;padding:0;background: url("mb_02.jpg?t=1756384923745") center top/ 100% no-repeat;}
.Area_activity .layout_activity ul {width:80% ;margin:0 auto;padding:1.5% 0 0 0;}
.Area_activity .layout_activity ul li {margin: 0;}
.Area_activity .layout_activity ul li img {width:88%;}
}


/*折價劵(線上入搞)*/
@media screen and (min-width:768px){
.Area_coupon {margin-bottom: 70px}
.Area_coupon .box ul li img{width:95%;}
}
@media screen and (max-width:767px){
.Area_coupon {background-color: #d6d6d6; padding-bottom:2vw;}
.Area_coupon .box ul li img{width:96%;}

}


/*登記贈品文案顏色*/
.Area_danji .danji_box ul li .activityText .gifts span { color: #fecd56;}     
/*登記*/
.Area_book0 { width:1220px; height:auto; position:relative; margin:0 auto;box-sizing:border-box; padding:0 ; margin-bottom:50px ; }
.Area_book0 .box1 { background:url(Area_gift_bg_02.png?t=1756384923745) top center repeat-y; }
.Area_book0 .Area_danji { top:0;}
.Area_book0 .danji_txt img { position: relative; padding: 2%; width: 45%;}

@media screen and (max-width:767px){
.Area_book0 { width:100%;height:auto; padding: 0;  background-size:100%; margin-bottom:3vw; }
.Area_book0 .Area_danji .danji_box {padding-top: 0%;}
.Area_book0 .box1 { background:url(mb_05.png?t=1756384923745) top center repeat-y ; background-size:100%;  }
.Area_book0 .Area_danji { width:92%; top:0;  margin: 0 auto;}
.Area_book0 .danji_txt img { width: 55%;}
}
/*PC+MB_登記說明文(不會有間距)*/
.Area_book0 .warningTxt h3 {color: #000; padding:0; }






/*作圖區*/
.layout_brand .PD_slide:hover { box-shadow: none!important; }
.layout_brand .PD p del { display: none; }
.layout_brand .PD p {display: block!important;}
.layout_brand .PD:hover h4 {color: #224469!important;}	
.layout_brand .PD_slide {height: 100%;padding:0;margin: 0 auto; background: url("Area02_BNbg.png?t=1756384923745") center top / 100% no-repeat scroll;}
.layout_brand .PD_logo {width: 100%;padding: 0 27% 2%;display: block!important;}

@media screen and (min-width:768px){
	.layout_brand {padding: 0;}
	.layout_brand .PD_slide:hover { box-shadow:unset;}
	
/*//	.layout_brand ul li { position: relative; background-color: transparent; transition: 0.3s ease; filter: brightness(0.5);}
//	.layout_brand ul li.swiper-slide-active {filter: brightness(1);}
//	.layout_brand  ul.PD_wrapper li{margin: 0;margin-top: 50px;transition: 0.3s ease;filter: brightness(0.5); }
//	.layout_brand  ul li.swiper-slide-active {margin-top: 0;filter: brightness(1);}	
*/}

@media screen and (max-width:767px){
	.layout_brand ul {padding-left:0;padding-right:0;padding-top: 2vw;height: 83vw;}
	.layout_brand li {width: 100%; }
/*	.layout_brand ul li { position: relative; background-color: transparent; transition: 0.3s ease; filter: brightness(0.5);}
	.layout_brand ul li.swiper-slide-active {filter: brightness(1);}
	.layout_brand ul.PD_wrapper li{margin: 0;margin-top: 4vw;transition: 0.3s ease;filter: brightness(0.5);}
	.layout_brand ul li.swiper-slide-active {margin-top: 0;filter: brightness(1);}	
*/}






/*經典必Buy作圖區8品*/
@media screen and (min-width:768px){
	.Area_item {height: auto;padding-bottom:0;}
	.Area_item .PD_layout .PD_slide:hover { box-shadow: 0 0 0 rgba(0, 0, 0, 0); }	
		
	/*版頭公版上下標.關閉*/
	.Area_item .PD_layout.layout_item .imgTag{display: none !important;}
	.Area_item .PD_layout.layout_item .imgTagBottom{display: none !important;}
	.Area_item .PD_layout.layout_item .prdImgWrap .imgTagRectangle{display: none !important;}
		
	/*作圖區*/
	.Area_item .PD_layout.layout_item .PD p b {color: #19689e;background-color: #ffea00;padding: 0 3%;border-radius: 5em;font-size: 1.1em;margin: 0 2% 0 0;}	
	.Area_item .PD_layout.layout_item .PD_slide .PD p del {position: absolute;top: 20px;left:45px;color:#ffffff;    font-size: 25px;}
	.Area_item .PD_layout.layout_item .PD p .Price {font-weight: 700;color:#ffea00;font-size: 2.7em;}
	.Area_item .PD_layout.layout_item .PD p {position: relative;top:0px;left:50px;height: 6em;padding: 2% 0 0;line-height: 1.6em;font-size:1.3em;color:#ffea00;}
	.Area_item .PD_layout.layout_item li {background: url("layout_itembg1.png?t=1756384923745") center top / 90% no-repeat scroll;}	

	.Area_item .PD_layout.layout_item li:nth-child(1){padding: 0 0% 0; background: url("event_bg1.png?t=1756384923745") center top / 80% no-repeat scroll;}	
	.Area_item .PD_layout.layout_item li:nth-child(2){padding: 0 0% 0; background: url("event_bg2.png?t=1756384923745") center top / 80% no-repeat scroll;}	
	.Area_item .PD_layout.layout_item li:nth-child(3){padding: 0 0% 0; background: url("event_bg3.png?t=1756384923745") center top / 80% no-repeat scroll;}	
	.Area_item .PD_layout.layout_item li:nth-child(4){padding: 0 0% 0; background: url("event_bg4.png?t=1756384923745") center top / 80% no-repeat scroll;}	
	.Area_item .PD_layout.layout_item li:nth-child(5){padding: 0 0% 0; background: url("event_bg5.png?t=1756384923745") center top / 80% no-repeat scroll;}	
	.Area_item .PD_layout.layout_item li:nth-child(6){padding: 0 0% 0; background: url("event_bg6.png?t=1756384923745") center top / 80% no-repeat scroll;}	
	

	.Area_item .PD_layout.layout_item {padding:0;width: 84%;}
	.Area_item .PD_layout.layout_item .PD_slide:hover {transform:translateY(-6px);}
	.Area_item .PD_layout.layout_item .PD_slide:hover { box-shadow:unset;}
	.Area_item .PD_layout.layout_item .PD_slide {height:645px;padding:0;}
	.Area_item .PD_layout.layout_item .PD_slide .PD_into {width: 88%;padding-left:0;position: absolute;left:32px;top: 383px;text-align: center;font-size: 1em;color: #fff;}
	.Area_item .PD_layout.layout_item .PD_slide .PD_img img {width:69%;margin:7% 0% 0% 15.5%;box-shadow: unset;/*border-radius: 34.5em !important;border: 7px solid #ffffff;*/}
	.Area_item .PD_layout.layout_item .PD_slide .PD_into h3 {position: relative;top:0px;left:0px;max-height: 1.8em;font-family: Noto Sans CJK TC;font-weight: bold;font-size: 2.3em;line-height: 1.6em;color:#ffffff;text-align: center;    background: transparent!important;}
	.Area_item .PD_layout.layout_item .PD_slide .PD_into h4 {font-size: 2em;color: #ffffff;text-align: center;position: relative;top:0px;left:0px;margin-bottom:0; }
	.Area_item .PD_layout.layout_item .PD_slide .PD:hover h4 { color:#ffffff;}
	.Area_item .PD_layout.layout_item .PD .PD_logo {position: relative;top:-266px;left:-6px;height: 8em; z-index: 90;border-radius: 26.5em !important;}
	.Area_item .PD_layout .PD p .money{font-size: 35px;}
	}
	
	@media screen and (max-width:767px){
	.Area_item {height:100%;padding-bottom:5vw;}
	.Area_item .PD_layout .PD_slide:hover { box-shadow: 0 0 0 rgba(0, 0, 0, 0); }	
		
	/*版頭公版上下標.關閉*/
	.Area_item .PD_layout.layout_item .imgTag{display: none !important;}
	.Area_item .PD_layout.layout_item .imgTagBottom{display: none !important;}
	.Area_item .PD_layout.layout_item .prdImgWrap .imgTagRectangle{display: none !important;}
		
	/*作圖區*/
	.Area_item .PD_layout.layout_item {padding: 0 0 0 0;}
	.Area_item .PD_layout.layout_item ul {padding-left: 2vw; padding-right: 2vw;}

	.Area_item .PD_layout.layout_item li:nth-child(1){padding: 0 0% 0; background: url("event_bg1.png?t=1756384923745") center top / 90% no-repeat scroll;}	
	.Area_item .PD_layout.layout_item li:nth-child(2){padding: 0 0% 0; background: url("event_bg2.png?t=1756384923745") center top / 90% no-repeat scroll;}	
	.Area_item .PD_layout.layout_item li:nth-child(3){padding: 0 0% 0; background: url("event_bg3.png?t=1756384923745") center top / 90% no-repeat scroll;}	
	.Area_item .PD_layout.layout_item li:nth-child(4){padding: 0 0% 0; background: url("event_bg4.png?t=1756384923745") center top / 90% no-repeat scroll;}	
	.Area_item .PD_layout.layout_item li:nth-child(5){padding: 0 0% 0; background: url("event_bg5.png?t=1756384923745") center top / 90% no-repeat scroll;}	
	.Area_item .PD_layout.layout_item li:nth-child(6){padding: 0 0% 0; background: url("event_bg6.png?t=1756384923745") center top / 90% no-repeat scroll;}	


	.Area_item .PD_layout.layout_item .PD_slide .PD_img {margin-bottom: 60%;}
	.Area_item .PD_layout.layout_item .PD_slide .PD_into {padding-left: 1vw;position: absolute;top:36vw;width: 100%;text-align:center;font-size: 0.7em;}
	.Area_item .PD_layout.layout_item .PD .PD_logo::after { content:""; position: absolute; display:block; top: -7vw;left: 0;width:100%; height:100%; pointer-events:none; z-index: -1;}
	.Area_item .PD_layout.layout_item .PD .PD_logo img { padding: 0; box-shadow: none;border-radius: 34.5em!important;/*border: 7vw solid #ffffff;*/}
	.Area_item .PD_layout.layout_item .PD_slide .PD_img img {width:72%;margin:5% 0% 0% 14%;box-shadow: unset;}
	.Area_item .PD_layout.layout_item .PD_slide .PD_into h3 {padding: 0;max-height: 1.7em;font-weight: bolder;font-size: 1.4em;line-height: 1.7em;margin: 0;-webkit-background-clip: text;color: #ffffff;color: #ffffff;top:4vw;left:0vw;position: relative;}
	.Area_item .PD_layout.layout_item .PD_slide .PD_into h4 {padding: 0;font-size: 1.4em;color:#ffffff;margin: 0;line-height: 1em;text-align: center;top:5vw;position: relative;left:0vw;}
	.Area_item .PD_layout.layout_item .PD_slide .PD p del {top: 0vw;left: 0vw; color: #ffffff;z-index: 99;position: relative;font-size: 1.1em;}
	.Area_item .PD_layout.layout_item .PD p {position: relative;top:3.8vw;left:0vw; height: 15vw;font-size: 1.1em;line-height: 2.8em;color:#ffea00;}
	.Area_item .PD_layout.layout_item .PD p .Price {font-weight: 700;color:#ffea00;font-size: 2.0em;}
	.Area_item .PD_layout.layout_item .PD p small {font-size: 1.4em;}
	
	}






/*頁籤輪播*/
@media screen and (min-width:768px){
.Area_pageALL .PD_layout li{border-top:none;border-right:none;}
}
@media screen and (max-width:767px){
.Area_pageALL {background-color: #d6d6d6;}
.Area_pageALL .PD_layout ul{width: 96%;}
}	




/*區標*/
@media screen and (min-width:768px){
.Area_page {overflow: hidden;}
}
@media screen and (max-width:767px){
.Area_page {overflow: hidden;}
}	
/* --------------------------------------
* Page 頁籤_202405291900
* -------------------------------------- */
.NavArea_tabbar_page { margin: 0 auto 20px  ; width: 94%; }  
.NavArea_tabbar_page .Nav { overflow: visible; transform: translate3d(-30.5%, 0, 0);}  
.NavArea_tabbar_page .Nav_box { border-radius: 8px; overflow: hidden; padding: 0 2%;}
.NavArea_tabbar_page[data-num="2"] .Nav-wrapper { transform: translate3d(55.5%, 0, 0)!important}
.NavArea_tabbar_page[data-num="3"] .Nav-wrapper { transform: translate3d(43.0%, 0, 0)!important}
.NavArea_tabbar_page[data-num="4"] .Nav-wrapper { transform: translate3d(30.5%, 0, 0)!important}
.NavArea_tabbar_page[data-light="box"] .Nav ul { padding: 0 }
.NavArea_tabbar_page .Nav li { overflow: visible; }
@media screen and (min-width:768px){ 
.NavArea_tabbar_page { display: block; }
}
/*頁籤高亮顏色設定 */  
.NavArea_tabbar_page .Nav .swiper-slide-active a { color:#fff;}
.NavArea_tabbar_page .Nav .swiper-slide-active i { display:block; border: 1px solid #000000 !important; background-color: #ff6e7d !important;}
/*推編輯按鈕 */  
.NavArea_tabbar_page .Nav input { position: fixed; left: 30%}	  













/*BN*1*/
@media screen and (min-width:767px){
.AreaBN .PD_layout ul{width: 80%;}
}
@media screen and (max-width:767px){
.AreaBN .PD_layout ul{width: 96%;padding-top: 5vw;}
}




/*下方公版*/
@media screen and (min-width:767px){
}
@media screen and (max-width:767px){
.Area4PD .PD_layout ul{width: 96%;}
}

/*打字入稿BG*/
.pointer-off ul li a{ pointer-events: none;}
.titlebg { position: absolute; top: 30px; left: 50%; transform: translateX(-50%); }
@media screen and (max-width:767px){
.titlebg { width: 100vw; top: 5.5vw;}
}		

/*打字入稿區標*/
.Area .title { top: 80px; padding: 0; margin: 0 auto 110px; width: 70%; z-index: 2;}
.Area .title ul { padding: 0; grid-gap: 0;}
.Area .title ul li { background-color: transparent; pointer-events: none;}
.Area .title ul li .PD_into { padding: 0;}
.Area .title ul li h5 { padding: 0; margin: 0; font: bold 54px/88px "微軟正黑體","Microsoft JhengHei", Arial, Helvetica; color: #fff;}
@media screen and (max-width:767px){
.Area .title { width: 100%; margin: 0 auto 14vw; top: 10.5vw;}
.Area .title ul li h5 { font: bold 6.2vw/10.2vw "微軟正黑體","Microsoft JhengHei", Arial, Helvetica;}
}


/*小標題調整*/
.PD_text {position: relative;left: 0;top:0;height: auto;width: 100%!important;grid-gap: 0;}
.PD_text2 { position: relative;left: 0;top:0; height: auto; width: 55%!important;padding-bottom: 20px;}

.PD_text .PD a,.box_PD_txt .PD a { pointer-events: none; }
.PD_text2 .PD a,.box_PD_txt .PD a { pointer-events: none; }
.PD_text.PD_layout .PD_slide:hover {transform: none;box-shadow: none;}
.PD_text2.PD_layout .PD_slide:hover {transform: none;box-shadow: none;}
.PD_text.PD_layout[data-pd-li=BN] ul{padding: 0 0; grid-gap: 0px;}

@media screen and (max-width:767px){
.PD_text {position: relative;top:0;left:0vw;height: auto;width: 100%!important;}
.PD_text2 {position: relative;top:0;left:0;height: auto;width: 82%!important;padding-bottom: 2vw;}
}




@media screen and (min-width:767px){
.Areabottom{padding-bottom: 50px;}
}
@media screen and (max-width:767px){
.Areabottom{padding-bottom:5vw;}
}