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

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




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

/*PC背景*/
.bg_01 { z-index:-49; position:absolute; top:0; left:0; width:100%; height:100%; background-repeat:no-repeat; background-position: center top; pointer-events:none;}
/*.bg_02 { z-index:-51; position:absolute; top:1000px; left:0; width:100%; height:100%; background-repeat:repeat-y; background-position: center top; pointer-events:none;}*/
/*.bg_03 { z-index:-53; position:fixed; top:0; left:0; width:100%; height:100%; background-repeat:no-repeat; background-position: center top; pointer-events:none;}*/
.bg_04 { z-index:-52; position:fixed; top:0; left:0; width:100%; height:100%; background-repeat:no-repeat; background-position: center top; pointer-events:none;}
/*.bg_06 { z-index:-52; position:fixed; top:0; left:0; width:100%; height:100%; background-repeat:no-repeat; background-position: center top; pointer-events:none;mix-blend-mode: screen;}*/
.bg_05 { z-index:-51; position:absolute;top:700px; 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){
	.m_top { z-index:-52; position:fixed;top: 0vw; bottom:0; left:0; width:100%; height:100%; background-repeat:no-repeat; background-position: center top; pointer-events:none;background-size:120%;}
	.m_fix { z-index:-50; position:absolute;top:130vw; left:0; width:100%; height:100%; background-repeat:repeat-y; background-position: center top; pointer-events:none;background-size:100%;}
}



/*區塊_all*/
.Area { position: relative; margin: 0 auto; padding: 0; border-radius: 0; text-align: center; }
.Area a { 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);}
.Area1220 { margin: 0 auto; width: 1220px;}
.Area960 { margin: 0 auto; width: 960px;}
@media screen and (max-width:767px){
  .Area .go_bt:hover {  
    -webkit-transform: none;
     -moz-transform: none;
      -ms-transform: none;
       -o-transform: none;
          transform: none;}

  .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 1% 2%; padding: 0; width: 48%; list-style: none;}
  .Area_3bn { margin: 0 auto; padding: 0; overflow: hidden;}
  .Area_3bn a { float: left; margin: 0 1% 2% ; padding: 0; width: 31.3%; 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.3%; list-style: none;}
}

/*間距*/
.Area_bottom { margin-bottom: 50px;}
@media screen and (max-width:767px){
  .Area_bottom { margin-bottom: 10vw;}
}

#eWriterBtn_bt_B_000_05{position: absolute; left: 100px;}


