@charset "utf-8";
/* CSS Document */

/*基本*/
body{ margin:0; padding:0; background-color: #bbaff8;}

/*PC縮小*/
@media screen and (min-width: 768px) {
  body{background-color:#bbaff8;}
	
}


/*全BOX版面*/
.WRAPPER { z-index:0; position: relative; display:block; margin: 0 auto; padding:0; overflow: hidden; width:100%; min-width: 1220px; max-width: 2000px;text-align:left; font-family:"Century Gothic","微軟正黑體","Microsoft JhengHei",Helvetica;}
.WRAPPER img { border:0px; vertical-align:top;}
.WRAPPER a { text-decoration:none; -webkit-tap-highlight-color: transparent}
/*預設清單樣式*/
.Area .list_00 ul { display:inline-block; margin:0; padding:0;}
.Area .list_00 li { list-style:none; float:left; overflow: hidden;}
	@media screen and (max-width:767px){
		.WRAPPER { min-width: inherit; min-height:100vh;}
		.WRAPPER img { width:100%;  height: auto;}
	}


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

.bggold {background-image: linear-gradient(to right, #0a1941, #0a1941, #0a1941);padding: 10px 10px 35px 0;box-sizing: border-box;margin-top: 30px;margin-bottom: 80px;border-radius:15px !important;}
  @media screen and (max-width:767px){
   .m_bgdeco { z-index: 0; position: absolute; top:10vw; left: 0; width: 100%;height: 100%; background: url(m_bgdeco.png?t=1776329079677) repeat-y center top; transition: 0.5s linear; pointer-events: none;background-size:100% ;}
   .m_bgtop { z-index: 0; position: absolute; top: 10vw; left: 0; width: 100%;  height: 100%; background: url(m_bg01.jpg?t=1776329079677) no-repeat center top;background-position: center top;background-repeat: no-repeat; pointer-events: none; background-size: 100%; }	
   .bgblack {background: #0a1941;border: solid 1px;border-image: linear-gradient(to right, #0a1941, #0a1941) 1;padding: 5vw 0 2vw;width: 98%;margin: -5vw auto 0;border-radius:0vw ;}
   .bggold {border: solid 0px;padding: 2vw 0.3em 5vw;width: 98%;margin: -1vw auto 0;border-radius:2vw !important;margin-bottom:9vw ;}
  }


  @keyframes zoom {
    from { transform: scale3d(1.2, 1.2, 1.2);}
    100% { transform: scale3d(1, 1, 1);}
  }
  @keyframes downIn {
    from { transform: translateY(10px);}
    100% { transform: translateY(0);}
  }
  


/*區塊背景-共用設定*/
.Area_bg { pointer-events: none; z-index: -1;}
.Area_bg div { pointer-events: none; z-index: 1; position: absolute; left: 0; width: 100%; background-position: center top; background-repeat: no-repeat;}
    @media screen and (max-width: 767px) {
      .Area_bg div { pointer-events: none; z-index: -1; position: absolute; left: 0; width: 100%; background-position: center top; background-repeat: no-repeat;}
      .Area_bg div { z-index: 1; top: 0vw; padding-bottom: 200%; background-size: 100%;}
    }
    /*圖片*/
    /*.Area_share_bg { z-index: 2;}*/
      @media screen and (min-width: 768px) {
        .Area_activ_bg div { top: -133px; height: 1000px; position: absolute;}
      }
      @media screen and (max-width: 767px) {
        .Area_activ_bg div { top: -17.5vw; height: 0; padding-bottom: 110%; background-size: 100%;}
      }



.Area_bottom{ margin-bottom: 70px !important; }
@media screen and (max-width:767px){
	.Area_bottom{ margin-bottom: 7vw !important; }
}


/*版頭*/
.Area_top .momologo { z-index:8; position: absolute; top: 0px; left:10px;}
.Area_top .momologo a { display:block; width:172px; height:100px; background: url(momo_logo.png?t=1776329079677) no-repeat;}
.Area_top .momologo a:hover{ background: url(momo_logo_on.png?t=1776329079677) no-repeat;}
	@media screen and (max-width:767px){
		.Area_top { height: auto;}
		.Area_top .m_momologo { width:21%; position:absolute; z-index:5; top:2vw; left:2vw;}
    /*提醒我按鈕*/
    a.mo_remind_btn { z-index:10; position: absolute !important; right: 0; bottom: -7.5vw; width: 16%;}    
	}

  @media screen and (min-width:768px){
    .light_02{position: absolute;width: 49.7%;left: 677px;top: 100px;z-index: 999;pointer-events: none;animation: fadeInUp_s 5.5s .5s infinite;opacity: 0;mix-blend-mode: color-dodge;}
    .light_02 img{width: 100%;}
    .light_03{position: absolute;width: 59.7%;left: 777px;top: 50px;z-index: 999;pointer-events: none;animation: fadeInUp_s 5.5s 1.5s infinite;opacity: 0;mix-blend-mode: color-dodge;}
    .light_03 img{width: 100%;}
   
    }
    @media screen and (max-width: 767px){
    .light_02{display:none ;}
   /* .light_02 {position:absolute;width: 76%;top:15.5vw;left:10vw;pointer-events:none;animation: fadeInUp_s 5.5s .5s infinite;opacity:0;mix-blend-mode: color-dodge;}
    .light_02 img{width: 100%;}*/
    .light_03{display:none ;}
    /*.light_03 {position:absolute;width: 76%;top:10.5vw;left: 10vw;pointer-events:none;animation: fadeInUp_s 5.5s 1.5s infinite;opacity:0;mix-blend-mode: color-dodge;}
     .light_03 img{width: 100%;}*/
    }


/*版頭品*/
  .Area_title{ position:relative;width:1220px ;height:700px; box-sizing: border-box;margin:0 auto ;}
  .Area_title .topPD { z-index:99; position: absolute; top:54px; right:58px;width:960px;margin:0 auto ;  }
  .Area_title .topPD ul.PD_wrapper { display: flex; flex-wrap: nowrap; margin: 0; padding: 0; width: 100%; box-sizing: content-box; grid-gap: inherit;}
  .Area_title .topPD ul.PD_wrapper li { flex-shrink: 0; margin: 0; padding: 0; opacity: 0; transform: translate(5%,0);}
  .Area_title .topPD ul.PD_wrapper li.swiper-slide-active { opacity: 1; transition: .8s ease-out; transform: translate(0,0);}	
  .Area_title .topPD .PD_layout .PD_img { width:90%;}

@media screen and (max-width:767px){
  .Area_title .topPD { z-index:99; position: absolute; top: -2vw; right:-4vw; width: 110%;}
  .Area_title .topPD .PD_layout .PD_logo{ border: none; position: relative; top: -3vw; left: 0vw; width: 100% !important;}
  .Area_title .topPD .PD_layout ul { gap: 4vw; padding: 0;}
  .Area_title .topPD ul.PD_wrapper { display: flex; flex-wrap: nowrap; margin: 0; padding: 0; width: 80%; box-sizing: content-box; grid-gap: inherit;}
  .Area_title .topPD ul.PD_wrapper li { flex-shrink: 0; margin: 0; padding: 0; opacity: 0; transform: translate(5%,0);}
  .Area_title .topPD ul.PD_wrapper li.swiper-slide-active { opacity: 1; transition: .8s ease-out; transform: translate(0,0);}	
  /* .topPD .PD_layout[data-pd-li*=BN-AWD] .PD_img { display: block !important;} */
}





    /*日期*/
    .Area_title .box_txt2 { z-index: 10;position: absolute;top: 25px; left: 742px;width:100%;}
    .Area_title .box_txt2 .PD_layout h3{ color: #ffffff!important; font-size:43px;  font-family: "Century Gothic","Noto Sans TC"; font-weight: 700;}


    /*副標輪播*/
    .Area_title .Area_topSUB {position: absolute;z-index: 999 !important;top:195px;left:178px;width:597px;}
    .Area_title .Area_topSUB ul.PD_wrapper { display: flex; flex-wrap: nowrap; margin: 0; padding: 0; width: 100%; box-sizing: content-box; grid-gap: inherit;}
    .Area_title .Area_topSUB ul.PD_wrapper li { flex-shrink: 0; margin: 0; padding: 0; opacity: 0; transform: translate(5%,0);}
    .Area_title .Area_topSUB ul.PD_wrapper li.swiper-slide-active { opacity: 1; transition: .8s ease-out; transform: translate(0,0);}	





@media screen and (max-width:767px){
.Area_title {z-index:9 ; height:70vw;width:100% ;}



    /*日期*/
    .Area_title .box_txt2 { z-index: 10;position: absolute;top: 1vw; left: 63.5vw;width:100%;}
    .Area_title .box_txt2 .PD_layout h3{ color: #ffffff!important; font-size:20px;  font-family: "Century Gothic","Noto Sans TC"; font-weight: 700;} 



    /*副標輪播*/
    .Area_title .Area_topSUB {position: absolute;top:18vw;left: 3vw;width:70%;}
    .Area_title .Area_topSUB img { width:100% !important;}
    .Area_title .Area_topSUB ul.PD_wrapper { display: flex; flex-wrap: nowrap; margin: 0; padding: 0; width: 80%; box-sizing: content-box; grid-gap: inherit;}
    .Area_title .Area_topSUB ul.PD_wrapper li { flex-shrink: 0; margin: 0; padding: 0; opacity: 0; transform: translate(5%,0);}
    .Area_title .Area_topSUB ul.PD_wrapper li.swiper-slide-active { opacity: 1; transition: .8s ease-out; transform: translate(0,0);}	
    .Area_title .PD_wrapper {background-color: rgba(255,255,255,0.00);}
    .Area_title .PD_layout[data-pd-li*="BN"] li{border: rgba(255,255,255,0.00);}	

}




/*活動倒數*/
.TimerNick {position: absolute;top: 290px;left:185px;display: inline-block;z-index:8;text-align: center;letter-spacing: 0.1em;font-family: Arial, Helvetica, sans-serif;color: #fff;font-size: 30px;}
.TimerNick .FontStyle {display: inline-block;margin: 0 0 0 -2px;padding: 0;border: 0;font-size: 39px;color: #fff;font-weight: normal;letter-spacing:0px;text-align: left;font-weight:600 ;}
.TimerNick span {padding-left: 5px;font-size: 28px;letter-spacing: 0.1em;color: #fff;}
.TimerNick b { font-weight: normal;}
@media screen and (max-width:767px){
  .TimerNick  {width:100%;top: 28vw;left:5.8vw;display: flex;column-gap: 0.1em;text-align: left;font-size:1.0em;}
  .TimerNick .FontStyle {margin: -0.15em 0 0 0em;padding: 0;border: 0;font-size: 1.3em;letter-spacing:- 0.09em;}
  .TimerNick span {padding-left: 0;font-size: 1.2em;letter-spacing: -0.07em;margin-left:-0.2em;margin-right: 0.0em;}
  .TimerNick span:first-child{ margin-top: -0.1em; }
}  

/*去除PD_layout樣式*/
.PD_noBG ul { background-color: transparent; width: 100%; padding: 0;}
.PD_noBG ul li { border: none; /*background-color: #fff;*/}





/*區標(線上入稿)*/
@media screen and (min-width:767px){
  .box_txt2 {position: relative;top:0;background-image:url("m_box_txt_bg.png?t=1776329079677"); background-size: 100%;width: 960px; height:160px;overflow: hidden;background-repeat:no-repeat;margin: 0px auto;}
  .box_txt2 .PD_layout ul {padding: 0;margin-top:58px;list-style: none;height:100%!important;}
  .box_txt2 .PD_layout ul li { background-color: transparent; pointer-events: none;}
  .box_txt2 .PD_layout ul li h3 {position: relative;z-index: 1;font:48px/48px Arial, "Noto Sans TC", "Century Gothic", "Microsoft JhengHei", system-ui, Helvetica;float: center;color:transparent;background: linear-gradient(180deg, #FFF, #ffd785 70%, #ffF) /* 設定漸層背景 */;
    -webkit-background-clip: text; background-clip: text/*讓背景只顯示在文字上 */;width: 100%;margin: 0 auto;padding: 0;font-weight: 600;font-style:normal;}	
  .box_txt2 .PD_layout .PD_into {padding: 0!important;}	
  }
  @media screen and (max-width:767px){
  .box_txt2 {position: relative;width: 103%;height:14vw;margin-bottom: 1.5vw;background-image:url(m_box_txt_bg.png?t=1776329079677);background-repeat: no-repeat; background-size: 100%;z-index: 20;overflow: hidden;}	
  .box_txt2 .PD_layout ul {margin-top:3vw;list-style: none;}
  .box_txt2 .PD_layout ul li { background-color: transparent; pointer-events: none;}
  .box_txt2 .PD_layout ul li h3 {position: relative;top:1.5vw;margin: 0;padding: 0;width: 100%;height: 8vw;font:6vw/6vw  Arial, "Noto Sans TC", "Century Gothic", "Microsoft JhengHei", system-ui, Helvetica;text-align: center;color:#fff;letter-spacing: 0;overflow: hidden;font-weight:600;/*text-shadow: 0px 0px 5px #000;*/font-style:normal;}
  }

/*小區標(線上入稿)*/
@media screen and (min-width:767px){
  .box_txt3 {position: relative;top:0;background-image:url("m_box_txt_bg2.png?t=1776329079678"); background-size: 100%;width: 960px; height:112px;overflow: hidden;background-repeat:no-repeat;margin: 0px auto;}
  .box_txt3 .PD_layout ul {padding: 0;margin-top:38px;list-style: none;height:100%!important;}
  .box_txt3 .PD_layout ul li { background-color: transparent; pointer-events: none;}
  .box_txt3 .PD_layout ul li h3 {position: relative;z-index: 1;font:48px/48px Arial, "Noto Sans TC", "Century Gothic", "Microsoft JhengHei", system-ui, Helvetica;float: center;color:transparent;background: linear-gradient(180deg, #4c31cb, #4c31cb 70%, #4c31cb) /* 設定漸層背景 */;
    -webkit-background-clip: text; background-clip: text/*讓背景只顯示在文字上 */;width: 100%;margin: 0 auto;padding: 0;font-weight: 600;font-style:normal;}	
  .box_txt3 .PD_layout .PD_into {padding: 0!important;}	
  }
  @media screen and (max-width:767px){
  .box_txt3 {position: relative;width: 103%;height:11vw;margin-bottom: 2vw;background-image:url(m_box_txt_bg2.png?t=1776329079678);background-repeat: no-repeat; background-size: 100%;z-index: 20;overflow: hidden;}	
  .box_txt3 .PD_layout ul {margin-top:3vw;list-style: none;}
  .box_txt3 .PD_layout ul li { background-color: transparent; pointer-events: none;}
  .box_txt3 .PD_layout ul li h3 {position: relative;top:0vw;margin: 0;padding: 0;width: 100%;height: 8vw;font:6vw/6vw  Arial, "Noto Sans TC", "Century Gothic", "Microsoft JhengHei", system-ui, Helvetica;text-align: center;color:#4c31cb;letter-spacing: 0;overflow: hidden;font-weight:600;/*text-shadow: 0px 0px 5px #000;*/font-style:normal;}
  }



/*攻略區塊*/
.Area_activ .box_tab2{ margin-top: 2%; }
.warningTxt { position: relative; }
  @media screen and (min-width:768px){
    .Area_activ .activ01{ margin: 0px 0 0px -10px; }
    .Area_activ .activ01 img{ width:960px !important }
  }
  @media screen and (max-width:767px){
    .Area_activ{ margin-top: 8vw;}
    .Area_activ .activ01{ margin: 0vw 0 0vw -1vw }
    .Area_activ .activ01 img{ width:103% !important }
  }

/*2-主打3品*/
@media screen and (max-width:767px){
  .Area02 .PD_layout ul {width:96% ;
  }
  }
  



/*4-優惠攻略*/

.Area04 .PD_wrapper {background-color: transparent;width:85% ;}
.Area04 .PD_layout li {border-right:0px solid !important ;}
/*.Area04 .PD_layout .PD img {width:80% ;}*/
@media screen and (max-width:767px){
  .Area04 .PD_wrapper {width:97% ;padding:0 !important ;} 

}
/*5-登記區*/
@media screen and (max-width:767px){
.Area05 .Area_danji{width:96% ;
}}


/*6-主打公版*/
@media screen and (max-width:767px){
.Area06 .PD_layout ul {width:96% ;
}
}


/*7-副打公版*/
@media screen and (max-width:767px){
  .Area07 .PD_layout ul {width:96% ;
  }
  }
/*品類*/
.Area_flags .PD_layout {
  width: 960px;
  margin: 0 auto;
  box-sizing: border-box;
}

.Area_flags .PD_layout .PD_wrapper {
  width:90% ;
  display: grid;
  /*grid-template-columns: repeat(4, 1fr);  /* 每排 4 欄 */
  gap: 5px;
  padding: 0;
  margin: 0 auto;
  list-style: none;
}

/* 防止外部樣式影響li寬度（像 slider 可能寫死 width） */
.Area_flags .PD_layout .PD_wrapper > .PD_slide {
  width: auto !important;
}

.Area_flags .PD_layout .PD_wrapper > .PD_slide .PD_img img {
  width: 100%;
  height: auto;
  display: block;
}

@media (max-width: 767px) {
  .Area_flags { width: 100%; }
  .Area_flags .PD_layout { width: 96%; }
}



/*品牌旗艦館*/
.Area_brand .PD_layout {
  width: 960px;
  margin: 0 auto;
  box-sizing: border-box;
}

.Area_brand .PD_layout .PD_wrapper {
  width:100% ;
  display: grid;
  grid-template-columns: repeat(1, 1fr);  /* 每排 3 欄 */
  gap: 10px;
  padding: 0;
  margin: 0 auto;
  list-style: none;
}

/* 防止外部樣式影響li寬度（像 slider 可能寫死 width） */
.Area_brand .PD_layout .PD_wrapper > .PD_slide {
  width: auto !important;
}

.Area_brand .PD_layout .PD_wrapper > .PD_slide .PD_img img {
  width: 100%;
  height: auto;
  display: block;
}

@media (max-width: 767px) {
  .Area_brand { width: 100%;margin:0 auto ; }
  .Area_brand .PD_layout { width: 100%; }

}


  

/*黏人精*/
.Area_hammerAD { z-index: 9999; 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;}
}
