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


/*全BOX版面*/
.WRAPPER {position: relative;margin: 0 auto;padding: 0;width:100%;min-width:1220px;overflow: hidden;font-family:"微軟正黑體","Microsoft JhengHei",Helvetica;background-color: #dc3e4a;z-index: 0;}
.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("m_bg.jpg?t=1742365296549");background-repeat:repeat-y;background-size:100%;*/z-index: 0;}
		.WRAPPER .mainArea { position:relative; display:block; margin:0 auto; padding: 0; width:100%;  }

	}


/*PC背景*/
@media screen and (min-width:767px){
.bg_fix {z-index: 0;position:absolute;top: 0;left:0;width:100%;height: 100%;background-repeat:no-repeat;background-position: center top;pointer-events:none;}
.bgtop_fixed { z-index:-1; position:fixed; top:0; left:0; width:100%; min-width:1220px; height:100%; background-repeat:repeat-y; background-position:center top; pointer-events:none; }
.bg_deco {z-index:0;position:absolute;top:550px;left:0;width:100%;height:100%;background-position:center 0px;background-repeat:repeat-y;pointer-events:none;}	
}

/*mb背景*/
@media screen and ( max-width:767px) {
.bgtop01 { z-index:0; position:absolute; top:44px; left:0; width:100%; height:100%; background-repeat:no-repeat; background-position:center top; background-size:100%; }	
.bgtop02 { z-index:0; position:absolute; top:10vw; left:0; width:100%; height:100%; background-repeat:no-repeat; background-position:center top; background-size:100%; }	
.bg03{ z-index:-1; position:fixed; top:0vw; left:0; width:100%; height:100%; background-repeat:repeat-y; background-position:center top; background-size:100%; }	
.bg02{ z-index:-1; position:absolute; top:0vw; left:0; width:100%; height:100%; background-repeat:repeat-y; background-position:center top; background-size:100%;  }	
}

@keyframes light{
  0%{ filter: brightness(1); }
  100%{ filter: brightness(1.5); }
}


