@charset "utf-8";
/* 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}
/*預設清單樣式*/
.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;}
		.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;}
	} 

/*背景*/
.bg_01 { z-index: -3; position:absolute; top:0; left:0; width:100%; height:100%; background: #caf8ff;}
.petal{position: absolute;z-index: -1;}
@media screen and (min-width:768px){
  .bg_02 { z-index: -1; position:absolute; bottom:0; left:0; width:100%; height:400px; background: url(area_bg_bt_pc.png?t=1772002950046) no-repeat;background-position: center bottom;background-size: contain;}
  .bg_deco02 { z-index: -1 ; position:absolute ; top: 1000px ; left: 0px; width:100%; height:80%; background-position:center top; background-repeat:repeat-y; transition:0.5s linear; pointer-events:none;}
  .pc_repeat_bg { z-index: -2 ; position:absolute ; top: 0 ; left: 0 ; width:100%; height:100%; background-position:center top; background-repeat:repeat-y; transition:0.5s linear; pointer-events:none;}
  .mo_top{z-index:-2; position:absolute ; top:0;left:50%;transform: translateX(-50%);width:2000px;height: 800px;background-repeat:no-repeat;background-position: center top;pointer-events:none;background-size: 100%;}
}
@media screen and (max-width: 767px){
  .bg_02 { z-index: -1; position:absolute; bottom:0; left:0; width:100%; height:22vw; background: url(area_bg_bt.png?t=1772002950046) no-repeat;background-position: center bottom;background-size: contain;}
  .mo_top{z-index:-2; position:absolute ; top:9vw;left:0;width:100%;height: 2%;background-repeat:no-repeat;background-position: center top;pointer-events:none;background-size: 100%;}
  .m_repeat_bg { z-index: -1 ; position:absolute ; top: 0 ;left:0;width:100%;height: 100%;background-repeat:repeat-y;background-position: center top;pointer-events:none;background-size: 100%;}
  .petal{width: 3vw;}
}

.sub .Area_swiper .Area_swiper_box li {background: none;}

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

  .Area_title .title_bg { 
    position:absolute ;         
    width: 430px;
    left: 399px;
    top: 301px;
    z-index: 0 ; 
  }
  .Area_title .cate { 
    position:absolute ;         
    width: 361px;
    top: 35px;
    left: 467px;
    z-index: 1 ; 
  }
  .Area_title .date { 
    position:absolute ;         
    width: 195px;
    top: 30px;
    left: 291px;
    z-index: 1 ; 
  }
  .Area_title .main { 
    position:absolute ;        
    width: 825px;
    top: 68px;
    left: 210px;
    z-index: 1 ; 
  }
  .Area_title .sub { 
    position: absolute ;         
    width: 380px;
    left: 422px;
    top: 307px;
  }

  .deco01 { 
    position: absolute;         
    top: 320px;
    left: 160px;
    width: 350px; 
    z-index: 2;
  }
  .deco02 { 
    position: absolute; 
    top:320px;
    right: 160px;
    width: 350px;
    z-index: 2;
  }
  .deco03 { 
    position: absolute;
    width: 290px;
    top: 1px;
    left: -430px;
    z-index: 0;
  }
  .deco04 { 
    position: absolute;
    width: 290px;
    top: 0px;
    right: -430px;
    z-index: 0;
  }
  .deco05 { 
    position: absolute;
    width: 2000px;
    top: 86px;
    left: -457px;
    z-index: 0;
  }
  .deco06 { 
    position: absolute;
    width: 2000px;
    top: 420px;
    left: -384px;
    z-index: 0;
  }
}
@media screen and (max-width: 767px){
  .Area_title { height: 57vw ; }
  .Area_title .title_bg { 
    position:absolute ;         
    width: 53vw;
    top: 32vw;
    left: 25vw; 
    z-index: 0 ; 
  }
  .Area_title .cate { 
    position:absolute ;         
    width: 41vw;
    top: 3vw;
    left: 31vw; 
    z-index: 1 ; 
  }
  .Area_title .date { 
    position:absolute ;         
    width: 22vw;
    top: 2vw;
    left: 14vw;
    z-index: 1 ; 
  }
  .Area_title .main { 
    position:absolute ;        
    width: 87vw;
    top: 7vw;
    left: 6vw; 
    z-index: 1 ; 
  }
  .Area_title .sub { 
    position: absolute ;         
    left: 31vw;
    top: 33.5vw;
    width: 40vw;
  }

  .deco01 { 
    position: absolute;         
    top: 36vw;
    left: -4vw;
    width: 38vw; 
    z-index: 2;
  }
  .deco02 { 
    position: absolute; 
    top: 36vw;
    right: -4vw;
    width: 38vw;
    z-index: 2;
  }
  .deco03 { 
    position: absolute;
    width: 29vw;
    top: -10vw;
    left: -6vw;
    z-index: 0;
  }
  .deco04 { 
    position: absolute;
    width: 35vw;
    top: -11vw;
    right: -5vw;
    z-index: 0;
  }
  .deco05 { 
    position: absolute;
    width: 100%;
    top: 24.7vw;
    left: 0;
    z-index: 0;
  }
  .deco06 { 
    position: absolute;
    width: 100%;
    top: 48vw;
    left: 0;
    z-index: 0;
  }
}

