@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: 0; vertical-align: top;}
.WRAPPER a { text-decoration: none;}
@media screen and (max-width:767px){
  .WRAPPER {min-width: inherit;}
  .WRAPPER img {width: 100%;  height: auto;}
}
	

/*區塊_all*/
.Area { position: relative; margin: 0 auto; padding: 0; border-radius: 0; text-align: center; }
.Area a { display: block;} 
.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){
  .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_bottom {margin-bottom: 80px!important;}
.Area_bottom_01 {}
@media screen and (max-width:767px){
  .Area_bottom { margin-bottom: 6vw!important;}
  .Area_bottom_01 {margin-bottom: 7vw!important;}
  .m96 { width: 96%; margin: 0 auto; }
}


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







/*公版*/
@media screen and (max-width:767px){
  .PD_layout { width: 97%;}
}


/*背景*/
.bgtop { z-index: -2; position: absolute; top: 0; left: 0; width: 100%; min-width: 1220px; height: 100%; background: url(bgtop.jpg?t=1768448652283) no-repeat center top;}
.bgdeco2 { z-index:-1; position:fixed; top:0px; left:0; width:100%; height:100%; background-position:center 0px; background-repeat:repeat-y; transition:0.5s linear; pointer-events:none;}

.bgrepeat { z-index: 0; position: absolute; top: 0; left: 0; width: 100%; min-width: 1220px; height: 100%; background: url(bgrepeat.png?t=1768448652283)top center repeat-y; pointer-events: none;}
.bgrepeat02 { z-index: -4; position: absolute; top: 753px; left: 0; width: 100%; min-width: 1220px; height: 100%; background: url(bgrepeat02.jpg?t=1768448652283)top center repeat-y; pointer-events: none;}
.bgdeco {z-index:99;position: absolute;top: 786px;left: 0;width: 100%;min-width:1220px;height: calc(100% - 70px);background: url(bgdeco.png?t=1768448652283) repeat-y center top;pointer-events: none;}
@media screen and (max-width:767px){
  .bgtop { z-index: -2; min-width: inherit;  background: url(mbgtop.jpg?t=1768448652283) no-repeat center 44px; background-size: 100%;}
  .bgdeco2 { z-index:3; position:fixed; top:0px; left:0; width:100%; height:100%; background-size: 100%; transition:0.5s linear; }
  .bgrepeat { z-index: 0; min-width: inherit; position:absolute;top: 0;background: url(bgrepeat_m.png?t=1768448652283) repeat-y center;background-size: 100%;}
  .bgrepeat02 { z-index: -4; top: 0; left: 0; width: 100%; min-width: 100%; height: 100%; background: url(bgrepeat02.jpg?t=1768448652283)top center repeat-y; pointer-events: none;}
}





/* 設定css背景與偽元素的css背景，讓首屏以外的css背景先被隱藏 */
/* css寫法--1104修正 (1)空格異常重KEY、(2)新增第四行*-全部元素背景 */
.articleList .lazy[data-bg=""][data-was-processed="false"],
.articleList .lazy[data-bg=""][data-was-processed="false"]::before,
.articleList .lazy[data-bg=""][data-was-processed="false"]::after,
.articleList .lazy[data-bg=""][data-was-processed="false"] *,
.articleList .lazy[data-bg=""][data-was-processed="false"] *::before,
.articleList .lazy[data-bg=""][data-was-processed="false"] *::after {background-image: none !important;}




/*共用設定*/
.PD_layout li:hover { box-shadow: none!important; }
.PD_layout[data-pd-li=BN] ul, .PD_layout[data-pd-li=BN-AWD] ul, .PD_layout[data-pd-li=PDBN] ul { padding: 0;}




/* 區標1共用 */
.Aear_title  { margin: 0px auto 20px auto; height: 111px; }
.Aear_title .Areatitle_bg {  z-index: -1; position: absolute; top: 0; left: 0;  }
.PD_title  {  font-family: "Century Gothic","Arial","Noto Sans TC","微軟正黑體","Microsoft JhengHei"; }
.PD_title span { float: left; width: 960px; height: 111px; font-size: 55px; margin: 0 0 0 0; line-height: 99px; text-align: center; }
.PD_title span:nth-child(1) { color: #6e4644; font-weight: 700; }
.PD_title span:nth-child(2) { color: #6e4644; font-weight: 700; }
.Aear_title ul.PD_wrapper li img { width: 100%; }
@media screen and (max-width:767px){
  .Aear_title {  background-size: 100%; height: 10vw; margin: 0 0 2.5vw 0;  }
  .PD_title  span {  width: 59.5%; height: 9.5vw; font-size: 5.5vw; margin: 0 0 0 19vw; line-height: 10vw; }
}



/* 關閉主標hover */
.hero .PD_layout[data-pd-li*="BN"] li:hover { box-shadow: none; filter: brightness(100%);}
.hero .sub .PD_layout ul { background-color: transparent; padding: 0 0 25px 0; }
.hero .sub .PD_layout ul li { border-top:transparent; border-right:transparent;  }
@media screen and (max-width: 767px){
  .hero .sub .PD_layout .PD_img { padding: 0; }
  .hero .PD_layout .PD p .Price { font-size: 24px; }
  }



  
/* 登記高亮字改色 */
/* 文案 */.Area_danji .btn_reg .activityText p,.Area_danji .btn_reg .activityText .Tip,.Area_danji .btn_reg .content p { color: #000; }
/* 送 */.Area_danji .gifts span { color: #ff962e; } 



/* 折價券改色 */
.PD_layout.PD_layout-coupon3 .PD .divine_coupon { color: #FFF; }
.PD_layout.PD_layout-coupon3 .PD .threshold { color: #FFF; }




/* 關閉主標hover */
.Area_top .PD_layout[data-pd-li*="BN"] li:hover { box-shadow: none; filter: brightness(100%);}
.Area_top .sub .PD_layout ul { background-color: transparent; padding: 0 0 25px 0; }
.Area_top .sub .PD_layout ul li { border-top:transparent; border-right:transparent;  }
@media screen and (max-width: 767px){
  .Area_top .sub .PD_layout .PD_img { padding: 0; }
  .Area_top .PD_layout .PD p .Price { font-size: 24px; }
  }
  


/*LOGO CSS*/
.momologo { z-index:9999; position: absolute; top: 15px; left:10px;}
.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;}
  }



/*版頭*/
.Area_top {position: relative;height: 1030px;z-index: 30;}
/*標設定關閉*/
.Area_top .topPD ul { background: #00000000; padding:0 35px; }
.Area_top .topPD ul li { border-top:transparent; border-right:transparent; }
.Area_top .PD_layout .PD h3,.topPD .PD_layout .PD h4, .PD_layout .PD p { overflow: hidden; height: 44px; }
.Area_top .topPD .imgTag{display: none !important;}
.Area_top .topPD .imgTagBottom{display: none !important;}
.Area_top .topPD .prdImgWrap .imgTagRectangle{display: none !important;}
@media screen and (min-width:767px){
.Area_top .toptitle {position: absolute;top: 32px;left: 244px;width: 60.5%;z-index: 97;}
/*主打品*/
.Area_top .toppd img{width: 90%;}
.Area_top .toppd1 {position: absolute;top: 556px;left: -70px;z-index: 99;}
.Area_top .toppd2 {position: absolute;top: 468px;left: -46px;z-index: 98;}
.Area_top .toppd3 {position: absolute;top: 655px;left: 746px;z-index: 99;}
.Area_top .toppd4 {position: absolute;top: 735px;left: 1095px;z-index: 99;}
    
/*物品動畫*/
.Area_top .deco1 {position: absolute;top: 126px;left: 251px;z-index: 99;}
.Area_top .deco2 {position: absolute;top: 246px;left: 795px;z-index: 99;}
.Area_top .deco3 {position: absolute;width: 4%;left: 992px;top: 418px;z-index: 99;}
.Area_top .deco4 {position: absolute;width: 3%;left: 19px;top: 210px;z-index: 99;}  
/*版頭公版*/

.Area_top .topbox {position: absolute;left: 666px;top: 108px;}
.Area_top .topbox img{width: 75%;}
.Area_top .topPD {position: absolute;width: 58.3%;left: 299px;top: 170px;top: 119px;z-index: 99;}
/*圖*/ 
.Area_top  .PD_layout[data-pd-br="1"] .PD_slide .PD_img img{border-radius: 0 !important;width: 79% !important;top: -53px;left: -25px;} 
.Area_top .topPD .PD_img img{border-radius: 0 !important;}    

/*文案*/ 
.Area_top .PD_layout .PD_into{margin-top: 261px;margin-right: -352px;z-index: 99;text-align: center;}
  
.Area_top .topPD  .PD p{color: #0a6576;}
.Area_top .topPD  .PD p .Price{font-size: 2.2em;line-height: -27px;top: 21px;}
.Area_top .topPD  .PD h3{font-size: 1.4em;line-height: 1em;}
 
.Area_top .topPD   h3{ background: none !important; margin-bottom: 0 !important; background-image: none !important;}   
.Area_top .topPD  .PD_slide{ background-color:rgba(255,255,255,0);  }

.Area_top .topPD  .PD h3 span{background-color: rgba(255,255,255,0)!important;color: #0a6576 !important;max-width: 100% !important;}
.Area_top .topPD  a{color: #f7efc6;}

.Area_top .topPD  .PD h4 {font-size: 1.7em !important;color: #0a6576;line-height: 1em !important; height: 55px;}
.Area_top  .PD h4 b{font-size: 0.8em !important;}
.Area_top .topPD  .PD:hover h4 { color:#042328 !important;}

.Area_top .topPD  .PD_btn{display: none;}

}
@media screen and (max-width:767px){
  .Area_top {height: 117.5vw;}
  .Area_top .momologo { display: none;} 	
  .Area_top .toptitle {width: 88%;left: 4vw;top: 4vw;z-index: 8;}
  /*物品動畫*/
  .Area_top .deco1 {position: absolute;width: 13%;left: 11vw;top: 6vw;z-index: 10;}
  .Area_top .deco2 {position: absolute;width: 17%;left: 72vw;top: 22vw;z-index: 10;}
  .Area_top .deco3 {position: absolute;width: 11%;left: 72vw;top: 41vw;z-index: 10;}
   /*主打品*/
  .Area_top .toppd1 {position: absolute;width: 19%;left: 2vw;top: 55vw;z-index: 1;}
  .Area_top .toppd2 {position: absolute;width: 115%;left: -5vw;top: 58.5vw;z-index: 10;}
  .Area_top .toppd3 {position: absolute;width: 27%;left: 66vw;top: 75vw;z-index: 10;}
  .Area_top .toppd4 {position: absolute;width: 13%;left: 86vw;top: 89vw;z-index: 10;}
   /*版頭公版*/  
   .Area_top .Area00title{position: absolute;width: 45%;left: 44vw;top: 109vw;overflow: hidden;z-index: 1;}
   .Area_top .topbox {position: absolute;width: 40%;left: 4vw;top: 113vw;overflow: hidden;z-index: 1;}
   .Area_top .topPD {position: absolute;height: 31vw;left: -23.4vw;top: 117.2vw;z-index: 1;}
    /*圖*/
   .Area_top .topPD .PD_img{width: 46% !important;margin: -3vw 23vw 0vw 0vw;left: 0;padding: 0;border-radius:none !important;}
   .Area_top .topPD .PD_img img{border-radius: 0 !important;}
    /*文*/
   .Area_top .topPD   li:first-child .PD_into{text-align: left !important;}
   .Area_top .topPD .PD_into{margin-top: 3vw;margin-right: -82.2vw;z-index: 99;text-align: center;}
   .Area_top .topPD .PD_slide{ background-color:rgba(255,255,255,0);  }
    
   .Area_top .topPD   h3{background: none !important;margin-bottom: 0 !important;padding: 0 !important; }
   .Area_top .topPD   .PD h3 span{background-color: rgba(255,255,255,0)!important;color: #0a6576 !important;max-width: 100% !important;font-size: 4.5vw;}
    
   .Area_top .topPD  .PD p{color: #0a6576;left: 1vw;margin-left: 0vw;}
   .Area_top .topPD  .PD p .Price{font-size: 2.1em;}
    
   .Area_top .topPD  .PD h4 {font-size: 1.3em !important;line-height: 1.3em;overflow: hidden;height: 9vw; color: #0f6979;}
   .Area_top .topPD  .PD:hover h4 { color:#042328 !important;}
    
   .Area_top .topPD  .PD_btn{display: none;}
   .Area_top .PD_layout .PD h4 b,.PD_layout .PD h4 span { max-height:1.2em }
   .Area_top .PD_layout .PD h3,.topPD .PD_layout .PD h4, .PD_layout .PD p {  height: 8vw; }
   
}


/* 版頭品 */
.Area_top .top_PD  { position: absolute; top: 0; left: 0; }
@media screen and (max-width:767px){
  .Area_top .top_PD  { top: 3vw;  }
}




 .Area00 .bg { z-index: -1; position: absolute; top: -115px; left: 50%; transform: translateX(-50%); }
 .Area00 .title{position:absolute;left: 383px;top: 30px; width: 45%; z-index: 99; }
 .Area00 .title img {width: 100%;}
 .Area00 .Area_swiper_box .PD_layout li{  background: #00000000; }
 .Area00 li { padding: 25px 75px 0 75px  !important; }
 .Area00 .PD_layout_1 .PD_img { width: 45% !important; padding: 0 !important; border: 5px solid #ee945d; margin-right: 45px; }
 .Area00 .Area_swiper_box .PD_layout li, .Area00  .Area_swiper_box .PD_layout li .PD_img img { border-radius: 0; }
 .Area00 .PD_layout a,.Area00 .PD_layout .PD p,.Area00 .PD_layout .PD p del { color: #0a6576; }
 .Area00 .PD_layout[data-pd-direction=row] .PD_into,.Area00 .PD_layout[data-pd-direction=row-reverse] .PD_into { width: 57% !important;  }
 .Area00 .PD_layout .PD h3 { font-size: 20px; }
 .Area00 .PD_layout .PD h4 { font-size: 24px; font-weight: 800; }
 .Area00 .PD_layout .PD p .money{ font-size: 24px;  }
 .Area00 .PD_layout .PD p .Price { font-size: 40px;  }
 .Area00 .PD_layout .PD p b,.Area00 .PD_layout .PD p del { font-size: 24px;  }

 @media screen and (max-width: 767px) {
  .Area00 .bg { top: -6vw; width: 100%; }
  .Area00 .title{left: 41vw;top: -1vw; width: 40%; z-index: 99; }
  .Area00 li { padding: 1vw 2vw 0 2vw  !important; }
  .Area00 .PD_layout_1 .PD_img { width: 36% !important; padding: 0 !important;  margin-right: 5vw; }
  .Area00 .PD_layout[data-pd-direction=row] .PD_into,.Area00 .PD_layout[data-pd-direction=row-reverse] .PD_into { width: 57% !important;  }
  .Area00 .PD_layout_1 .PD_into { padding-top: 8vw; }

  .Area00 .PD_layout .PD h3 { font-size: 3.5vw; }
  .Area00 .PD_layout .PD h4 { font-size: 4vw; font-weight: 800; }
  .Area00 .PD_layout .PD p .money{ font-size: 4.5vw;  }
  .Area00 .PD_layout .PD p .Price { font-size: 7.5vw;  }
  .Area00 .PD_layout .PD p b,.Area00 .PD_layout .PD p del { font-size: 4vw;  }

}

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

}


@media screen and (max-width:767px){
  .Area03 li:nth-child(7)  { left:15vw ; }
  .Area03 li:nth-child(8)  { left:15vw ; }

}




  .Area04  {  padding-top: 65px; }

  .Area04 .PD_layout_1 {  margin-bottom: 30px;  }
  .Area04 .PD_layout_2 {  border: 2px solid #fabc41; }
  .Area04 .PD_layout_3 {  border: 2px solid #79bfcf; }
  .Area04 .PD_layout_4 {  border: 2px solid #f88d4e; }
  .Area04 .PD_title span:nth-child(1) { color: #fff; }
  @media screen and (max-width:767px){
    .Area04  {  padding-top: 0vw; }
    .Area04 .PD_title span {  line-height: 11vw; }
    .Area04 .PD_layout_1 {  margin-bottom: 3vw; width: 90%; }

  }


  .repeatbg {  }
  .repeatbg .bg_top { z-index: -4; position: absolute; top: 0; left: 50%; transform: translateX(-50%); }
  .repeatbg::after { content: ""; z-index: -4; display: block; background: url(Areabg01_repeat.png?t=1768448652283) repeat-y center bottom ; width: 2000px;  background-size: 100%;  height: calc(100% - 92px); position: absolute; top: 143px; left: 50%; transform: translateX(-50%);  }
  .repeatbg::before { content: ""; z-index: -4; display: block; background: url(Areabg01_bottom.png?t=1768448652283) no-repeat center ; width: 2000px;  background-size: 100%;  height: 38px; position: absolute; bottom: -89px; left: 50%; transform: translateX(-50%);   }
  @media screen and (max-width: 767px){
    .repeatbg {  background: url(Areabg01_top_m.png?t=1768448652283) no-repeat center top; padding: 8vw 0 0 0; width: 100%; background-size: 100%;  }
    .repeatbg::after {   background: url(Areabg01_repeat_m.png?t=1768448652283) repeat-y center bottom ; width: 100%;   height: calc(100% - 34vw);  top: 8vw; left: 0%; transform: translateX(0%); background-size: 100%;  }
    .repeatbg::before {  background: url(Areabg01_bottom_m.png?t=1768448652283) no-repeat center ; width: 100%;  height: 30vw; bottom: -16vw; left: 0%; transform: translateX(0%); background-size: 100%;  }
    
  }
  


/*Appletxt*/
.apple_txt{position: relative;padding:30px 0;color: #4f4f4f;font-size: 12px;text-align: center;top: 0;z-index:2;/* background: url(Area04bg.jpg?t=1768448652283) top center repeat-y; */}
	@media screen and (max-width:767px){
	.apple_txt{position: relative;padding:2%;color: #6b6b6b;padding-bottom: 4vw;z-index: 99;top: 0;}
	}



/*隱鑶*/
.for_pc {}

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