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

/*基本*/
body{ margin:0; padding:0;background-color: #190c28;}


/*全BOX版面*/
.WRAPPER { z-index:0; position: relative; display:block; margin: 0 auto; padding:0; overflow:hidden; width:100%; min-width:1220px; background:#750695; text-align:left; font-family:"Century Gothic","Microsoft JhengHei","微軟正黑體", Arial, sans-serif; }
.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:0px; min-width: inherit; min-height:100vh; overflow: hidden;   }
		.WRAPPER img {  width:100%;  height:auto;}
	}


/*區塊_all*/
.Area2000 { margin:0 auto; width:2000px;}
.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;}
	}
/*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:-175px; left:0; width:100%; height:100%; background-repeat:no-repeat; background-position: center top; pointer-events:none;}
.bg_02 { z-index:-3; 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;margin-top: 200px;}
.bg_03 { z-index:-3; 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;margin-top: 200px;}
.bg_04 { z-index:-3; 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;margin-top: 200px;}
.BG_01{z-index:-2; position:absolute; top:0; left:0; width:100%; height:100%; background-repeat:no-repeat; background-position: center top; pointer-events:none;}
.BG_02{z-index:-2; 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:-2; position:absolute; top:0; left:0; width:100%; height:100%; background-repeat:no-repeat; background-position: center top; pointer-events:none;}
.bgdeco { z-index:-2; position: absolute; top:1000px; left: 0; width: 100%; min-width: 1220px; height: 100%; background: url(bgdeco.png?t=1755834807511) repeat-y center top; transition: 0.5s linear; pointer-events: none;}
}
@media screen and (max-width:767px){

   .mbg_01 { z-index:-10; position:absolute; top:7vw; left:0; width:100%; height:100%; background-position:center 0px; background-repeat:no-repeat; background-size:100%; pointer-events:none;}	
   .BG_01{z-index:-10; position:absolute; top:0; left:-6vw; width:108%; height:100%; background-position:center 0px; background-repeat:no-repeat; background-size:100%; pointer-events:none;}
   .BG_02{z-index:-10; position:absolute; top:0; left:-6vw; width:108%; height:100%; background-position:center 0px; background-repeat:no-repeat; background-size:100%; pointer-events:none;}
   .BG_03{z-index:-10; position:absolute; top:0; left:-6vw; width:108%; height:100%; background-position:center 0px; background-repeat:no-repeat; background-size:100%; pointer-events:none;}
}


/*提醒我按鈕*/
a.mo_remind_btn { z-index:9999; position: absolute!important; right: 0; top:73vw; width: 17%;}


