@charset "big5";
/* CSS Document */

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



/*全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;}
.WRAPPER a { text-decoration:none; -webkit-tap-highlight-color: transparent}
.WRAPPER ul {margin:0px; padding:0px; list-style:none outside 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 {min-width: inherit; min-height:100vh; overflow:visible;  background-size:100%; background-image: url(bg.jpg?t=1603956666031); background-repeat:repeat-y;}
		.WRAPPER img {  width:100%;  height:auto;}
	}
	
	
	
	/*區塊_all*/
.Area { position: relative; margin:0 auto; padding:0; border-radius:0; text-align:center; }
.Area a { position:relative; /*display:inline-block;*/} 
.Area .go_bt {
  -webkit-transition: all 0.35s ease;
     -moz-transition: all 0.35s ease;
      -ms-transition: all 0.35s ease;
       -o-transition: all 0.35s ease;
          transition: all 0.35s 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_1bn { margin: 0 auto; padding:0; overflow:hidden;}
		.Area_1bn a { float:left; margin:0 0 2% 0; padding:0; width:100%; list-style: none;}
		.Area_2bn { margin: 0 auto; padding:0; overflow:hidden;}
		.Area_2bn a { float:left; margin:0 0% 0%; padding:0; width:50%; list-style: none;}
		.Area_3bn { margin: -1px auto; padding:0; overflow:hidden;}
		.Area_3bn a { float:left; margin:0 0% 0% ; padding:0; width:33.33%; list-style: none;}
		.Area_1bn_nopadding { margin: 0 auto; padding:0; overflow:hidden;}
		.Area_1bn_nopadding a { float:left; margin:0; padding:0; width:100%; list-style: none;}
		.Area_2bn_nopadding { margin: 0 auto; padding:0; overflow:hidden;}
		.Area_2bn_nopadding a { float:left; margin:0; padding:0; width:50%; list-style: none;}
		.Area_3bn_nopadding { margin: 0 auto; padding:0; overflow:hidden;}
		.Area_3bn_nopadding a { float:left; margin:0; padding:0; width:33.33%; list-style: none;}
	    .Area_4bn_nopadding { margin: 0 auto; padding:0; overflow:hidden;}
		.Area_4bn_nopadding a { float:left; margin:0; padding:0; width:25%; list-style: none;}
	    .Area_5bn_nopadding { margin: 0 auto; padding:0; overflow:hidden;}
		.Area_5bn_nopadding a { float:left; margin:0; padding:0; width:20%; list-style: none;}


	}



/*壓標*/
.momologo { position:absolute; top: 19px; left:0; z-index:999; }
	@media screen and (max-width:767px){
         .momologo {width: 17%;top:11.6vw; left:3vw;}
	}


/*PC背景*/
.bg_01 { z-index:-47; position:absolute; top:0; left:0; width:100%; height:100%; background-repeat:no-repeat; background-position: center top; pointer-events:none;}
.bgdeco { z-index:-49; position:fixed; top:0px; left:0; width:100%; height:100%; background-repeat:repeat-y; background-position: center top; pointer-events:none;}
.circle { z-index:-48; position:fixed; top:0px; left:0; width:100%; height:100%; background-repeat:no-repeat; background-position: center top; pointer-events:none;}






	
	
/*底部*/
.fixbn a { 	padding-bottom:constant(safe-area-inset-bottom); /* 兼容 iOS < 11.2 */
				    padding-bottom:env(safe-area-inset-bottom);}   /* 兼容 iOS >= 11.2 */ 
