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

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

/*區塊_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.97);
     -moz-transform:scale(0.97);
      -ms-transform:scale(0.97);
       -o-transform:scale(0.97);
          transform:scale(0.97);}
.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;}
}

/*全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","微軟正黑體", Arial, sans-serif; background: #faebd7;}
.WRAPPER img { border: 0; vertical-align: top;}
.WRAPPER a { text-decoration: none; -webkit-tap-highlight-color: transparent;}

@media screen and (max-width:767px){
.WRAPPER { min-width: inherit; min-height: 100vh; overflow: hidden;}
.WRAPPER img { width:100%; height: auto;}
}



/*背景*/
.bg_1 { z-index:-3; position: absolute; top: 0; left: 0; width: 100%; height: 915px; background-repeat: no-repeat; background-position: center top; pointer-events: none; animation: downIn 0.8s ease-out forwards;}
.bg_2 { z-index:-3; position: absolute; bottom: 0; left: 0; width: 100%; height: 655px; background-repeat: no-repeat; background-position: center bottom; pointer-events: none; animation: downIn 0.8s ease-out forwards;}
.bgdeco { z-index: 0; position: absolute; top: 710px; left: 0; width: 100%; height: 2000px; background: url(bgdeco.png?t=1780021872267) no-repeat center top; transition: 0.5s linear; pointer-events: none;}
@media screen and (max-width:767px){	
.m_bg_1 { z-index: -3; position: absolute; top: 10vw; left: 0; width: 100%; height: 100%; background-repeat: no-repeat; background-position: center top; pointer-events: none; background-size: 100%; animation: downIn 0.8s ease-out forwards;}
.m_bg_2 { z-index: -3; position: absolute; bottom: 0; left: 0; width: 100%; height: 100%; background-repeat: no-repeat; background-position: center bottom; pointer-events: none; background-size: 100%;}
}
@keyframes downIn {
  from { transform: translateY(10px);}
  100% { transform: translateY(0);}
}


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