/* 活動 */
.Area_active{
  background: #7fdd78;
  padding: 3vw 0;
  @media screen and (min-width:768px){
    padding: 0;
    &::before{
      content: "";
      position: absolute;
      left: 50%;
      transform: translateX(-50%);
      display: block;
      width: 2000px;
      height:1328px;
      background: #7fdd78;
      z-index: -1;
    }
  }
  .box_pd{
    display: flex;
    overflow: hidden;
    .box_title{
      width: 12%;
      @media screen and (min-width:768px){
        width: 8%;

      }
    }
    .layout_toppd{
      width: 88%;
      margin-bottom: 3vw;
      @media screen and (min-width:768px){
        width: 92%;
        margin-bottom: 20px;
      }
    }
  }
  .box_bn{
    margin: 0 auto;
    width: 96%;
  }
  .box_coupon{
    margin-bottom: 2vw;
    @media screen and (min-width:768px){
      margin-bottom: 20px;
    }
  }

}

.box_title { margin-bottom: 40px; }
@media screen and (max-width:767px){
  .box_title {  margin-bottom: 2vw; }
}


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


/* 折價券 */
.PD_layout.PD_layout-coupon3 .PD{
  .Discount, .Dis_unit, .threshold { color: #2c2c2c; }
} 


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


/* 館連結 */
@media screen and (min-width:768px){
  .Area_link .layout_text ul { width: 90% ; }
	.Area_link .layout_guan ul{ grid-gap:1em ; }
}
  @media screen and (max-width: 767px){
	.Area_link .layout_guan { width: 96% ; }
	.Area_link .layout_guan ul{ grid-gap: .5em ; }
  .Area_link .layout_guan ul li:nth-child(4) { left: 15vw ; }
  .Area_link .layout_guan ul li:nth-child(5) { left: 15vw ; }
}

.Area_hot{
  .box_title{
    background: url(area_hot_bg.png?t=1772002950046)no-repeat;
    background-size: cover;
    padding: 0 0 2%;
    margin: 0;
  }
  .box{
    background: linear-gradient(-180deg,#64dd5b 20%,#62dc59 50%);
    margin: 0 auto;
    padding: 2%;
    border-radius: 0 0 20px 20px;
  }
}


/* 1帶2公版 */
.Area_brand{
  .box{
    display: flex;
    flex-direction: column;
    gap: 4vw;
    margin: 0 1% 4vw;
    @media screen and (min-width:768px){
      margin: 0 1% 28px;
      gap: 12px;
      flex-direction: row;
    }
    .box_item {
      /* width: 50%; */
      background: linear-gradient(180deg, #fff -5%, #fff -1%, #cbb6ff 3%, #cbb6ff 20%, #ba9eff 80%);
      padding: 0 8px 8px;
      border-radius: 20px;
      .PD_layout-D3_02{
        padding: 12px 0;
        ul.PD_wrapper{
          .PD_into{
            gap: 2vw;
            @media screen and (min-width:768px){
              gap: 12px;
            }
            h3{
              width: auto;
              font-size: 6vw;
              color: #2a2a2a;
              @media screen and (min-width:768px){
                font-size: 34px;
              }
            }
          }
          .PD_logo{
            padding: .5% 2%;
          }
        }
      }
    }
  }
}

.area-bg{
  background: #7fdd78;
  position: relative;
  padding-bottom: .5vw;
  @media screen and (min-width:768px){
    padding-bottom: 8px;
  }
  &::before{
    content: "";
    position: absolute;
    top: -1vw;
    left: 0;
    display: block;
    width: 100%;
    height: 13vw;
    background: url(area_product_bg.jpg?t=1772002950046) no-repeat;
    background-size: contain;
    @media screen and (min-width:768px){
      top: -10px;
      left: 50%;
      transform: translateX(-50%);
      width: 2000px;
      height: 140px;
      background: url(area_product_bg_pc.jpg?t=1772002950046) no-repeat;
      background-size: contain;
    }
  }
}

.Area_8pda{
  .box{
    margin: 0 auto;
    width: 96%;
  }
}

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


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