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


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

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


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


/*共用--區塊_all*/
.Area { z-index:1; 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:none; -moz-transform:none; -ms-transform:none; -o-transform:none; transform:none; filter:brightness(110%);}*/
  @media screen and (min-width:768px){
    .Area .go_bt:hover { -webkit-transform:translateY(-6px); -moz-transform:translateY(-6px); -ms-transform:translateY(-6px); -o-transform:translateY(-6px); transform:translateY(-6px);}
  }
  /*寬度,間距*/
  .Area1220 { margin:0 auto; width:100%;}
  .Area960 { margin:0 auto; width:100%;}
    @media screen and (min-width:768px){
      .Area1220 { width:1220px;}
      .Area960 { width:960px;}
      .Areabottom { margin-bottom:0;}
    }
    @media screen and (max-width:767px){
      .Areabottom { margin-bottom:0;}
    }




/*PC背景*/
	@media screen and (min-width:768px){
    .Area_bgtop { pointer-events: none;}
    .Area_bgtop span { background-repeat: no-repeat;}
		.Area_bgtop_fixed { position: fixed;}
    .Area_bgtop .bgtop_ { position: fixed; top: 0; left: 0; width: 100%; height: 100%;}
    .Area_bgtop .bgtop_ span { position: absolute; display: block; width: 100%; height: 100%; background-position: center top;}
    
		.Area_bgtop_1 .bgtop_ { z-index: 0; height: 1185px; overflow: hidden;}
		.Area_bgtop_1 .bgtop_1_2 { z-index: 2;}
		.Area_bgtop_1 .bgtop_1_1 span { background-image: url(bgtop_1_3.jpg?t=1751275063845);}
		.Area_bgtop_1 .bgtop_1_2 span { background-image: url(bgtop_1_2.png?t=1751275063845);}
    
    .Area_bgtop_2 { z-index: 0; position: absolute; top: 600px; left: 50%; transform: translateX(-50%); width: 2000px; height: 100%;}
    .Area_bgtop_2 .bgtop_ { opacity: 1;}
    .Area_bgtop_2 .bgtop_ span { height: 100%;}
    .Area_bgtop_2 .bgtop_2_1 { width: 100%; height: 100%; /*top: 1213px;*/}
    .Area_bgtop_2 .bgtop_2_1 span { background: url(bg_body.jpg?t=1751275063845) center top repeat; /*opacity: 0;*/} 
  }

/*Phone背景*/
  @media screen and (max-width:767px){
    .m_Area_bgtop { pointer-events: none;}
    .m_Area_bgtop span { background-repeat: no-repeat;}
	  .m_Area_bgtop_fixed { position: fixed; top: 32px;} /*搭配js-appBgFixed*/
    .m_Area_bgtop .m_bgtop_ { position: absolute; top: 0; left: 0; width: 100%; height: 100%; padding-bottom: 100%;}
    .m_Area_bgtop .m_bgtop_ span { position: absolute; display: block; width: 100%; height: 100%; padding-bottom: 100%; overflow: hidden; background-position: center top; background-size: 100%;}
    
    .m_Area_bgtop_1 .m_bgtop_1_1 { position: fixed; top: -2vw;}
    .m_Area_bgtop_1 .m_bgtop_1_2 { z-index: 1;}
    /*.m_Area_bgtop_1 .m_bgtop_1_0 span { position: fixed; top: 0; left: 0; width: 100%; height:100%; background: url(m_bg_body.jpg?t=1751275063845) center center repeat-y; background-size: 100%;}*/
    .m_Area_bgtop_1 .m_bgtop_1_1 span { position: absolute; top: 0; left: 0; width: 100%; height:100%; background: url(m_bgtop_1_1.jpg?t=1751275063845) center top no-repeat; background-size: 100%;}
    .m_Area_bgtop_1 .m_bgtop_1_2 span { position: absolute; top: 0; left: 0; width: 100%; height:100%; background: url(m_bgtop_1_2.png?t=1751275063845) center top no-repeat; background-size: 100%;}
  }


/*區塊背景-共用設定*/
.Area_bg { pointer-events: none; z-index: 0;}
.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%;}
    }
    /*圖片*/
    @media screen and (min-width: 768px) {
      .Area_intro_bg div { top: -132px; height: 1192px; position: absolute; z-index: 0;}
    }
    @media screen and (max-width: 767px) {
      .Area_intro_bg div { top: -15.2vw; height: 0; padding-bottom: 130%; background-size: 100%;}
    }