/*區標線上入稿*/
.box_title .PD_layout .PD_into { padding: .5em 0 .55em;}
.box_title_1 { background: url("title_bg_1.png?t=1780021872267") center top / 100% no-repeat;}
.box_title_2 { background: url("title_bg_2.png?t=1780021872267") center top / 100% no-repeat;}
.box_title_3 { background: url("title_bg_2.png?t=1780021872267") center top / 100% no-repeat;}
@media screen and (min-width: 768px){
.box_title { position: relative; z-index: 5; display: flex; padding: 0; width: 100%; height: 135px; justify-content: center;}
.box_title img { width: 100% !important; padding: 0;}
.box_title_1 ul li h5 { padding: 0; margin: 39px 0; font: bold 50px / 50px "Noto Sans CJK SC", "Microsoft JhengHei", Arial, Helvetica; letter-spacing: -0.03em; text-align: center; background: linear-gradient(65deg, #d28c3c 20%, #d79b5a 50%, #cd8237 80%); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent;}	
.box_title_2 ul li h5 { padding: 0; margin: 22px 0; font: bold 50px / 50px "Noto Sans CJK SC", "Microsoft JhengHei", Arial, Helvetica; letter-spacing: -0.03em; text-align: center; background: linear-gradient(65deg, #d28c3c 20%, #d79b5a 50%, #cd8237 80%); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent;}	
.box_title_3 .PD_layout-D3_02 ul li h3 {  font: bold 50px / 50px "Noto Sans CJK SC", "Microsoft JhengHei", Arial, Helvetica; letter-spacing: -0.03em; text-align: center; background: linear-gradient(65deg, #d28c3c 20%, #d79b5a 50%, #cd8237 80%); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent;}	
.box_title_3 .PD_layout ul{padding:10px 0;}
.PD_layout.PD_layout-D3_02 ul .PD .PD_logo{background-color:#ffffff00;width: 80%;}
}
@media screen and (max-width:767px){	
.box_title { position: relative; z-index: 5; margin: 0 auto; width: 100%; height: auto;}
.box_title img { width: 100%;}
.box_title_1 ul li h5 { font: bold 5.4vw / 5.4vw "Noto Sans CJK SC", "Microsoft JhengHei", Arial, Helvetica; margin: 3vw 0; letter-spacing: 0; text-align: center;  background: linear-gradient(65deg, #d28c3c 45%, #d79b5a 50%, #cd8237 55%); -webkit-background-clip: text; background-clip: text;  color: transparent;}	
.box_title_2 ul li h5 { font: bold 5.4vw / 5.4vw "Noto Sans CJK SC", "Microsoft JhengHei", Arial, Helvetica; margin: 1vw 0; letter-spacing: 0; text-align: center;  background: linear-gradient(65deg, #d28c3c 45%, #d79b5a 50%, #cd8237 55%); -webkit-background-clip: text; background-clip: text;  color: transparent;}	
.box_title_3 .PD_layout-D3_02  ul li h3 { font: bold 5.4vw / 5.4vw "Noto Sans CJK SC", "Microsoft JhengHei", Arial, Helvetica; margin: 3vw 0; letter-spacing: 0; text-align: center; letter-spacing: -.02em; background: linear-gradient(65deg, #d28c3c 45%, #d79b5a 50%, #cd8237 55%); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent;width: 23% !important;}	
.box_title_3 .PD_layout ul{padding:0 0;}
.PD_layout.PD_layout-D3_02 ul .PD .PD_logo{background-color:#ffffff00;width: 30%;}
}


/*版頭*/
.brand .Area_swiper_box, .sub .Area_swiper_box, .topPD .Area_swiper_box { padding: 0;}
.brand .PD_layout li, .sub .PD_layout li, .topPD .PD_layout li { background: transparent;}
.brand .PD_layout a, .sub .PD_layout a, .topPD .PD_layout a ,.A05_BN a { pointer-events: none;}
@media screen and (min-width:768px){
.Area_title { height: 555px; box-sizing: border-box; }
.brand {position: absolute;top: 139px;left: -36px;width: 60%;}
.sub {position: absolute;top: 226px;right: 222px;width: 100%;}
.sub ul li img{width: 50%!important;}
.topPD {position: absolute;top: 100px;left: 385px;z-index: 5;width: 71%;}
}
@media screen and (max-width:767px){
.Area_title { height: 60vw;}
.brand {position: absolute;top: 12vw;left: 0vw;width: 59%;}
.sub {position: absolute;top: 21.5vw;left: -20.5vw;z-index: 0;width: 100%;}
.sub ul li img{width: 50%!important;}
.topPD {position: absolute;top: 10vw;z-index: 5;width: 73%;left: 32vw;}
}


/*日期*/
@media screen and (min-width: 768px){
.date .PD_layout .PD img {width: 25%;position: absolute;top: -1px;left: 258px;}
.date .PD_layout ul li{position: absolute;left: 500px;top:8px;}
}
@media screen and (max-width:767px){
.date .PD_layout .PD img { width: 25%;}
.date .PD_layout ul li{position: absolute;left: 35vw;top:2vw}
}

/*小標*/
@media screen and (min-width: 768px){
.summer .PD_layout .PD img {width: 30%;position: absolute;left: 258px;}
.summer .PD_layout ul li{position: absolute;right: 233px;top: 300px;}
}
@media screen and (max-width:767px){
.summer .PD_layout .PD img {width: 32%;}
.summer .PD_layout ul li{position: absolute;left: -29vw;top: 30vw;}
}
  

/*版頭品*/
@media screen and (min-width: 768px){
.top_deco { z-index: -1;}
.topPD, .brand { z-index: 0;}
.sub { z-index: 0;}
.top_deco_1 { top: 105px; right: -110px;}
.top_deco_2 { top: 60px; left: -250px;}
.top_deco_3 { top: 0; right: 120px;}
}
@media screen and (max-width:767px){
.top_deco_1 { width: 39%; top: 12vw; right: -3vw;}
.top_deco_2 { width: 174%; top: 6vw; right: -48vw;}
.top_deco_3 { width: 106%; top: 0; right: 13vw;}
}
.shine { animation: shine 1.5s infinite alternate;}



/*A01*/
@media screen and (min-width: 768px){
.Area01 .box_title { margin-bottom: -35px;}
.title_deco_1 { top: -20px; left: 98px; z-index: 6;}
}
@media screen and (max-width:767px){
.Area01 .box_title { margin-bottom: -8vw;}
.title_deco_1 { top: -4vw; left: 8vw; z-index: 6; width: 20%;}
.Area01 { width: 96%;}
}


/*背景_上*/
.Area_box .Area00_bg {z-index: 0;position:relative;top: 31px;width:100%;height: 166px;background-repeat:no-repeat;background-position: center top;left: 0px;}
@media screen and (max-width: 767px){
.Area_box .Area00_bg_m {z-index: 0;position:relative;top: 8vw;left:0;width:100%;height:8vw;background-repeat:no-repeat;background-size: 100%;background-position: center top;}
}

/*中間repeat*/
.repeatbg {background: #f4d9af;padding: 0px 0 0px;margin: 0 auto 0;max-width:2000px;width: 100%;margin-top: -104px;}
@media screen and (max-width:767px){
.repeatbg { background: #f4d9af; /*padding: 3vw 0 3vw;*/ margin: 0vw auto 0;}
}


/*背景_下*/
.Area_box .img_w {z-index: -1;position:relative;top: -120px;width:100%;height: 200px;background-repeat:no-repeat;background-position: center top;left: 0px;margin-bottom: -40px;}
@media screen and (max-width: 767px){
.Area_box .img_w_m { z-index:1; position:relative; top:0vw; left:0; width:100%; height:18vw; background-repeat:no-repeat; background-size: 100%; background-position: center top;}
}



/*回饋*/
.Area02 .PD_layout ul { padding: 0; grid-gap: 0;}
.Area02 .PD_layout a { pointer-events: none;}
@media screen and (min-width: 768px){
.title_deco_2 { z-index: 8; top: -23px;}
.A02_BN { width: 104%; left: -2%;}
}
@media screen and (max-width:767px){
.title_deco_2 { z-index: 8; top: -2vw;}
.A02_BN { width: 105%; left: -2.5%;}
}




/*登記*/
.Area_danji .danji_box ul li .activityText .gifts span { color: #eb913c;}
.warningTxt h3 {color: #000000;}
.Area_danji .danji_box { margin-bottom: 0;}
@media screen and (min-width: 768px){
.A04_deco_1 { bottom: -77px; left: -105px;}
.A04_deco_2 { bottom: -27px; left: -145px;}
.Area_danji { margin-top: 15px;}
.Area_danji .danji_box ul li { padding-bottom: 20px;}
.warningTxt h3 { padding: 0 0 0;}
}
@media screen and (max-width:767px){
.Area_danji { width: 96%;}
.Area_danji ul { grid-gap: 1vw; padding-bottom: 2vw;}
.A04_deco_1 { width: 30%; bottom: -9vw; left: -1vw;}
.A04_deco_2 { width: 97%; bottom: -2.5vw; left: -16vw;}
}


/*限時禮遇BN*/
.A05_bg { position: absolute;}
@media screen and (min-width: 768px){
.Area05 .warningTxt h3 {color: #000000;position: absolute;left: 350px;top: 815px;z-index: 5;} 
.A05_bg { z-index: -1; top: -13px; left: -520px; width: 2000px; height: 970px;}
.A05_BN.PD_layout ul {padding: 0px 0px 0 0px;grid-gap: 3px 0;margin-bottom: 50px;}
}
@media screen and (max-width:767px){
.Area05 .warningTxt h3 {color: #000000;position: absolute;left: 23vw;top: 84vw;z-index: 5;} 
.A05_bg { width: 208%; left: -54%; top: -1vw; z-index: -1;}
.A05_BN { top: 2vw;}
.A05_BN.PD_layout ul { padding: 0; grid-gap: 5.5vw 0;}
}



/*話題新品2PD*/
@media screen and (max-width:767px){
.A06_PD { width: 96%;}
}


/*4PD01 2區 _無背景*/
@media screen and (min-width: 768px){
.A07_PD, .A08_PD { margin-top: -42px;}
 }
@media screen and (max-width:767px){
.A07_PD, .A08_PD { margin-top: -5vw;width: 96%;}
}




/*下方公版BG*/
@media screen and (min-width: 768px){
.A09_bg { position: absolute; z-index: -2; top: 50px; left: -520px; width: 2000px; height: 492px;}
.A09_PD { padding: 0 0 35px;}
}
@media screen and (max-width:767px){
.Area09 { background: url(A03_bg_1_m.png?t=1780021872267) center top 5.5vw / contain no-repeat, url(A03_bg_3_m.png?t=1780021872267) center bottom / contain no-repeat, url(A03_bg_2_m.png?t=1780021872267) center top 20vw / 100% calc(100%) no-repeat;}
.A09_PD { padding: 2vw 0 7vw;width: 96%;}
}


/*A10*/
@media screen and (min-width:768px){
.Area10 .PD_layout ul { padding: 0 75px; grid-gap: 0 55px;}
.A10_deco { top: 90px; left: -45px; z-index: -1;}
}
@media screen and (max-width:767px){
.Area10 .PD_layout ul { padding: 0 4vw; grid-gap: 0 3vw;}
.A10_deco { width: 26vw; top: 18vw; left: -2vw; z-index: -1;}
}


/*光*/
 .A04_deco, .A10_deco, .top_deco, .title_deco {
  position: absolute;
  mix-blend-mode: screen;
  /*強制元素進入GPU渲染層(主要觸發器)*/-webkit-transform: translateZ(0);
  /*提前告知瀏覽器元素會變化(預分配資源)*/will-change: transform;
  /*觸發合成層創建(強化觸發)*/backface-visibility: hidden;
  /*創建獨立層疊上下文*/isolation: isolate;
}




/*編輯按鈕移動*/
#eWriterBtn_bt_B_000_001{ margin-left: 10px!important; margin-top: 90px!important; z-index: 99!important; }
#eWriterBtn_bt_B_000_004{ margin-left: 178px!important; margin-top: 90px!important; z-index: 99!important; }

#eWriterBtn_bt_B_000_011, #eWriterBtn_bt_B_000_016, #eWriterBtn_bt_B_000_018, #eWriterBtn_bt_B_000_020, #eWriterBtn_bt_B_000_022, #eWriterBtn_bt_B_000_024, #eWriterBtn_bt_B_000_026 { 
  position: absolute;
  top: 22px;
  left: -378px;
}

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