/*區塊title*/
.Atitle_BG .PD_layout ul{background-color: inherit;}
.Atitle_BG .PD_layout ul li{border: none;}
.Atitle_BG .PD_layout ul li h3{color:#fff;}
@media screen and (min-width:768px){
.Atitle_BG.st1{background: url(Atitle_bg.jpg?t=1755834807511) center 100% / 100% no-repeat scroll;}
.Atitle_BG.st2{background: url(Atitle_bg2.jpg?t=1755834807511) center 100% / 100% no-repeat scroll;position:absolute;top:-71px;width: 100%;}
.Atitle_BG.st3{background: url(Atitle_bg3.jpg?t=1755834807511) center 100% / 100% no-repeat scroll;}
.Atitle_BG .PD_layout ul li h3{font-size:52px;}
}
@media screen and (max-width:767px){
.Atitle_BG.st1{background: url(Atitle_bg.jpg?t=1755834807511) center 100% / 140% no-repeat scroll;} 
.Atitle_BG .PD_layout ul li h3{font-size: 8vw;text-align: center;}
.Atitle_BG.st2{background: url(mAtitle_bg2.jpg?t=1755834807511) center 80% / 100% no-repeat scroll;position:relative;top:0;width: 100%;}
.Atitle_BG.st3{background: url(Atitle_bg3.jpg?t=1755834807511) center 100% / 140% no-repeat scroll;}
}


/*版頭區塊*/
.sub {overflow: hidden;}
.sub .PD_layout ul{display: flex;flex-direction: row;flex-wrap: nowrap;}

@media screen and (min-width:768px){
.Area_title { height:780px;}
.Area_title .sub{position: absolute;width: 57%;top: 193px;left:16px;z-index: 5;}
.Area_title .sub .PD_layout ul{gap:34px;padding-right:0;}
.Area_title .sub .PD_layout ul li {width: 0;;margin-right:0;}
.date { width: 35%; position:absolute; top:42px; left:840px; z-index:2; }
.toptitle {width: 50%;position:absolute;top: 85px;left:50px;}
}
@media screen and (max-width:767px){
.Area_title { height:90vw;margin-bottom: 0 !important;}
.date {width: 24%;position:absolute;top:2.5vw;z-index:2;right: 0;}
.toptitle {width:60%;position:absolute;top: 8vw;left: 3vw;}
.Area_title .sub{position: absolute;width: 55%;top: 20vw;left:2vw;z-index: 10;}
.Area_title .sub .PD_layout ul{gap:4vw;padding-right:0;}
.Area_title .sub .PD_layout ul li {width: 0;;margin-right:0;}
.coming{position: absolute;bottom: 3vw;left:0;width:40%;}
}



/*版頭品*/
.topPD .PD_layout ul{background-color: inherit;display: flex;flex-direction: row;flex-wrap: nowrap;}
.topPD .PD_layout ul li{border: none;}
.topPD .PD_layout .PD p .money,
.topPD .PD_layout .PD p .Price{color: #ffffff;}
.topPD .PD_layout .PD p b, .PD_layout .PD p del{color: #ffffff!important;}
.topPD .PD_layout ul .PD_into h3 span{background-color:inherit;padding: 0;color:#ffffff; max-width: 105%;}
@media screen and (min-width:768px){
.topPD {width:960px;position: absolute;top: 250px;left: 443px;z-index: 10;overflow: hidden;}
.topPD .PD_layout ul{gap: 270px;padding-right: 230px;}
.topPD .PD_layout ul .PD_into {position: relative;top: 140px;left:97px;width:100%}
.topPD .PD_layout ul .PD_into h3 {text-align: left;font-size:32px;margin-bottom: 0;}
.topPD .PD_layout ul .PD_into h4 {text-align: left;font-size:26px;color:#ffffff;}
.topPD .PD_layout .PD p .Price{font-size:44px;}
.topPD .PD_layout ul li .PD_img{border: none;top:-67px;position: relative;left: 210px;width: 73%;}
}
@media screen and (max-width:767px){
  .topPD {width:100%;position: absolute;top: 39vw;left: -5vw;z-index: 5;}
  .topPD .PD_layout ul li .PD_img{border: none;top: -25vw;position: relative;left: 10vw;width: 57%;}
  .topPD .PD_layout ul{gap: 9vw;}
  .topPD .PD_layout .PD .oPrice{display: none;}
  .topPD .PD_layout ul .PD_into h3,
  .topPD .PD_layout ul .PD_into h3 span,
  .topPD .PD_layout ul .PD_into h4 {margin:0;white-space: nowrap !important;overflow: hidden !important;text-overflow: clip !important;max-width: 94%; color: #ffffff;}
  .topPD .PD_layout ul .PD_into {width: 50%;top: 2vw;position: relative;left: 20vw;}
  
  }

/*攻略*/
@media screen and (min-width:768px){
  .strategy { margin-bottom:60px!important; }
  .strategy  .PD_wrapper { width: 110%; grid-gap:0.5em;padding-bottom:15px; }
  li{list-style: none; }
  
  }
 @media screen and (max-width:767px){
  .strategy {  margin-top:-18vw!important; margin-bottom:-4vw!important; }
  .strategy  .PD_wrapper {width: 96%; grid-gap:.8em;padding-bottom:0; }
  li{list-style: none; }
  }

@media screen and (min-width:768px){
  .strategy {height:100%;}
  .strategy .box {display:flex;padding-bottom: 30px;position: relative;right:20px;}
  .strategy .layout_PD01 {width: 88%;}
}
@media screen and (max-width:767px){
.strategy {height:100%;}
.strategy .box {display:flex;padding-bottom:5vw;}
.strategy .layout_PD01 {width: 100%;}
}

  /*BN區*/
@media screen and (min-width:768px){
  .onebn { margin-bottom: 80px; height: 930px; padding-top: 485px;}
  .onebn .PD01{ z-index: 5; position: relative;}
  .onebn .title{ width: 80%; position: relative;margin: 120px auto auto auto;}
  .onebn .bg3_vd{ top: 405px!important;}
  .onebn .bg3_pd{ top: 423px!important;}
  .onebn2 { height: 1010px!important;}
}
@media screen and (max-width:767px){
  .onebn { margin-bottom: 80px; padding-top: 42vw;}
  .onebn .PD01 { z-index: 5; top: 0;position: relative; margin-bottom: 0; padding-bottom: 10vw;}
  .onebn .title { width: 80%; position: relative;margin: 12vw auto 4vw auto;}
}



/*影片*/	
.onebn .videobox1{ z-index:5; position:relative;  padding-bottom: 30px; }
.onebn .videobox1 .youtubeArea { position:relative; height: 475px;}

	@media screen and (max-width:767px){	
	.onebn .videobox1 { position: relative; top:0; width:100%; right: 0; margin:0; padding: 0;}
	.onebn .videobox1 .youtubeArea { width: 87%; height: 52vw; top:0; right:0px; position: relative; margin: 5% auto;}
	}


.onebn .videobox2{ z-index:5;position: relative;top: 40px; }
.onebn .videobox2 .youtubeArea { position:relative; height: 475px;}

	@media screen and (max-width:767px){	
	.onebn .videobox2 { position: relative; top: 0; width:100%; right: 0%; margin: 0;padding: 0;}
	.onebn .videobox2 .youtubeArea { width: 87%; height: 52vw; top:0; right:0px; position: relative; margin: 5% auto;}
	}

/*活動倒數*/
.TimerNick {position: absolute;top: 338px;left:50px;display: inline-block;z-index:8;text-align: center;letter-spacing: 0.3em;}
.TimerNick .FontStyle { display: inline-block; margin: 0 0 0 5px; padding: 0; border: 0; font-size: 36px;  color:#fff; font-weight: normal; letter-spacing:1px; text-align: center;}
.TimerNick span { padding-left: 2px; font-size: 36px;  letter-spacing: 0.1em; color:#fff;}
.TimerNick b { font-weight: normal;}
@media screen and (max-width:767px){
  .TimerNick  {width: 100%;top: 33vw;left:6vw;display: flex;column-gap: 0.4em;text-align: left;}
  .TimerNick .FontStyle { margin:-0.25em 0 0 -0.01em; padding: 0; border: 0; font-size: 1.4em; letter-spacing: .01em; }
  .TimerNick span { padding-left: 0; font-size: 1em; letter-spacing: -0.05em; margin-left: -0.3em; }
  .TimerNick span:first-child{ margin-top: -0.1em; }
}    

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


/*影片+2品公版-共用*/	
.Area_video .videobox1 { z-index:5; }
@media screen and (min-width:768px){
.Area_video .videobox1 .youtubeArea { height: 475px; margin: 0px auto 20px;border:5px solid #ffffff;
  border-image: linear-gradient(to right, #b7934e, #fffacd, #ffec8b, #fffacd, #b18500) 1;
  border-radius: 21vw; }
}
@media screen and (max-width:767px){	
.Area_video .videobox1 .youtubeArea { width: 96%; height: 50vw; margin: 4vw auto 2vw; border: 1.5vw solid #ffffff;
  border-image: linear-gradient(to right, #b7934e, #fffacd, #ffec8b, #fffacd, #b18500) 1;
  border-radius: 21vw;}
}


/*影片*/		
.videobox {position:relative; height: auto;}
.videobox .youtubeBG {width: 100%;position:relative;}
.videobox .youtubeArea { position:absolute; top:23px; right:173px; width:872px; height:494px}
.videobox .youtubeArea iframe {border-radius:25px;}
@media screen and (max-width:767px){
	.videobox{position:relative; width:100%; height: auto;}
	.videobox .youtubeBG {width: 96%;left:2vw;}
	.videobox .youtubeArea {position: relative;width:93vw; height:200px; top:-30vw; right:0; margin:-92px auto;}
	.videobox .youtubeArea iframe {border-radius:5px;}
}

/*登記區*/
@media screen and (min-width:768px){
/* .Area_activ  { height: 2120px; } */
.Area_activ .title { width: 100%;position: relative;margin:25px auto;}
.Area_alldanji .Area_danji .danji_box { width: 960px !important;}
.Area_alldanji .Area_danji { margin-bottom: 15px;}
}
@media screen and (max-width:767px){
/* .Area_activ  { height: 221vw; } */
.Area_activ .title { width: 80%;position: relative;margin: 4vw auto;}
.Area_alldanji .Area_danji .danji_box { width: 96% !important;}
.Area_alldanji .Area_danji .danji_box ul li { margin-bottom: 2vw !important;}
.Area_alldanji .Area_danji { margin-bottom: 3vw;}
}

/*影踭+宮格區*/
  @media screen and (min-width:768px){
    .Area04{background-color:#a6885e;margin:10% 5% 0 15%;padding:0 0 5%!important;border-radius:100px 0 0 0;    width: calc(100% - 15%);}
  }
  @media screen and (max-width:767px){
    .Area04{background-color:#a6885e;margin:10% 0 15%;padding:0 0 5%!important;border-radius:20vw 0 0 0;    width:100%;} 
  }

  @media screen and (min-width:768px){
    .Area05{background-color:#a6885e;margin:10% 0 !important;padding:0 0 5%!important;border-radius: 0 100px 0 0!important;    width: calc(100% - 15%);}

  }
  @media screen and (max-width:767px){
    .Area05{background-color:#a6885e;margin:10% 0 !important;padding:0 0 5%!important;border-radius: 0 20vw 0 0!important;width:100%;}
  }


/*3按鈕*/
@media screen and (min-width:768px){
.bnbtn .PD_layout { width:960px; }
.bnbtn .PD_wrapper { grid-gap:0.5em; }
 li{list-style: none; }
 }
@media screen and (max-width:767px){
.bnbtn .PD_layout { width: 96%; }
.bnbtn .PD_wrapper { grid-gap:0.3em; }
 li{list-style: none; }
 }


/*8品公版*/
@media screen and (min-width:768px){
.Area_8p .PD_layout { width: 100%; }
.Area_8p .title { margin-bottom: 50px; }
}
@media screen and (max-width:767px){
.Area_8p .PD_layout { width: 96%; }
.Area_8p .title { width: 80%; position: relative;margin: 12vw auto 4vw auto;}
}


/*品類*/
.Area09 {margin:100px auto; width:960px}
.Area09 .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;}

@media screen and (max-width: 767px) {

  .Area09 .PD_layout[data-pd-li=BN] ul, .Area09 .PD_layout[data-pd-li=BN-AWD] ul, .Area09 .PD_layout[data-pd-li=PDBN] ul{grid-gap:1em!important;}
  .Area09 {width: 100%!important; margin-top: 10vw!important;}


}

/*館連結*/
@media screen and (min-width:768px){
	.Area_guan .PD_layout {width: 60%; margin: 40px auto; }
    .pc_guan { display: flex;flex-direction: row;justify-content: center;align-items: flex-end;}
	}
@media screen and (max-width:767px){
	.Area_guan .PD_layout {width:95%; }
	.Area_guan { height: auto; margin:10vw 0vw!important;}			
	}


/*黏人精*/
.Area_hammerAD { z-index: 9999; position: fixed; bottom: 0; right: 0;}
.Area_hammerAD .box { position: relative; margin-right: 10px; opacity: 1;}
.Area_hammerAD img { width: 100%; height: auto; position: absolute; top: 0; left: 0;}
.Area_hammerAD .closeButton a { display: block; cursor: pointer; position: absolute; width: 20px; height: 20px; border-radius: 50%; font: bold 20px/1em "Century Gothic"; color: #FFF; text-align: center; background-color: rgba(0%,0%,0%,0.5); text-decoration: none; z-index: 2;}
.Area_hammerAD .Ahammer_text { position: absolute; z-index: 2; display: flex; align-items: center; justify-content: center; width: 90%; color: #000; font-family: "Century Gothic","Noto Sans CJK TC"; font-weight: 700;}
.Area_hammerAD .Ahammer_black .img_0, .Area_hammerAD .img_1 { filter: brightness(0%);}
.Area_hammerAD .Ahammer_black .img_1 { filter: none;}
.Area_hammerAD .Ahammer_black .Ahammer_text { color: #fff;}
@media screen and (min-width:768px){
  .Area_hammerAD { position: fixed; z-index: 300; left: 50%; right: auto; bottom: 50px; display: block; width: 210px; height: 200px; transform: translateX(618px) translate3d(0,200px,0);}
  .Area_hammerAD .closeButton a { top: 0; right: 0;}
  .Area_hammerAD .Ahammer_text { font-size: 2.3em; line-height: 1em; height: 1em; top: 40px;}
}
@media screen and (max-width:767px){
  .Area_hammerAD { display: block; width: 26%; transform: translate3d(0px, -215px, 0px) !important;}
  .Area_hammerAD .closeButton a { top: 1vw; right: 1vw;}
  .Area_hammerAD .Ahammer_text { font-size: 1.5em; line-height: 1.5em; height: 1.5em; top: 3.6vw;}
}


/*取消公版白底*/
.FUKK .PD_wrapper {background-color: rgba(255,255,255,0.00);}
.FUKK .PD_layout[data-pd-li*="BN"] li{border: rgba(255,255,255,0.00);}
@media screen and (max-width:767px){
	.FUKK .PD_wrapper {background-color: rgba(255,255,255,0.00);}
	.FUKK .PD_layout[data-pd-li*="BN"] li{border: rgba(255,255,255,0.00);}
 }

/*置底*/
.fixbn a {padding-bottom:constant(safe-area-inset-bottom); /* 兼容 iOS < 11.2 */
				    padding-bottom:env(safe-area-inset-bottom);}   /* 兼容 iOS >= 11.2 */ 
.fixbn{position:fixed; background-size:100%;bottom:0; display:block; z-index:30;}
.fixbn ul li{float:left;padding:0;list-style-type:none;width:50vw;}
.fixbn ul li img{width:100%;margin:0 auto;}

.fixbn ul{
    margin-top: 0px;
    margin-bottom: 0px;
    padding-left: 0px;
}

/*1顆按鈕*/
.fixbn .class_00 {position:absolute;width:100%; height: 100%; }
.fixbn .class_00 a {display:block;width:100%;height:93%;}
.fixbn .class_01 { top:0%;left:0%;}


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