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

/*基本*/
body{ margin:0; padding:0; background: #e1e7ef; }


/*全BOX版面*/
.WRAPPER { z-index:0; position: relative; display:block; margin: 0 auto; padding:0; overflow: hidden; width:100%; min-width: 1220px; 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 (min-width: 768px) {
		.WRAPPER { max-width: 2000px;}
	}
	@media screen and (max-width:767px){
		.WRAPPER { min-width: inherit; min-height:100vh;}
		.WRAPPER img { width:100%;  height: auto;}
	}


/*fixed背景*/
.pc_bg { z-index:2; position:fixed;top:0;left:0; width:100%; height:100vh; background-repeat:no-repeat; background-position:center top; pointer-events:none; }
  @media screen and (max-width:767px){
   .m_bg{ z-index: 5; position: fixed; top:0; left: 0; width: 9%; height:15vw; background-position: center top; background-repeat: no-repeat; pointer-events: none; background-size: 100%;}	
  }

/*PC背景*/
.Area_bgtop { z-index: 0; position: absolute; top: 0; left: 50%; width: 2000px; -webkit-transform: translateX(-50%); transform: translateX(-50%); pointer-events: none;}
.Area_bgtop .bgtop_ { position: absolute; top: 0; left: 0; width: 100%; height: 1314px;}
.Area_bgtop .bgtop_ span { position: absolute; display: block; width: 100%; height: 100%; background-position: center top;}
  @media screen and (min-width: 768px) {
    .Area_bgtop span { background-repeat: no-repeat;}
    .Area_bgtop_fixed { position: fixed;}
    .Area_bgtop_1 .bgtop_1_0 span { background-image: url(bg_repeat.jpg?t=1764641850582); background-repeat: repeat-y;}
    .Area_bgtop_1 .bgtop_1_1 span { background-image: url(bgtop_1_1.jpg?t=1764641850582);}
  }

/*Phone背景*/
.m_Area_bgtop { z-index: 0; position: absolute; top: 0; left: 0; width: 100%; height: 100%; pointer-events: none;}
.m_Area_bgtop .m_bgtop_ { position: absolute; top: 44px; left: 0; width: 100%; height: 100%; }
.m_Area_bgtop .m_bgtop_ span {position: absolute; display: block; width: 100%; height: 100%; overflow: hidden; background-position: center top; background-size: 100%;}
  @media screen and (max-width: 767px) {
    .m_Area_bgtop span { background-repeat: no-repeat;}
    .m_Area_bgtop_fixed { position: fixed; top: 32px;} /*搭配js-appBgFixed*/
    .m_Area_bgtop_1 .m_bgtop_1_1 span {   background-image: url(m_bgtop_1_1.jpg?t=1764641850582); }
	/* .m_Area_bgtop_1 .m_bgtop_1_2 span {   background-image: url(m_bgtop_1_2.png?t=1764641850582); mix-blend-mode: screen; } */
  }




/*區背景*/
.Area_bg{ position: relative; pointer-events: none;}
.Area_bg div { pointer-events: none; position: absolute;  background-position: center top; background-size: 100%;}

.Area04_bg .Area04_bgtop{  top: -68px; left: 0; background-repeat: no-repeat; width:2000px; height: 1000px;}
.Area04_bg .Area04_bgcenter{  top: 522px; left: 0; background-repeat: repeat-y; width: 2000px; height: 600px;}
.Area04_bg .Area04_bgbottom{  bottom: 50px;  left: 0; background-repeat: no-repeat; width: 2000px; height: 857px; z-index: -1;}

.Area04_bg .m_Area04_bgtop{ top: -4vw; left: 0; background-repeat: no-repeat; width:100%; height: 100vh; background-size: 100%;}
.Area04_bg .m_Area04_bgcenter{  top: 50vw; left: 0; background-repeat: repeat-y; width:100%; height: 514vw; background-size: 100%; z-index: -1;}
.Area04_bg .m_Area04_bgbottom{ top: -54vw; left: 0; background-repeat: no-repeat; width:100%; height: 50vw; background-size: 100%; z-index: -1;}

.Area05_bg .Area05_bgall{  top: -21px; left: 0; background-repeat: no-repeat; width:2000px; height: 1000px; z-index: -1;}
.Area05_bg .Area05_bgbox{  top:577px; left: 739px; background-repeat: no-repeat; width:534px; height:308px; background-size: 100%; z-index: 3;}
.Area05_bg .m_Area05_bgall{  top: -1.5vw; left: 0; background-repeat: no-repeat; width:100%; height: 100vh; background-size: 100%; }
.Area05_bg .m_Area05_bgbox{  top: 60.5vw; left: 21vw; background-repeat: no-repeat; width:56vw; height: 20vw; background-size: 100%; z-index: 3;}

.Area06{ position: relative; }
.Area06_bgtop{ position: absolute; top: 2px; left: -390px; background-position: center top; background-size: 100%; background-repeat:no-repeat; width:2000px; height: 324px; z-index: -1;}
.Area06_bgcenter{ position: absolute; top: 320px; left: -390px; background-position: center top; background-size: 100%; background-repeat:repeat-y; width:2000px; height: 370px; z-index: -1;}
.Area06_bgbottom{ position: absolute; top: 560px; left: -390px; background-position: center top; background-size: 100%; background-repeat:no-repeat; width:2000px; height: 560px; z-index: -1;}
.m_Area06_bgtop{ position: absolute; top: -3vw; left: 0; background-position: center top; background-size: 100%; background-repeat:no-repeat; width:100%; height: 65vw; z-index: -1;}
.m_Area06_bgcenter{ position: absolute; top: 44vw; left: 0; background-position: center top; background-size: 100%; background-repeat:repeat-y; width:100%; height: 241vw; z-index: -1;}
.m_Area06_bgbottom{ position: absolute; bottom:-3vw; left: 0; background-position: center top; background-size: 100%; background-repeat:no-repeat; width:100%; height: 20vw; z-index: -1;}

.Areabottom_bg .Areabottom_bgtop{  top: -255px; left: 0; background-repeat: no-repeat; width:2000px; height: 565px; z-index: -1; }
.Areabottom_bg .m_Areabottom_bgtop{ top: 7.5vw; left: 0; background-repeat: no-repeat; width:100%; height: 100vh; background-size: 100%; }

@media screen and (max-width: 767px) {
.m_side_L:before{ position: absolute; left: 0; top: 20vw; content: ""; width: 12vw; height: 20vw; background: url(m_side_L.png?t=1764641850582) no-repeat center / 100%; z-index: 10; animation:drop1 2s infinite alternate ease-in-out ;}
.m_side_R:before{ position: absolute; right: 0; top: 20vw; content: ""; width: 12vw; height: 20vw; background: url(m_side_R.png?t=1764641850582) no-repeat center / 100%; z-index: 10; animation:drop2 2s infinite alternate ease-in-out ;}
}

@keyframes drop1{
  0%{ transform: translateY(0); }
  100%{ transform: translateY(15px); }
}
@keyframes drop2{
  0%{ transform: translateY(15px); }
  100%{ transform: translateY(0); }
}


/*區標(線上入稿)*/

.box_txt{ position: relative; margin: 0 auto;}


.box_txt::before {content:"";position: absolute;display:block;top:-10%;left: 0;width: 100%;height: 100%;pointer-events:none;background: url("m_box_txt_bg.png?t=1764641850582") center top/100% no-repeat scroll;}
.box_txt-b::before {content:"";position: absolute;display:block;top:-10%;left: 0;width: 100%;height: 100%;pointer-events:none;background: url("m_box_txt_bg-b.png?t=1764641850582") center top/100% no-repeat scroll;}
.box_txt-c::before {content:"";position: absolute;display:block;top:-10%;left: 0;width: 100%;height: 100%;pointer-events:none;background: url("m_box_txt_bg-c.png?t=1764641850582") center top/100% no-repeat scroll;}
.box_txt2::before {content:"";position: absolute;display:block;top:-10%;left: 0;width: 100%;height: 100%;pointer-events:none;background: url("m_box_txt_bg2.png?t=1764641850582") center top/100% no-repeat scroll;}
.box_txt3::before {content:"";position: absolute;display:block;top:-10%;left: 0;width: 100%;height: 130%;pointer-events:none;background: url("m_box_txt_bg3.png?t=1764641850582") center top/100% no-repeat scroll;}

.box_txt .PD_layout .PD h3 {color:#282828;font-size: 3.5em;line-height: 2.1em; font-weight: 700;font-family:"Century Gothic","Noto Sans TC";}
.box_txt2 .PD_layout .PD h3{ color:#fecb00; }
.box_txt3 .PD_layout .PD h3{ color:#fff; transform: rotate(-1.7deg); }

.box_txt .box_title_deco1{ position: absolute; left: 10%;  top: 34%;  width: 6%; height: auto; animation: flower 3s infinite linear;} 
.box_txt .box_title_deco2{ position: absolute; right: 5%;  bottom: 10%;  width: 3%; height: auto; height: auto; animation: star1 3s infinite ease-in-out alternate; } 
.box_txt .box_title_deco3{ position: absolute; right: 17.5%;  bottom: 10%;  width: 6%; height: auto;  animation: star2 3s infinite ease-in-out alternate; } 

.box_txt3 .box_title_deco1{  left: 71%; } 

.box_txt li:hover{ transform: none!important; }
.box_txt a{ pointer-events: none;}
.box_txt h3 span{ overflow: visible!important;}

@media screen and (min-width:768px){
  .box_txt {  width: 960px; margin-bottom: 20px; }
  .box_txt .box_title_deco1{ top: 30%; }
  .box_txt .box_title_deco2, .box_txt .box_title_deco3{ bottom: 2%; }

}

@media screen and (max-width:767px){
  .box_txt .PD_layout .PD h3 {font-size: 1.5em;line-height: 13vw; }

  .box_txt {margin: 0 auto 2vw; }
  .box_txt::before{ top:0; }

}


@keyframes flower{
  0%{ transform: rotate(0); }
  100%{ transform: rotate(360deg); }
}

@keyframes star1{
  0%{ opacity: 0; }
  60%{ opacity: 100%; }
  100%{ opacity: 100%; }
}

@keyframes star2{
  0%{ opacity: 100%; }
  60%{ opacity: 100%; }
  100%{ opacity: 0; }
}



.Area_bottom{ margin-bottom: 80px; }
@media screen and (max-width:767px){
	.Area_bottom{ margin-bottom: 6.5vw; }
  .m96 { width: 96%; }
}



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



/*logo*/
.Area_top .momologo { z-index:8; position: absolute; top: 0px; left:-156px;}
.Area_top .momologo a { display:block; width:172px; height:100px; background: url(momo_logo.png?t=1764641850582) no-repeat;}
.Area_top .momologo a:hover{ background: url(momo_logo_on.png?t=1764641850582) no-repeat;}
	@media screen and (max-width:767px){
		.Area_top { height: auto;}
		.Area_top .m_momologo { width:20%; position:absolute; z-index:5; top:27vw; left:3.5vw;}
    /*提醒我按鈕*/
    a.mo_remind_btn { z-index:10; position: absolute; right: 0; bottom: -1.5vw; width: 14%;}    
	}



/*版頭*/
.Area_title { }
.Area_title .box_1 { height: 585px; }
.Area_title .maintitle { position: absolute; width: 752px;  }
.Area_title .maintitle img {  width: 100%; }
.Area_title .PD_layout[data-pd-li=BN] ul,.PD_layout[data-pd-li=BN-AWD] ul, .PD_layout[data-pd-li=PDBN] ul { padding: 0; grid-gap:0; }
/* 關掉公版li白色背景 */
.Area_title .Area_swiper_box .PD_layout li { background: 00000000; }
  /*版頭品輪播*/
  .Area_swiper2{ position: absolute; z-index: 99; }  
  @media screen and (min-width:768px){
    .Area_swiper2{ top: 0; right: 34px; width: 66%;}
    .Area_swiper2 .swiper-pagination{  bottom: auto!important; left: -93px; top:427px; transform: scale(1.5,3);}
  }
  @media screen and (max-width:767px){
    .Area_swiper2 { top: 24vw; left: 4vw; z-index: 99; width: 90%; }
    .Area_swiper2 .PD_img {  width: 100%; }
    .Area_swiper2 .swiper-pagination{  bottom: auto!important; left: -41vw; top:48vw;}
  }

  /* 副標 */
  .Area_title .sub { width: 35%; position: absolute; top: 430px; right: 46px; z-index: 100; }

  
/* 版頭品公版 */

  /*輪播品背景*/
  .igheart::after{ content: ""; position: absolute; background: url(heart.png?t=1764641850582) no-repeat center / 100%; z-index: 100; animation: heart 1s infinite;}
  @media screen and (min-width:768px){
    .Area_title .top_PD { margin-top: 39px; margin-left: 133px; }
  .Area_title::before{ content: ""; width:1220px;height: 105px; position: absolute; background: url(deco_momoco_pc.png?t=1764641850582) no-repeat center / 100%; z-index: 1; top: 544px; left: -17px;}
  .Area_bgtop_2 .bgtop_1_1 span { background-image: url(topPD_bg01.png?t=1764641850582); top:548px;}
  .Area_bgtop_2 .bgtop_1_2 span { background-image: url(topPD_bg02.png?t=1764641850582); top:629px; background-repeat: repeat-y; height: 34%;}
  .Area_bgtop_2 .bgtop_1_3 span { background-image: url(topPD_bg03.png?t=1764641850582); top:1031px;}
  .igheart::after{ width: 42px; height: 42px; left: 34px; bottom: -1px; }
  }
  @media screen and (max-width:767px){
    .Area_title .top_PD { margin-top: 3vw;  }
  .Area_title::before{ content: ""; width:100%;height: 10vw; position: absolute; background: url(deco_momoco.png?t=1764641850582) no-repeat center / 100%; z-index: 100; top: 84.5vw; left: 0;}
  .m_Area_bgtop_2 .m_bgtop_1_1 span {  background-image: url(m_topPD_bg01.png?t=1764641850582); top: 73vw;}
  .m_Area_bgtop_2 .m_bgtop_1_2 span {  background-image: url(m_topPD_bg02.png?t=1764641850582); top: 82vw; background-repeat: repeat-y; height: 40%;}
  .m_Area_bgtop_2 .m_bgtop_1_3 span {  background-image: url(m_topPD_bg03.png?t=1764641850582); top: 142vw;}
  .igheart::after{ width: 4.5vw; height: 4.5vw; left: 6vw; bottom: 3vw; }
  }


	@media screen and (max-width:767px){
    .Area_title .box_1 { height: 90vw; }
    .Area_title .maintitle {  width: 100%;  } 
    .Area_title .Area_swiper_box .PD_layout1 ul { margin-left: 0; } 
    .Area_title .sub { z-index: 999; width: 55%; position: absolute; top: 71vw; right: 0.5vw; }
	}


  @keyframes heart{
    0%{ opacity: 1; transform: translateY(0);}
    100%{ opacity: 0;  transform: translateY(-200%);}
  }

/*閃光*/
.lightSweep { background: none 0% 0% / auto repeat scroll padding-box border-box rgba(0, 0, 0, 0); overflow: hidden; pointer-events: none;
  filter: brightness(2);
  mask-size: 300% 200%;
  mask-image: -webkit-linear-gradient( -70deg, rgba(255, 255, 255, 0) 40%, rgba(255, 255, 255, 1) 50%, rgba(255, 255, 255, 0) 60%);
  transition: -webkit-mask-position;
  animation-timing-function: linear;
  transform: translate3d(0, 0, 0);
  transition-duration: 3s;
  animation: move 3s ease-in-out infinite;
}

@keyframes move {
  from {
    mask-position: 0% 0px;
  }
  to {
    mask-position: 150% 0;
  }
}



/** 倒數 **/
.TimerNick { text-shadow: none; display: flex; justify-content:center;}
.TimerNick .time_day{ position: relative; }
.TimerNick .TIMER { margin: 0; padding: 0; text-align: center; color: #464646; font-size: 28px; line-height: 40px; font-weight: 800; font-family:"微軟正黑體","Microsoft JhengHei", Arial, Helvetica; overflow: visible;}
.TimerNick span { float: left;}
.TimerNick small { float: left; position: relative; top: 0; font-size: 28px; margin-right: 10px; margin-left: 2px;}
.TimerNick .FontStyle { position: relative; font-size: 32px; width: 51px; font-family: "Century Gothic";}
.TimerNick .FontStyle b { display: inline-block; margin: 0; width: 17px; text-align: center; font-weight: 300;}
.TimerNick3 .TIMER{  color: #fff; }
  @media screen and (min-width:768px){
    .TimerNick {justify-content: center;  margin: -21px 0 50px 0;}
  }
  @media screen and (max-width:767px){
    .TimerNick { margin: -5.5vw 0 14vw 3vw; width: 100%; }
    .TimerNick2 {margin: -2.7vw 0 0 2vw;}
    .TimerNick3{  margin: auto; }
    .TimerNick .TIMER { font-size: 4vw; line-height: 5vw; }
    .TimerNick small { top: 0.4vw; font-size: 3.5vw; margin-right: 0; margin-left: 0;}
    .TimerNick .time_day { position: relative; font-size: 4vw; line-height: 5vw;}
    .TimerNick .FontStyle { width: 5vw; font-size: 5vw; padding: 0.25em; top: -0.2em;}
    .TimerNick .FontStyle b { margin: 0; width: 3vw;}
  }


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






/*攻略區塊*/
.warningTxt { position: relative; }

.Area_activ .activ01:before{ content: ""; background: url("iron01.png?t=1764641850582") no-repeat scroll top / 100%; position: absolute; z-index: 1;}
  @media screen and (min-width:768px){
    
    .bg_deco01 {top: 1350px; left: 0; width: 2000px; height: 256px; }
    .Area_activ .activ01:before{  top: 90px; left: -179px; width: 264px; height: 200px; }
  }
  @media screen and (max-width:767px){
    .Area_activ{ margin-top: -3vw;}
    .Area_activ .activ01{  transform: translate(7.5vw, -2vw); }
    .bg_deco01 {top: 19vw; left: 0; width: 100%; height: 40vw; background-size: 155vw;}
    .Area_activ .activ01:before{  top: 10vw; left: -16vw; width: 25vw; height: 20vw; }
  }











/*品牌旗艦館*/
.Area_flags{ margin:auto;}
.Area_flags .PD_layout ul{ display: flex; flex-wrap: nowrap; padding: 0; justify-content: center;}
.Area_flags .PD_layout ul li{ min-width: 33%; }
.Area_flags .PD_layout ul li:hover{ z-index: 1; }
.Area_flags .PD_layout ul li img { width: 100%;}
.Area_flags::before{ content: ""; position: absolute; background: url(store_btn_deco1.png?t=1764641850582) no-repeat center / 100%; z-index: 2; animation: flower 2s infinite linear;}
.Area_flags::after{ content: ""; position: absolute; background: url(store_btn_deco2.png?t=1764641850582) no-repeat center / 100%; z-index: 2; animation: go .5s infinite ease-in-out alternate;}
@media screen and (min-width:767px){
  /* .Area_flags .bg{ background: url(pc_bottom.png?t=1764641850582) no-repeat scroll center bottom / 2000px 557px; height: 557px; position: absolute; left: -520px; width: 2000px; bottom:-125px; z-index: -1;} */
  .Area_flags{ left: -1.5%; }
  .Area_flags::before{ width: 52px; height: 52px; top: 32%; left: 13.5%; }
  .Area_flags::after{ width: 83px; height: 83px; top: 23%; right: 21.5%; }
}
@media screen and (max-width:767px){
	/* .Area_flags .bg{ background: url(m_bottom.png?t=1764641850583) repeat scroll bottom / 100%; height: 150%; position: absolute; left: 0; width: 100%; bottom:-2vw;  z-index: -1;} */
	.Area_flags { top: 2vw;  left: 0;  height: 32vw; width: 85%;}
  .Area_flags::before{ width: 7vw; height: 7vw; top: 19%; left: 5.5%; }
  .Area_flags::after{ width: 10vw; height: 10vw; top: 14%; right: 14.5%; }

}

@keyframes go{
  0%{ transform: translateX(-5%); filter: brightness(1);}
  100%{ transform: translateX(10%); filter: brightness(1.2);}
}


/*注意事項區*/
.edm_notice{ text-align:center; padding:10px 10px 15px 10px; color:#1e1e1e; font:12px/18px Helvetica;}
.edm_notice .apple_notice{  padding:10px 0px 10px 0px; }