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

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

/*PC縮小*/
@media screen and (min-width: 768px) {
	
}


/*全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:"Century Gothic","微軟正黑體","Microsoft JhengHei",Helvetica;}
.WRAPPER img { border:0px; vertical-align:top;}
.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 (min-width: 768px) {
		.WRAPPER { max-width: 2000px;}
	}
	@media screen and (max-width:767px){
		.WRAPPER { min-width: inherit; min-height:100vh;}
		.WRAPPER img { width:100%;  height: auto;}
	}


/*fixed背景*/
.pc_bg { z-index:-10; position:fixed;top:0;left:0; width:100%; height:100vh; background-repeat:no-repeat; background-position:center top; pointer-events:none; }
  @media screen and (max-width:767px){
   .m_bg { z-index: -10; position: fixed; top:0; left: 0; width: 100%; height:100vh; background-position: center top; background-repeat: no-repeat; pointer-events: none; background-size: 100%;}	
  }

/*PC背景*/
.Area_bgtop { z-index: 0; position: absolute; top: 0; left: 50%; width: 2000px; -webkit-transform: translateX(-50%); transform: translateX(-50%); pointer-events: none;}
.Area_bgtop .bgtop_ { position: absolute; top: 0; left: 0; width: 100%; height: 1200px;}
.Area_bgtop .bgtop_ span { position: absolute; display: block; width: 100%; height: 100%; background-position: center top;}
  @media screen and (min-width: 768px) {
    .Area_bgtop span { background-repeat: no-repeat;}
    .Area_bgtop_fixed { position: fixed;}
    .Area_bgtop_1 .bgtop_1_1 span { background-image: url(bgtop_1_1.png?t=1750328665842);}
	.Area_bgtop_1 .bgtop_1_2 span { background-image: url("bg_light.png?t=1750328665842"); mix-blend-mode: screen; animation: shine 2s infinite alternate;}
  }

/*Phone背景*/
.m_Area_bgtop { z-index: 0; position: absolute; top: 0; left: 0; width: 100%; height: 100%; pointer-events: none;}
.m_Area_bgtop .m_bgtop_ { position: absolute; top: 44px; left: 0; width: 100%; height: 100%; }
.m_Area_bgtop .m_bgtop_ span {position: absolute; display: block; width: 100%; height: 100%; overflow: hidden; background-position: center top; background-size: 100%;}
  @media screen and (max-width: 767px) {
    .m_Area_bgtop span { background-repeat: no-repeat;}
    .m_Area_bgtop_fixed { position: fixed; top: 32px;} /*搭配js-appBgFixed*/
    .m_Area_bgtop_1 .m_bgtop_1_1 span {   background-image: url(m_bgtop_1_1.jpg?t=1750328665842); }
	.m_Area_bgtop_1 .m_bgtop_1_2 span {   background-image: url(m_bgtop_1_2.png?t=1750328665842); mix-blend-mode: screen; animation: shine 2s infinite alternate;}
  }




/*區塊背景-共用設定*/
.Area_bg { pointer-events: none; z-index: -1;}
.Area_bg div { pointer-events: none; z-index: 1; position: absolute; left: 0; width: 100%; background-position: center top; background-repeat: no-repeat;}
    @media screen and (max-width: 767px) {
      .Area_bg div { pointer-events: none; z-index: -1; position: absolute; left: 0; width: 100%; background-position: center top; background-repeat: no-repeat;}
      .Area_bg div { z-index: 1; top: 0vw; padding-bottom: 200%; background-size: 100%;}
    }
    /*圖片*/
    /*.Area_share_bg { z-index: 2;}*/
      @media screen and (min-width: 768px) {
        .Area_activ_bg div { top: -133px; height: 1000px; position: absolute;}
      }
      @media screen and (max-width: 767px) {
        .Area_activ_bg div { top: -17.5vw; height: 0; padding-bottom: 110%; background-size: 100%;}
      }



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


	@media screen and (max-width:767px){
		.Area_top { height: auto;}
	}