/*PC黏人精-區塊錨點*/
.fixarea_tabbar {z-index:99;position:fixed;right:0;top:200px;border-radius:20px 0 0 20px;width:110px; background-color: rgba(0,0,0,.65); text-align: center;font-family:"微軟正黑體", "Microsoft JhengHei", Arial;
  -webkit-transform: rotate3d(0,0,0,0deg) translate3d(150px,0,0);
          transform: rotate3d(0,0,0,0deg) translate3d(150px,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;
  }
.fixarea_tabbar.fixarea_off { -webkit-transform: rotate3d(0,0,0,0deg) translate3d(0,0,0); transform: rotate3d(0,0,0,0deg) translate3d(0,0,0);}
.fixarea_tabbar .fix_box { margin:20px auto 10px; margin-left:10px;}
.fixarea_tabbar ul { margin:0; padding:0; list-style:none;}
.fixarea_tabbar li { position:relative; margin:0; padding:0; font-weight:800; font-size:15px; line-height:20px; }
.fixarea_tabbar a { display:block; text-decoration:none; color:#fff; }
.fixarea_tabbar a:hover{ color:#ffffbe; }
.fixarea_tabbar .cate-hover a { color:#ffffbe; }
.fixarea_tabbar .fix_other { }
.fixarea_tabbar .fix_other li { padding:10px 0; }
.fixarea_tabbar .fix_other li:before { content: ""; display: block; position: absolute; bottom:0; left:18%; width:64%; height:1px; background-color:#fff; opacity: 0.2}
.fixarea_tabbar .fix_other li:last-child::before { display:none;}
.fixarea_tabbar .fix_other li i { display:none; z-index:-1; position: absolute; top:53%; left:-2px; width:12px; height:12px; -webkit-transform:translate(0%,-50%); transform:translate(0%,-50%); background:url('') no-repeat center center; background-size:100%;}
.fixarea_tabbar .fix_other .cate-hover i { display: block;}
.fixarea_tabbar .fix_footer { position: relative; margin-bottom:10px; margin-left: 10px; font-weight:800; font-size:24px;}
.fixarea_tabbar .fix_footer a { display:block; padding-top:11px; color: #fff;}
.fixarea_tabbar .fix_footer a::before { content: ""; position: absolute; top:6px; left:44%; display:block; width: 0; height: 0; border-width: 0 5px 8px 5px; border-style: solid; border-color:transparent transparent #FFF transparent;}
.fixarea_tabbar .fix_footer a:hover { color:#ffffbe; }    
/*錨點icon--用SVG格式*/
.fixarea_tabbar .fix_other li i { mask-image: url('data:image/svg+xml,%3Csvg%20id%3D%22navlight_icon%22%20data-name%3D%22navlight%20icon%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2020%2020%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%23ffffff%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3E%3C%2Ftitle%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M10%2C0A7.17%2C7.17%2C0%2C0%2C0%2C2.8%2C7.2C2.8%2C12.9%2C10%2C20%2C10%2C20s7.2-7.1%2C7.2-12.8A7.17%2C7.17%2C0%2C0%2C0%2C10%2C0Zm0%2C11a3.8%2C3.8%2C0%2C1%2C1%2C3.8-3.8A3.8%2C3.8%2C0%2C0%2C1%2C10%2C11Z%22%2F%3E%3C%2Fsvg%3E'); background-color: #ffffbe }
.fixarea_tabbar .fix_footer:hover a::before { border-color: transparent transparent #ffffbe transparent;}
                



/*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;}
  }
                    

/*版頭*/

.Area_top {height:880px;}
.f1  {position:absolute;left:940px;top:116px;z-index:8;animation-duration:2s;animation-delay:1s}
.f2  {position:relative;left:-685px;top:104px;animation-duration:2s;animation-delay:2s}


@media screen and (max-width:767px){
  .Area_top {width:100%;height:134vw;}
  .f1  {position:absolute;left:47vw;top:78vw;width:65%;z-index:2;animation-duration:2s;animation-delay:1s;pointer-events:none;}
  .f2  {position:absolute;left:0vw;top:11vw;width:55%;z-index:2;animation-duration:2s;animation-delay:1s;pointer-events:none;}
  .mbg_04 {position:absolute;left: 0;top: 0; width: 100%;z-index: -51;pointer-events:none;}
  .mbg_06 {position:absolute;left: 0;top: 0; width: 100%;mix-blend-mode: screen;z-index: -51;pointer-events:none;}
}

/*主標*/
/*.Area_top .title1 {position:absolute;left: 243px;top: 235px;height:350px;width: 660px;;animation-duration:1s;margin: auto;z-index: 10}*/
.Area_top  .main1{position: absolute; z-index:0;left:193px;top: 239px;}
.Area_top  .main2{position: absolute; z-index:9;left:13px;top: 410px;}
.Area_top .title1 .PD_layout ul li {pointer-events:none;}
/*.Area_top .title1 img {width: 804px;}*/
	@media screen and (max-width:767px){
    .Area_top .title1 {position: absolute;left: 7%;top: 26vw;height: 43vw;width: 85%;margin: 0px auto;list-style: none;z-index: 3;}
    .Area_top .main1 {width: 96%;top: 43vw!important;left: 2vw!important;z-index: 99;}
    .Area_top .main2 {width: 95%;left: 2vw!important;top: 66vw!important;z-index: 99;}
}

/*副標*/
.Area_top .title2 {position:absolute;left: 280px;top: 534px;height:153px;width: 640px;text-align: left;z-index: 3;}
.Area_top .title2 .PD_layout ul li {pointer-events:none;}
.Area_top .title2 img {width: 504px;}
	@media screen and (max-width:767px){
    .Area_top .title2 {position: absolute;left: 10%;top: 77vw;height: 17vw;width: 80%;margin: 0px auto;list-style: none;z-index: 3;}
    .Area_top .title2 img {width: 100%;}

}

         /*大小網吃不同張*/
         @media screen and (min-width:768px){
         .Area_top .box_PD .PD_layout[data-pd-pdlogo] .PD .PD_logo { display: none!important;}
         }
         @media screen and (max-width:767px){
         .Area_top .box_PD .PD_layout[data-pd-pdlogo] .PD .PD_img { display: none!important;}
         }



/*版頭輪播品*/
.Area_top .box_PD {position:absolute;top: 402px;left:246px;width:702px;height:428px;animation-delay: 0.5s; }
.Area_top .box_PD .Area_swiper .swiper-slide .PD_img img {width:100%;}
.Area_top .box_PD .Area_swiper ul {margin: 0;padding: 0; display: flex;}
    @media screen and (max-width:767px){
      .Area_top .box_PD  { z-index: 2; position:absolute;left: 14.5vw;top: 54.5vw; width: 68%; height:40%;}
	  .Area_top .box_PD .Area_swiper  .swiper-slide .PD_img img {width:100%;}
    }
    /*輪播公板調整*/
    .Area_top .box_PD .PD_layout {}
        @media screen and (max-width:767px){
         .Area_top .box_PD .PD_layout .PD_logo { z-index: 5; position: absolute; top: 0; left: 0;}
        }
        /*輪播特效*/
        @media screen and (min-width:768px){
            .Area_top .box_PD .Area_swiper .swiper-slide .PD_img { opacity: 0; transform: translate(-6%,0);}
            .Area_top .box_PD .Area_swiper .swiper-slide-active .PD_img { opacity: 1; transition: 1s ease-out; transform: translate(0,0);}

        }
        @media screen and (max-width:767px){
            .Area_top .box_PD .Area_swiper .swiper-slide .PD_logo { opacity: 0;transform: translate(-6%,0);  }
            .Area_top .box_PD .Area_swiper .swiper-slide-active .PD_logo { opacity: 1; transition: 1s ease-out; transform: translate(0,0);}

        }


/*攻略活動*/
.Area_activ .activ {position:relative;left:40px;top:0px;width:100%;z-index:5;}
.Area_activ .activ ul{display:inline-block; width:100%;}
.Area_activ .activ ul li {position:relative;list-style:none;float:left;margin:0;padding:5px 0;}
/*.Area_activ .activ ul li:nth-child(1) {width:46%;margin:0 10px;}*/
.Area_activ .activ ul li:nth-child(2) {width:46%;margin:0 10px;}
.Area_activ .activ ul li:nth-child(3) {width:18%;margin:0 10px;}
.Area_activ .activ ul li:nth-child(1) img{width:100%;}
.Area_activ .activ ul li:nth-child(2) img{width:100%;}
.Area_activ .activ ul li:nth-child(3) img{width:100%;}

.Area_activ .add_11{position:relative;left: 510px;top: -320px;}


		@media screen and (max-width:767px){
			.Area_activ { height:100%;}
			.Area_activ .activ { position:relative;left:1%;top:0vw;width:95%;padding-bottom:0;}
			.Area_activ .activ ul{ width:100%;padding: 0;margin: 0;}
		    .Area_activ .activ ul li:nth-child(1){margin:0; padding:0 0 1% 1%; width:45%;}
		    .Area_activ .activ ul li:nth-child(2){margin:0; padding:0 0 1% 1%; width:50%;}
		    .Area_activ .activ ul li:nth-child(3){margin:0; padding:0 0 1% 1%; width:25%;}
			.Area_activ .activ .width12{width: 110%!important;}
			
			
			.Area_activ .size{width: 85%;}
			.Area_activ .activ ul li img{width:100%;}
			.Area_activ .add_11{position:relative;left: 8vw;top: -38vw;width: 141%;}
		}



/*限時加購線上入稿*/
.Area_activ .AreaBN { position: relative; flex-wrap: nowrap;  box-sizing: border-box;padding: 0 60px;width: 60%; }
.Area_activ  .AreaBN .PD_layout ul{ padding-left: 30px;padding-right: 30px; }
.Area_activ  .AreaBN .PD_layout .PD img{ width:100%; }
/*.11_bg {display: flex; text-decoration: none;}*/

@media screen and (max-width:767px){
   .Area_activ .AreaBN { flex-wrap: wrap; padding: 0 4%;}
   .Area_activ  .AreaBN .PD_layout ul{ padding-left: 0;padding-right: 0; }
   .Area_activ .AreaBN .PD_layout .PD img{ width:100%; }
   .addbox{height: 0vw;margin-bottom: 80vw;}
	}


         /*大小網吃不同張*/
         @media screen and (min-width:768px){
         .Area_activ  .PD_layout[data-pd-pdlogo] .PD .PD_logo { display: none!important;}
         }
         @media screen and (max-width:767px){
         .Area_activ  .PD_layout[data-pd-pdlogo] .PD .PD_img { display: none!important;}
         }




/*限搶*/
@media screen and (min-width:768px){
    .Area_limited {height: 532px; padding-bottom: 100px;}
	.Area_limited .layout_4PDa {top: 201px;margin-left: -60px;}
	.Area_limited .layout_4PDa ul { width:75%; padding:0px 0 0 0; margin:0 auto;}

}
@media screen and (max-width:767px){
    .Area_limited {height: auto; padding-bottom:8vw;padding-top: 0vw;}
    .Area_limited .layout_4PDa {top: 5vw;}

    .Area_limited .layout_4PDa ul {width:96%;/*padding:0!important;margin:0 0 0 5%!important;*/}

}


/*美味專區*/
@media screen and (min-width:768px){
    .Area_limited {height: 676px; padding-bottom: 105px;}
	.Area_limited .layout_4PDa2 {top: 154px;position: relative;left: 100px;margin-left: -60px;}
	.Area_limited .layout_4PDa2 ul { width:75%; padding:0px 0 0 0; margin:0 auto;}
}
@media screen and (max-width:767px){
    .Area_limited {height: auto; padding-bottom:20vw;padding-top: 0vw;}
    .Area_limited .layout_4PDa2 {top: 5vw;}
    .Area_limited .layout_4PDa2 ul {width:96%;/*padding:0!important;margin:0 0 0 5%!important;*/}

}
  
    /*下方公版*/
    .Area07 {}
    .Area07 .tag {display: flex;flex-wrap: wrap;margin: 20px 0 50px 0;height: auto;box-sizing: border-box;justify-content:center;}
    .Area07 .tag a:nth-of-type(1) {padding-left: 0px;}
    .Area07 .tag a {width: 30%;margin: 0 0px;}
    .Area07 .tag a:hover{filter: brightness(1.2);}
    .Area07 .tag a img {width: 90%;}
    .Area07 .box {padding-bottom: 50px;margin-bottom: 55px;}
    .Area07 .box .bg_box ul{ width: 100%;margin-top: 35px; }





    @media screen and (max-width:767px){
      .Area07 {}
      .Area07 .tag {display: flex;flex-wrap: wrap;margin: 0 0vw 35vw 0vw;height: 0vw;box-sizing: border-box;}
      .Area07 .tag a {width: 45%;margin: 0 0% 3%;}
      .Area07 .tag a:nth-of-type(1) {padding-left:0vw;padding-right: 2vw;}	
      .Area07 .tag a:nth-of-type(9) {padding-left: 0vw;}
      .Area07 .tag a img {width: 100%;}
      .Area07 .box  {padding-bottom: 5vw;}
      .Area07 .box .bg_box ul{ width: 96%;margin-top: 5vw; }

    }


/*美味專區微調*/
@media screen and (min-width:768px){
.distop{margin-top: 145px;}
}
@media screen and (max-width:767px){
		.titlesmall {position: inherit;width: 94%;left: 4vw;}
}



/*品牌故事微調*/
@media screen and (max-width:767px){
		.sizee {width: 117%;margin: -11vw;}
		
	}
/*登記送活動詳情*/
  .agreeArea .itembox .item-title { min-width: calc(100% - 35em);}

  
/*浮層*/
@media screen and (max-width:767px){
  .agreeArea .itembox .item-information1 {font-size: 1rem;text-align: left;line-height: 1.65rem;color: #000;font-weight: 500;padding-left: 1rem;}
}
  



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