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

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

/*全BOX版面*/
.WRAPPER {z-index:0;position: relative;display:block;margin: 0 auto;padding:0;width:100%;min-width:1220px;text-align:left;font-family:"微軟正黑體","Microsoft JhengHei",Helvetica;background-color: #ffa46f;overflow: hidden; }
.WRAPPER img { border:0px; vertical-align:top;}
.WRAPPER a { text-decoration: none;}

/*預設清單樣式*/
.Area .list_00 ul {display:inline-block;}
.Area .list_00 li {list-style:none;float:left;overflow: hidden;}
	@media screen and (max-width:767px){
		.WRAPPER {margin-bottom: 0;min-width: inherit;min-height: 100vh;overflow: hidden;background-size: 100%;padding-bottom: 0;background: #fff;}
		.WRAPPER img {  width:100%;  height:auto; }
	}


/** 入稿區基本 **/
.content_Area { position:relative; display:inline-block; margin:0px auto 0px auto; padding: 0px 0px 0px 0px; width:1220px;}
.buttonAera_more { position: absolute; top:15px; right:15px; padding-left:17px; padding-right:10px;  border-radius:60px; width:90px; height:40px; background-color: #666; text-align:center;}
.buttonAera_more a { display:block; padding-top:5px; font: bold 24px/29px Century Gothic; color:#fff; text-decoration: none; letter-spacing:-0.05em; }
.buttonAera_more:hover {background-color: #000;}
.buttonAera_more .btnGO { margin:5px; float:right; width:20px ;height:20px;}

/*PC背景*/
@media screen and (min-width:768px){
.bg_fix {z-index: -65;position:absolute;top: 0;left:0;width:100%;height: 1179px;background-repeat:no-repeat;background-position: center top;pointer-events:none;}
.bg_deco {z-index: 50;position:absolute;top: 950px;left: 0;width:100%;height: 10650px;background-repeat:repeat-y;background-position: center top;pointer-events:none;}
.bg_repeat {z-index: -70;position:absolute;top: 0;left: 0;width:100%;height: 100%;background-repeat:repeat-y;background-position: center top;pointer-events:none;}
.bg_repeat2 {z-index: -69;position:absolute;top: 2350px;left: 0;width:100%;height: 2270px;background-repeat:repeat-y;background-position: center top;pointer-events:none;}
.bg_repeat3 {z-index: -69;position:absolute;top: 10210px;left: 0;width:100%;height: 100%;background-repeat:repeat-y;background-position: center top;pointer-events:none;}
}

@media screen and (max-width:767px){
.m_bg_fix {z-index:-8;position:absolute;top: 10vw;left:0;width:100%;height:100%;background-repeat:no-repeat;background-position: center top;pointer-events:none;background-size: 100%;}	
.m_bg_repeat {z-index:-50;position:absolute;top: 0;left:0;width:100%;height: 948vw;background-repeat:repeat-y;background-position: center top;pointer-events:none;background-size: 100%;}
.m_bg_repeat2 {z-index:-48;position:absolute;top: 1283vw;left:0;width:100%;height: 100%;background-repeat:repeat-y;background-position: center top;pointer-events:none;background-size: 100%;}
.m_Area06_repeat {z-index:-48;position:absolute;top: 2183vw;left:0;width:100%;height: 100%;background-repeat:repeat-y;background-position: center top;pointer-events:none;background-size: 100%;}
}


/*間距*/
@media screen and (min-width:768px){
.Area_bottom {margin-bottom: 60px!important;}
.Area_bottom2 { margin-bottom: 20px!important; }
}
@media screen and (max-width:767px){
.Area_bottom {margin-bottom: 5vw!important;}
.Area_bottom2 { margin-bottom: 0vw!important; }	
}

.PD_layout[data-pd-li=BN] ul, .PD_layout[data-pd-li=BN-AWD] ul, .PD_layout[data-pd-li=PDBN] ul{
	padding: 0;
	grid-gap: 0;
}


/*版頭區塊*/
.area-title {
	position: relative;
	@media screen and (max-width:767px){
		padding-bottom: 5vw;
	}
	.title{
		position: absolute;
		top: 110px;
		left: 53%;
		transform: translateX(-50%);
		width: 860px;
		@media screen and (max-width:767px){
			width: 60vw;
			top: 10vw;
			left: 38vw;	
		}
	}
	.subtitle{
		position: absolute;
		top: 345px;
		left: 220px;
		width: 250px;
		@media screen and (max-width:767px){
			width: 27vw;
			top: 28.5vw;
			left: 21vw;	
		}
		img{
			min-width: 250px;
			@media screen and (max-width:767px){
				min-width: 27vw;
			}
		}
	}
	.date{
		position: absolute;
		top: 595px;
		left: 220px;
		width: 190px;
		@media screen and (max-width:767px){
			width: 30vw;
			top: 58vw;
			left: 8vw;	
		}
	}
	.top_pd{
		position: relative;
        top: 213px;
        left: 66%;
        transform: translateX(-50%);
        width: 528px;
		@media screen and (max-width:767px){
			width: 50vw;	
			top: 15vw;
			left: 70vw;
		}
	}
	.PD_boxtitle{
		margin-top: 215px;
		@media screen and (max-width:767px){
			margin-top: 15vw;
		}
	}

	.PD-swiper{
		position: relative;
		background: url(PD_boxbg.png?t=1757581723951)top center repeat-y;
		@media screen and (max-width:767px){
			background: url(m_PD_boxbg.png?t=1757581723951)top center repeat-y;
			background-size: 100%;
		}
		.box{
			margin: 0 40px  0 40px;
			
			@media screen and (max-width:767px){
				margin: 0 5vw;
			}
			.Area_swiper_box{
				padding-bottom: 0;
				@media screen and (max-width:767px){
					padding-bottom: 0;
				}
			}
			.PD_layout.PD_layout-D1_14 ul{
				padding: 0;
				grid-gap: 0;
				li{
					background: none;
					.PD{
						.PD_img{
							background: #fff;
							border-radius: 12px;
							margin-bottom: 8px;
							@media screen and (max-width:767px){
								margin-bottom: 1.5vw;
							}
						}
						.PD_into{
							width: 86%;
							margin: 0 auto;
							border-radius: 4px;
							position: relative;
							background-color: transparent;
							
							@media screen and (max-width:767px){
								width: 100%;
								padding: .2em;
							}
						}
						.PD_into h3 {
							width: 100%;
							background-color: #000;	
							border-radius: 4px;						
						}
					}
	
	
				}
			}
		}
		.swiper-boxbg{
		}
	}
}

@media screen and (min-width:768px){
	.top_deco {position: absolute;top: 303px;left: -343px;z-index: 10;}
	.top_deco2 {position: absolute;top: 220px;left: -260px;z-index: 10;}	
	.top_deco3 {position: absolute;top: 321px;left: 1441px;right: -320px;z-index: 10;}	
	.top_deco4 {position: absolute;top: 405px;left: 1362px;right: -236px;z-index: 10;}		
}

@media screen and (max-width:767px){
	.m_top_deco {position: absolute;top: 3vw;left: 88vw;z-index: 10;width: 12%;}	
	.m_top_deco2 {position: absolute;top: 8vw;left: 71vw;z-index: 10;width: 7%;}		
}



@media screen and (min-width: 768px){
/*編輯按鈕移動*/
#eWriterBtn_bt_B_000_v1-he1 { margin-left: 10px!important; margin-top: 90px!important; z-index: 99!important; }
#eWriterBtn_bt_B_000_v1-he2 { margin-left: 10px!important; margin-top: 150px!important; z-index: 99!important; }
}


/*版頭線上入搞品*/
.PDbox.PD_layout .PD_slide {
  border-left: #e3e3e3 1px solid;
  border-bottom: #e3e3e3 1px solid;
}

/*副標題*/
.subtitle, .subtitle2{
	.PD_layout[data-pd-li*=BN] li:hover{
		filter: none;
	}
}
@media screen and (min-width: 768px){
	.subtitle {
		margin-bottom: 24px
	
	}
}

@media screen and (max-width:767px){
	.subtitle {
		position: relative;
		left: 50%;
		transform: translateX(-50%);
		margin-bottom: 3vw;
		width: 150%;
	}
}


/*好康攻略*/
.area-strategy{
	.strategy-main{
		.PD_layout[data-pd-li*=BN] li:hover{
			filter: none;
		}
	}
	.danji-main{
		background: url(bg_repeat1.jpg?t=1757581723951) top no-repeat;
		background-size: contain;
		background-color: #fff;
	}
}

@media screen and (min-width: 768px){
	.area-strategy{
		.box-main{
			.danji-main{
				padding-top: 32px;
			}
		}
	}
}
@media screen and (max-width: 767px){
	.area-strategy{
		.box-main{
			.danji-main{
				padding-top: 3vw;
				.subtitle{
					width: 100%;
				}
				.box02{
					margin: 0 auto;
					width: 96%;
				}
			}
		}
	}
	
}


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

/*熱銷特談爆品*/
.area-sale{
	background: url(bg_repeat2.jpg?t=1757581723951);
	.box-main{
		margin: 0 auto;
		width: 96%;
	}
}
@media screen and (min-width: 768px){
	.area-sale {
		padding: 40px 0;
	}
}

@media screen and (max-width: 767px){
	.area-sale {
		padding: 5vw 0;
	}
}

/*精選精品大牌注目焦點*/
.area-brand{
	background: url(bg_repeat2.jpg?t=1757581723951);
	.box-main{
		width: 96%;
		margin: 0 auto;
		.box-item{
			box-sizing: border-box;
			background: #000;
		}

	}
}
@media screen and (min-width: 768px){
	.area-brand {
		padding: 12px 0 40px;
		.box-main{
			.box-item{
				border-radius: 20px;
				padding: 24px 0 40px 40px;
				margin-bottom: 32px;
			}
			.subtitle2{
				margin-bottom: 20px;
			}
		}
	}
	
}

@media screen and (max-width: 767px){
	.area-brand {
		padding: 2vw 0 4vw;
		.box-main{
			.box-item{
				border-radius: 5vw;
				padding: 4vw 0 5vw 4vw;
				margin-bottom: 5vw;
			}
			.subtitle2{
				width: 200vw;
				margin-bottom: 4vw;
			}
		}
	}
}



/*男女士精選*/
.area-spacial{
	.box-main{
		.box-item{
			&:nth-child(odd){
				background: #fbdad6;
			}
			&:nth-child(even){
				background: #ccdfec;
			}
			.PD-main{
				width: 96%;
				margin: 0 auto;
			}
		}
	}
}
@media screen and (min-width: 768px){
	.area-spacial{
		.box-main{
			.box-item{
				margin-bottom: 24px;
				.PD-main{
					padding: 16px 0 32px;
				}
			}
		}
	}
}
@media screen and (max-width: 767px){
	.area-spacial{
		.box-main{
			.box-item{
				margin-bottom: 5vw;
				.PD-main{
					padding: 3vw 0 4vw;
				}
			}
		}
	}
}

/*金鑽永流傳*/
.area-gold{
	.box-main{
		.box-item{
			background: #fbe39f;
			&:last-child{
				margin: 0;
			}
			.PD-main{
				width: 96%;
				margin: 0 auto;
			}
		}
	}
}
@media screen and (min-width: 768px){
	.area-gold{
		.box-main{
			.box-item{
				margin-bottom: 24px;
				.PD-main{
					padding: 16px 0 32px;
				}
			}
		}
	}
}
@media screen and (max-width: 767px){
	.area-gold{
		.box-main{
			.box-item{
				margin-bottom: 5vw;
				.PD-main{
					padding: 3vw 0 4vw;
				}
			}
		}
	}
}


/*話題精選款式*/
.area-trands{
	background: url(bg_repeat3.jpg?t=1757581723951);
	.box-item{
		width: 96%;
		margin: 0 auto;
		}
	}
@media screen and (min-width: 768px){
	.area-trands{
		padding: 40px 0 0;
		.box-main{
			.box-item{
				margin-bottom: 24px;
				padding: 16px 0 16px;
				.PD_wrapper{
					border-radius: 0 0 15px 15px;
				}
			}
		}
	}
}
@media screen and (max-width: 767px){
	.area-trands{
		padding: 5vw 0 0;
		.box-main{
			.box-item{
				margin-bottom: 3vw;
				padding: 2vw 0 2vw;
				.PD_wrapper{
					border-radius: 0 0 4vw 4vw;
				}
			}
		}
	}
}

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

/*區塊_all*/
.Area1220 {position: relative;margin:0 auto;width:1220px;}
.Area960 { margin:0 auto; width:960px;}
.Area {position: relative;margin:0 auto;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);}

	@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;}
	}


/*輸送帶*/
.bgtop_r-play1 { -webkit-animation:bgtop_r-play1 8s linear infinite; animation:bgtop_r-play1 16s linear infinite ;}
		@-webkit-keyframes bgtop_r-play1 {
		  0%   { background-position:0 0;}
		  100% { background-position:-277px 0px;}
		}
		@keyframes bgtop_r-play1 {
		  0%   { background-position:0 0;}
		  100% { background-position:277px 0px;}
		}

.bgtop_r-play2 { -webkit-animation:bgtop_r-play2 8s linear infinite; animation:bgtop_r-play2 16s linear infinite ;}
		@-webkit-keyframes bgtop_r-play2 {
		  0%   { background-position:0 0;}
		  100% { background-position:277px 0px;}
		}
		@keyframes bgtop_r-play2 {
		  0%   { background-position:0 0;}
		  100% { background-position:-277px 0px;}
		}