/*版頭區塊*/
.Area_title img { width: 100%; height: auto;}
.Area_title .title { position: relative; pointer-events: none;}
.Area_title .title_02 { position: absolute;}
.Area_title .title_02_deco{ position: absolute; mix-blend-mode: screen;}
.Area_title .title_03{ position: absolute; mix-blend-mode: screen;}
.Area_title .title_04{ position: absolute; }
  @media screen and (min-width:768px){
    .Area_title .title_02 { left: 91.5%;  top: 13%; width: 15.5%; }
    .Area_title .title_02_deco{ left: 90.5%;  top: 10%; width: 17.5%;}
    .Area_title .title_03{ left: 0;  top: 0; width: 100%;}
    .Area_title .title_04{ left: -125px;  top: 58px; width: 1220px;}
 }
  @media screen and (max-width:767px){
	  .Area_title .title_02 { width: 16%; right: 3vw; top: 3vw;  }
    .Area_title .title_02_deco { width: 18.5%; right: 2vw; top: 1.3vw;  }
    .Area_title .title_03{ left: 0;  top: 0; width: 100%;}
    .Area_title .title_04{ left: 0;  top: 0; width: 100%;}
  }
  /*副標輪播*/
  .Area_title .box_PD { position: absolute; top: 329px; left: -12px; width: 960px; /*height: 140px;*/}
  .Area_title .box_PD .Area_swiper ul { margin: 0; padding: 0; }
  .Area_title .box_PD .Area_swiper li { list-style: none; }
  .Area_title .box_PD .Area_swiper img { width: 92%; height: auto;}
    @media screen and (max-width:767px){
      .Area_title .title{ margin-bottom: 1vw;}
      .Area_title .box_PD { position: absolute; top: 36.4vw; left: 0; width: 100%; height: auto;}
    }


    /*輪播調整*/
    .Area_title .Area_swiper_box{ padding-bottom: 0; }


