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

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


/*全BOX版面*/
.WRAPPER { position: relative; display:block; margin: 0 auto; padding: 0; width:100%; max-width: 2000px;min-width:1220px; overflow:hidden; font-family:"微軟正黑體","Microsoft JhengHei",Helvetica;background-color:#fc7531;z-index:0;}
.WRAPPER img { border:0px; vertical-align:top;}
.WRAPPER a { text-decoration:none;}
.memo {font-size:28px;color: #fff;margin: 1% auto}
		@media screen and (max-width:767px){
		.WRAPPER { min-width: inherit; width:100%; padding-bottom:0px;background-color:#fc7531;}
		.WRAPPER img {  width:100%;  height:auto;}
.memo {font-size:4vw;color: #fff}			
	}
	
	
/*背景*/
@media screen and (min-width:767px){

.bg_repeat{ z-index:-5; position:fixed;top:0; left: 0;width:100%; min-width:1220px; height:3000px; background: url(pc_bgrepeat.jpg?t=1751542161024) repeat-y center top ; pointer-events:none}
.top_bg{z-index:1;position:absolute;top: 0px;width:100%;min-width:1220px;height:1015px;background: url(mian_topbg.png?t=1751542161024) no-repeat center top;pointer-events:none}
.top_bgdeco{z-index:0;position:fixed;top: 0px;left: 0; width:100%;min-width:1220px;height:1266px;background: url(top_bgdeco.png?t=1751542161024) no-repeat center top;pointer-events:none}
.top_foot{position:fixed;top:700px;width:50px;z-index: 6}
.footprint{position:relative;right:-1392px}
}
	@media screen and (max-width:767px){
.mtop_bg{ z-index:1; position:absolute;top:0; width:100%;height:142vw;background: url(mmian_topbg.png?t=1751542161024) center 100% / 100% no-repeat scroll;pointer-events:none}
		
	}



/*背景*/
.bgtop  { z-index:0; position:absolute; top:0; left:0; width:100%; min-width:1220px; height:100%;}
	@media screen and (max-width:767px){
		.bgtop { min-width: inherit; background-size:100%;}
	}
	
	

	
/*黏人快速鍵(白色款)*/
.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 {margin-bottom: 17px;z-index: 1}
	@media screen and (max-width:767px){
		.Area_top {height:119.5vw;z-index:3}


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

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



/*top*/
	  @media screen and (min-width:768px){
		 .Area_top_box {position: relative;height:795px }
		 .main{position: relative;width: 740px; top: 116px;left: 95px;z-index: 1}

		  .title_sub{position: absolute;top: 210px; left: 110px;}
		  .main_pd{position: absolute;top: 235px;left:572px; width: 631px; z-index: 1;}
		  .main_btn{position: absolute;bottom: -81px;left: 536px;z-index: 5}
		  .main_btn span{position: absolute;top:0;left:0;pointer-events: none}
		 .date {position: absolute;right:14px;top: 130px;width: 218px; z-index: 1;transform: rotate(391deg)!important;}				
		}
	 
   @media screen and (max-width:767px){
		 .main{position:absolute;width: 89%;top: 16vw;left: 6vw;z-index: 1}	   
	  	 .date {position: absolute;left: 5vw;top: 66vw;z-index:5;width: 24%;}
	     .main_pd{position: absolute;top: 29vw; left:-2vw; width: 100%;}
	  	 .title_sub{position: absolute;top: 32vw;right: 3vw;width: 66%;}	  
	  	 .title_sub img{width: 80%}	 
		 .main_btn{position: absolute;bottom:-9.5vw;left: 44vw;width:14%;}	    
		 .main_btn span{position: absolute;bottom:0vw;left:0vw;pointer-events: none}	    
}

@media screen and (max-width:400px){
	.main_btn{position: absolute;bottom:-8.2vw;left: 44vw;width:14%;}	    

}


  @media screen and (max-width:767px){
	.deco {position: absolute;bottom: 6vw;width: 90%;margin: 0 4%;}
}






/*共用--區塊背景*/
	.Area_boxstyle {}
	.Area_boxstyle > .Area_boxstyle_box { position:relative; background-repeat: no-repeat; background-position: center bottom;z-index: 1}
	.Area_boxstyle > .Area_boxstyle_box:before { content:""; display:block; z-index:-1; position:absolute; left:0; width:100%;}
	.Area_boxstyle > .Area_boxstyle_box:after  {content:"";display:block;z-index:-2;position:absolute;top: 193px;left:0px;width:100%;height:100%;}
			@media screen and (min-width:768px){
				.Area_boxstyle > .Area_boxstyle_box {padding: 0px 0 40px;width: 1220px;}
				.Area_boxstyle > .Area_boxstyle_box:before {top: 32px;left: 0px;height: 159px;}
				.Area_boxstyle > .Area_boxstyle_box:after {height: calc(100% - 225px);}
				.Area_boxstyle > .Area_boxstyle_box { background-image:url(Area_boxstyle_bgbottom.png?t=1751542161024);background-size: 100%;}
				.Area_boxstyle > .Area_boxstyle_box:before { background-image:url(Area_boxstyle_bgtop.png?t=1751542161024);background-size: 100%;}
				.Area_boxstyle > .Area_boxstyle_box:after  { background-image:url(Area_boxstyle_bgcon.png?t=1751542161024);background-size: 100%;}

			}
			
			@media screen and (max-width:767px){
				.Area_boxstyle > .Area_boxstyle_box { padding:0;}
				.Area_boxstyle > .Area_boxstyle_box:before { top:0vw; height:0vw;}
				.Area_boxstyle > .Area_boxstyle_box:after {top: 18.3vw;height: calc(100% - 22vw);}
				.Area_boxstyle > .Area_boxstyle_box {padding-top: 3vw;}
				.Area_boxstyle > .Area_boxstyle_box:before {top: -1vw;height: 21vw;}
				.Area_boxstyle > .Area_boxstyle_box {background-image: url(m_Area_boxstyle_bgbottom.png?t=1751542161024);background-size: 100%;padding-bottom: 4vw;}
				.Area_boxstyle > .Area_boxstyle_box:before { background-image: url(m_Area_boxstyle_bgtop.png?t=1751542161024);background-size: 100%;}
				.Area_boxstyle > .Area_boxstyle_box:after  { background-image: url(m_Area_boxstyle_bgcon.png?t=1751542161024);background-size: 100%;}
			}






/*Area03*/
 
 	.Area03 .Area03_PD .PD_layout.PD_layout-PDBN_01 .PD p .money,
 	.Area03 .Area03_PD .PD_layout.PD_layout-PDBN_01 .PD p .Price,
 	.Area03 .Area03_PD .PD_layout.PD_layout-PDBN_01 .PD p b,
 	.Area03 .Area03_PD .PD_layout.PD_layout-PDBN_01 .PD p small{background: -webkit-linear-gradient(90deg, #e8f65c 20%, #e8f65c 60%);-webkit-background-clip: text;text-shadow: none;} 

	  .Area03 .Area03_PD .PD_layout .PD_into .js-PD_priceTxt,
	  .Area03 .Area03_PD .PD_layout .PD_into .js-PD_unit,
	  .Area03 .Area03_PD .PD_layout .PD_into .js-PD_txt1 {display: none;}	
  @media screen and (min-width:768px){
	/* .Area03 .Area03_PD .PD_layout li{background: url(A03_bg.png?t=1751542161024)center 40% / 96% no-repeat;} 	   */
	.Area03 .Area_title {position:relative;z-index: 1;height: 130px;top:70px;}
	.Area03 .Area_title img{width: 60%}	  
	.Area03{position: relative;height:auto;z-index: 1;    margin-bottom: 5%;}
	.Area03 .Area03_PD .PD_layout ul {padding:23px 70px 0px; grid-gap:20px;}
	  
	  /* .Area03 .Area03_PD .PD_layout li{height: 523px;}			  
	  .Area03 .Area03_PD .PD_layout li h3{top: 4px; font-size: 24px;}			  
	  .Area03 .Area03_PD .PD_layout li .PD_img{width: 69%;z-index: 1;margin: 0 59px;top: 213px;position: absolute;}			  
	  .Area03 .Area03_PD .PD_layout li .PD_into{text-align: center;transform: translate(0px, 45px);}	
	  .Area03 .Area03_PD .PD_layout.PD_layout-PDBN_01 .PD p {font-weight: 600;top:104px;}	
	  .Area03 .Area03_PD .PD_layout.PD_layout-PDBN_01 .PD p .Price{letter-spacing: -0.5px; font-size: 43px;}	  
	  .Area03 .Area03_PD .PD_layout.PD_layout-PDBN_01 .PD h3 {color: #fff; top: 4px; font-size: 24px;}
	  .Area03 .Area03_PD .PD_layout.PD_layout-PDBN_01 .PD h4 {width: 80%;margin: 1% 11%;overflow: hidden;font-weight: 600;font-size: 36px; top: 45px;}	   */
  
}
  @media screen and (max-width:767px){
	  .Area03 .Area03_PD .PD_layout ul{grid-gap: 0.5em;} 		  
	  /* .Area03 .Area03_PD .PD_layout li{background: url(A03_bg.png?t=1751542161024)center 100% / 100% no-repeat;} 		   */
	  .Area03 {z-index:2;}
	  .Area03 .Area_title {position:relative;z-index: 1;height:15vw;top:-10vw}	
	  /* .Area03 .Area03_PD .PD_layout li{height: 72vw;}			  
	  .Area03 .Area03_PD .PD_layout li .PD_img{width:70%;z-index: 1;margin: 6% 15%;top:30vw;position: absolute;}			  
	  .Area03 .Area03_PD .PD_layout li .PD_into{text-align: center;transform: translate(0px, -4vw);}	
	  .Area03 .Area03_PD .PD_layout.PD_layout-PDBN_01 .PD p {font-weight: 600;top:24.5vw}	
	  .Area03 .Area03_PD .PD_layout.PD_layout-PDBN_01 .PD p .Price{letter-spacing: -0.3vw;font-size: 7vw;}	  
	  .Area03 .Area03_PD .PD_layout.PD_layout-PDBN_01 .PD h3 {color: #fff;    top:11vw;    font-size: 4vw;}
	  .Area03 .Area03_PD .PD_layout.PD_layout-PDBN_01 .PD h4 {width: 80%; margin: 0 11%; overflow: hidden; top: 18.5vw;font-size: 4.6vw;}	   */
}



.Area05 {background: url(Area05_bg.png?t=1751542161024) no-repeat top center; background-size: 2000px auto; height: 660px}
.Area05 .PD_layout{padding: 290px 101px 0 101px;}
@media screen and (max-width:767px){
.Area05 {background: url(Area05_bg_m.png?t=1751542161024) no-repeat top center; background-size: 100vw auto; height: 68vw;}
.Area05 .PD_layout{padding: 17vw 8vw;}
}

/* NEW */
@media screen and (min-width:768px){
.Area_activ{background-color: #304e97; width: 1228px; padding-bottom: 20px;}
.Area_activ .text_box{position: absolute; width: 839px;  top: 53px; left: 50%; transform: translateX(-50%);}
.Area_activ .S2 .boxrepeat_top { position: relative; padding: 187px 0 0px; width: 100%; background: url(boxrepeat_top.png?t=1751542161024)top center no-repeat;}
}

@media screen and (max-width:767px){
	.Area_activ{background-color: #304e97; width: 100vw; padding-bottom: 2vw;}
	.Area_activ .text_box{position: absolute; width: 100vw;  top: 3vw; left: 50%; transform: translateX(-50%);}
	.Area_activ .S2 .boxrepeat_top { padding: 22vw 0 0px;;}
	.Area_activ .S2 .text_box{  top: 6vw;}

    .Area_activ .PD_layout ul {width: 94vw;}
}


/* 重複背景1 */
.Area .boxrepeat_top { position: relative; padding: 163px 0 0px; width: 100%; background: url(boxrepeat_top.png?t=1751542161024)top center no-repeat;}
.Area .boxrepeat { background: url(boxrepeat.png?t=1751542161024)top center repeat-y; position: relative;}
.Area .boxbottom { position: relative;}
@media screen and (max-width:767px){
  .Area .boxrepeat_top  { padding: 16vw 0 0vw; background: url(boxrepeat_top_m.png?t=1751542161024)top center no-repeat; background-size: 100%;}
  .Area .boxrepeat { background: url(boxrepeat_m.png?t=1751542161024)top center repeat-y; background-size: 100%;}
}

/* 重複背景2 */
.Area.Area04 .boxrepeat_top { position: relative; padding: 42px 0 0px; width: 100%; background: url(boxrepeat_top_2.png?t=1751542161024)top center no-repeat;}
.Area.Area04 .boxrepeat { background: url(boxrepeat_2.png?t=1751542161024)top center repeat-y; position: relative;}
.Area.Area04 .boxbottom { position: relative;}
@media screen and (max-width:767px){
  .Area.Area04 .boxrepeat_top  { padding: 6vw 0 0vw; background: url(boxrepeat_top_m_2.png?t=1751542161024)top center no-repeat; background-size: 100%;}
  .Area.Area04 .boxrepeat { background: url(boxrepeat_m_2.png?t=1751542161024)top center repeat-y; background-size: 100%;}
}



.Area02 .text_box{ position: relative; width: 839px; margin: 0 auto; padding-top: 54px;}
.Area02 .Area02_PD{padding: 26px 32px 0px 32px;}

@media screen and (max-width:767px){
.Area02 .text_box{ position: relative; width:100vw;padding-top: 0vw;}
.Area02 .Area02_PD{padding: 2vw 2vw 0px 2vw;}
}


.Area03 .text_box{ position: relative; width: 839px; margin: 0 auto; padding-top: 54px;}
@media screen and (max-width:767px){
	.Area03 .text_box{ position: relative; width:100vw;padding-top: 0vw;}
	.Area03 .Area03_PD{padding: 0vw 3vw 0px 3vw;}
	.Area03 .Area03_PD .PD_layout .PD p del {
		font-size: 21px;
	}
	}
	
.Area04 .text_box{padding-top: 30px;}
.Area04 .boxrepeat .js-PC:first-child .text_box {padding-top: 0px;}
	
@media screen and (max-width:767px){
.Area_BN .Area_swiper_box ul{height: 22.8vw;}
}


.momologo_bigBrand{width: 140px; }
.momologo_bigBrand img{width: 100%;}

@media screen and (max-width:767px){
	.momologo.momologo_bigBrand{display: block!important; top: 22px;left: -9px;}
	.momologo.momologo_bigBrand a{width: 20vw!important;;}
}





@media screen and (max-width:767px) {
	.w-sm .PD_layout ul.PD_wrapper{width: 94vw!important; margin: 0 auto;}
	.Area_danji {width: 94vw;}
}
.p-e-n{pointer-events: none;}
/* 推推樂 */
.mb-l{margin-bottom: 60px;}
.mb-m{margin-bottom: 30px;}
.mb-s{margin-bottom: 10px;}

@media screen and (max-width:767px) {
.mb-l{margin-bottom: 8vw;}
.mb-m{margin-bottom: 5vw;}
.mb-s{margin-bottom: 2vw;}
}

.pb-l{padding-bottom: 60px;}
.pb-m{padding-bottom: 30px;}
.pb-s{padding-bottom: 10px;}

@media screen and (max-width:767px) {
.pb-l{padding-bottom: 8vw;}
.pb-m{padding-bottom: 5vw;}
.pb-s{padding-bottom: 2vw;}
}

/*移除公版設定，區標、BN作圖區移除公版樣式，PD_layout 區塊加上remove_box_style標籤
*/
.Area .remove_box_style ul { background-color: transparent; grid-gap: 10px;}
.Area .remove_box_style ul li { border: none!important;}
@media screen and (max-width:767px){
  .Area .remove_box_style ul { width: 100%; grid-gap: 0.2em;}
  .Area .remove_box_style ul {}
}

/*輪播移除公版設定，輪播公版移除公版樣式設定，PD_layout 區塊加上swiper_remove_box_style標籤
*/
.Area .swiper_remove_box_style ul { background-color: transparent; grid-gap: 0;}
.Area .swiper_remove_box_style ul li { border: none!important; background-color: #fff;}
.Area .swiper_remove_box_style ul li,
.Area .swiper_remove_box_style ul li .PD_img img { border-radius: 10px;}
@media screen and (max-width:767px){
  .Area .swiper_remove_box_style ul { width: 100%; grid-gap: 0.2em;}
  .Area .swiper_remove_box_style ul {}
}

/*3品公版間距*/
.Area .PD_layout-add2cart ul { padding: 20px;}
@media screen and (max-width:767px){
  .Area .PD_layout-add2cart ul { padding: 0.2em 0;}
  .Area .PD_layout-add2cart ul li { padding: 0.2em;}
}





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





/*隱鑶*/
.for_pc {}
.for_phone { display:none !important;}
	@media screen and (max-width:767px){
		.for_pc { display:none !important;}
		.for_phone { display: inherit !important;}
	}