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

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




/*隱鑶*/
.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;}
	}

/*全BOX版面*/
.WRAPPER {z-index:0; position: relative; display:block; margin: 0 auto; padding: 0; width:100%; max-width: 2000px;min-width:1220px; overflow:hidden; font-family:"微軟正黑體","Microsoft JhengHei",Helvetica;background-color: #ff94ae;}
.WRAPPER img { border:0px; vertical-align:top;}
.WRAPPER a { text-decoration:none;}

		@media screen and (max-width:767px){
		.WRAPPER { min-width: inherit; width:100%; padding-bottom:0px;background-color: #c5ddb2;}
		.WRAPPER img {  width:100%;  height:auto;}
        }
	
	
/*背景*/
@media screen and (min-width:767px){
.bg_01{ z-index:-5; position:absolute;top:0; width:100%; min-width:1220px; height:2769px; background: url(bg_01.jpg?t=1751265435549) no-repeat center top ; pointer-events:none}
.bg_02{ z-index:-6; position:absolute;top:0; width:100%; min-width:1220px; height:100%; background: url(bg_fixed.jpg?t=1751265435549) repeat-y center top ;background-size: 100%; pointer-events:none}
.main_deco{ z-index:-2; position:absolute;top:1200px; width:100%; min-width:1220px; height:100%; background: url(main_deco.png?t=1751265435549) repeat-y center top ; pointer-events:none}	
}
@media screen and (max-width:767px){
.mbg_01{ z-index:0; position:absolute;top:10vw!important; width:100%;height:120vw;background-size:100% ;pointer-events:none}
.mbg_02{ z-index:-1; position:fixed;top:0vw; width:100%;height:228vw;background: url(mbg_fixed.jpg?t=1751265435549) center 100% / 100% repeat-y scroll;pointer-events:none}			
}


/*背景*/
.bgtop  { z-index:0; position:absolute; top:0; left:0; width:100%; min-width:1220px; height:100%;}
@media screen and (max-width:767px){
		.bgtop { min-width: inherit; background-size:100%;}
}
	


/*區塊_all*/
.Area { position: relative; margin:0 auto; padding:0; border-radius:0; text-align:center; }
.Area a { display:block;margin: auto;} 
.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);}
.Area1220 { margin:0 auto; width:1220px;}
.Area960 { margin:0 auto; width:960px;}

	@media screen and (max-width:767px){
		.Area1220 { width:100%;}
		.Area960 { width:100%;}
	
	}


/*版頭*/
.Area_top {height:1100px;}
@media screen and (max-width:767px){
	.Area_top {height:125vw;z-index:3}
}



/*版頭品入稿*/
@media screen and (min-width:768px){
	.Area_top .layout_toppd {position:absolute;width: 895px;top: 492px;margin: 0 auto;right: 0;left: 0;z-index: 5;padding: 14px;}
	.Area_top .layout_toppd ul {padding:0;}
	.Area_top .layout_toppd ul li {}
	.Area_top .layout_toppd .PD_into {align-items:center!important;}
	.Area_top .layout_toppd .PD h3 {font-size:20px;}
	.Area_top .layout_toppd .PD h3 span{max-width:100%!important;}
	.Area_top .layout_toppd .PD h4 {font-size:20px;}
	.Area_top .layout_toppd .PD p {height:2.5em;line-height:2em;}
	.Area_top .layout_toppd .PD p .Price {font-size:35px;}
	.Area_top .layout_toppd input {position: relative;left: -6px;}	
	}
	@media screen and (max-width:767px){
	.Area_top .layout_toppd {position:absolute;top: 52vw;width: 93%;left: 0;right: 0;z-index: 2;margin: auto;padding: 0 ;}
	.Area_top .layout_toppd ul {}	
	.Area_top .layout_toppd .PD h3 {}
	.Area_top .layout_toppd .PD h4 {}
	.Area_top .layout_toppd .PD p {}
	.Area_top .layout_toppd .PD p .Price {}	
}



