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

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



/*全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%;}
		
	}


/*版頭*/

/*一般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; }
.momologo-white a path { fill:#ffffff; }
	@media screen and (max-width:767px){
		.momologo { display:none;}
	}
/*品牌日*/
/* .momologo a:hover {opacity: 1; background-image:url(momo_logo.png?t=1765955697641);} */
/*品類日*/
/* .momologo a:hover {opacity: 1; background-image:url(momo_logo2.png?t=1765955697641);} */
      @media screen and (max-width:767px){
        .momologo {z-index: 999;position:absolute;top: 1vw;left:2vw;}
        .momologo a {  width:20vw; height:12vw;}
		a:hover{background-size: 45%}		  
      }


.Area_top {height:780px;}
	@media screen and (max-width:767px){
		.Area_top {height: 109vw;z-index: 0}

		
/*提醒我按鈕*/
a.mo_remind_btn { z-index:10; position: absolute; right: 0; top:93vw; width: 17%;}	  

		
	}
.bank_bn{ position:absolute; top:200px; left:0; z-index:3;}

.Area_top .topPD .Area_swiper_box .PD_layout li,
.Area_top .title_sub .Area_swiper_box .PD_layout li{background-color:inherit;}

  @media screen and (min-width:768px){
.main{position: absolute;top: 120px;width: 52%;margin: 0 7%;}	 
.date{position: absolute;top: 157px;width: 25%;margin: 0 33%;}	
.topPD{position: absolute;top: 50px;width: 60%;margin: 0 50%;z-index: 1;}
.topPD img{width: 80%!important;}		
.stage{position: absolute;top:0px;width:100%;pointer-events: none;}	
.sub_bg{position: absolute;top: 536px;width: 50%;margin: 0px 26%;z-index: 1}	
.coming{position: absolute;top: 634px;width: 28%;margin: 0 39%;}


.title_sub{position: absolute;top: 527px;width: 100%;margin: 0 1%;z-index: 1}	  
.title_sub img{width: 55%!important;}	
}

  @media screen and (max-width:767px){
.main{position: absolute;top:8vw;width: 72%;margin: 0 15%;}	 
.date{position: absolute;top: 25vw;width:25%;margin: 0 16%;}	
.topPD{position: absolute;top: 27vw;width: 77%;margin: 0 11%;z-index: 1;}	
.stage{position: absolute;top:78vw;width:90%;margin:0 4% }	
.sub_bg{position: absolute;top: 82vw;width: 75%;margin: 0 13%;z-index: 1}	
.coming{position: absolute;top: 91vw;width: 40%;margin: 0 32%;}

.title_sub{position: absolute;top: 82vw;width:100%;margin: 0;z-index: 1}	  
.title_sub img{width: 75%!important;}	 	  
}


/*活動倒數*/
.TimerNick {position: absolute;top: 720px;left: 340px;display: inline-block;z-index: 8;text-align: center;color: #ffffff;        text-shadow: 0 0 20px #86390b;}
.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: 102.7vw;left:1vw;text-shadow: 0 0 3vw #86390b;}
      .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;*/}
    }


/*Area_title*/
	.Area_title1.PD_layout.PD_layout-D3_01 .PD h4{ 
		display: block;  width: fit-content; position: absolute; top:55%; left: 48%;width: 100%; transform: translate(-50%, -50%); color: #c81414;font-size: 50px;

	  }
	.Area_title1.PD_layout.PD_layout-D3_01 .PD h4 b,
	.Area_title1.PD_layout.PD_layout-D3_01 .PD h4 span{font-weight: 600!important;font-family: "Roboto", "Noto Sans CJK TC", "Microsoft JhengHei", Arial, Helvetica;    font-style: italic;}
	  
	.Area_title1.PD_layout.PD_layout-D3_01 .PD h4 span{font-size: 60px;} 
	  @media screen and (max-width: 767px){
	.Area_title1.PD_layout.PD_layout-D3_01 .PD h4{ 	font-size: 6.2vw;}
	.Area_title1.PD_layout.PD_layout-D3_01 .PD h4 span{font-size: 8.2vw;}
	  }

	.Area_title2.PD_layout.PD_layout-D3_01 .PD h3{ 
		display: block;  width: fit-content; position: absolute; top: 57%; left: 50%; transform: translate(-50%, -50%); color:#951d1f;font-size: 50px;
	  }
	.Area_title2.PD_layout.PD_layout-D3_01 .PD h3{font-weight: 600!important;font-family: "Roboto", "Noto Sans CJK TC", "Microsoft JhengHei", Arial, Helvetica;}
	  @media screen and (max-width: 767px){
		.Area_title2.PD_layout.PD_layout-D3_01 .PD h3{ 
			display: block;  width: fit-content; position: absolute; top: 52%; left: 50%; width: 100%;transform: translate(-50%, -50%); color:#951d1f;font-size:6.2vw;
		  }
	  }	  
	  .Area04 .Area_title3{transform: translateY(33px);} 
	  .Area_title3.PD_layout.PD_layout-D3_01 .PD h3{ 
		display: block;  width: fit-content; position: absolute; top: 57%; left: 50%; transform: translate(-50%, -50%);color:#fff;font-size: 50px;text-shadow: 1px 0px 6px #ff6d28;
	  }
	.Area_title3.PD_layout.PD_layout-D3_01 .PD h3{font-weight: 600!important;font-family: "Roboto", "Noto Sans CJK TC", "Microsoft JhengHei", Arial, Helvetica;}
	  @media screen and (max-width: 767px){
		.Area04 .Area_title3{transform: translateY(6vw);} 
		.Area_title3.PD_layout.PD_layout-D3_01 .PD h3{ 
			display: block;  width: fit-content; position: absolute; top:60%; left: 50%; width: 100%;transform: translate(-50%, -50%); color:#fff;font-size:6.2vw;text-shadow: 1px 0px 6px #ff6d28;
		  }
	  }	  
