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

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



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

	
/*黏人快速鍵(白色款)*/
.fixed_Area {z-index:999; position:fixed; top:20px; right:0px; width:100px; font-weight:800; font-size:16px; line-height:48px; font-family:Century Gothic, "微軟正黑體",Helvetica; text-align:center;
			-webkit-transform: rotate3d(0,0,0,0deg) translate3d(0,0,0); transform: rotate3d(0,0,0,0deg) translate3d(0,0,0); -webkit-transform-origin:top right; transform-origin:top right;
			  -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;}
.fixed_Area a { display:block; text-decoration: none; color: #000;}
.fixed_Area img {-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;}
.fixed_Area .box ul { margin:0; padding:0; list-style:none;}
.fixed_Area .box li { margin:0 0 1px 0; padding:0; height:48px; background-color:rgba(255,255,255,0.6);}
.fixed_Area .box li a { letter-spacing:-1px;height:48px; overflow:hidden;}
.fixed_Area .box li a:hover { background-color:rgba(255,255,255,1);}
.fixed_Area .box li.cate-hover { background-color:rgba(255,255,255,1);}
.fixed_Area .box h2 { margin:0; padding:0;}
	/*快速導覽*/
	.fixed_Area h3 { position: absolute; top:100px; right:-50px; margin:0; padding:35px 0 0 0; border-radius:10px; width:48px; height:82px; font-size: 16px; line-height:30px; writing-mode: tb-lr; writing-mode: vertical-lr; -webkit-writing-mode: vertical-lr; background-color:rgba(255,255,255,0.6); text-align:left; cursor:pointer;
			-webkit-transform-origin:top left; transform-origin:top left;
			  -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;}
	.fixed_Area h3 i { position: absolute; top:0; right:0; display:block; width:50px; height:50px; cursor:pointer;}
	.fixed_Area h3 i:before { content: ""; position:absolute; top:41%; left:37%; display:block; border:1px solid #000; border-width:0 1px 1px 0; width:15%; height:15%; -webkit-transform:translate(-50%,-50%) rotate(135deg); transform:translate(-50%,-50%) rotate(135deg); -webkit-transition: all 0.3s ease; transition: all 0.3s ease;}
			/*黑色款*/
			.fixed_Area.fixed_Area-dark a { color: #fff;}
			.fixed_Area.fixed_Area-dark .box li { background-color:rgba(0,0,0,0.5);}
			.fixed_Area.fixed_Area-dark .box li a:hover { background-color:rgba(0,0,0,1);}
			.fixed_Area.fixed_Area-dark .box li.cate-hover { background-color:rgba(0,0,0,1);}
            .fixed_Area.fixed_Area-dark h3 {background-color:rgba(0,0,0,0.5);color: #fff; }
            .fixed_Area.fixed_Area-dark h3  i:before { border-color:#fff;}



			/*收合黏人精*/
			.fixed_Area.fixed_Area_hide { -webkit-transform: rotate3d(0,0,0,0deg) translate3d(150px,0,0); transform: rotate3d(0,0,0,0deg) translate3d(150px,0,0); }
			.fixed_Area.fixed_Area_hide h3 { -webkit-transform: rotate3d(0,0,0,0deg) translate3d(-185px,0,0); transform: rotate3d(0,0,0,0deg) translate3d(-185px,0,0); 
											 -webkit-transition-delay:0.2s; transition-delay:0.2s;}
/*區塊_all*/
.Area { position: relative; margin:0 auto; padding:0; border-radius:0; text-align:center; }
.Area a { display:block;margin: auto;} 
.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){
		.Area1220 { width:100%;}
		.Area960 { width:100%;}
		
	}


/*版頭*/
.Area_top {height:820px;position: relative;}
.Area_top .momologo { z-index:2; position: absolute;top:15px; left:30px;}
.Area_top .momologo a { display:block; width:200px; height:60px; background: url(momo_logo.png?t=1753952537763) no-repeat;}
.Area_top .momologo a:hover{ background: url(momo_logo.png?t=1753952537763) no-repeat;}
	@media screen and (max-width:767px){
		.Area_top {height: 120vw;z-index: 0}
		.Area_top .momologo {top: 2vw; left: 2vw;}
		.Area_top .momologo a{background-size:45%;}
		
/*提醒我按鈕*/
a.mo_remind_btn { z-index:10; position: absolute; right: 0; top:93vw; width: 17%;}	  

		
	}

@media screen and (min-width:768px){
.Area_title{width:100%;margin: 0 auto;}	
}

.title_sub .PD_layout ul {display: flex;width: 100%;grid-gap: 0;padding: 0!important;}
.title_sub .PD_layout ul li img{width: 100%!important;}

.top_PD .PD_layout ul li{background-color:inherit}
@media screen and (min-width:768px){
.top_PD {position: absolute;z-index: 2;top: 155px;left: 340px;transform: rotate(-16deg);}
.top_PD .PD_layout ul li img{width: 75%;}
.main{position: absolute;top: 72px;width: 65%;margin: 0 13%;}	 
.date{position: absolute;top: 50px;width: 12%;margin: 0px 80%;}	
.deco{position: absolute;top: 36px;left: -120px;margin: 0px 0%;right: -100px;}	
.title_sub .sub_box{width:700px!important;overflow: hidden;}
.title_sub{position: absolute;top:295px;width: 100%;left:110px;}	  
}
@media screen and (max-width:767px){
	.top_PD {position: absolute;z-index:2;top:46vw;left:16vw;transform: rotate(-20deg);}
	.top_PD .PD_layout ul{max-height: 67vw;}
	.top_PD .PD_layout ul li img{width: 100%;}
	.main{position: absolute;top: 11vw;width: 68%;margin: 0px 8%;}	 
	.date{position: absolute;top: 28vw;width: 16%;margin: 0 80%;}	
	.deco{position: absolute;top:47vw;width: 92%;margin: 0 7vw;}	
	.title_sub{position: absolute;top: 54vw;width:100%;left:-21vw;}	  
	.title_sub .sub_box{width:100%!important;overflow: hidden;}
	.title_sub .PD_layout ul li img{width:60%!important;}
	}
		
	

/*活動倒數*/
.TimerNick {position: absolute;top: 730px;left: 340px;display: inline-block;z-index: 8;text-align: center;color:#ff6118;transform: rotate(-5deg);}
.TimerNick .FontStyle {display: inline-block;margin: 0 0 0 10px;padding: 0;border: 0;font: bold 51px/40px Arial;letter-spacing: 0px;text-align: center;}
.TimerNick span { padding-left: 2px;font: bold 29px/30px "微軟正黑體","Microsoft JhengHei", Arial, Helvetica;letter-spacing: -0.025em;}
    @media screen and (max-width:767px){
      .TimerNick  {width: 100%;top:110vw;left:5vw;}
      .TimerNick .FontStyle {margin: 0;padding: 0;border: 0;font: bold 6.7vw/0vw Arial;}
      .TimerNick span {padding-left: 0;font: bold 3.5vw/5vw "微軟正黑體","Microsoft JhengHei", Arial, Helvetica;/*letter-spacing: -0.05em;*/}
    }

    .momologo a { display:block; width:151px; height:57px; background-size: 100%; transition: .5s opacity; opacity: 1; background-image:url(momo_logo.png?t=1753952537763);background-repeat: no-repeat; }
    .momologo a:hover {opacity: 1; background-image:url(momo_logo.png?t=1753952537763);}
      @media screen and (max-width:767px){
        .momologo { z-index: 999; position:absolute; top:2vw; left:2vw; }
        .momologo a {  width:26vw; height:12vw;}
		a:hover{background-size: 45%}		  
      }

.Area00{position: relative;z-index: 5;}
.Area_PD0{transform: rotate(-3.5deg);}	
.Area00 .Area_swiper_box{left: 7%;}
@media screen and (max-width:767px){
.Area_PD0{transform: rotate(-4.5deg);}	
.Area00{height:76vw;z-index: 5;}
.Area00 .deco{position: absolute;width:25%;top:-15vw;left:-17vw;}
.Area00 .Area_swiper_box{left:12%;}
.Area00 .PD_layout .swiper-pagination-bullet{background: #ffff;}
}


.Area01 .PD_layout ul li{border: none;background-color: #fff;border-radius: 5%;}

@media screen and (min-width:768px){
	.Area01{margin:310px auto 2%;background-color:#d9e100;padding-bottom: 3%;position: relative;}
	.A01_box{position: relative;}
	.Area01 .PD_layout ul {background-color: inherit;gap:0.5%;}
	.Area01 .A01_box .deco{position: absolute;width: 3%;left: 836px;right: 0;margin: 0;top: -30px;}
	.Area01 .A01_box .deco img{width:100%;}
	.Area01 .TimerNick.style2 {position:relative;top:-10px;left:0px;display: inline-block;z-index: 8;text-align: center;color:#fff;transform: rotate(0deg);}
	.Area01 .TimerNick.style2 .FontStyle {display: inline-block;margin: 0 0 0 10px;padding: 0;border: 0;font: bold 43px/40px Arial;letter-spacing: 0px;text-align: center;}
}
@media screen and (max-width:767px){
	.Area01{margin:6% auto 2%;background-color:#d9e100;padding-bottom:15%;}
	.Area01 .A01_box .deco{position: absolute;width:4%;left:80vw;right: 0;margin: 0;top:15vw;}
	.Area01 .PD_layout ul {background-color: inherit;gap: 1%;grid-row-gap: 0.2%;margin-top: -5vw;}
	.Area01 .TimerNick.style2 {position:relative;top:-5vw;left:-3vw;display: inline-block;z-index: 8;text-align: center;color:#fff;transform: rotate(0deg);}
	.Area01 .TimerNick.style2 {margin: 0;padding: 0;border: 0;font: bold 6.7vw/0vw Arial;}
}


/*登記贈品文案顏色*/
.danji_box{margin-top:1.5em;}
.Area_danji .danji_box ul li .activityText .gifts span { color: #fff;}   



.Area03{background:#e5e5e5 ;}
.Area03 .PD_layout ul li{border: none;background-color: #fff;border-radius: 5%;}

@media screen and (min-width:768px){
	.Area03 .PD_layout ul {background-color: inherit;gap:0.5%;}
	.Area03 .box {margin-top:-5%; padding-bottom:2%;}
	.Area03 .deco{position: absolute;top:-85px;width:20%;z-index: -1;left:472px;}
	.Area03 {margin-top: 10%;}	
	.Area03 .Area_title{position: relative;top:-60px;}
}
@media screen and (max-width:767px){
	.Area03 .deco{position: absolute;top: -7vw;width: 25%;z-index: -1;left:29vw;}
	.Area03 {margin-top: 10%;padding-bottom: 7%;margin-bottom: 7%;}	
	.Area03 .Area_title{position: relative;top:-7vw;}
	.Area03 .PD_layout ul {background-color: inherit;gap: 1%;grid-row-gap: 0.2%;margin-top: -5vw;}
}



.Area04 .PD_layout .PD_into{justify-content: flex-start;align-items: flex-end;transform: rotate(-11deg);}
.Area04 .PD_layout a{color: #fff;}
@media screen and (min-width:768px){
.Area04{margin-bottom: 10%;}	
.Area04 .Area_PD4 .box {margin-top: 5%;}
.Area04 .PD_layout ul li{background-image: url(PD4_bg.png?t=1753952537763);background-size: 100%;height: 390px;background-color:inherit}
.Area04 .PD_layout .PD h3{color:#ccff00;text-shadow: -2px -5px 0 #ff7639, 1px -5px 0px #ff7639, 6px -3px 0 #ff7639, -6px 0px 0px #ff7639;transform: translate(-30px, 10px);height:55px;line-height: 60px;}
.Area04 .PD_layout .PD h3{font-size:30px!important;padding-right:0px;width: 70%;}
.Area04 .PD_layout .PD h4{font-size:30px;padding-right: 10px;}
.Area04 .PD_layout .PD .PD_img{margin-top:20px;margin-bottom: -2px;}
.Area04 .PD_layout .PD_into{margin-top: -25px;}
}
@media screen and (max-width:767px){
.Area04 {width: 100%;margin-bottom: 14vw;}
.Area04 .box{margin: 8% auto;}
.Area04 .PD_layout ul li{background-image: url(PD4_bg.png?t=1753952537763);background-size: 100%;height: 61vw;background-color:inherit}
.Area04 .PD_layout .PD h3{color:#ccff00;text-shadow:-2px -3px 0 #ff7639, 0px -3.5px 0px #ff7639, 4px 0px 0 #ff7639, 2px -3px 0px #ff7639, -3px 0px 0px #ff7639;}
.Area04 .PD_layout .PD h3{font-size:19px!important;padding-right: 1vw;width: 70%;height: 7vw;}
.Area04 .PD_layout .PD h4{font-size: 16px;    padding-right: 2vw;}
.Area04 .PD_layout .PD .PD_img{margin-top: 4vw;margin-bottom: -2vw;}
}

.mbg6,
.mbg_b{background-size: 100%!important;} 

.mA04_01bg,
.mA04_02bg,
.mA04_03bg{background-size: 120%!important;} 

.swiper-pagination-bullet-active {opacity: 1;background: #0069ff!important;}
.Area_swiper_box .swiper-pagination-white .swiper-pagination-bullet{opacity: 1;}




.Area05 .Area_page{margin:5% auto;}
.Area05 .PD_layout ul li{border: none;background-color: #fff;border-radius: 5%;}
.Area05 .PD_layout.Atitle ul li{background: inherit;}
@media screen and (min-width:768px){
	.Area05 .deco{position: absolute;top:0px;width:20%;z-index: -1;left:472px;}
	.Area05 .PD_layout ul {background-color: inherit;gap:0.5%;}
	.Area05 .PD_layout.Atitle ul li{padding:0 150px ;}
	.Area05 .PD_layout.Atitle ul {grid-gap:0;padding: 0;}
	.Area05 .PD_layout.PD_bg ul{background-image: url(A05_bg.png?t=1753952537763);background-size: 100%;background-color:inherit;padding:3%;margin-bottom: 2%;background-repeat: no-repeat;}	

}
@media screen and (max-width:767px){
	.Area05{margin-bottom:10%;}
	.Area05 .deco{position: absolute;top:0vw;width: 25%;z-index: -1;left:29.5vw;}
	.Area05 .PD_layout ul {background-color: inherit;gap: 1%;grid-row-gap: 0.2%;margin-top: -2vw;}
	.Area05 .PD_layout.PD_bg ul{background-image: url(mA05_bg.png?t=1753952537763);background-size: 100%;background-color:inherit;padding:3%;background-repeat: no-repeat;}	
}




.A06_box{position: relative;}

.Area06 .PD_layout.part1 ul{display: grid;}
.Area06 .PD_layout.part1 ul li:nth-child(1){  grid-column: 1 / 4;grid-row: 1 / 8;}
.Area06 .PD_layout.part1 ul li:nth-child(2){  grid-column: 4 / 7; grid-row: 1 / 5;}
.Area06 .PD_layout.part1 ul li:nth-child(3){ grid-column: 4 / 7; grid-row: 5 / 8;}

.Area06 .PD_layout.part2 ul li:nth-child(1){  grid-column: 1 / 6;grid-row: 1 / 4;}
.Area06 .PD_layout.part2 ul li:nth-child(2){  grid-column: 6 / 9; grid-row: 1 / 6;}
.Area06 .PD_layout.part2 ul li:nth-child(3){ grid-column: 2 / 6; grid-row: 4 / 6;}
@media screen and (min-width:768px){
	.Area06{margin:100px auto 270px;position: relative;}
	.Area06 .PD_layout.part1 ul li:nth-child(1) img{width: 97%;}
	.Area06 .PD_layout.part2 ul li:nth-child(1) img{width: 98%;}	
	.Area06 .PD_layout.part2 ul li:nth-child(2) img{width: 100%;}	
	.Area06 .PD_layout.part2 ul li:nth-child(3) img{width: 90%;position: relative;right: -22px;}
	.A06_box{padding-top:210px;}	

	.Area06 .deco01 {position: relative;z-index: 10;right: -1110px;top: 10px;}
	.Area06 .deco02 {position:absolute;z-index: 10;bottom: 11px;left: -60px;}
	.Area06 .deco02 div{width: 100%;}
	.Area06 .deco01 div{position: absolute;width: 13%;left: -230px;}
}
@media screen and (max-width:767px){
	.Area06{margin-bottom:25vw;position: relative;}
	.Area06 .PD_layout.part1 ul li:nth-child(1) img{width: 97%;}
	.Area06 .PD_layout.part2 ul li:nth-child(2) img{width: 98%;}
	.A06_box{padding-top:25vw;}

	.Area06 .deco01 {position: relative;z-index: 10;right:0vw;top: 10px;}
	.Area06 .deco02 {position:absolute;z-index: 10;bottom: 1vw;left: -10.5vw;}
	.Area06 .deco02 div{width: 45%;}
	.Area06 .deco01 div{position: absolute;width: 13%;right:-2vw;top:-3vw}

}

.Area07{margin-bottom: 5%;}
@media screen and (max-width:767px){
	.Area07{margin-bottom: 10vw;}
	.Area07 .Area960 .PD_layout ul{padding:0 10vw;}	
}
/*隱鑶*/
.for_pc {}
.for_phone { display:none !important;}
	@media screen and (max-width:767px){
		.for_pc { display:none !important;}
		.for_phone { display: inherit !important;}
	}

    @import'Area_boxstyle'    