/*副標輪播*/
.Area_top .subtitle { position: absolute; top: 120px; left:292px; width: 641px; height: 166px;z-index: 10;}
@media screen and (max-width:767px){
  .Area_top .subtitle { position: absolute; width: 66%; height: auto; top: 12vw; left: 17vw;}
}



/*top*/
	  @media screen and (min-width:768px){
		 .Area_top_box {position: relative;height:500px }
		 .toptitle {position: relative;width: 630px;top: 295px;left: 6px;z-index: 11; }  .main img{width:100%;}
		 
		 .shinee {position: absolute;mix-blend-mode: screen;top:258px;left:61px;z-index: 1 }
		 .date {position: absolute;left: 423px;top: 80px;z-index: 10;}	.date img{width: 100%;}			
		 	

		 .stage {position: absolute;top: 318px;left: 610px;right: -20px;z-index: -1;}  .stage img {width:715px!important ;}	  
		 .ring01{width: 46%;position: absolute;top: 146px;left: 627px;z-index: 3;}
		 .ring02{position: absolute;top: 130px;left: 532px;z-index: 1;width: 64%;mix-blend-mode: plus-lighter;}

		 .clock{position: absolute;top:390px;left: 1070px;width: 50%;z-index: -2;transform: rotate(98deg);}
		 .clock img{width: 100%}
		 .clock_bg {position: absolute;}
		 .clock_l {position: absolute;}  
		 .set_size img{width:100%}
		  
		 .lightning {position: absolute;top: 24px;left: 893px;z-index: 3;}  .lightning img {width:113px!important ;}	
		 .sword {position: absolute;top: 272px;left: 158px;z-index: 3;}  .sword img {width:136px!important ;}	
		  
		 .coupon_btn {z-index: 1;position: absolute;top: 930px;}
		  
		 .bn {z-index: 1;position: absolute;top: 1430px;margin:0 auto;} .bn img{width:850px!important;}
}
	 
	 
  @media screen and (max-width:767px){
		 .toptitle {position:absolute;width: 66%;top: 30vw;left: 17vw;z-index: 11;}	   
		 .txt_box{position: relative;width:100%; top:10vw;left:0vw;z-index: 1}	  
	  	 .date {position: absolute;left:30vw;top:8vw;z-index:5;width: 40%;}

		 .stage {position: absolute;top: 86vw;left: 10vw;right: 1vw;z-index:0;width: 85%;}	 .stage img {width:100%!important ;}
	  	 .ring01{width: 80%;position: absolute;top: 95vw;left: 11vw;z-index:2}
	  	 .ring02{position: absolute;top: 90vw;left: -3vw;z-index: 1;width: 108%;mix-blend-mode: plus-lighter;}
	  
	     .clock{position: relative;top:33vw;left:-17vw; width:88%;z-index: -2}
	     .clock_bg {position: absolute;}
	     .clock_l {position: absolute;}
	  
	   	 .lightning {z-index: 5;position: absolute;top: 3vw;left: 72vw;}  .lightning img {width:40%!important ;}	
	     .sword {z-index: 5;position: absolute;top: 25vw;left: 0vw;}  .sword img {width:40%!important ;}	
	  
	     .coupon_btn {z-index: 1;position: absolute;width:100%;top: 100vw; }
	  
	     .bn {z-index: 1;top: 110vw;width:90% ;margin:0 auto;}
}



/*Area_txt(有設計的區標PC手機共用)*/
@media screen and (min-width:768px){
	.Area_txt {margin:0 auto; }
	.Area_txt img {width:700px; }	  
}
@media screen and (max-width:767px){
		.Area_txt {width:100% }
	    .Area_txt img {width:100%;}
}