.fixbn{position:fixed; bottom:0; display:block; z-index:10; background:#0000;width: 100vw;}
.fixbn ul li{float:left;padding:0;list-style-type:none;width:50vw;}
.fixbn ul li img{width:100% ; height:auto;}

.fixbn ul{
    margin-top: 0px;
    margin-bottom: 0px;
    padding-left: 0px;
}






/*版頭*/
.Area_top {}
.Area_top .momologo { z-index:2; position: absolute;top: 15px; left:40px;}
.Area_top .momologo a { display:block; width:220px; height:80px; background: url(momo_logo.png?t=1603956666031) no-repeat;}
.Area_top .momologo a:hover{ background: url(momo_logo.png?t=1603956666031) no-repeat;}
	@media screen and (max-width:767px){
		.Area_top { height: auto;}
		.Area_top .momologo { display:none;}
	}
	
	
	
/*版頭區塊*/
.Area_title { height:524px;}
.Area_title .light{position: absolute;top:55px; left:0; z-index:3;}

		@media screen and (max-width:767px){
			.Area_title { height:100%;}			
		}
.pc_title { position:absolute;left:157px;top:45px;}



/*版頭輪播*/
.pc_toppd_box{display:block; position:relative; top:1px;}		
.pc_toppd_swiper { display:block; position: absolute;top: 0px;   left:288px; z-index:1;}
		@media screen and (max-width:767px){
			.pc_toppd_box{position:absolute; width:100%; height:auto;top:0;} 		
			.pc_toppd_swiper { height:100%; top: 0px;   left:0px;}	
}



/*6大活動按鈕*/
.Area_activ { height:236px;}
		@media screen and (max-width:767px){
			.Area_activ { height:100%;}			
		}
.pc_activ {position:absolute;top:66px; left:-162px;}

.pc_logo_left_01 {position:absolute;left:-8px;top:58px;width: 550px;}
.pc_logo_left_01 li {margin:0 -35px 0 0;}
.pc_logo_left_02 {position:absolute;left:-13px;top:142px;width: 550px;}
.pc_logo_left_02 li {margin:0 0px 0 0;}
.pc_logo_right_01 {position:absolute;left:640px;top:58px;width: 550px;}
.pc_logo_right_01 li {margin:0 -40px 0 0;}
.pc_logo_right_02 {position:absolute;left:680px;top:142px;width: 550px;}
.pc_logo_right_02 li {margin:0 -00px 0 0;}












/** 倒數2 **/
.TimerNick2 { z-index:5; display:inline-block; height:51px; text-align:right;    position: absolute;left: 481px;top:128px;}
.TimerNick2 .FontStyle { display:inline-block; margin:3px 30px 0 0; padding:0; border:0px; font: 33px/32px Helvetica; color:#000000; /*text-shadow:1px 1px 0px #fff;*/ letter-spacing:-1px; text-align:right; background:transparent; }
.TimerNick2 div:nth-of-type(2),
.TimerNick2 div:nth-of-type(3) { width:44px;}
.TimerNick2 span { padding-left:2px; font: bold 27px/38px "微軟正黑體","Microsoft JhengHei", Arial, Helvetica; letter-spacing: -0.05em;color: #000;}
	@media screen and (max-width:767px){
		
		.TimerNick2  {top:16.6vw; left:34vw; height:6vw;  background-size: 100%; transform: scale(1)}
		.TimerNick2 .FontStyle { margin:0 14px 0 0; padding:0; border:0px; width:9.2vw; font:bold 7vw/5vw Arial; color:#ab682f; /*text-shadow:1px 1px 0px #fff;*/ letter-spacing:-1px; text-align:right; background:transparent;}
        .TimerNick2 div:nth-of-type(2),
		.TimerNick2 div:nth-of-type(3) { width:5vw;}
		.TimerNick2 span { padding-left:1vw; font: bold 3.2vw/11vw "微軟正黑體","Microsoft JhengHei", Arial, Helvetica; letter-spacing: -0.05em;color: #000;}

	}
	
	@media screen and (max-width:767px){
		.Area_top .time {top:64vw; left:21vw; width:54vw; height:6vw;  background-size: 100%; transform: scale(1)}
	}



/*公版1-剁手搶*/
.pc_layout01_bg { z-index:-10; position:absolute;width:1220px;height:1428px;left:0px;top:0px;background-repeat:no-repeat;background-position:center top;pointer-events:none;background-image: url(pc_layout01_bg.png?t=1603956666031);}
.Area_layout01 { height:1430px;}
.Area_layout01 ul {display:inline-block;}
.Area_layout01 li {list-style:none;float:left;overflow: hidden;}
	@media screen and (max-width:767px){
			.Area_layout01 { height:100%;}			
		}
		

/*公版2-1111★好貨必buy*/
.pc_layout02_bg { z-index:-10; position:absolute;width:1220px;height:1428px;left:0px;top:0px;background-repeat:no-repeat;background-position:center top;pointer-events:none;background-image: url(pc_layout02_bg.png?t=1603956666031);}
.Area_layout02 { height:1390px;}
.Area_layout02 ul {display:inline-block;}
.Area_layout02 li {list-style:none;float:left;overflow: hidden;}
	@media screen and (max-width:767px){
			.Area_layout02 { height:100%;}			
		}




/*輪播BN+銀行*/
.Area_banner_swiper { height:590px; margin-top:-110px}
		@media screen and (max-width:767px){
			.Area_banner_swiper { height:100%;margin-top:0px}			
		}

.banner_swiper {position: absolute;left: 0px;top: 60px;text-align: left;width: 1220px;}
@media screen and (max-width:767px){
		.banner_swiper {position: absolute;left:1vw;top: 5vw;text-align: left;width:96%;padding: 2% 1%;}
		.rwd_banner_swiper {height:60vw;}
}





/*BN區*/
.Area_banner { height:480px;}
.banner_6 {position:absolute;left:9px;top:0px;}
.banner_6 li {margin: 5px 5px;width:31%;}
.banner_6 li img {width:100%;}
		@media screen and (max-width:767px){
			.Area_banner { height:100%;}
			.banner_6 {    left: 0;top: 0;position: relative;width: 100%;margin: 0 auto;padding: 0;background-color: #5f121c;}
			.banner_6 ul {margin: 0 auto;padding: 0;width: 100%;}
			.banner_6 li {margin:2% 0 0 2%;width:47%;}
			.banner_6 li img {width:100%;}			
		}	





/*活動按鈕*/
.coupon { height:310px; }
		@media screen and (max-width:767px){
			.coupon { height:100%;}			
		}
.pc_coupon {position:absolute; }
.pc_coupon ul li {width:16%;overflow:visible !important;}	



	

/*公版六*/
.Area_layout06 { height:1610px;}
@media screen and (max-width:767px){
			.Area_layout06 { height:100%; clear:both;}			
		}

/*看更多*/
.btn{ position: absolute; z-index:3; /*background-color:rgba(0,0,0,0.5)*/; top: -122px; right:204px; }
.btn a{ width:180px; height:70px; display:block;}
        }

/*看更多*/
.see_more{ position: absolute; z-index:3; /*background-color:rgba(0,0,0,0.5)*/; top: -125px; right:202px; }
.see_more a{ width:180px; /*height:70px;*/ display:block;}
@media screen and (max-width:767px){
	.see_more { height:100%; position: relative; margin:0vw 0; width:100%; padding:0; box-sizing:border-box; top:70px; left:230px; /*margin-bottom:15%;*/}
	.see_more  ul {margin:0;  overflow:hidden; margin-left:0px;  background-size:100%; }
	.see_more  ul li {list-style:none; display:inline-block; float:left; width:50%; margin:0; padding: 0; margin-top:0%;}
	.see_more  ul li a { display:block;  padding:0;text-decoration:none; box-sizing: border-box; }
	.see_more  ul li a img{ width:100%; margin:0; }

        }

/*bn*/					
.Area_bn_swiper { height:190px;}
.pc_bn_box{ border-radius:30px;}
		@media screen and (max-width:767px){
			.Area_bn_swiper { height:100%; background-size:100%; margin:9% 0 6% 0;}	
			.pc_bn_swiper {width: 90%;}	
			
		}



/*主打品*/
.Area_item { height:2928px; }
.Area_item  ul {margin:0 auto; width:100%; padding:0; overflow:hidden; }
.Area_item  ul li { list-style:none; width:44%; display:inline-block; float:left; margin:77px 0px 0 61px ; padding:0px; box-sizing:border-box;  position:relative;}
.Area_item  ul li a { display:block; text-decoration:none;}
.Area_item  ul li a img{ width:100%; }

@media screen and (max-width:767px){
	
	.Area_item { height:100%; position: relative; margin:0vw 0; width:100%; padding:0; box-sizing:border-box; top: auto; left: auto; margin-bottom:15%;}
	.Area_item ul {margin:0;  overflow:hidden; margin-left:0px;  background-size:100%; }
	.Area_item ul li {list-style:none; display:inline-block; float:left; width:50%; margin:0; padding: 0; margin-top:5%;}
	.Area_item ul li a { display:block;  padding:0;text-decoration:none; box-sizing: border-box; }
	.Area_item ul li a img{ width:100%; margin:0; }
	}
		



.Area_bonus{ height:706px;}

@media screen and (max-width:767px){
			.Area_bonus { height:100%; margin-bottom:10%;}			
		}
	







/*口罩加購區*/

.maskpd{ height:1035px;}

@media screen and (max-width:767px){
			.maskpd { height:100%;}			
		}
		
		
		



/*品牌區*/
.sale_brand { height:911px;}
		@media screen and (max-width:767px){
			.sale_brand { height:100%;}			
		}		
.pc_brand {position:absolute;left:40px;top:209px;width:1160px;}
.pc_brand ul{ }
.pc_brand ul li{ padding:20px 14px 0 0;}
		@media screen and (max-width:767px){
			.pc_brand {position:relative;left:0;top:0;width:100%; }
			.pc_brand ul {margin:0;padding:0 0 0 1%;background-color: #70caef; margin-bottom:10%;}
			.pc_brand ul li {width:31%; padding:1% 1% ;}
		
		}	






/*男性滋補*/
.newpd{ height:1097px;}
@media screen and (max-width:767px){
			.newpd { height:100%;}			
		}


		
		


/*公版4-熱搜成分*/
.Area_layout04 { height:6500px;}
.Area_layout04_bg { z-index:-10; position:absolute;width:1220px;height:2159px;left:0px;top:0px;background-repeat:no-repeat;background-position:center top;pointer-events:none;}
@media screen and (max-width:767px){
			.Area_layout04 { height:100%; clear:both;}			
		}



/*公版5-下排*/
.Area_layout05 { height:2730px;}
@media screen and (max-width:767px){
			.Area_layout05 { height:100%; clear:both; margin-top:5%;}			
		}

		
		
/*品牌logo*/
.Area_brand_logo { height:803px;}
.Area_brand_logo  ul {margin:0 auto; width:100%; padding:0; overflow:hidden; margin:-497px 14px 0 33px ;}
.Area_brand_logo  ul li { list-style:none; width:19%; display:inline-block; float:left; margin:0px 0px 0 0px ; padding:0px; box-sizing:border-box;  position:relative;}
.Area_brand_logo  ul li a { display:block; text-decoration:none;}
.Area_brand_logo  ul li a img{ width:100%; }
.brand_logo_bg { z-index:-10; position:relative;width:1220px;height:711px; top:37px;background-repeat:no-repeat;background-position:center top;pointer-events:none;background-image: url(brand_logo_bg.png?t=1603956666031);}

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

	.Area_brand_logo { height:100%; position: relative; margin:0vw 0; width:100%; padding:0; box-sizing:border-box; top: auto; left: auto;}
	.Area_brand_logo ul {margin:0;  overflow:hidden; margin-left:0px;  background-size:100%; background-color:#cfaa75; }
	.Area_brand_logo ul li {list-style:none; display:inline-block; float:left; width:20%; margin:0; padding: 0; }
	.Area_brand_logo li a { display:block;  padding:0;text-decoration:none; box-sizing: border-box; }
	.Area_brand_logo li a img{ width:100%; margin:0; }	
		}
			



/*公版一(10品)*/
.Area_layout10 { height:2230px;}
		@media screen and (max-width:767px){
			.Area_layout10 { height:100%;}			
			.mo_layout01_bg { z-index:-10;position:absolute;width:100%;height:100%;background-repeat:repeat-y;background-position:center top;pointer-events:none;background-image: url(mo_layout01_bg.jpg?t=1603956666031);}
		}
.pc_layout10 { position:absolute;top:0;}
.pc_layout10_bg { z-index:-10;position:absolute;left:0;top:60px;width:1220px;height:2300px;background-repeat:no-repeat;background-position:center top;pointer-events:none;background-image: url(pc_layout_bg.png?t=1603956666031);}




/*錨點*/
.Area_navbtn { height:400px; margin-top:0px;}
.Area_navbtn li {list-style:none;}
		@media screen and (max-width:767px){
			.Area_navbtn { height:100%;}			
		}
.pc_Area_navbtn {position:absolute; left:-60px}	
	}


/** 大牌精選1折起入稿區 **/
.bran_pc { display:inline-block; margin:0px; padding:0px; width:1220px;}
.bran_pc ul { margin:0; padding:0; width:100%; height:auto;margin-top: 10px;}
.bran_pc ul li { position:relative; display: inline-block;  height: auto; border: 0px; background-color:#000;-webkit-transition:0.2s; transition:0.2s;}
.bran_pc ul li { width:285px; height:375px; margin:0px 5px 15px 10px; }
.bran_pc ul il a { display:block; }
.bran_pc .TIMG { background:#fff;}
.bran_pc .TIMG a img { width: 100%; height: auto;}
.bran_pc .PD_LOGO { position:relative; margin-top:-15px; width:100%; text-align:center;}
.bran_pc .PD_LOGO a img { width: auto; height:40px; background-color:#fff; border-radius:60px; }
.bran_pc .PD_SLOGAN { margin-top:5px; margin-bottom:8px; width: 100%; height:18px; overflow: hidden; text-align:center;}
.bran_pc .PD_SLOGAN a { font-size:17px; line-height:18px; font-family:"微軟正黑體","Microsoft JhengHei", Arial, Helvetica; text-align:center; color:#fff; text-decoration:none;}
.bran_pc .PD_NAME {  width: 200px; height:20px; overflow: hidden; margin:0 auto; margin-bottom:8px;text-align:center;}
.bran_pc .PD_NAME a { font-size:16px; line-height:18px; font-family:"微軟正黑體","Microsoft JhengHei", Arial, Helvetica; text-align:center; color: #fff; text-decoration:none; font-weight:bold;}
.bran_pc .PD_GO { display:none; margin:0 auto; margin-bottom:15px; width:100px; height:25px; background-color:#000; }
.bran_pc .PD_GO a { font-size:16px; line-height:23px; font-family:"微軟正黑體","Microsoft JhengHei", Arial, Helvetica; text-align:center; color: #fff; text-decoration:none;}
.bran_pc ul li:hover {-webkit-transform:translateY(-6px); transform:translateY(-6px);}
.bran_pc li:hover .PD_GO a { color:#FF0;}

.bran { display:inline-block;margin:0; padding:0 0.5vw; width:100%; height:auto;}
.bran  li { position:relative; display: inline-block;width:48%;  margin:2% 0.5% 1% 0%; box-sizing: border-box; height: auto; border: 0px; background-color:#780d10;}
.bran  li a { display:block; }
.bran .TIMG { background:#fff;}
.bran .TIMG a img { width: 100%; height: auto;}
.bran .PD_LOGO { position:relative; margin-top:-1vw; width:100%; text-align:center;}
.bran .PD_LOGO a{ height:37px;width: 60%; overflow: hidden;border-radius:60px; background: #FFF;margin: 0 auto;}
.bran .PD_LOGO a img { width: auto; height:80%; background-color:#fff; margin-top: 3%;}
.bran .PD_SLOGAN { margin-top:5px; margin-bottom:4px; width: 100%; height:16px; overflow: hidden;}
.bran .PD_SLOGAN a { font-size:14px; line-height:18px; font-family:"微軟正黑體","Microsoft JhengHei", Arial, Helvetica; text-align:center; color:#fff; text-decoration:none;}
.bran .PD_NAME {  width: 100%; height:16px; overflow: hidden; margin:0 auto; margin-bottom:12px;}
.bran .PD_NAME a { font-size:14px; line-height:18px; font-family:"微軟正黑體","Microsoft JhengHei", Arial, Helvetica; text-align:center; color: #fff; text-decoration:none; font-weight:bold;}
.bran .PD_GO { display:none; margin:0 auto; margin-bottom:15px; width:100px; height:25px; background-color:#000; }
.bran .PD_GO a { font-size:16px; line-height:23px; font-family:"微軟正黑體","Microsoft JhengHei", Arial, Helvetica; text-align:center; color: #fff; text-decoration:none;}
.bran  li:hover {
    -webkit-box-shadow:0px 0px 10px rgba(0,0,0,0.7);
       -moz-box-shadow:0px 0px 10px rgba(0,0,0,0.7);
        -ms-box-shadow:0px 0px 10px rgba(0,0,0,0.7);
         -o-box-shadow:0px 0px 10px rgba(0,0,0,0.7);
            box-shadow:0px 0px 10px rgba(0,0,0,0.7);
}
.bran li:hover .PD_GO a { color:#FF0;}

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