@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;}
.Area .list_00 li {list-style:none;float:left;overflow: hidden;}
	@media screen and (max-width:767px){
		.WRAPPER { min-width: inherit; min-height:100vh; overflow:hidden;}
		.WRAPPER img {  width:100%;  height:auto;}
	}


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

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





/** 入稿區基本 **/
.content_Area { position:relative; display:inline-block; margin:0px auto 0px auto; padding: 0px 0px 0px 0px; width:1220px;}
.buttonAera_more { position: absolute; top:15px; right:15px; padding-left:17px; padding-right:10px;  border-radius:60px; width:90px; height:40px; background-color: #666; text-align:center;}
.buttonAera_more a { display:block; padding-top:5px; font: bold 24px/29px Century Gothic; color:#fff; text-decoration: none; letter-spacing:-0.05em;}
.buttonAera_more:hover {background-color: #000;}
.buttonAera_more .btnGO { margin:5px; float:right; width:20px ;height:20px;}


/*PC背景*/
@media screen and (min-width:768px){
.bg_color { z-index:-60; position:absolute; top:0; left:0; width:100%; height:100%; background-repeat:repeat-y; background-position: center top; pointer-events:none;}
.bg_01 { z-index:-46; position:absolute; top:0; left:0; width:100%; height:100%; background-repeat:no-repeat; background-position: center top; pointer-events:none;}
/*.bg_03 { z-index:0; position:absolute; top:952px; left:0; width:100%; height:100%; background-repeat:no-repeat; background-position: center top; pointer-events:none;}*/
.bg_04 { z-index:-50; position:absolute; top:970px; left:0; width:100%; height:100%; background-repeat:repeat-y; background-position: center top; pointer-events:none;}
.bg_8pdbg01 { z-index:-50; position:absolute; top:674px; left:0; width:100%; height:100%; background-repeat:repeat-y; background-position: center top; pointer-events:none;}
.bg_8pdbg02 { z-index:-50; position:absolute; top:674px; left:0; width:100%; height:100%; background-repeat:repeat-y; background-position: center top; pointer-events:none;}
.bg_8pdbg03 { z-index:-50; position:absolute; top:674px; left:0; width:100%; height:100%; background-repeat:repeat-y; background-position: center top; pointer-events:none;}
.bg_repeat_01 { z-index:-10; position:absolute; top:970px; left:0; width:100%; height:100%; background-position:center 0px; background-repeat:repeat-y; transition:0.1s linear; pointer-events:none;/*mix-blend-mode: screen;*/}
.bg_floor { z-index:-50; position:absolute; top:0px; left:0; width:100%; height:100%; background-repeat:no-repeat; background-position:bottom; pointer-events:none;/*mix-blend-mode: screen;*/}

}
@media screen and (max-width:767px){
   .bg_color { display: none;}
   .bg_01 { display: none;}
   .bg_03 { z-index:0; position:absolute; top:187vw; left:0; width:100%; height:100%;background-size:100%; background-repeat:no-repeat; background-position: center top; pointer-events:none;}
   .bg_04 { display: none;}
   .bg_repeat_01 { display: none;}
   .mo_bg { z-index:-46; position:absolute; top:0vw; left:0; width:100%; height:100%;background: url(mo_bg.jpg?t=1786704024177)center top repeat-y;  background-position: center top; pointer-events:none;}
   .m_bg{ z-index:-54; position:fixed; bottom:0; left:0; width:100%; height:100%; background-repeat:repeat-y; background-position: center bottom; pointer-events:none;}
   .m_deco { z-index:-10; position:absolute; top:190vw; left:0; width:100%; height:100%; background-position:center 0px; background-repeat:repeat-y; transition:0.5s linear;background-size:100%; pointer-events:none;}	
	
}



/*版頭區塊*/
@media screen and (min-width:768px){
	.Area_title  {  height: 624px!important;}
	.title_01 {position:absolute;z-index: 5;left:28px;top:210px;}
	.title_02 {position:absolute;z-index: 4;left:94px;top:121px;}
	.title_date {position:absolute;left:599px;top:63px;z-index: 2}

	
	}
@media screen and (max-width:767px){
	.Area_title { height: 110vw;}	
	.title_01 {z-index: 5;position:absolute;left:3vw;top:13vw;width:92%;}
	.title_02 {position:absolute;left:9vw;top:-1vw;width:79%;}
    .title_date {position:absolute;left:3vw;top:44vw;width:21%;z-index: 2}
	.mo_top {z-index: -1;position:absolute;left:0vw;top:0vw;width:100%;}

	}



/*版頭輪播品*/
.Area_title .box_PD .PD_layout .PD img {height: auto !important;}
.Area_title .Area_swiper_box .PD_layout li {background-color: #fff0;}
 @media screen and (min-width:768px){
.Area_title .box_PD { position: absolute; top: 70px; left: 609px; width: 670px; height: 570px; overflow: hidden; z-index: 1;}
.Area_title .box_PD ul.PD_wrapper { display: flex; flex-wrap: nowrap; margin: 0; padding: 0; width: 100%; box-sizing: content-box; grid-gap: inherit;}
.Area_title .box_PD ul.PD_wrapper li { flex-shrink: 0; margin: 0; padding: 0; opacity: 0; transform: translate(5%,0);}
.Area_title .box_PD ul.PD_wrapper li.swiper-slide-active { opacity: 1; transition: .8s ease-out; transform: translate(0,0);}

}
    @media screen and (max-width:767px){
      .Area_title .box_PD {z-index: 5; position: absolute; top:47vw;left:5vw; width:94%; height:auto; overflow: hidden; }
      .Area_title .box_PD ul.PD_wrapper { display: flex; flex-wrap: nowrap; margin: 0; padding: 0; width: 100%; box-sizing: content-box; grid-gap: inherit;}
      .Area_title .box_PD ul.PD_wrapper li { flex-shrink: 0; margin: 0; padding: 0; opacity: 0; transform: translate(5%,0);}
      .Area_title .box_PD ul.PD_wrapper li.swiper-slide-active { opacity: 1; transition: .8s ease-out; transform: translate(0,0);}
}


/*副標輪播*/
.Area_title .title_swiper {z-index:10; position:absolute;width:430px;height:88px;left:108px;top:392px;animation-delay:0s;}
.Area_title .title_swiper .title_04_bg { width:100%;height:auto;margin-top:0px;z-index:1;animation-delay:0s;}
.Area_title .title_swiper ul { padding:0px; text-align:center;margin: -88px auto 0;}
.Area_title .title_swiper ul li { list-style: none outside none; }
.Area_title .title_swiper img {  width:100%;height:auto; padding-left:0;}
.Area_title .title_swiper .pagination { position:relative;}
		@media screen and (max-width:767px){
	    .Area_title .title_swiper {position:absolute;width:60%;height:12vw;left:20vw;top:37vw;z-index:1;animation-delay:0s;}
        .Area_title .title_swiper .title_04_bg {width:100%;height:12vw;margin-top:0px;z-index:1;animation-delay:0s;}
		.Area_title .title_swiper ul {padding:0vw;height:20vw ; margin:-12vw auto 0vw; width:100%;}
		.Area_title .title_swiper ul li{list-style:none;height:12vw!important ; margin:0; padding:0;}
	    .Area_title .title_swiper ul li img{width:100%;}
		}



/*輪播特效*/
@media screen and (min-width:768px){
.Area_title .box_PD .Area_swiper .swiper-slide .PD_img { opacity: 0; transform: translate(0,0%);  }
.Area_title .box_PD .Area_swiper .swiper-slide-active .PD_img { opacity: 1; transition: 1s cubic-bezier(0, 0.63, 0.63, 0.89); transform: translate(0,0);}
.Area_title .box_PD .Area_swiper .swiper-slide .PD_logo {display: none;}
    }
    @media screen and (max-width:767px){
       .Area_title .box_PD .Area_swiper .swiper-slide .PD_logo { opacity: 0; transition: .2s ease-out;transform: translate(0%,0);  }
       .Area_title .box_PD .Area_swiper .swiper-slide-active .PD_logo { opacity: 1; transition: 1s ease-out; transform: translate(0,0);}
       .Area_title .box_PD .Area_swiper .swiper-slide .PD_img {display: none;}
    }


/** 倒數 **/
.TimerNick {z-index:1; position: absolute;/*transform: rotateZ(-0.015turn );*/left: 43px;top: 723px; display:inline-block; height:51px; text-align:right; }
.TimerNick2 {z-index:1; position: absolute;/*transform: rotateZ(-0.015turn );*/left: 133px;top: 619px; display:inline-block; height:51px; text-align:right; }
.TimerNick .FontStyle { display:inline-block; margin:0 5px 0 5px; padding:0; border:0px;/*font-style: italic!important;*/ font:normal 47px/32px "Century Gothic"; color:#ffda9c;letter-spacing:-1px; text-align:right; background:transparent; }
.TimerNick2 .FontStyle2 { display:inline-block; margin:0 5px 0 5px; padding:0; border:0px;/*font-style: italic!important;*/ font:normal 114px/32px "Century Gothic";font-weight:bold; color:#fff;letter-spacing:-1px; text-align:right; background:transparent; }
.TimerNick span { padding-left:2px;/*font-style: italic!important;*/ font: bold 20px/38px "微軟正黑體","Microsoft JhengHei", Arial, Helvetica; letter-spacing: -0.05em;color: #fff;}
	@media screen and (max-width:767px){
		.TimerNick  {left:-11vw;top:167vw;  height:11vw;  background-size: 100%; transform: scale(1)}
		.TimerNick2  {left:15vw;top:150vw;  height:17vw;  background-size: 100%; transform: scale(1)}
		.TimerNick .FontStyle { margin:0 0 0 1vw; padding:0; border:0px; width:9vw;/*font-style: italic!important;*/ font:normal 8vw/5vw "Century Gothic" ; color:#ffda9c; letter-spacing:-1px; text-align:right; background:transparent;}
		.TimerNick2 .FontStyle2 { margin:0 0 0 1vw; padding:0; border:0px; width:6vw;/*font-style: italic!important;*/ font:normal 20vw/5vw "Century Gothic";font-weight:bold; color:#fff; letter-spacing:-1px; text-align:right; background:transparent;}
        .TimerNick span { padding-left:1vw;/*font-style: italic!important;*/ font: bold 4vw/11vw "微軟正黑體","Microsoft JhengHei", Arial, Helvetica; letter-spacing: -0.05em;color: #fff8d0;}
	}





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

/*按鈕區塊*/
@media screen and (min-width:768px){
    .pc_activ1 {height:640px;}
	.pc_activ1 .activ_bg{ position: absolute;top:0px;left: 0;z-index: 2;display: none;}
    .pc_activ1 .activ_box {z-index: 3;position: absolute; width:100%;margin: 0px auto 0px;top:86px;display: flex;flex-direction: row;align-items: center;flex-wrap: nowrap;justify-content: space-around;}
    .pc_activ1 ul li {width:25%;  margin:0 auto;overflow: visible !important;-webkit-transition: 0.2s ease; -moz-transition: 0.2s ease; -ms-transition: 0.2s ease; -o-transition: 0.2s ease; transition: 0.2s ease;}
    .pc_activ1 .activ_box .box {margin: 0px auto;}
	.pc_activ1 .warningTxt h3 {position: absolute;margin:0px auto; top:506px ;left:428px;color:#ca2b2b;font-size: 1rem; line-height: 1.2em; font-weight: 400; }

	}
@media screen and (max-width:767px){
    .pc_activ1 {position: absolute;left:0vw;top:0vw;height:130vw!important;margin-top:0vw!important ;}
	.pc_activ1 .activ_box {z-index: 3;position: absolute; width:100%;height: 120vw;margin: 0vw auto ;top:1vw;display: flex;flex-direction: row;align-items: center;flex-wrap: nowrap;justify-content: space-around;}
	.pc_activ1 .warningTxt h3 {position: absolute;margin:0 auto;top:110vw ;left: 14vw;color:#ca2b2b;text-align: center;font-size: 0.8rem; line-height: 1em; font-weight: 400; padding: 0rem;margin-top:0vw ;}
	

    .activ_box {width:100%;height:100%;flex-direction: row; display:flex;justify-content: flex-start;align-items: flex-start;}

	}


@media screen and (max-width:767px){
.Area_danji .danji_box ul li img {width:96%;}
	}



/*Area_PD4*/

@media screen and (min-width:768px){
.Area_PD4 .PD_layout {padding-bottom:100px;}
}
@media screen and (max-width:767px){
.Area_PD4 .PD_layout {padding-bottom:10vw;}
}



/*Area_6pd*/
@media screen and (min-width:768px){
.Area_6pd .PD_layout {padding-bottom:100px;}
}
@media screen and (max-width:767px){
.Area_6pd .PD_layout {padding-bottom:10vw;}
}




/*連館*/
@media screen and (min-width:768px){
	.Area_guan { height:120px;}
    .Area_guan .PD_layout ul{ width: 550px;margin: 0 auto;}
	}
@media screen and (max-width:767px){
	.Area_guan { height:24vw;margin: 5vw auto 0vw!important;width: 86%!important}			
	}











/*區塊_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);}
	@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;}
	}










/*落花*/
.falling-leaves {
  z-index:0;
  position: fixed;
  top: 0;
  bottom: 0;
  left:50%;
  width: 2000px;
  height: 2000px; 
  max-width: 2000px;
  max-height: 2000px;
  -webkit-transform: translate(-50%, 0);
          transform: translate(-50%, 0);
  background-size: cover;
  overflow: hidden;
}
.leaf-scene {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  width: 100%;
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
}
.leaf-scene div {
  position: absolute;
  top: 0;
  left: 0;
  width: 20px;
  height: 20px;
  background: url(flower_02.png?t=1786704024177) no-repeat; 
  background-size: 100%;
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-backface-visibility: visible;
          backface-visibility: visible;
}
   @media screen and (max-width:767px){
    .falling-leaves {
  z-index:0;
  position: fixed;
  top: 0;
  bottom: 0;
  left:0%;
  width: 100%;
  height: 400vw;
  -webkit-transform: translate(0%, 0);
          transform: translate(0%, 0);
  overflow: hidden;
}
    }