/** 倒數 **/
.TimerNick { text-shadow: none; display: flex; }
.TimerNick .TIMER { margin: 0; padding: 0; text-align: center; color: #fff; font-size: 28px; line-height: 40px; font-weight: 800; font-family:"微軟正黑體","Microsoft JhengHei", Arial, Helvetica; overflow: visible;}
.TimerNick span { float: left;}
.TimerNick small { float: left; position: relative; top: 0; font-size: 28px; margin-right: 10px; margin-left: 2px;}
.TimerNick .time_day { margin-right: 5px; letter-spacing: .3rem;}
.TimerNick .FontStyle { position: relative; font-size: 32px; width: 51px; color: #fff; font-family: "Century Gothic";}
.TimerNick .FontStyle b { display: inline-block; margin: 0; width: 17px; text-align: center; font-weight: 300;}
  @media screen and (min-width:768px){
    .TimerNick {justify-content: center;  margin: 20px 0 50px 0;}
  }
  @media screen and (max-width:767px){
    .TimerNick { padding: 4vw 0 0 9vw; width: 100%; justify-content: left;}
    .TimerNick2{ padding: 4vw 0 0 0; justify-content:center;}
    .TimerNick .TIMER { font-size: 4vw; line-height: 5vw; }
    .TimerNick small { top: 0.4vw; font-size: 3.5vw; margin-right: .4em; margin-left: .15em;}
    .TimerNick .time_day { position: relative; font-size: 4vw; line-height: 5vw;}
    .TimerNick .FontStyle { width: 5vw; font-size: 5vw; padding: 0.25em; top: -0.2em;}
    .TimerNick .FontStyle b { margin: 0; width: 3vw;}
  }

/*去除PD_layout樣式*/
.PD_noBG ul { background-color: transparent; width: 100%; padding: 0;}
.PD_noBG ul li { border: none; /*background-color: #fff;*/}




/*區標(線上入稿)*/

.box_txt{ position: relative; margin: 0 auto; width: 100%;}
.box_txt3{ height:160px; padding-top: 5.5%;}
.box_txt4{ margin: 3vw auto 1vw!important;}

.box_txt::before {content:"";position: absolute;display:block;top:-10%;left: 0;width: 100%;height: 100%;pointer-events:none;background: url("m_box_txt_bg.png?t=1750328665842") center top/100% no-repeat scroll;}
.box_txt3::before {content:"";position: absolute;display:block;top:16%;left: 0;width: 100%;height: 100%;pointer-events:none;background: url("m_box_txt_bg3.png?t=1750328665842") center top/100% no-repeat scroll;}
.box_txt4::before {content:"";position: absolute;display:block;top:0;left: 0;width: 100%;height: 100%;pointer-events:none;background: url("m_box_txt_bg4.png?t=1750328665842") center top/100% no-repeat scroll;}

.box_txt .PD_layout .PD h3 {color:#fee7c1;font-size: 3.5em;line-height: 1.9em;font-style: italic;font-weight: 700;font-family:"Century Gothic","Noto Sans TC";}
.box_txt3 .PD_layout .PD h3{ color: #4f0400; line-height: 2.2em; }

.box_txt .box_title_deco1{ position: absolute; left: 6.6%; top:-2%; width: 10%; height: auto; animation: disk 3s infinite; } 
.box_txt3 .box_title_deco1{ right: 5%; top:63%; } 
.box_txt4 .box_title_deco1{ right: 6%; top:63%; } 

.box_txt .PD_layout{  width: 100%; }
.box_txt li:hover{ transform: none!important; }
.box_txt a{ pointer-events: none;}
.box_txt h3 span{ overflow: visible!important;}


@media screen and (max-width:767px){
  .box_txt {margin: 0 auto 0vw; }
  .box_txt::before{ top:0; }
  .box_txt3 {margin: 0 auto 3vw;}
  .box_txt .PD_layout .PD h3 {font-size: 1.6em;}

}

@keyframes disk{
	0%{  transform:rotateY(180deg); }
	30%{  transform:rotateZ(0); }
	100%{  transform:rotateZ(0); }
	
}


/*攻略區塊*/
.Area_activ .box_tab2{ margin-top: 2%; }
.warningTxt { position: relative; }
.warningTxt:before{ content:""; position: absolute; width: 100%; height: 100%; bottom: -0.7em; left: 0; background: url(txtline.png?t=1750328665842) no-repeat center / 100%; z-index: -2;}
  @media screen and (min-width:768px){
  }
  @media screen and (max-width:767px){
    .Area_activ{ margin-top: 8vw; background: linear-gradient(90deg, #2782bb, #2782bb, transparent);}
  }


/*主打品*/
.Area03 .PD_layout.layout_item .PD_slide .PD p del { color:#7e7e7e;font-size: 0.4em;}
.Area03 .PD_layout.layout_item .PD_slide .PD p {padding: 1% 0;height: 1.5em;line-height: 1em;font-size:5.5em;}
.Area03 .PD_layout.layout_item .PD p .money {color: #1e5e85;font-weight: 500; font-size: .7em;}
.Area03 .PD_layout.layout_item .PD p .Price {color: #1e5e85;font-weight: 800; font-size: 1em; text-align: left;}
.Area03 .PD_layout.layout_item .PD_slide .PD_into {padding-left:0;position: relative; text-align:center;font-size: 0.8em;}
.Area03 .PD_layout.layout_item .PD_slide .PD_into h3 {padding: 0;max-height: 1.6em;font-weight: 500;font-size: 3.8em;line-height: 1.8em;font-family: "Noto Sans CJK SC";color:#414141;}
.Area03 .PD_layout.layout_item .PD_slide .PD_into h4 {font-size: 3.2em;color: #414141; font-weight: 700;}
.Area03 .PD_layout.layout_item .PD_slide .PD_img img { width: 100%; margin: 0; box-shadow: unset;}
.Area03 .PD_layout.layout_item .PD_slide .PD .PD_logo { display: none;}

@media screen and (min-width:768px){
	.Area03:before{ content: ""; background: url("item_bg_top.jpg?t=1750328665842") no-repeat scroll top / 100%; position: absolute; top:144px; left: 50%; width: 2000px; height: 200px; transform: translateX(-50%);  z-index: -1;}
	.Area03:after{ content: ""; background: url("item_bg_bottom.jpg?t=1750328665842") no-repeat scroll bottom / 100%; position: absolute; bottom:-30px; left: 50%; width: 2000px; height: 200px; transform: translateX(-50%);  z-index: -1;}
	.Area03 .bg:before{ content: ""; background: url("item_bg_center.jpg?t=1750328665842") repeat scroll top / 100%; position: absolute; top:144px; left: 50%; width: 2000px; height: 95%; transform: translateX(-50%); z-index: -2; }
  .Area03 .PD_layout.layout_item li{background: url("layout_itembg.png?t=1750328665842") center top / 85% no-repeat scroll;}	
  .Area03 .PD_layout.layout_item li .PD{ padding: 20px; }
	.Area03 .PD_layout.layout_item ul { grid-gap: 0 3%;  margin-top:56px;}
	.Area03 .PD_layout.layout_item .PD_slide:hover {transform:translateY(-6px);}
	.Area03 .PD_layout.layout_item .PD_slide:hover { box-shadow:unset;}
	.Area03 .PD_layout.layout_item .PD_slide { padding:0;margin: 0;}
  .Area03 .PD_layout.layout_item .PD_slide .PD_into{ margin: -28px auto 0;}
	
}
@media screen and (max-width:767px){
	.Area03{  padding-bottom: 2vw; }    
	.Area03:before{ content: ""; background: url("m_item_bg_top.png?t=1750328665842") no-repeat scroll top / 100%; position: absolute; top:14vw; left: 0; width: 100%; height: 17vw; z-index: -1;}
	.Area03:after{ content: ""; background: url("m_item_bg_bottom.png?t=1750328665842") no-repeat scroll bottom / 100%; position: absolute; bottom:-5vw; left: 0; width: 100%; height: 17vw; z-index: -1;}
  .Area03 .bg:before{ content: ""; background: url("m_item_bg_center.png?t=1750328665842") repeat scroll top / 100%; position: absolute; top:27vw; left: 0; width: 100%; height: 90%; z-index: -2;}
  .Area03 .PD_layout.layout_item li{background: url("layout_itembg.png?t=1750328665842") center top / 90% no-repeat scroll;}	
	.Area03 .box_all{ width: 96%; margin: auto;}
	.Area03 .PD_layout.layout_item ul { grid-gap: 0 1.5%;}
	.Area03 .PD_layout.layout_item ul li {width: 100%; height: 72vw;}
	.Area03 .PD_layout.layout_item .PD_slide .PD_into {font-size: 0.9em; top:-5vw; width: 100%;}
	.Area03 .PD_layout.layout_item .PD_slide .PD_into h3 { font-size: 1.3em; line-height: 2em;  }
	.Area03 .PD_layout.layout_item .PD_slide .PD_into h4 { font-size: 1.3em; line-height: 1.7em;  letter-spacing: -1px; margin-bottom: 0;}
	.Area03 .PD_layout.layout_item .PD_slide .PD p{ height: 2em; line-height: 8vw; font-size: 1.5em;  }    
	.Area03 .PD_layout.layout_item .PD p .money { font-size: .4em;}
	.Area03 .PD_layout.layout_item .PD p .Price { font-size: 1.3em; }
	.Area03 .PD_layout.layout_item .PD_slide .PD_img img { margin: 6% 0 0 0%;}


}

@media screen and (min-width: 768px){
/* .Area04 .box_all .PD_layout ul{width: 800px;} */
}

/*BN*/
@media screen and (min-width: 768px){
.Area_Abn2 {height:312px;}	
.Area_Abn2 .box05 .PD_layout .PD img,.Area_Abn .box06 .PD_layout .PD img { border-radius: 1em; }
	
}
@media screen and (max-width: 767px){
.Area_Abn2 {height:33vw; }	
.Area_Abn2 .box{ }
.Area_Abn2 .box05 { margin-bottom: 2vw;   width: 100%; margin: 0 auto; }
.Area_Abn2 .box05 .PD_layout .PD img,.Area_Abn .box06 .PD_layout .PD img { border-radius: 0.5em; }
}


/*商品公版*/

@media screen and (min-width:768px){
	.Area05{ margin-top: 70px;  padding-bottom: 53px;  margin-bottom: 20px; }
	.Area05:before{ content: ""; background: url("pd_bg_top.jpg?t=1750328665842") no-repeat scroll top / 100%; position: absolute; top:0; left: 50%; width: 2000px; height: 4px; transform: translateX(-50%);}
	.Area05:after{ content: ""; background: url("pd_bg_bottom.jpg?t=1750328665842") no-repeat scroll bottom / 100%; position: absolute; bottom:0; left: 50%; width: 2000px; height: 5px; transform: translateX(-50%);}
	.Area05 .bg:before{ content: ""; background: url("pd_bg_center.jpg?t=1750328665842") repeat scroll top / 100%; position: absolute; top:0; left: 50%; width: 2000px; height: 100%; transform: translateX(-50%); z-index: -1; }
	
}
@media screen and (max-width: 767px){
	.Area05 { background-color: #f8d2a0; padding: 0 0 5vw; margin-top: 6vw;}
	.Area05:before{ content: ""; background: url("m_pd_bg_top.png?t=1750328665842") no-repeat scroll top / 100%; position: absolute; top:0; left: 0; width: 100%; height: 10vw;}
	.Area05:after{ content: ""; background: url("m_pd_bg_bottom.png?t=1750328665842") no-repeat scroll bottom / 100%; position: absolute; bottom:0; left: 0; width: 100%; height: 10vw;}
	
}


.Area_logo .PD_layout ul{grid-gap: 15px 15px;}

@media screen and (max-width: 767px){
  .Area_logo .PD_layout ul{width: 96vw; margin: 0 auto; grid-gap: 2.5vw 2.5vw;}

}

.Area_logo .PD_layout li{
 background-image: url('logo_bg.png?t=1750328665842');
 background-size: cover;
 aspect-ratio: 1/1;
 padding: 10px;
 display: flex;
 justify-content: center;
 align-items: center;
}





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



/* 20240527改版後移除公版設定*/

/*移除公版設定，區標、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;}
}




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

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