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

 .btn_alert_danji {
    top: 3%!important;;
}
 
 /*全BOX版面*/
 .WRAPPER {z-index:0;position: relative;display:block;margin: 0 auto;padding:0;width:100%;min-width:1220px;text-align:left;font-family:"微軟正黑體","Microsoft JhengHei",Helvetica;padding-bottom: 30px;overflow: hidden;background-color: #0c1d54;}
 .WRAPPER img { border:0px; vertical-align:top;}
 .WRAPPER a { text-decoration: none;}
 
 /*預設清單樣式*/
 .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 {margin-bottom: 0;min-width: inherit;min-height: 100vh;overflow: hidden;background-size: 100%;padding-bottom: 40vw;}
		 .WRAPPER img {  width:100%;  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_fix {z-index: -65;position:absolute;top: 0;left:0;width:100%;height: 100%;background-repeat:no-repeat;background-position: center top;pointer-events:none;}
 .top_deco {z-index: 30;position:absolute;top: 0;left:0;width:100%;height: 100%;background-repeat:no-repeat;background-position: center top;pointer-events:none; mix-blend-mode: screen; }
 .bg_deco {z-index: -30;position:absolute;top: 1120px;left: 0;width:100%;height: 95%;background-repeat:repeat-y;background-position: center top;pointer-events:none;}
 .bg_repeat {z-index: -70;position:fixed;top: 0;left: 0;width:100%;height: 100%;background-repeat:repeat-y;background-position: center top;pointer-events:none;}
 .bg_bottom {z-index: -60;position:absolute;bottom: 0;left:0;width:100%;height: 100%;background-repeat:no-repeat;background-position: center bottom;pointer-events:none;}
 }
 
 @media screen and (max-width:767px){
 .m_bg_fix {z-index:-8;position:absolute;top: 11vw;left:0;width:100%;height:100%;background-repeat:no-repeat;background-position: center top;pointer-events:none;background-size: 100%;}
 .m_top_deco {z-index:15;position:absolute;top: 11vw;left:0;width:100%;height:100%;background-repeat:no-repeat;background-position: center top;pointer-events:none;background-size: 100%; mix-blend-mode: screen;}
 .m_bg02 {z-index:-50;position:absolute;top: 125vw;left:0;width:100%;height:100%;background-repeat:no-repeat;background-position: center top;pointer-events:none;background-size: 100%;}
 .m_bg_repeat {z-index:-55;position:absolute;top: 0;left:0;width:100%;height: 100%;background-repeat:repeat-y;background-position: center top;pointer-events:none;background-size: 100%;}
 .m_bg_bottom {z-index:-10;position:absolute;bottom: 0;left:0;width:100%;height:100%;background-repeat:no-repeat;background-position: center bottom;pointer-events:none;background-size: 100%;}
 }
 
 
 /*螢火蟲*/
 canvas {position: absolute;top: 170px;left: 680px;z-index:0;pointer-events:none;width: 800px;}	
 @media screen and (max-width:767px){
	 canvas {position: absolute;height: 111vw;width: 51%;top: 10vw;left: 26vw;z-index:1;}	
 }
 
 
 
 /*間距*/
 @media screen and (min-width:768px){
 .Area_bottom {margin-bottom: 70px!important;}
 .Area_bottom2 {margin-bottom: 40px!important;}
 }
 @media screen and (max-width:767px){
 .Area_bottom {margin-bottom: 5vw!important;}
 .Area_bottom2 {margin-bottom: 5vw!important;}	
 }
 
 
 
 
 /*版頭區塊*/
 .Area_title img{ width: 100%; }
 @media screen and (min-width:768px){
 .Area_title {height: 710px;z-index: 20;}
 .top_deco01 {position: absolute;top: 326px;left: 813px;z-index: 2;width: 11%;pointer-events: none;}	
 .title_deco {position: absolute;top: 108px;left: 880px;z-index: 10;width: 5.3%;pointer-events: none;}	
 .title_light {position: absolute;top: 0;left: 151px;z-index: 99!important;width: 73%;height: 50%;}	
 }
 
 @media screen and (max-width:767px){
 .Area_title {height: 83vw;}
 .top_deco01 {position: absolute;top: 37vw;left: 65vw;z-index: 10;width: 16%;}	
 .title_deco {position: absolute;top: 11.5vw;left: 78.3vw;z-index: 15;width: 7%;pointer-events: none;}	
 .title_light {position: absolute;top: 1vw;left:0;z-index: 99!important;width: 100vw;height: 25vw;}	
 }
 
 
 /*版頭主標微調*/
 .Area_title img{width: 100%;border-radius: 0!important;}
 .Area_title .PD_layout .PD_slide { min-width:auto; }
 .Area_title .PD_layout ul{ background-color: #0000;  }
 .Area_title .PD_layout li { border:none; }
 
 @media screen and (min-width: 768px){
 .title { z-index: -10; }
 .title .PD_layout li:nth-of-type(1) {position: absolute;top: 0;left: 151px;z-index: 10;width: 73%;}
 .title .PD_layout li:nth-of-type(2) {position: absolute;top: 57px;left: 677px;z-index: 10;width: 28%;}
 .title .PD_layout .PD img { width: 100%!important; }
 .top_pd { transform: scale(.9); position: relative; top: 262px; }
 .top_pd .PD_layout ul{ padding: 0; display: flex; justify-content: center;}
 .top_pd .PD_layout .PD img {width: 100%!important;}	
 }
 
 @media screen and (max-width:767px){
 .title {position: relative;top: 1vw;}
 .title .PD_layout li:nth-of-type(1) {position: absolute;top: 0;left: 0;z-index: 10;width: 100%;}
 .title .PD_layout li:nth-of-type(2) {position: absolute;top: 5vw;left: 60vw;z-index: 30;width: 45%;}
 .title .PD_layout .PD img { width: 100%!important; }
 .top_pd {position: relative; top: 34vw; left: 1.2vw; z-index: 5;}
 .top_pd .PD_layout ul{ padding: 0 1vw; display: flex; justify-content: center; flex-wrap: nowrap; column-gap: 2vw!important;}
 .top_pd .PD_layout .PD img {width: 100%!important;}
 }
 
 /*活動倒數*/
 .TimerNick {position: absolute;padding: 0 0 0;top: 630px;left: 440px;display: inline-block;z-index:8;text-align: center;}
 .TimerNick .FontStyle {display: inline-block;margin: 0 0 0 5px;padding: 0;border: 0;font: normal 35px/30px Arial;color: #fff;letter-spacing: 2px;text-align: center;}
 .TimerNick span {padding-left: 2px;font: normal 25px/30px "Century Gothic","Microsoft JhengHei", Arial, Helvetica;font-weight: 400;letter-spacing: -0.05em;color: #fff;}
 @media screen and (max-width:767px){
 .TimerNick  {width: 59%;top: 70vw;left: 20vw;padding: 2vw 0 1vw;display: flow;margin-bottom: 1vw;}
 .TimerNick .FontStyle {margin: 0;padding: 0;border: 0;font: 5vw/4vw Arial;}
 .TimerNick span {padding-left: 0vw;font: 3.6vw/4vw "微軟正黑體","Microsoft JhengHei", Arial, Helvetica;letter-spacing: -0.05em;}
 }
  /*活動倒數2*/
  .TimerNick2 {padding: 0 0 0; display: inline-block;z-index:8;text-align: center; margin-bottom: 20px;}
  .TimerNick2 .FontStyle {display: inline-block;margin: 0 0 0 5px;padding: 0;border: 0;font: normal 35px/30px Arial;color: #fff;letter-spacing: 2px;text-align: center;}
  .TimerNick2 span {padding-left: 2px;font: normal 25px/30px "Century Gothic","Microsoft JhengHei", Arial, Helvetica;font-weight: 400;letter-spacing: -0.05em;color: #fff;}
  @media screen and (max-width:767px){
  .TimerNick2  {width: 100%;display: flow;margin-bottom: 3vw;}
  .TimerNick2 .FontStyle {margin: 0;padding: 0;border: 0;font: 5vw/4vw Arial;}
  .TimerNick2 span {padding-left: 0vw;font: 3.6vw/4vw "微軟正黑體","Microsoft JhengHei", Arial, Helvetica;letter-spacing: -0.05em;}
  }
 
 
 /*公版背景*/
 .box_txt ul,.box_txt2 ul,.box_txt3 ul,.box_txt4 ul{ padding: 0; }	
 @media screen and (min-width: 768px){
 .box_txt {position: relative;display: flex;margin: 0 auto;width: 100%;height: auto;justify-content: center;}
 .box_txt img{width: 88%!important;padding: 0;}
 .box_txt .PD_layout .PD h3 {color: #fff7ff;font-size: 3.2em;font-family: "Century Gothic";letter-spacing: -1px;}
 .box_txtbg::after {content:"";position: absolute;display:block;top: -30px;left: 50px;width: 90%;height: 110%;pointer-events:none;z-index: 10;background: url("box_txtbg.png?t=1751018695529") center top/100% no-repeat scroll;}	
 }
 
 @media screen and (max-width:767px){
 .box_txt {position: relative;margin: 0 auto;width: 100%;height: auto;z-index: 30;}
 .box_txt img{width: 100%;}
 .box_txt .PD_layout .PD h3 {color: #fff;font-size: 1.5em;letter-spacing: -2px;line-height: 11vw;font-family: "Century Gothic","微軟正黑體";max-height: 9vw;font-weight: bold;}
 .box_txtbg::after {content:"";position: absolute;display:block;top: 0;left: 0;width: 100%;height: 100%;pointer-events:none;z-index: -1;background: url("box_txtbg.png?t=1751018695529") center top/100% no-repeat scroll;}	
 }
 
 
 
 /*區塊0*/
 .Area00 .PD_layout ul{padding: 15% 14% 0;grid-gap: 0; grid-template-columns: auto!important; grid-template-areas: "A A" "B C" "D E"; }
 .Area00 .PD_layout ul li:nth-child(1){ grid-area: A; }
 .Area00 .PD_layout ul li:nth-child(2){ grid-area: B; }
 .Area00 .PD_layout ul li:nth-child(3){ grid-area: C; }
 .Area00 .PD_layout ul li:nth-child(4){ grid-area: D; }
 .Area00 .PD_layout ul li:nth-child(5){ grid-area: E; }
 @media screen and (min-width: 768px){
 .Area00 {z-index: 35;height: auto;padding-top: 140px;padding-bottom: 100px;margin: 0 auto;}
 .Area00_bg {z-index: -40;position:absolute;top: 0;width:100%;height: 115%;background-repeat:no-repeat;background-position: center top;pointer-events:none;}	
 .Area00_bg2 {z-index: -40;position:absolute;top: 0;width:100%;height: 100%;background-repeat:no-repeat;background-position: center top;pointer-events:none;}	

 }
 
 @media screen and (max-width: 767px){
 .Area00 {height: auto;z-index: 20;margin-bottom: 19vw!important;padding-top: 16vw;16vw;}
 .Area00_bg {z-index: -1;position:absolute;top: 0;width:100%;height: 115%;background-repeat:no-repeat;background-position: center top;pointer-events:none;background-size: 100%;}
 .Area00_bg2 {z-index: -1;position:absolute;top: 0;width:100%;height: 100%;background-repeat:no-repeat;background-position: center top;pointer-events:none;background-size: 100%;}
 .Area00 .PD_layout ul{padding: 15% 0 0; }
 .Area00 .PD_layout ul li:nth-child(1){  margin: 1vw 0 -1vw; }
 }
 
 
 
 /*區塊2*/
 .Area02_bg02 {z-index: -40;position:absolute;top: 0;width:100%;height: 100%;background-repeat:no-repeat;background-position: center top;pointer-events:none;}	
 .Area02_tag {position: absolute;top: 390px;left: 945px;z-index: 10;}
 .Area02_tag img{width: 130%;}
 .Area02 .box02 { position: relative;}
 .Area02 .box02 .PD_layout ul{padding: 2% 17% 3%;grid-gap: 38px;}
 .Area02 .box03 .PD_layout li img { width: 30%;}
 @media screen and (min-width: 768px){
 .Area02 .box01{ width: 90%; margin: auto; }
}
 
 @media screen and (max-width: 767px){
 .m_Area02_deco {z-index: -1;position:absolute;top: 1vw;width:100%;height: 100%;background-repeat:no-repeat;background-position: center top;pointer-events:none;background-size: 100%;}
 .Area02_bg02 {z-index: -1;position:absolute;top: 0;width:100%;height: 100%;background-repeat:no-repeat;background-position: center top;pointer-events:none;background-size: 100%;}
 .Area02_tag {position: absolute;top: 39vw;left: 70vw;right: -1vw;z-index: 10;}
 .Area02_tag img{width: 50%;}
 .Area02 .box01 { margin-bottom: 2vw;}
 .Area02 .box02 .PD_layout ul{padding: 3% 6% 0%;grid-gap: 4vw;}
 .Area02 .box03 .PD_layout li img {width: 32%;}
 }

 
 /*區塊3*/
 .Area03 .danji-pd-container{ overflow: visible; margin-top: 15%;}
 .Area03 #B01{ margin-top: 10%; }
 .Area03 .danji-pd-head{ border-radius: 8px 8px 0 0; color: #feda97; }
 .Area03 .danji-pd-head2{ background-color:transparent; width: 90%; position: absolute; top: -9vw; left: 5%; z-index: -1;  line-height: 1.5em; color: #c23f17;}
 .Area03 .danji-pd-body .pd-info-brand{ margin-left: 0; }
 @media screen and (min-width: 768px){
 .Area03 {z-index: 35;height: auto;margin-top: 184px!important;margin-bottom: 875px!important;}
 .Area03_top {z-index: -40;position:absolute;top: -220px;width:100%;height: 100%;background-repeat:no-repeat;background-position: center top;pointer-events:none;}	
 .Area03_repeat {z-index: -45;position:absolute;top: 0;width:100%;height: 116%;background-repeat:repeat-y;background-position: center top;pointer-events:none;}	
 .Area03_end {z-index: -40;position:absolute;bottom: -910px;width:100%;height: 100%;background-repeat:no-repeat;background-position: center bottom;pointer-events:none;}	
 .Area03 .box{position: relative;top: -100px;height: 3610px;}
 .Area03 .danji-pd-container{ overflow: visible; margin-top: 10%;}
 .Area03 .danji-pd-head2{ top: -76px;  }
 }
 
 @media screen and (max-width: 767px){
 .Area03{ margin-top: 35vw!important; }
 .Area03_bg02 {z-index: 35;height: auto;margin-top: 45vw!important;margin-bottom: -13vw!important;}
 .m_Area03_top {z-index: -1;position:absolute;top: -41vw;width:100%;height: 100%;background-repeat:no-repeat;background-position: center top;pointer-events:none;background-size: 100%;}
 .m_Area03_repeat {z-index: -1;position:absolute;top: 0;width:100%;height: 93%;background-repeat:repeat-y;background-position: center top;pointer-events:none;background-size: 100%;}
 .m_Area03_end {z-index: -1;position:absolute;bottom: 0vw;width:100%;height: 100%;background-repeat:no-repeat;background-position: center bottom;pointer-events:none;background-size: 100%;}
 .Area03 .box{position: relative;top: -25vw;height: auto;}
 }
 /*註解補丁*/
 .notice_bold { color: #9d7528; font-weight: 600;}
 .notice_txt { list-style: none !important;}
 
 
 
 /*區塊4*/
 .Area04 {}
 @media screen and (max-width: 767px){
 .Area04 {position: fixed !important;bottom: -9vw;z-index: 99;}
 .Area04 .PD_layout[data-pd-li=BN] ul, .PD_layout[data-pd-li=BN-AWD] ul, .PD_layout[data-pd-li=PDBN] ul {
	padding: 0!important;
}
 }

 
 
 
 /*區塊_all*/
 .Area1220 {position: relative;margin:0 auto;width:1220px;}
 .Area960 { margin:0 auto; width:960px;}
 .Area {position: relative;margin:0 auto;border-radius:0;text-align:center;}
 
 
 /*注意事項區*/
.edm_notice{ text-align:center; padding:10px 10px 15px 10px; color:#fff; font:12px/18px Helvetica;}
.edm_notice .apple_notice{  padding:10px 0px 10px 0px; }

 
 
 .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;}
	 }
 
 
 
 
 /*隱鑶*/
 .for_pc {}
 .for_phone { display:none !important;}
 
 
	 @media screen and (max-width:767px){
		 .for_pc { display:none !important;}
		 .for_phone { display: inherit !important;}
	 }
 
 
 
	 /*閃光*/
 .lightSweep { position: absolute; bottom: 0; right: 0; background: none 0% 0% / auto repeat scroll padding-box border-box rgba(0, 0, 0, 0); overflow: hidden; z-index: 30; pointer-events: none;
	 -webkit-filter: brightness(1.5);
	 -webkit-mask-size: 300% 200%;
	 -webkit-mask-image: -webkit-linear-gradient( -45deg, rgba(255, 255, 255, 0) 40%, rgba(255, 255, 255, 1) 50%, rgba(255, 255, 255, 0) 60%);
	 -webkit-transition: -webkit-mask-position;
	 -webkit-animation-timing-function: linear;
	 -webkit-transform: translate3d(0, 0, 0);
	 -moz-filter: brightness(1.5);
	 -moz-mask-size: 300% 200%;
	 -moz-mask-image: -webkit-linear-gradient( -45deg, rgba(255, 255, 255, 0) 40%, rgba(255, 255, 255, 1) 50%, rgba(255, 255, 255, 0) 60%);
	 -moz-transition: -webkit-mask-position;
	 -moz-animation-timing-function: linear;
	 -moz-transform: translate3d(0, 0, 0);
	 -o-filter: brightness(1.5);
	 -o-mask-size: 300% 200%;
	 -o-mask-image: -webkit-linear-gradient( -45deg, rgba(255, 255, 255, 0) 40%, rgba(255, 255, 255, 1) 50%, rgba(255, 255, 255, 0) 60%);
	 -o-transition: -webkit-mask-position;
	 -o-animation-timing-function: linear;
	 -o-transform: translate3d(0, 0, 0);
	 filter: brightness(1.5);
	 mask-size: 300% 200%;
	 mask-image: -webkit-linear-gradient( -45deg, rgba(255, 255, 255, 0) 40%, rgba(255, 255, 255, 1) 50%, rgba(255, 255, 255, 0) 60%);
	 transition: -webkit-mask-position;
	 animation-timing-function: linear;
	 transform: translate3d(0, 0, 0);
	 transition-duration: 3s;
	 animation: move 2s ease-out infinite;
   }
   
   @keyframes move {
	 from {
	   -webkit-mask-position: 150% 0px;
	   -moz-mask-position: 150% 0px;
	   -o-mask-position: 150% 0px;
	   mask-position: 150% 0px;
	 }
	 to {
	   -webkit-mask-position: 0% 0px;
	   -moz-mask-position: 0% 0px;
	   -o-mask-position: 0% 0px;
	   mask-position: 0% 0px;
	 }
   }
   
