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

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


/*全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:"微軟正黑體","Microsoft JhengHei",Helvetica;}
.WRAPPER img { border:0px; vertical-align:top;width: 100%;height: auto;}
.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 (max-width:767px){
		.WRAPPER { padding-bottom:30px; min-width: inherit; min-height:100vh; overflow: hidden;background: url("repeat_mb.jpg?t=1766481271941")top center;background-size: 100%;}
		.WRAPPER img {  width:100%;  height:auto;}
	}

	/*區塊_all*/
.Area1220 {margin:0 auto;width:1220px;}
.Area960 { margin:0 auto; width:960px;}
.Area { position: relative; margin:0 auto; padding:0; border-radius:0; text-align:center; }
.Area a { position:relative; display:block;} 
.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);}
		  
		  
.WRAPPER .go_bt1 {
  -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;}
.WRAPPER .go_bt1:hover { 
  -webkit-transform:translateY(-10px);
     -moz-transform:translateY(-10px);
      -ms-transform:translateY(-10px);

       -o-transform:translateY(-10px);
          transform:translateY(-10px);}

	@media screen and (max-width:767px){
		.Area1220 { width:100%;}
		.Area960 { width:100%;}
		.Area .go_bt:hover {  
			-webkit-transform:none;
			-moz-transform:none;
			-ms-transform:none;
			-o-transform:none;
			transform:none;}
	}
/*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;}
	} 

/*背景*/
@media screen and (min-width:768px){
.bg_00 { z-index:0; position:absolute; top:0; left:0; width:100%; height:100%; background-repeat:no-repeat; background-position: center top; pointer-events:none;}

.bg_01 { z-index:-40; position:absolute;top:0;left:0; width:100%; height:1110px; background-repeat:no-repeat; background-position: center top; pointer-events:none;}
.bg_02 { z-index:-40; position:absolute;top:1173px;left:0; width:100%; height:100%; background-repeat:repeat-y; background-position: center top; pointer-events:none;}
.bg_deco02 {z-index: -9;position:absolute;top: 134px;left: 0px;width:2000px;height:100%;background-position:center top;background-repeat:repeat-y;transition:0.5s linear;pointer-events:none;}
.bg_05 {z-index:-43;position:fixed;top: 0px;left:0;width:100%;height:100%;background-position:center 0px;background-repeat:repeat-y;transition:0.5s linear;pointer-events:none;}
.bg_repeat {z-index:-46;position:fixed;top: 0px;left:0;width:100%;height:100%;background-position:center 0px;background-repeat:repeat-y;transition:0.5s linear;pointer-events:none;}
.bg_deco { z-index:-30;position:fixed;top:0; left:0; width:100%; height:100%; background-position:center 0px; background-repeat:repeat-y; transition:0.5s linear; pointer-events:none;}
	
}
@media screen and (max-width: 767px){

}