/*活動標*/
.Area_logo { z-index: 5; position: absolute;}
.Area_logo a { display: block;}
.Area_logo img { width: 100%; height: auto;}
  @media screen and (max-width:767px){
    .Area_logo { top: 0; left: 2%; width: 14vw; /* filter: drop-shadow(0 5px 7px rgba(0,0,0,0.4));*/}
  }
  @media screen and (min-width:768px){
    .Area_logo { top: 0; left: 50%; width: 108px; -webkit-transform:translateX(-590px); transform:translateX(-590px);}
  }



/*版頭*/
.Area_top {}
.Area_top .title { margin: 0 auto; text-align: center;}
.Area_top .motionLine { position: absolute; top: 313px; left: 1160px; width: 1px; height: 145px; background-color: #2e2e2e;}
.Area_top .motionLine:after { content: ""; position: absolute; top: 0; left: 0; width: 100%; background-color: #ccc; animation: motionLine 4s linear infinite;}
.Area_top .momoco { position: absolute; top: 299px; left: 471px; animation-delay: 0.5s;}
	@media screen and (min-width:768px){
    .Area_top { height: 332px;}
    .Area_top .title { padding: 20px 0 5px;}
  }
	@media screen and (max-width:767px){
    .Area_top { height: 33.5vw;}
    .Area_top .motionLine { top: 46.3vw; left: 92.3%; height: 13vw;}
    .Area_top .momoco { position: absolute; top: 29.7vw; left: 40%; width: 9.5%; transform-origin: center bottom;}
  }
  /*motionLine*/
  @keyframes motionLine {
    0%   { height: 0;}
    25%  { height: 0;}
    85%  { height: 100%;}
    100% { height: 100%;}
  }



/*區標(線上入稿)*/
.box_title { position: relative; z-index: 2; margin: 0 auto; width: 95.8%;}
.box_title .inbox { position: absolute; top: 0; left: 50%; -webkit-transform: translate(-50%); transform: translate(-50%); width: 100%;}
.box_title .inbox ul { margin: 0 auto; padding: 0; list-style: none; box-sizing: border-box;}
.box_title .inbox li { margin: 0; padding: 0;}
.box_title .PD_into { text-align: left;}
.box_title h2 { position: relative; overflow: hidden; margin: 0; margin-left: .5em; width: 40%; height: 1.7em; line-height: 2.25; color: #1c1c1c; font-family: "Century Gothic", Noto Sans CJK SC, "Microsoft JhengHei", Helvetica; font-weight: 600; text-align: left; box-sizing: border-box;}
  @media screen and (min-width:768px){
    .box_title .inbox { top: 30px;} /*修正偏移*/
    .box_title h2 { font-size: 53px; line-height: 2.1;}
    .box_title .title_bg { height: 131px;}
    .box_title img { width: 100%; height: auto;}
  }
  @media screen and (max-width:767px){
    .box_title .inbox { top: 2vw;} /*修正偏移*/
    .box_title h2 { font-size: 6.3vw; letter-spacing: -0.025em;}
  }



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



/*品牌公版*/
.Area_eventBN {}
.Area_eventBN .box { margin: 0 auto; padding-bottom: .2em; width: 95.8%; box-sizing: border-box;}
	@media screen and (min-width:768px){
    .Area_eventBN { margin-bottom: 70px; padding: 0 24px; box-sizing: border-box;}
  }
	@media screen and (max-width:767px){
    .Area_eventBN { margin-bottom: 8vw;}
  }
  /*公版*/
  .Area_eventBN .PD_eventBN .PD_slide { position: relative; border: solid .1em #dcad76;}
  .Area_eventBN .PD_eventBN .PD .PD_logo { position: absolute; margin: 0 !important; top: 23.8vw; left: 3%; height: 4.5em;}
  .Area_eventBN .PD_eventBN .PD .PD_logo img { box-shadow: none; border-radius: .25em; background-color: #fff; border-width: .125em;}
  .Area_eventBN .PD_eventBN .PD h4 { margin-bottom: .1em; font-size: 16px;}
  .Area_eventBN .PD_eventBN .PD h4 b { font-size: 1.25em; line-height: 1.75; max-height: 1.75em; color: #323232;}
  .Area_eventBN .PD_eventBN .PD h4 span { max-height: none; -webkit-line-clamp: unset; color: #555;}
  .Area_eventBN .PD_eventBN .PD h5 { margin: 0; margin-bottom: .35em; padding-left: 1.5em; color: #777; font-size: .875em; font-weight: 400; line-height: 1.4;}
  .Area_eventBN .PD_eventBN .PD h5 i { position: relative;}
  .Area_eventBN .PD_eventBN .PD h5 i:before { content: ""; /*z-index: -1;*/ position: absolute; left: -1.5em; width: 1.3em; height: 1.3em; background-size: 100%;}
  .Area_eventBN .PD_eventBN .PD h5.PD_period i:before { top: 0em; background: url(PD_icon1.svg) no-repeat center top;}
  .Area_eventBN .PD_eventBN .PD h5.PD_info i:before { top: 0.1em; background: url(PD_icon2.svg) no-repeat center top;}
  .Area_eventBN .PD_eventBN .PD h5.PD_more i:before { top: .07em; background: url(PD_icon3.svg) no-repeat center top;}
  .Area_eventBN .PD_eventBN .PD h5.PD_more { text-decoration: underline;}
    @media screen and (min-width:768px){
      .Area_eventBN .PD_eventBN ul { padding-left: 37px; padding-right: 18px; grid-row-gap: 50px;}
      .Area_eventBN .PD_eventBN .PD_slide, .Area_eventBN .PD_eventBN .PD_img img { border-radius: .75em;}
      .Area_eventBN .PD_eventBN .PD_slide:hover { transform: translateY(-6px);}
      .Area_eventBN .PD_eventBN .PD_into { padding: .3em 1em 1.2em 1.5em;}
      .Area_eventBN .PD_eventBN .PD .PD_logo { top: 202px; left: 3%; height: 11.5em;}
      .Area_eventBN .PD_eventBN .PD .PD_logo img { border-radius: .75em; border-width: 3px;}
      .Area_eventBN .PD_eventBN .PD h4 { font-size: 20px;}
      .Area_eventBN .PD_eventBN .PD h5 { font-size: 17px;}
    }
    @media screen and (max-width:767px){
      .Area_eventBN .PD_eventBN ul { padding-left: .25em; padding-right: .25em; grid-row-gap: 1.25em;}
      .Area_eventBN .PD_eventBN .PD_slide, .Area_eventBN .PD_eventBN .PD_img img { border-radius: .3em;}
      .Area_eventBN .PD_eventBN .PD_into { padding: .3em .6em .75em .8em;}
    }



/*品牌公版(分項)*/
.Area_event {}
.Area_event .box { margin: 0 auto; width: 95%; box-sizing: border-box; border: solid .1em #dcad76; background-color: #fff; overflow: hidden;}
	@media screen and (min-width:768px){
    .Area_event { margin-bottom: 70px; padding: 0 60px 0 80px; box-sizing: border-box;}
    .Area_event .box { width: 100%; border-radius: .75em; padding-bottom: 1.2em;}
  }
	@media screen and (max-width:767px){
    .Area_event { margin-bottom: 8vw;}
    .Area_event .box { width: 94%; border-radius: .3em; padding-bottom: .75em;}
  }
  /*公版共用icon格式*/
  .PD_layout .PD_into { position: relative; padding: .4em .6em 0 .8em;}
  .PD_layout .PD h5 { margin: 0; margin-bottom: .35em; padding-left: 1.5em; color: #777; font-size: .875em; font-weight: 400; line-height: 1.4;}
  .PD_layout .PD h5 i { position: relative;}
  .PD_layout .PD h5 i:before { content: ""; /*z-index: -1;*/ position: absolute; left: -1.5em; width: 1.3em; height: 1.3em; background-size: 100%; background-position: center top; background-repeat: no-repeat;}
  .PD_layout .PD h5.PD_period i:before { top: 0em; background-image: url(PD_icon1.svg);}
  /*.PD_layout .PD h5.PD_rule i:before { top: 0.1em;  background-image url(PD_icon2.svg);}*/
  .PD_layout .PD h5.PD_more i:before { top: .07em; background-image: url(PD_icon3.svg);}
  .PD_layout .PD h5.PD_more { text-decoration: underline;}
    @media screen and (min-width:768px){
      .PD_layout .PD h5 { font-size: 17px;}
    }
  /*Ea-品牌*/
  .PD_layout.PD_bn.PD_noBG .PD .PD_logo { margin-top: 0; margin-bottom: 0;}
  .PD_layout.PD_bn .PD h4 { margin: 0; position: absolute; left: 5.45em; font-size: 17px; line-height: 2.4em; max-height: 2.4em;}
  .PD_layout.PD_bn .PD h4 b { font-size: 1.25em; color: #323232; font-weight: 700;}
  .PD_layout.PD_bn .PD h4 span { display: none;}
  .PD_layout.PD_bn .PD h5 { margin: 0; position: absolute; left: 6.45em; top: 3.3em;}
    @media screen and (min-width:768px){
      .PD_layout .PD_into { padding: .3em 1em 0 1.5em; padding-top: 1em;}
      .PD_layout.PD_bn.PD_noBG .PD .PD_logo { height: 6.75em;}
      .PD_layout.PD_bn .PD h4 { font-size: 20px; left: 7.5em; top: 1.5em;}
      .PD_layout.PD_bn .PD h5 { left: 8.8em; top: 4.7em;}
    }
  /*Eb-優惠項目*/
  .PD_layout.PD_info_box a { pointer-events: none;}
  .PD_layout.PD_info_box ul { padding: .5em .6em 0 2.2em; list-style: decimal;}
  .PD_layout.PD_info_box li { margin-bottom: .5em; /*line-height: 1.5;*/}
    @media screen and (min-width:768px){
      .PD_layout.PD_info_box { font-size: 20px;}
      .PD_layout.PD_info_box ul { padding: 1em 1em 0 2.7em;}
    }
    /*@media screen and (max-width:767px){
      .PD_layout.PD_info_box ul { padding-left: 0; margin-left: 2.2em; width: calc(100% - 2.2em);}
    }*/
  /*Ec-規範項目*/
  .PD_layout.PD_rule_box a { pointer-events: none;}
  .PD_layout.PD_rule_box ul { padding-left: 2.25em;}
  .PD_layout.PD_rule_box ul:before { content: ""; position: absolute; top: 0.2em; left: 0.65em; width: 1.3em; height: 1.3em; background-size: 100%; background-position: center top; background-repeat: no-repeat; background-image: url(PD_icon2.svg);}
  .PD_layout.PD_rule_box ul li { counter-increment: step;}
  .PD_layout.PD_rule_box ul li:before { content: counter(step); display: inline-block; text-align: center; width: 1em; height: 1em; line-height: 1em; font-size: .825em; color: #777; font-style: normal; border-radius: 50%; border: solid 1px #777;}
  .PD_layout.PD_rule_box .PD_slide:nth-of-type(n+10)::before { content: counter(step);}
  .PD_layout.PD_rule_box .PD { display: inline-block; width: 93%;}
  .PD_layout.PD_rule_box .PD_into { padding-top: .3em; padding-left: .1em;}
  .PD_layout.PD_rule_box .PD h5.PD_rule { margin-bottom: 0; padding-left: 0;}
    @media screen and (min-width:768px){
      .PD_layout.PD_rule_box ul { padding-left:  3.5em;}
      .PD_layout.PD_rule_box ul:before { left: 1.75em; width: 1.35em; height: 1.35em; top: 0.35em;}
      .PD_layout.PD_rule_box ul li:before { transform: translateY(-2px);}
      .PD_layout.PD_rule_box .PD { width: 95%;}
      .PD_layout.PD_more_box .PD_into { padding-left: 1.75em;}
    }
  /*ADD-詳細注意事項(浮層)*/
  .PD_btn { margin: .25em 0 .1em 1.4em; /*margin-left: 1.4em;*/ font-size: 1.2em; text-align: center; }
  .PD_btn a { padding: .2em .6em .3em; width: 17%; color: #fff; background-color: #6c4b20; border-radius: 20em;}
  .PD_btn a:hover { background-color: #f26f3b;}
    @media screen and (max-width:767px){
      .PD_btn { margin: .3em 0 .4em .85em; font-size: 1em;}
      .PD_btn a { padding-bottom: .2em; width: 34%;}
    }