/*Area_toppd*/

  @media screen and (min-width:768px){
	  .Area_toppd {position:relative;height:400px;margin: 0 auto 0px!important; z-index: 2}
	  .Area_toppd .Area_title {position:relative;z-index:2;height:117px;}
	  .Area_toppd .tag{display: flex;flex-direction: row;flex-wrap: wrap;width: 1180px;margin: 30px auto 0px;justify-content: center;}
	  .Area_toppd .box {margin: -530px auto 0px;}
	  .Area_toppd .box .tag a {margin: 0% 1% 0%;filter: grayscale(1);width: 20%;}
	  .Area_toppd .box .tag a img{width: 100%;}
	  .Area_toppd .box .tag a.cate-hover { filter: grayscale(0);}
	  .Area_toppd_swiper {position: relative;width:100%;margin: 0; overflow: hidden;}
	  
      .Area_toppd .PD_layout ul { margin-top:0px ; width:820px; }
      .Area_toppd .PD_layout ul li { border-radius:20px; }
      .Area_toppd .PD_layout ul li img { border-radius:20px; }
      .Area_toppd .PD_layout .PD_slide {background: rgba(0,0,0,0); min-width: 100%;}
      .Area_toppd .PD_layout .PD_into {width: 50%; margin-top:0vw!important ;}
	  .Area_toppd .PD_layout .PD h3 {color:#fff ;background-color: #eb3d68;border-radius:100px;font-size:34px ; line-height: 1.2em;margin:0px 0px 0px 0px}
      .Area_toppd .PD_layout .PD h4 {color: #fff;font-size:20px ;}
	  .Area_toppd .PD_layout .PD p .Price {font-size: 58px;font-weight: 800;}
      .Area_toppd .PD_layout .PD p {color: #ffea00;font-size:1.5em ;font-weight: 700;}
      .Area_toppd .PD_layout .PD p del{color: #B7B7B7;font-size:0.6em ;font-weight: 300;}
	  
	  .Area_toppd .memo {font-size:20px;color: #fff;margin: 0% auto 5%}			

}
  @media screen and (max-width:767px){
	  .Area_toppd {position:relative;height:55vw;margin: 0 auto 0vw!important; z-index: 2}
	  .Area_toppd .Area_title {position:relative;z-index:2;height:10vw;top:11vw}	  
	  .Area_toppd .tag{display: flex; flex-direction: row; flex-wrap: wrap; width: 80%; margin:1vw auto;}
	  .Area_toppd .box {margin: -45vw auto 0vw;}
	  .Area_toppd .box .tag a {margin:1% auto;filter:grayscale(1);width:33%;}
	  .Area_toppd .box .tag a.cate-hover { filter: grayscale(0);}
	  .Area_toppd_swiper {position: relative;width:100%;margin: 0; overflow: hidden;}	
	  
	  .Area_toppd .PD_layout .PD_slide {transform: translate(0%,1%);background: rgba(0,0,0,0);/*border:2px solid #98dffe;box-shadow:1vw 1.5vw 0 0 #7942c1;*/}
	  .Area_toppd .PD_layout .PD_into { padding: 0.3125em;margin-top: 0vw;width:57% ;}
	  .Area_toppd .PD_layout ul {padding:2vw 3vw 2vw 1vw;width: 95%;}
	  .Area_toppd .PD_layout ul li img { border-radius:3vw; }
	  .Area_toppd .PD_layout .PD h3 {color:#fff ; background-color: #eb3d68 ;border-radius:100px }
      .Area_toppd .PD_layout .PD h4 {color: #fff;}
	  .Area_toppd .PD_layout .PD p .Price {font-size: 1.5em;font-weight: 800;}
	  .Area_toppd .PD_layout .PD p {color: #ffea00;font-size:1.5em ;font-weight: 700;}
      .Area_toppd .PD_layout .PD p del{color: #B7B7B7;font-size:0.6em ;font-weight: 300;}
	  .Area_toppd .memo {font-size:4vw;color: #fff}
}



/*間距*/
.Area_bottom { margin-bottom: 100px;}
@media screen and (max-width:767px){
  .Area_bottom { margin-bottom: 10vw;}
}




/* 攻略 */
.Area_btn {}
.Area_btn .layout_text ul {width: 80% !important;margin: auto !important;}
.discount {position: absolute;top: 340px;left: 47px;z-index: 10;}
@media screen and (max-width:767px){
	.Area_btn {margin-bottom: 8vw;}
	.Area_btn .layout_text ul {width: 100% !important;margin: auto !important;}
	.Area_btn .layout_btn {width: 96%;}
	.discount {position: absolute;width: 19%;top: 37vw;left: 6vw;z-index: 10;}
}



/* 3顆 */
.Area_good .layout_good ul {grid-gap: 0 .5em !important;}
@media screen and (max-width:767px){
  .Area_good {margin-bottom: 8vw;}
  .Area_good .layout_good ul {grid-gap: 0 .2em !important;}
  .Area_good .layout_good {width: 96%;}
}
  


/* 登記 */
.Area_danji .layout_text ul {width: 65% !important;margin: auto !important;}
@media screen and (max-width:767px){
	.danjiall {}
	.Area_danji .layout_text ul {width: 100% !important;margin: auto !important;}
}




/* 限搶 */
@media screen and (min-width:768px){
	.Area_limit {}
	.Area_limit .layout_text ul {width: 65% !important;margin: auto !important;}
    .Area_limit .layout_limit {border:4px #000 solid;border-radius: 20px;}
}
@media screen and (max-width:767px){
    .Area_limit {margin:0 auto 10vw !important}
    .Area_limit .layout_limit ul{border:2px #000 solid;border-radius: 10px;}
}



/*活動倒數*/
.TimerNick { position:relative; height:50px; z-index:99;margin:-10px auto 0px;width:1220px; }
.TimerNick .FontStyle { display: inline-block; margin: 0 0 0 2px; padding: 0; border: 0; font:normal 30px/30px Arial; color: #292928; border-radius:5px;/*text-shadow:1px 1px 0px #fff;*/ letter-spacing: 0px; text-align: center;}
.TimerNick span { padding-left: 2px; font: 400 26px/48px "微軟正黑體","Microsoft JhengHei", Arial, Helvetica; letter-spacing: -0em; color:#292928}
	@media screen and (max-width:767px){
	.TimerNick {display:inline-block; width:100%; position: relative; top:0; left:0; margin:0;  height:0; padding-bottom:7%; overflow:hidden; text-align:center; z-index:20;}
	.TimerNick .FontStyle { margin: 0; padding: 0; border: 0; font: lighter 4.5vw/5vw Arial; }
	.TimerNick span { padding-left:0; font:normal 4.5vw/5vw "微軟正黑體","Microsoft JhengHei", Arial, Helvetica; letter-spacing: -0.05em;}
	}




/*下方公版*/
@media screen and (min-width:768px){
  .Area_4pda .layout_text {background-image:url(pc_box_top.png?t=1751265435549) ;background-size: 100%;background-repeat:no-repeat;}
  .Area_4pda .layout_text ul {width: 60% !important;margin: auto !important;}
  .Area_4pda .layout_4pda {background-image:url(pc_box_repeat.png?t=1751265435549) ;background-size: 100%;background-repeat: repeat-y;}
  .Area_4pda .layout_4pda ul {width: 96%;}
  }
  @media screen and (max-width:767px){
    .Area_4pda {}
    .Area_4pda .layout_text {width: 100%;background-image:url(text_bg_top.png?t=1751265435549) ;background-size: 100%;background-repeat:no-repeat;}
    .Area_4pda .layout_text ul {width: 100% !important;}
    .Area_4pda .layout_4pda {background-color: #eb4869;}
  }


/* logo */
.Area_logo .layout_text ul {width: 80% !important;margin: auto !important;}
.Area_logo .layout_logo ul {grid-gap: .5em !important;}
.Area_logo .layout_logo {width: 90%;}
@media screen and (max-width:767px){
	.Area_logo .layout_text ul {width: 100% !important;margin: auto !important;}
  .Area_logo .layout_logo ul {grid-gap: .2em !important;}
  .Area_logo .layout_logo {width: 96%;}
}