/*區塊底*/
@media screen and (min-width:768px){
.Area_bottom01 {background:url(pc_bottom01.png?t=1766481271941)top center no-repeat;background-size:100%;padding-top:80px;margin-top:-22px;margin-bottom:50px;}
}
@media screen and (max-width: 767px){
.Area_bottom01 {background: #ffcc82;background-size:100%;padding-top:4vw;}
	.mo_top {z-index: 1;position:absolute;top: 44px;left:0;width:100%;height:98vw;background-repeat:no-repeat;background-position: center top;pointer-events:none;background-size: 100%;}	
}

/*版頭區*/
@media screen and (min-width:768px){
.Area_title {height: 455px;}

.gold_leafe {
	position:absolute;
	width: 45px;               
	top: 569px;
	left: 684px;
	pointer-events:none;
	z-index: 10;
}
.gold_leafe02 {
	position:absolute;
	width: 67px;        
	top: 805px;
	right: 232px;
	pointer-events:none;
	z-index: 2;
}
.gold_leafe03 {
	position:absolute;        
	width: 49px;
	top: 745px;
	right: 323px;
	pointer-events:none;
	z-index: 2;
}
.gold_leafe04 {
	position:absolute;
	width: 40px;
	top: 463px;
	left: 560px;
	pointer-events:none;
	z-index: 2;
}
.gold_leafe05 {
	position:absolute;        
	width: 48px;
	top: 821px;
	left: 236px;
	pointer-events:none;
	z-index: 2;
}

.light {
	position:absolute;
	width: 594px;
	top: 425px;
	left: 316px;
	pointer-events:none;
	z-index: 10;
	mix-blend-mode: color-dodge;
	img{
		width: 80%;
	}
}
.light02 {
	position:absolute;
	width: 594px;
	top: -64px;
	left: 156px;
	pointer-events:none;
	z-index: 10;
	mix-blend-mode: color-dodge;
	img{
		width: 91%;
	}
}

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

	.Area_title {height: 51vw;}
	.gold_leafe {position:absolute;width: 4%;        top: 66.5vw;
        right: 38vw;pointer-events:none;z-index: 13;}
	.gold_leafe02 {position:absolute;width: 6%;top: 90vw;left: 83vw;pointer-events:none;z-index: 2;}
	.gold_leafe03 {position:absolute;width: 5%;        top: 84.5vw;
        right: 19vw;pointer-events:none;z-index: 2;}
	.gold_leafe04 {position:absolute;width: 5%;        top: 52.5vw;
        right: 48vw;pointer-events:none;z-index: 2;}
	.gold_leafe05 {position:absolute;width: 5%;        top: 93.5vw;
        right: 86vw;pointer-events:none;z-index: 2;}
	.light {position:absolute;width: 27%;top: 64.5vw;right: 41vw;pointer-events:none;z-index: 16;mix-blend-mode: color-dodge;}
	.light02 {position:absolute;width: 38%;top: 16.5vw;right: 55vw;pointer-events:none;z-index: 16;mix-blend-mode: color-dodge;}

}

/*編輯按鈕移動*/
#eWriterBtn_bt_B_000_05 { margin-left: 89px!important; margin-top: 60px!important; z-index: 99!important; }
#eWriterBtn_bt_B_000_06 { margin-left: 100px!important; margin-top: 220px!important; z-index: 99!important; }

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

/*主標入稿*/
@media screen and (min-width:768px){
	/*主標*/		
	.Area_title .main-title {
		position:absolute;        
        width: 762px;
        top: 179px;
        left: 50%;
		transform: translateX(-50%);
		z-index: 7;
		margin: auto;
	}

	/*副標輪播*/	
	.Area_title .sub-title {
		position:absolute;
        width: 524px;
		top: 342px;
        left: 50%;
		transform: translateX(-50%);
		z-index: 8;

		.main{
			position: relative;
            top: 9px;
			h3{
				color: #e3c58d;
				width: 97%;
                line-height: 1em;
			}
		}
	}

	.Area_title .subtitle-bg{
		position: absolute;
		top: 0;
		z-index: -1;
	}

	/* date	 */
	.Area_title .date {
		position:absolute;        
        width: 551px;
        top: 103px;
        left: 50%;
		transform: translateX(-50%);
		z-index: 7;
	} 

}

@media screen and (max-width:767px){
	/*主標*/		
	.Area_title .main-title {
		position:absolute;        
        width: 93vw;
        top: 16vw;
        left: 50%;
		transform: translateX(-50%);
		z-index: 7;
		margin: auto;

	}

	/*副標輪播*/	
	.Area_title .sub-title {
		position:absolute;
        width: 62vw;
        top: 37vw;
        left: 50%;
		transform: translateX(-50%);
		z-index: 8;

		.main{
			position: relative;
			top: 1vw;
			h3{
				color: #e3c58d;
				width: 97%;
                line-height: 1em;
			}
		}
	}

	.Area_title .subtitle-bg{
		position: absolute;
		top: 0;
		z-index: -1;
	}

	/*pp_01*/		
	.Area_title .pp_01 {
		position:absolute;
        width: 43vw;
        top: 49vw;
        left: 11vw;
		z-index: 7;
		margin: auto;
	}
	.Area_title .PD_slide:hover{
		transform:none;
	}
	/*pp_02*/		
	.Area_title .pp_02 {
		position:absolute;        
        width: 18vw;
        top: 59vw;
        left: 40vw;
		z-index: 7;
		margin: auto;
	}

	/*pp_03*/		
	.Area_title .pp_03 {
		position:absolute;         
        width: 27vw;
        top: 71vw;
        left: 52vw;
		z-index: 7;
		margin: auto;
	}

	/* date	 */
	.Area_title .date {
		position:absolute;        
        width: 58vw;
        top: 7.7vw;
        left: 50%;
		transform: translateX(-50%);
		z-index: 7;
	} 	
	
}

.title{
	margin-bottom: 32px;
	@media screen and (max-width:767px){
		margin-bottom: 4vw;
	}
}

.Area_main{
	position: relative;
	z-index: 3;
}

.Area_danjimo{

	.Area_danji{
		@media screen and (max-width:767px){
			width: 96%;
		}
	}

}

.Area_strategy{
	.PD_layout{
		ul{
			gap: 20px;
			@media screen and (max-width:767px){
				width: 96%;
				gap: 2vw;
			}
		}
	}
}

.Area_item02{
	padding: 20px 0 60px;
	position: relative;
	background: url(pc_framebox_02.png?t=1766481271941) repeat-y;
	background-size: contain;
	margin-bottom: 80px ;
	border-left: 2px solid #bba868;
	border-right: 2px solid #bba868;
	
	@media screen and (max-width:767px){
		padding: 2vw 0 8vw;
		background: url(framebox_02.jpg?t=1766481271941) repeat-y;
		background-size: contain;
		border-left: none;
		border-right: none;
	}
	&::before{
		content: "";
		background: url(pc_framebox_01.png?t=1766481271941) no-repeat;
		background-size: contain;
		display: block;
		position: absolute;
		top: 0;
		width: 100%;
		height: 51vw;
		z-index: 1;
		@media screen and (max-width:767px){
			background: url(framebox_01.png?t=1766481271941) no-repeat;
			background-size: contain;
		}
	}
	&::after{
		content: "";
		background: url(pc_framebox_03.png?t=1766481271941) no-repeat center bottom;
		background-size: contain;
		display: block;
		position: absolute;
		bottom: 0;
		width: 100%;
		height: 51vw;
		z-index: 1;
		@media screen and (max-width:767px){
			background: url(framebox_03.png?t=1766481271941) no-repeat center bottom;
			background-size: contain;
			height: 51vw;
		}
	}
	.title{
		position: relative;
		z-index: 2;
		padding: 32px 0 0;
		margin-bottom: 80px;
		@media screen and (max-width:767px){
			padding: 2vw 0 0;
			margin-bottom: 10vw;

		}
	}
	.PD_layout.PD_layout-CSSBG_01[data-pd-li=PDBN]{
		width: 96%;
		position: relative;
		z-index: 2;
		ul{
			gap: 28px;
			@media screen and (max-width:767px){
				gap: 3.5vw;
			}
			li{
				.PD_img{
					order: 2;
					margin: 0 auto;
					width: 66%;
					margin-bottom: 2rem;
					padding: 0;
					@media screen and (max-width:767px){
						width: 66%;
						padding-top: 0;
						margin-bottom: 1vw;
					}
				}
				.PD_into{
					width: 80%;		
					margin: 50px auto 20px;		
					@media screen and (max-width:767px){
						margin: 5vw auto 2vw;
	
					}
					h3{
						color: #fff;
						font-size: 2rem;
						@media screen and (max-width:767px){
							font-size: 3.7vw;
						}
					}
					h4{
						color: #fff;
						font-size: 1.5rem;
						@media screen and (max-width:767px){
							font-size: 4vw;
						}
					}
					p{
						font-size: 2rem;
						color: #ffef86;
						@media screen and (max-width:767px){
							font-size: 3vw;
						}
						.oPrice{
							color: #d1c2a2;
							font-size: 1.5rem;
							@media screen and (max-width:767px){
								font-size: 2.5vw;
							}
						}
						.Price{
							color: #ffef86;
							font-size: 3rem;
							@media screen and (max-width:767px){
								font-size: 6vw;
							}
						}
					}
				}
			}
			li::after {
				content: "";
				display: block;
				width: 100%;
				height: 0;
				padding-bottom: 136%;
				background-image: url(PD_layout-CSSBG_01.png?t=1766481271941);
				background-repeat: no-repeat;
				background-size: 100%;
				background-position: center top;
			}
		}
	
	}
}



.Area_topitem{
	padding: 20px 0 60px;
	background: url(framebox02_02.png?t=1766481271941) repeat-y;
	background-size: contain;
	border: 1px solid #bba868;
	border-bottom: 1px solid #bba868;
	@media screen and (max-width:767px){
		border-top: .5vw solid #bba868;
		border-bottom: .5vw solid #bba868;
		border-left: none;
		border-right: none;
		padding: 6vw 0 8vw;
	}

	&::before{
		content: "";
		background: url(framebox02_01.png?t=1766481271941) no-repeat;
		background-size: contain;
		display: block;
		position: absolute;
		top: 0;
		width: 100%;
		height: 51vw;
		z-index: 1;
	}
	&::after{
		content: "";
		background: url(framebox02_03.png?t=1766481271941) no-repeat center bottom;
		background-size: contain;
		display: block;
		position: absolute;
		bottom: 0;
		width: 100%;
		height: 51vw;
		z-index: 1;
	}
	.title{
		position: relative;
		z-index: 2;
		padding: 32px 0 0;
		margin-bottom: 20px;
		@media screen and (max-width:767px){
			padding: 1vw 0 0;
            margin-bottom: 6vw;
		}
	}
	.Area_page{
		position: relative;
		z-index: 2;
		margin: 0 auto;
		width: 96%;
		@media screen and (max-width:767px){
			width: 100%;
		}
	}
}

.Area_logo{
	@media screen and (max-width:767px){
		width: 96%;
	}
	.PD_layout{
		ul{
			gap: 20px;
			@media screen and (max-width:767px){
				gap: 2vw;
			}
		}
	}
}

.Area_page{
	overflow: hidden;
}

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

.Area_bottom{
	margin-bottom: 60px;
	@media screen and (max-width:767px){
		margin-bottom: 12vw;
	}
}


/*版頭*/
.Area_top {}
.Area_top .momologo { z-index:10;position:absolute;top:15px;left:0px;}
	@media screen and (max-width:767px){
		.Area_top { height: auto;}
		.Area_top .momologo { display:none;}
	}




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