/*區塊_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 { position: relative;}

	}


/*LOGO CSS*/
.momologo { z-index:2; position: absolute; top: 15px; left:-66px;}
.momologo a { display:block; width:140px; height:21px;}
.momologo a svg { width:140px; height:21px; }
.momologo a path { fill:#EA27C2; }
.momologo-pink  a path { fill:#EA27C2; }/*LOGO 桃紅色*/
.momologo-white a path { fill:#ffffff; }/*LOGO 白色*/
    @media screen and (max-width:767px){
        .momologo { display:none;}
    }





                   

/*日期*/
.TIMER_DAY {display:flex; justify-content: center; flex-wrap: wrap; position: absolute; top: 58px; left: 176px; width:23%; height: 206px; 
            padding: 35px 13px 0 0px; transform: rotate(-6deg); font-size:52px; font-weight: bold; font-family: "Century Gothic"; z-index: 10; 
            box-sizing: border-box;color: #1a3567; background: url(datebg.png?t=1766048117802)no-repeat center / 61% ;}
.TIMER_DAY small {font-size: 40px; font-weight: 100; position: relative;}
.TIMER_DAY #sendMonth { display: inline-block; text-align: right;  letter-spacing: -2px;} 
.TIMER_DAY #sendToday { display: inline-block;  text-align: left; letter-spacing: -2px;}
.TIMER_DAY .sendtxt { font-size: 0.8em; font-weight: 500; margin:-68px 0 0 9px; text-align: center; width: 100%;}
.TIMER_DAY .box{ width: 60%; display: flex; justify-content: center; align-items: center;height: 80px; }
@media screen and (max-width: 736px){ 
.TIMER_DAY { position: absolute;width: 30%;top: 4.7vw;left: 8vw;font-size: 5.5vw;letter-spacing: 0; padding: 4.5vw 2vw 0 0; text-align: left;margin: 0;font-weight: 900;height:22vw;}
.TIMER_DAY small {font-size: 4vw;}    
.TIMER_DAY #sendMonth {display: inline-block; font-size: 1em; }
.TIMER_DAY #sendToday {display: inline-block; font-size: 1em; }
.TIMER_DAY .sendtxt {font-weight: 500;font-size: 0.8em;  margin:-7.5vw 0 0 1vw;}	
.TIMER_DAY .box{ height: 8vw; }
}




/*區背景*/
.Area .bg, .Area .bg_btom{ position: absolute;pointer-events: none;z-index:0; }
@media screen and (min-width: 768px){
  .Area .bg, .Area .bg_btom{ left: 50%; transform: translateX(-50%); }
  .AreaPD3:before, .Area_book:before{ left: 50%; transform: translateX(-50%); }

  .Area_hotPD .bg {top:37px;left: 50%;}	
  .Area_hotPD .bg_btom {bottom:-1687px;}	

  .Area_book .bg {top:-61px;left: 50%;}	
  .Area_book .bg_btom {bottom:-62px;}	

  .AreaPD3 .bg {top:-80px;left: 50%;}	
  .AreaPD3 .bg_btom {bottom:-105px;}	
  .AreaPD3:before{ content:''; width: 2000px; height: 85%; background:url(AreaPD3_center.png?t=1766048117802) repeat-y top / 100%; position: absolute; top: 477px;} 
}

@media screen and (max-width:767px){

  .Area_hotPD .bg {top:-1.5vw;left:0;width:100%;  }	
  .Area_hotPD .bg_btom {bottom:-179vw;left:0;width:100%; }	

  .Area_book .bg {top:-11.5vw;left:0;width:100%;  }	
  .Area_book .bg_btom {bottom:-5vw;left:0;width:100%; }	
  .Area_book:before{ content:''; width: 100%; height: 68%; background:url(mArea_book_center.png?t=1766048117802) repeat-y top / 100%; position: absolute; top: 20vw; left: 0;}

  .AreaPD3 .bg {top:-6.5vw;left:0;width:100%;  }	
  .AreaPD3 .bg_btom {bottom:-9vw;left:0;width:100%; }	
  .AreaPD3:before{ content:''; width: 100%; height: 90%; background:url(mAreaPD3_center.png?t=1766048117802) repeat-y top / 100%; position: absolute; top: 60vw; left: 0;}


}


/*區標線上圖*/
.box_txt .PD_layout ul, .box_txt2 .PD_layout ul { padding: 0 !important; }	
@media screen and (min-width: 768px){
.box_txt, .box_txt2 {position: relative;display: flex;margin: 0 auto;width:960px;height: auto;justify-content: center; }
.box_txt{ margin-bottom: -13px; }
.box_txt:before{ content:''; width: 935px; height: 135px; background:url(titleLight.png?t=1766048117802) no-repeat center / 100%; position: absolute; top: 19px; ; left: 5px; z-index: 10; mix-blend-mode: screen;}

}

@media screen and (max-width:767px){
.box_txt, .box_txt2  {position: relative;margin: 0 auto;width: 100%;}
.box_txt{ margin-bottom: -1vw; }
.box_txt:before{ content:''; width: 98vw; height:14vw; background:url(titleLight.png?t=1766048117802) no-repeat center / 100%; position: absolute; top: 2vw; left: 0.5vw; z-index: 2; mix-blend-mode: screen; }

}



/*推距離*/
.Area_bottom{ margin-bottom: 40px; }
.Area_bottom2{ margin-bottom: 137px; }
@media screen and (max-width:767px){
  .Area_bottom{ margin-bottom: 2vw; }
  .Area_bottom2{ margin-bottom: 14vw; }
}



  /*版頭區塊*/
  .topdeco{ position:absolute; pointer-events: none; z-index: 1;}  
  .Area_title a{ pointer-events: none; }
  @media screen and (min-width:768px){
  .Area_title {height:1132px;}
  .deco01 { top: -96px; left: -244px; z-index: 21; mix-blend-mode: screen; }
  .deco02 { top: 371px; left: 832px; z-index: 21; mix-blend-mode: screen; }
  .deco03 { top: 4px; left: 173px; z-index: 21; mix-blend-mode: screen; animation:sun 2s infinite alternate-reverse ease-in-out;}
  .deco04 { top: 325px; right: 70px; z-index: 21; mix-blend-mode: screen; animation:uptodown-play2 1.5s ease-in-out infinite alternate;}
  .deco05 { top: 681px; left: 464px; z-index: 21; mix-blend-mode: screen; animation:uptodown-play2 1.5s ease-in-out infinite alternate; animation-delay: .5s;}
  .deco06 { top: 395px; left: 131px; z-index: 21;  mix-blend-mode: screen; animation:sun 2s infinite alternate-reverse ease-in-out; transform: scale(0.9);}
  .deco07 { top: 263px; left: 877px; z-index: 20;  animation:uptodown-play2 1.5s ease-in-out infinite alternate;}
  .deco08 { top: 442px; left: 485px; z-index: 20;  animation:uptodown-play2 1.5s ease-in-out infinite alternate;}
  .deco09 { top: 518px; left: 325px; z-index: 20;  animation:uptodown-play2 1.5s ease-in-out infinite alternate; animation-delay: .5s;}
  .deco07 img, .deco08 img, .deco09 img{ transform: scale(0.8);  }
}
  @media screen and (max-width:767px){
  .Area_title {height:136vw;}
  .Area_title .mb_01{position:absolute; top:0; left:0 ;width: 100%; z-index:-1;}
  .deco01 {top:-21vw; left: -48vw;width: 69vw; z-index: 21; mix-blend-mode: screen;}
  .deco02 {top:56vw; left: 40vw;width: 69vw; z-index: 21; mix-blend-mode: screen; }
  .deco03 { top: 3.5vw; left: 10vw; width: 13vw; z-index: 21; mix-blend-mode: screen; animation:sun 2s infinite alternate-reverse ease-in-out;}
  .deco04 { top: 33vw; right: -1.5vw; z-index: 21; width: 20vw;  mix-blend-mode: screen; animation:uptodown-play3 1.5s ease-in-out infinite alternate;}
  .deco05 { top: 78.3vw; left: 20.6vw; z-index: 21; width: 22vw;  mix-blend-mode: screen; animation:uptodown-play3 1.5s ease-in-out infinite alternate; animation-delay: .5s;}
  .deco06 { top: 42vw; left: 1vw; z-index: 21; width: 82vw;  mix-blend-mode: screen; animation:sun 2s infinite alternate-reverse ease-in-out;}
  .deco07 { top: 29vw; left: 74vw; z-index: 20; width: 22vw; animation:uptodown-play3 1.5s ease-in-out infinite alternate; }
  .deco08 { top: 56vw; left:031vw; z-index: 20; width: 61vw; animation:uptodown-play3 1.5s ease-in-out infinite alternate;}
  .deco09 { top: 64vw; left: 6vw; z-index: 20; width: 39vw;  animation:uptodown-play3 1.5s ease-in-out infinite alternate; animation-delay: .5s;}

}
  
  @keyframes sun{
    0%{ filter: brightness(1); opacity: .8; }
    100%{ filter: brightness(1.2); opacity: 1;}
  }

/*飄-上下*/
@keyframes uptodown-play2 { 
0%   { transform: translate(0,-15px);} 
100% { transform: translate(0,0);}
}
@keyframes uptodown-play3 { 
  0%   { transform: translate(0,-5px);} 
  100% { transform: translate(0,5px);}
  }

/*版頭主標微調*/
.title01 .PD_layout .PD img { width:100%!important; }
.title01 .PD_layout .PD a { pointer-events: none; }
.title01 .PD_layout .PD_slide:hover {transform: translateY(0); }
.title01 .PD_layout .PD_slide {min-width: 100%;}
@media screen and (min-width: 768px){
.title01 {position:absolute;top:-3px;left:100px;z-index: 20; width:84%;}
}
@media screen and (max-width:767px){
.title01{width: 100%;}
.title01 ul{ padding: 0!important; }
.title01 .PD_layout {position: relative;top:0;left:0;width: 100%; }
.title01 .PD_layout .PD img { width: 100%!important; }

}

/*副標輪播*/
.Area_title .topPD2 {position: absolute; top: 401px; left: 194px; width:569px;height: 97px;overflow: hidden;z-index: 20;}
.Area_title .topPD2 ul.PD_wrapper { display: flex; flex-wrap: nowrap; margin: 0; padding: 0; width: 100%; box-sizing: content-box; grid-gap: inherit;}
.Area_title .topPD2 ul.PD_wrapper li { flex-shrink: 0; margin: 0; padding: 0; opacity: 0; transform: translate(5%,0);}
.Area_title .topPD2 ul.PD_wrapper li.swiper-slide-active { opacity: 1; transition: .8s ease-out; transform: translate(0,0);}
@media screen and (min-width: 768px){
  .Area_title .topPD2 ul.PD_wrapper li img{ width: 110%; }
}

@media screen and (max-width:767px){
  .Area_title .topPD2 {width: 71%; height: 11vw; position: absolute; top: 41.8vw; left: 4vw; overflow: hidden;}
}




/*區塊2(主打品區)*/
.mainPD .PD_layout.PD_layout-PDBN_01 .PD p .money,
.mainPD .PD_layout.PD_layout-PDBN_01 .PD p .Price,
.mainPD .PD_layout.PD_layout-PDBN_01 .PD p b,
.mainPD .PD_layout.PD_layout-PDBN_01 .PD p small{background: linear-gradient(to top, #9a1a2b 0%, #dd253f 50%, #dd253f 100%);-webkit-background-clip: text;-webkit-text-fill-color: transparent;color: transparent;}
.mainPD .PD_layout .PD_img {z-index: 5}
.mainPD .PD_layout .PD_logo img {box-shadow: none!important }	
/*.mainPD .PD_layout li:nth-child(odd) .PD a{flex-direction: row!important;}*/

.mainPD .PD_layout-PDBN_01 li{content: "";background: url(PD02_bg.png?t=1766048117802)center top / 100% no-repeat scroll;}

@media screen and (min-width:768px){
.mainPD{position: relative;height:auto;}
.mainPD .PD_layout-PDBN_01 ul {padding-top: 0px; padding-left: 0px;padding-right: 0px; margin-top: -34px;}	
.mainPD .PD_layout-PDBN_01 li {height: 450px;}	  
.mainPD .PD_layout-PDBN_01 .PD h3 {font-size: 45px;color: #3d0506; text-align: center; width: 75%; margin-left: 31%;}
.mainPD .PD_layout-PDBN_01 .PD h4 {top: 106px;font-size: 36px;color: #3d0506; text-align: center; width: 75%; margin-left: 31%;}
.mainPD .PD_layout-PDBN_01 .PD p {height: 89px; top: 160px;  width: 75%; margin-left: 31%;}
.mainPD .PD_layout-PDBN_01 .PD p .js-PD_del {position: absolute;font-size:30px;color: #9d8976;font-weight: 400;top: 10px}
.mainPD .PD_layout-PDBN_01 .PD p .Price {top:34px;left:2px;font-size: 100px;line-height: 98px;font-family:Century Gothic;}
.mainPD .PD_layout-PDBN_01 .PD p .money {font-size: 36px;font-weight: 600;font-family:Century Gothic;}
.mainPD .PD_layout-PDBN_01 .PD p b, .PD_layout .PD p del {font-size: 1.4em;}

.mainPD .PD_layout-PDBN_01 li .PD_logo {position: relative;width: 70px; height: 70px;left: 315px; top: -55px;display: none;opacity: 0;}
.mainPD .PD_layout-PDBN_01 li .PD_img{position: relative;width: 370px; left: -520px; top: 30px;}
.mainPD .PD_layout-PDBN_01 li .PD_into{width:80%;z-index: 1;position: absolute; right:24px; top:58px; text-align: center;}		  
}
@media screen and (max-width:767px){
.mainPD {position:relative;height: auto;}
.mainPD .Area_title {position:relative;z-index: 1;height:15vw;}	  
.mainPD .PD_layout-PDBN_01 ul{padding-left: 0em;padding-right:0em;perspective:10vw;  margin-top: -5vw;}
.mainPD .PD_layout-PDBN_01 li{margin:0;z-index: 2;width: 100%;height: 47vw}

.mainPD .PD_layout-PDBN_01 li .PD h3 {font-size:5vw; left:0; top: 8vw; color: #3d0506;  text-align: center; width: 75%; margin-left: 35%;}
.mainPD .PD_layout-PDBN_01 li .PD h4 {font-size: 4vw;left: 0; top: 16.3vw; color: #3d0506;  text-align: center; width: 75%; margin-left: 35%;}
.mainPD .PD_layout-PDBN_01 .PD p {top:26vw;line-height: 2.3em; top: 24.5vw; left:35%; text-align: center; height: 3em; width: 75%;}
.mainPD .PD_layout-PDBN_01 .PD p .Price {top:25vw;left: -2vw;font-size: 2.5em;font-family:Century Gothic;}
.mainPD .PD_layout-PDBN_01 .PD p .money {font-family:Century Gothic;}
.mainPD .PD_layout-PDBN_01 .PD p .js-PD_del {position: absolute; font-size: 0.8em; color:  #9d8976;font-weight: 400; top: -1vw;}
.mainPD .PD_layout-PDBN_01 .PD p b, .PD_layout .PD p del {font-size: 0.9em;}
.mainPD .PD_layout-PDBN_01 li .PD_logo {width:8vw;height:8vw;position: relative;left:21vw;top: 2vw;display: none;opacity: 0;}
.mainPD .PD_layout-PDBN_01 li .PD_logo img {width:47vw;height:47vw;}
.mainPD .PD_layout-PDBN_01 li .PD_img{position:relative;width: 39vw; left: -4vw;top: 3vw;}
.mainPD .PD_layout-PDBN_01 li .PD_into{z-index: 1;margin-left:0;top:7vw;}	  

}



/*主打PD*/
.Area_hotPD .bling{ position: absolute; top:-456px; left: -239px; mix-blend-mode: screen; }
.Area_hotPD a{ pointer-events: none; }
@media screen and (min-width: 768px) {
  .Area_hotPD .bn{ width: 1100px; margin: auto;}
}
@media screen and (max-width:767px){
  .Area_hotPD .bling{ top:-54vw; left: -37vw; width: 75vw; mix-blend-mode: screen; }
}


/*BN*/
@media screen and (max-width:767px){
  .Area_bn {  overflow: hidden; }
  }
  /*輪播BN*/
  .BN_swiper { position: relative; margin: 0 auto; overflow: hidden; z-index: 1; width: 96%;}
  .BN_swiper ul.PD_wrapper { display: flex; flex-wrap: nowrap; margin: 0; padding: 0 0 20px; width: 100%; grid-gap: 0; box-sizing: content-box;}
  .BN_swiper ul.PD_wrapper li { position: relative; flex-shrink: 0; margin: 0; padding: 0; pointer-events: inherit;}
  .BN_swiper ul.PD_wrapper li.PD_slide { min-width: inherit;}
  .BN_swiper ul.PD_wrapper li.PD_slide:hover { box-shadow: 0 3px 30px rgba(0, 0, 0, 0);}
  @media screen and (max-width:767px){
    .BN_swiper { width: 100%; margin: 0 auto;        padding-top:0vw;}
    .BN_swiper ul.PD_wrapper { margin: 0; padding: 0 0 2%; }
  }
  

/*Video*/
@media screen and (max-width: 767px) {
  .Area_video {height: 72vw;}
  .Area_video .Area_video_more {height: 12vw;padding-top: 6vw;}
  .Area_video .videoPD{position: absolute; width: 22%; top: 36.5vw; left: 78.5vw; z-index: 10;}
  .Area_video .videoPD img{ width: 100%; }
  .Area_video .video { width: 88vw; height: 49.5vw; margin-left: 4vw; margin-top: 0; border:1px solid #f6cacc;}
  }
  @media screen and (min-width: 768px) {
    .Area_video {height: 860px;}
    .Area_video .videoPD{position: absolute; top: 369px; left: 956px; z-index: 10; width: 300px; }
    .Area_video .videoPD img{ width: 100%; }
    .Area_video .Area_video_more {padding-top: 86px;}
    .Area_video .video { width: 1100px; height: 619px; margin-left:21px; margin-top:-2px; border: 2px solid #f6cacc;}
    }
  
  /*影片css*/
  .bigpicture { height: 100%;	width: 100%; position: relative; background-position: center center; background-size: cover; cursor: pointer;}
  .bigpicture h3 { position: absolute; left: 5%; bottom: 0; z-index: 1; color: #fff; font-size: 20px }
  .bigpicture:before,
  .bigpicture:after { z-index: 1; content: ''; position: absolute; left: 0; top: 0; right: 0;	bottom: 0;height: 100%;	width: 100%; transition: opacity 0.2s;}
  .bigpicture:after { background-repeat: no-repeat; background-position: center; opacity: 1; background-size: 2em;}
  .bigpicture:before { background: linear-gradient(0deg, #000, transparent 40%); opacity: 0.7;}
  /*.bigpicture:hover:after { opacity: 0.8; }*/
  .bigpicture:hover:before { opacity: 0.5; }
  .bigpicture:after { height: 100%; width: 100%;	
    background-image: url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20159.00691%20111.60904%22%3E%3Cpath%20d%3D%22M36.2%20111c-25-1.3-29.6-4-34-18.6C.3%2086.7%200%2080%200%2057.4%200%2019%202.3%209.7%2013.6%204c11.5-5.6%20120-5.6%20131.4%200%206%203%2010%208.7%2011.8%2017.2%202%209.8%203%2042.2%201.5%2057.5-2%2020.4-7%2028.5-19.2%2030.8-7.6%201.5-82%202.4-102.8%201.3zM85%2065.3c11.3-6%2020.4-11%2020.3-11L84%2043%2063%2032v22c0%2012%20.4%2022%20.8%2022%20.3%200%2010-5%2021.2-10.8z%22%20fill%3D%22%23db2823%22%2F%3E%3Cpath%20d%3D%22M63.2%2032c-.4.3-.2%201-.3%201.3v28.5c0%204.6%200%209.2.5%2013.8%200%20.4.3.7.6.5%206.3-3%2012.3-6%2018.4-9.3%207.5-4%2015-7.8%2022.2-12%20.3%200%201-.4.6-.8-12.8-7-25.7-13.5-38.6-20.2-1-.6-2.2-1.3-3.4-1.7z%22%20fill%3D%22%23fff%22%2F%3E%3C%2Fsvg%3E');
    background-size: 4em;
  }
  .bigpicture img { width: 100%; border-radius:0; aspect-ratio: 1.777777; }
    @media screen and (max-width:767px){
        .bigpicture h3 { font-size: 3vw; left: 1.2em;  }
    }
  .box_youtube { overflow: hidden}
  .box_youtube .youtubeArea { position:relative; width:100%; height:0px; padding-bottom:56.25%;}
  .box_youtube .youtubeArea * { margin:0; padding:0;}
  .box_youtube .youtubeArea iframe { position:absolute; top:0px; left:0px; width:100%; height:100%;}
  .box_youtube .youtubeArea .youtubeDiv { background-color: transparent!important;}
        @media screen and (min-width:768px){
           .box_youtube {  border-radius: 0; display: block !important;}
        }
        @media screen and (max-width:767px){
           .box_youtube {  border-radius: 0;display: block !important;}
           .box_youtube iframe { border-radius: 0; } 
        }
  
  


/*登記贈品文案顏色*/
.Area_danji .danji_box ul li .activityText .gifts span {color: #cf1a34;}    
/*登記*/
.Area_book { height: 100%;}
.Area_book .Area_danji .danji_box{margin: 0 auto;}
.Area_book .Area_danji {position: relative; left:-138px;}
.Area_book .more{    position: absolute;left: 709px; height: 43px;z-index: 5;}
.Area_book .bling{ position: absolute; top:-566px; left: -339px; mix-blend-mode: screen; }
.Area_book .bling2{ position: absolute; bottom:-187px; right: -210px; mix-blend-mode: screen; }

@media screen and (max-width:767px){
.Area_book {width:100%;height:100%;padding: 0;padding-bottom: 0vw;}
.Area_book .Area_danji .danji_box{ width: 99%;}
.Area_book .floor2 {position: absolute;left: 0;top:-5vw ;}
.Area_book .Area_danji { position: relative; left: 0; width:97%;  margin: 0 auto;padding:0 0 0 0;}	
.Area_book .more{position: relative;top:10vw; left: 75vw;width: 23%;}
.Area_book .bling{ top:-72vw; left: -27vw; width: 75vw; mix-blend-mode: screen; }
.Area_book .bling2{ bottom:-23vw; right: -17vw; width: 65vw; mix-blend-mode: screen; }

}


/*折價劵(線上入搞)*/
@media screen and (min-width:768px){
.PD_layout-coupon3 {margin-bottom: 20px;}
.PD_layout.PD_layout-coupon3 .PD .divine_coupon, .PD_layout.PD_layout-coupon3 .PD .threshold { color: #79070a;}	
}
@media screen and (max-width:767px){
.PD_layout-coupon3 { padding-bottom: 2vw;}
.PD_layout.PD_layout-coupon3 .PD .divine_coupon, .PD_layout.PD_layout-coupon3 .PD .threshold { color: #79070a;}	

}



.Area_active a{ pointer-events: none; }




/*品類公版*/
.AreaPD3 .box {margin-bottom: 50px; box-sizing: border-box; position: relative;}
.AreaPD3 .box:last-child { margin-bottom: 0;}
.AreaPD3 .box .bling{ position: absolute; top:-550px; left: -210px; mix-blend-mode: screen; }
.AreaPD3 .box .bling2{ position: absolute; bottom:-166px; right: -210px; mix-blend-mode: screen; }
@media screen and (max-width:767px){
  .AreaPD3 .box { margin: 0 auto 8vw;}
  .AreaPD3 .PD_box{padding: 0% 0 0 0;width: 95%;}
  .AreaPD3 .box .bling{ top:-72vw; left: -27vw; width: 75vw; mix-blend-mode: screen; }
  .AreaPD3 .box .bling2{ bottom:-23vw; right: -17vw; width: 75vw; mix-blend-mode: screen; }
}


/*品類按鈕*/
@media screen and (min-width: 768px) {
  .Area_brand .PD_layout ul { padding: 0px 35px; gap: 20px;}
}
@media screen and (max-width: 767px) {
  .Area_brand .PD_layout ul { grid-gap: .5em;padding: 4%;}
}



 /*置底*/
@media screen and (min-width: 768px){
  .Area_fixbn{ transform: translateX(-390px); }
}
@media screen and (max-width: 767px) {
   .Area_fixbn a {padding-bottom:constant(safe-area-inset-bottom); /* 兼容 iOS < 11.2 */
            padding-bottom:env(safe-area-inset-bottom); /* 兼容 iOS >= 11.2 */ 
            position: relative; display: block;  }   
  .Area_fixbn{position:relative; background-size:100%;margin-bottom:-23vw; display:block; z-index:30;}
  .Area_fixbn ul li{float:left;padding:0;list-style-type:none;width:50vw;}
  .Area_fixbn ul li img{width:100%;margin:0 auto;}
  
  .Area_fixbn ul{  margin-top: 0px;  margin-bottom: 0px;  padding-left: 0px; }
  .Area_fixbn{z-index: 10; }

}


/*注意事項區*/
.edm_notice{position: relative;margin:70px auto 10px;text-align:center;padding:10px 10px 15px 10px;color: #FFF;font:12px/18px Helvetica;}
.edm_notice .apple_notice{  padding:10px 0px 10px 0px; }

@media screen and (max-width:767px){
.edm_notice{position: relative;margin:6vw 0 25vw 0;text-align:center;padding:10px 10px 15px 10px;color: #fff;font:12px/18px Helvetica;}
}



/*隱鑶*/
.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;}
	}


/**延遲載圖用**/
.mainArea .articleList * img.lazy {display:none;} 

/*分享浮層*/
.floatBox { position:relative; margin:2% auto; padding: 2% 0; width: 700px; height:auto; background-color:rgba(0,0,0,0.8); text-align:center;  border-radius:20px;}
.floatBox img { width:100%; height:auto;}
.floatBox .go_bt {
  -webkit-transition: all 0.2s ease;
     -moz-transition: all 0.2s ease;
      -ms-transition: all 0.2s ease;
       -o-transition: all 0.2s ease;
          transition: all 0.2s ease;}
.floatBox .go_bt:hover { filter: brightness(120%);
  -webkit-transform:translateY(-6px);
     -moz-transform:translateY(-6px);
      -ms-transform:translateY(-6px);
       -o-transform:translateY(-6px);
          transform:translateY(-6px);}
.floatBox .closeButton a { display:block; cursor:pointer; position:absolute; top:-20px; right:-20px; width:40px; height:40px; border-radius:50%; border:solid 2px #999999; font:bold 40px/1em "Century Gothic"; color:#FFF; text-align:center; background-color:rgba(0%,0%,0%,0.5);text-decoration: none; z-index:2}
.floatBox .closeButton:hover {background-color:#666; text-decoration:none;}
.floatBox .title  { display:inline-block; margin:0 0 10px 0; border-bottom:1px solid #ffd800; font:bold 45px/1.5em "微軟正黑體","Microsoft JhengHei", Arial, Helvetica;letter-spacing: -0.05em;  color:#ffd800; text-align:center}
.floatBox .box_ { margin:0 auto; width:90%;}
.floatBox .box_:after { content: ""; display:block; clear:both;}
.floatBox .box_btn { margin:20px auto 0; width: 80%;}
.floatBox .box_btn a { display:block; margin:3% 0;}
.floatBox .box_btn img { width:100%;}
.floatBox .box_btn .btn { margin:0 auto; width:60%;}
.floatBox .box_btn2 a { float:left; margin:0 1%; width:48%;}
	@media screen and (max-width:767px){
		.floatBox { padding:5% 0; width:90%; height: auto;}
		.floatBox .closeButton a {display:block; position:absolute; top:-15px; right:-15px; width:30px; height:30px; border-radius:50%; border:solid 2px #999999; font:bold 30px/1em "Century Gothic"; color:#FFF; text-align:center; background-color:rgba(0%,0%,0%,0.5);text-decoration: none; z-index:2}
		.floatBox .closeButton:hover {background-color:#666; text-decoration:none}
		.floatBox .title  { margin:0 5% 3vw; font-size: 6vw; line-height:2rem;}
		.floatBox .box_btn { margin:2% auto 0;}
		.floatBox .box_btn .btn { margin:0 auto; width:80%;}
	}