.A00h3{position: relative;margin-bottom: -3%;}

.Area_danji{width:96%; margin: 0 auto;}

.Area02 .PD_box .PD_layout .PD h3{font-size: 33px;color:#4f3f3f;width:80%;overflow: hidden;margin: 0 auto;}
.Area02 .PD_box .PD_layout ul{background-color: inherit;grid-gap:70px;grid-row-gap: 130px;}
.Area02 .PD_box .PD_layout ul li:nth-child(even) {transform: translateY(60px);}
.Area02 .PD_box .PD_layout ul li{border: none;}
.Area02 .PD_box .PD_layout ul li .PD::before{content: '';z-index: -1;position: absolute;width: 509px;height: 630px;left:-45px;top: -25px;background-image: url(A02BG.png?t=1765955697641);background-size: 100%;background-repeat: no-repeat;}
.Area02 .PD_box .PD_layout ul li:nth-child(even) .PD::after{content: '';z-index: -1;position: absolute;width: 509px;height: 630px;left: -50px;top:-50px;background-image: url(A02BG_snow.png?t=1765955697641);background-size: 100%;background-repeat: no-repeat;animation:fadeInDown 2s infinite;animation-direction: alternate;pointer-events: none; }
.Area02 .PD_box .PD_layout ul li:nth-child(odd) .PD::after{content: '';z-index: -1;position: absolute;width: 509px;height: 630px;left: -50px;top:-50px;background-image: url(A02BG_snow.png?t=1765955697641);background-size: 100%;background-repeat: no-repeat;animation:fadeInDown2 2s infinite;animation-direction: alternate;pointer-events: none;}
.Area02 .PD_box .PD_layout .PD p {height: 2.3em;}
.Area02 .PD_box .PD_layout .PD p .Price{font-size:45px;color:#9b0002;}
.Area02 .PD_box .PD_layout .PD p .money{color:#9b0002;}
.Area02 .PD_box .PD_layout .PD_img{padding:0 2em}
.Area02 .PD_box .PD_layout .PD_into{padding:2.4em;padding-bottom: 0;}
.Area02 .PD_box .PD_layout .PD a{flex-direction: column-reverse;}


.Area02 .txt {margin-bottom:5%;}
@media screen and (max-width:767px){
 .Area02 .PD_box .PD_layout ul li:nth-child(even) {transform: translateY(10vw);}
  .Area02 .PD_box .PD_layout .PD p .Price{font-size:7vw;color:#9b0002;max-height: 1.7em;}
  .Area02 .PD_box .PD_layout .PD h3{font-size:5vw;color:#332f2d;}
  .Area02 .PD_box .PD_layout ul{background-color: inherit;grid-gap: 0vw;grid-row-gap:11vw;padding: 0;}
  .Area02 .PD_box .PD_layout ul li .PD::before{content: '';z-index: -1;position: absolute;width:67vw;height: 90vw;left:-8vw;top:-3vw;background-image: url(A02BG.png?t=1765955697641);background-size: 100%;background-repeat: no-repeat;}
  .Area02 .PD_box .PD_layout ul li:nth-child(even) .PD::after{content: '';z-index: -1;position: absolute;width:67vw;height: 90vw;left:-8vw;top:-8vw;background-image: url(A02BG_snow.png?t=1765955697641);background-size: 100%;background-repeat: no-repeat;animation:fadeInDown 2s infinite;animation-direction: alternate;pointer-events: none;}
  .Area02 .PD_box .PD_layout ul li:nth-child(odd) .PD::after{content: '';z-index: -1;position: absolute;width:67vw;height: 90vw;left:-8vw;top:-8vw;background-image: url(A02BG_snow.png?t=1765955697641);background-size: 100%;background-repeat: no-repeat;animation:fadeInDown2 2s infinite;animation-direction: alternate;pointer-events: none;}
  .Area02 .PD_box .PD_layout .PD_img{padding:0 1.1em}
  .Area02 .PD_box .PD_layout .PD_into{padding:1.0125em;padding-bottom: 0;}
}

.Area03 .PD_layout.PD_layout-D3_02 ul .PD .PD_logo{background-color:inherit;width: 25%;}
.Area03 .PD_layout.PD_layout-D3_02 ul{padding-top:6%;}
.Area03 .PD_layout ul {padding: 0;}

.Area03 .PD_box .PD_layout{width: 95%;}
.Area03 .PD_box{background-image: url(A03BG.png?t=1765955697641);background-size: 100%;background-repeat: no-repeat;padding-bottom: 5%;}
@media screen and (max-width:767px){
	.Area03 .PD_layout.PD_layout-D3_02 ul .PD .PD_logo{width:35%;padding: 0;}
	.Area03 .PD_box{background-image: url(mA03BG.png?t=1765955697641);background-size: 100%;background-repeat: no-repeat;padding-bottom: 5%;margin-top: 3%;}
	
}

.Area04 .Area_page{background-color:#ffca4b;padding: 5% 0;overflow: hidden;}
.Area04 .Area_page .PD_layout ul{width: 94%;}

@media screen and (min-width:768px){
	.Area05{padding:3%;}
}
.Area05 .PD_layout  ul li:nth-child(even){margin-top: 50%;}
@media screen and (max-width:767px){
.Area05 .PD_layout  ul{margin:8% auto 5% !important;}	
}

/*黏人精*/
.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;}
}

/*隱鑶*/
.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'    

