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

/*區塊_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*/
.momologo { z-index:2; position: absolute; top: 15px; left:15px;}
.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;}
  }

/*全BOX版面*/
.WRAPPER {position: relative;margin: 0 auto;padding: 0;width:100%;min-width:1220px;overflow: hidden;font-family:"微軟正黑體","Microsoft JhengHei",Helvetica;background-color: #f4f1e2; 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%; 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;filter: drop-shadow(-10px -10px 0px #c6c4b7);}
.bg_fix02 {z-index: 0;position:absolute;top: 882px;left:0;width:100%;height: 100%;background-repeat:no-repeat;background-position: center top;pointer-events:none;filter: drop-shadow(-10px -10px 0px #c6c4b7);}
.bg_fix03 {z-index: 0;position:absolute;top: 1434px;left:0;width:100%;height: 100%;background-repeat:no-repeat;background-position: center top;pointer-events:none;filter: drop-shadow(-10px -10px 0px #c6c4b7);}
.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:1;position:absolute;top:1150px;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%;  }	
}


/* 區塊間距 */
.Area_bottom{
  margin-bottom: 6vw;
  @media screen and (min-width: 768px){
    margin-bottom: 60px;
  }
}


  /*版頭區塊*/
  @media screen and (min-width:768px){
  .Area_title {height:927px;}
}
  @media screen and (max-width:767px){
  .Area_title {height:93vw;}
  .Area_title .mb_01{position:absolute; top:24vw; left:0 ;width: 100%; z-index:-1;filter: drop-shadow(2px -3px 0px #00000030);}
  }
  


/*版頭主標微調*/
.main-title{
  position: absolute;
  top: -3vw;
  left: 2vw;
  width: 94%;
  z-index: -2;
  @media screen and (min-width: 768px){
    position: absolute;
    top: 0px;
    left: -13px;
    width: 97%;
  }
}
.pd-main-bg{
  position: absolute;
  top: 79.5vw;
  left: 46.6vw;
  width: 50%;
  z-index: 4;
  @media screen and (min-width: 768px){
    top: 802px;
    left: 495px;
  }
}
.pd-main-deco{
  position: absolute;
  top: 39vw;
  left: 5vw;
  width: 100%;
  z-index: 3;
  @media screen and (min-width: 768px){
      top: 402px;
        left: 144px;
        width: 72%;
  }
}
.main-img { z-index: 5; position:absolute; overflow: hidden;}
.main-img .PD_layout .PD a { pointer-events: none; }
.main-img .PD_layout ul{ display: flex ; flex-wrap: nowrap;  }
.main-img .swiper-pagination-bullet-active{ background-color: #6fbbf3; }
.main-img .swiper-container-horizontal>.swiper-pagination-bullets{
  bottom: 12vw;
    left: -3vw;
    width: 17%;
    @media screen and (min-width: 768px){
          bottom: 120px;
    left: -55px;
    width: 17%;
    }
  }
@media screen and (min-width: 768px){
  .main-img {top: 176px;
        left: 127px;
        width: 76%;}
  .main-img .PD_layout ul li:nth-child(1):after{ content: ""; position: absolute; bottom: -1px; right: 347px; width: 45px; height: 57px; z-index: 30; background: url(cs_finger.png?t=1782810926254) no-repeat scroll center / 100%; animation: moveFade 1.5s infinite reverse;rotate: -4deg;}
  .main-img .PD_layout ul li:nth-child(2):after{ content: ""; position: absolute; bottom: -2px;right: 352px; width: 45px; height: 57px; z-index: 30; background: url(cs_finger2.png?t=1782810926254) no-repeat scroll center / 100%; animation: moveFade 1.5s  infinite ;rotate: -8deg;}
}
@media screen and (max-width:767px){
  .main-img {top:16vw;left:2vw; width:95%;}
  .main-img .PD_layout ul li:nth-child(1):after{ content: ""; position: absolute; bottom:-.5vw; right:36vw; width: 5vw; height: 7vw; z-index: 30; background: url(cs_finger.png?t=1782810926254) no-repeat scroll center / 100%; animation: moveFade2 1.5s  infinite reverse;rotate: -2deg;}
  .main-img .PD_layout ul li:nth-child(2):after{ content: ""; position: absolute; bottom: -.5vw; right:35vw; width: 5vw; height: 7vw; z-index: 30; background: url(cs_finger2.png?t=1782810926254) no-repeat scroll center / 100%; animation: moveFade2 1.5s  infinite ;rotate: -10deg;}
}

@keyframes moveFade {
  0% {
    transform: translate(0, 0);
    opacity: 1;
  }
  50% {
    transform: translate(16px, 0);
    opacity: 0; /* 右移時淡出 */
  }
  75% {
    transform: translate(0, 0);
    opacity: 0; /* 左移保持透明 */
  }
  100% {
    transform: translate(0, 0);
    opacity: 1; /* 回到起點再顯示 */
  }
}
@keyframes moveFade2 {
  0% {
    transform: translate(0, 0);
    opacity: 1;
  }
  50% {
    transform: translate(2vw, 0);
    opacity: 0; /* 右移時淡出 */
  }
  75% {
    transform: translate(0, 0);
    opacity: 0; /* 左移保持透明 */
  }
  100% {
    transform: translate(0, 0);
    opacity: 1; /* 回到起點再顯示 */
  }
}

.Area_time{
  position: relative;
  z-index: 99;
  width: 1006px;
  margin-bottom: 80px;
  .box{
    background: #fce6b7;
    padding: 40px;
    border-radius: 0 50px 80px 80px;
    filter: drop-shadow(-10px 0px 0px #c6c4b7);
  }
}

@media screen and (max-width:767px){
  .Area_time{
    margin-top: -14vw;
    filter: drop-shadow(2px -3px 0px #00000030);
    width: 100%;
    margin-bottom: 0;
    &:before{ 
      content:''; 
      width: 100%; 
      height: 12vw; 
      background:url(area_today_bg.png?t=1782810926254) no-repeat center top;
      background-size: contain; 
      position: absolute; 
      top: -2vw; 
      left: 0;
    }
    .box{
      background: #fce6b7;
      padding: 6vw 2vw 4vw;
      border-radius: 0;
    }
  }

}


/*登記贈品文案顏色*/
.Area_danji .danji_box ul li .activityText .gifts span {color: #61b1ed;}  

/*登記*/
.Area_book { 
  position: relative;
  z-index: 6;
  width: 1005px;
  .box{
    padding: 40px 0 0;
  }
}

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

  .Area_book{
    width: 100%;
    filter: drop-shadow(2px -3px 0px #00000030);
    &:before{ 
      content:''; 
      width: 100%; 
      height: 12vw; 
      background:url(area_danji_bg.png?t=1782810926254) no-repeat center top;
      background-size: contain; 
      position: absolute; 
      top: -2vw; 
      left: 0;
    }

    .box{
      background: #513029;
      padding: 4vw 2vw 14vw;
    }
  }
}

/*deco*/
.deco01{ position: absolute; top: -268px; right: 37px; }
.deco02{ position: absolute; bottom: -272px; left: 0; }
@media screen and (max-width:767px){
  .deco01{  top: -32vw; right: -1vw; width: 17vw;}
  .deco02{  bottom: -32vw; left: -5vw; width: 23vw;}
}

 

/*活動倒數*/
.TimerNick2 {display:inline-block;position:absolute;top:-43px;left:388px;height: 57px;z-index:99;font-weight: 700;padding: 1.4% 0 0;width: 53%;}
.TimerNick2 .FontStyle2 {display: inline-block;margin: 0 0 0 2px;padding: 0;border: 0;font: bold 40px/30px Arial;color: #fce6b7;/*background-color: #000; */border-radius:5px;/*text-shadow:1px 1px 0px #fff;*/letter-spacing: 0px;text-align: center;}
.TimerNick2 span {padding-left: 2px;font: 400 37px/48px "微軟正黑體","Microsoft JhengHei", Arial, Helvetica;letter-spacing: -0em;color: #fce6b7;}
@media screen and (max-width:767px){
.TimerNick2 {display:inline-block;width: 73%;top:-2vw;left:30vw;margin:0;height:0;padding-bottom: 8%;overflow:hidden;text-align:center;background-size:100%;z-index:20;  transform: scale(0.9);}
.TimerNick2 .FontStyle2 {margin: 0;padding: 0;border: 0;font: bold 5vw/5vw Arial;}
.TimerNick2 span {padding-left:0;font: normal 5vw/5vw "微軟正黑體","Microsoft JhengHei", Arial, Helvetica;letter-spacing: -0.05em;}
}

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