<strong></strong>@charset "utf-8";
/* CSS Document */
/* --------------------------------------
 * Layout.css
 * -------------------------------------- */


/*.articleList img.lazy_off { background-image: none!important;}
.WRAPPER { overflow: hidden; }*/

/*寬度,間距*/

  @media screen and (min-width:768px){
.Areabottom { margin-bottom:40px;}	  
    .Areabottom { margin-bottom:20px;}
  }
  @media screen and (max-width:767px){
    .Areabottom {}	  
}

.Area1220 {
    margin: 0 auto 0 auto;
}

.Area_logo { display: none!important}
/*PC背景*/
	@media screen and (min-width:768px){
    .Area_bgtop { width:100%;}
    .Area_bgtop span { background-repeat: no-repeat;}
    .Area_bgtop_1 { position: fixed; overflow: hidden; height: 100%;}
    .Area_bgtop_1 .bgtop_ { height: 200%;}
    .Area_bgtop_1 .bgtop_ span { background-repeat: no-repeat;}

  }
/*Phone背景*/
    .m_Area_bgtop span { background-repeat: no-repeat;}
		.m_Area_bgtop_1 { overflow: hidden;}
		.m_Area_bgtop_1 .m_bgtop_1_1 span { background-image: url(m_bgtop_1_1.jpg?t=1756455048946);}
    
/*背景fixed擋到logo修正*/
    .Area_header_momologo {  z-index: 1;}


/*按鈕*/
.Area_btn { position: absolute; padding: 0 0 0 0; top:400px; left:0px; width: 1220px;height: 297px; background-image: url("btn_bg.png?t=1756455048946")}
.Area_btn:after { content:""; clear:both; display:block;}
.Area_btn a { float:left; }
/*.Area_btn a:first-child {margin-left: 110px;}*/
.Area_btn a:hover {
      -webkit-animation-name: top_btn-play;  
          animation-name: top_btn-play;  
      -webkit-animation-duration: 0.3s;  
          animation-duration: 0.3s;
      -webkit-animation-iteration-count: infinite;    
          animation-iteration-count: infinite;
      -webkit-animation-direction: alternate;
          animation-direction: alternate;
      }
@-webkit-keyframes top_btn-play {   
  0%   { -webkit-transform: translate3d(0,0%,0) ; transform: translate3d(0,0%,0);}
  100% { -webkit-transform: translate3d(0,-5%,0); transform: translate3d(0,-5%,0);}
}
@keyframes top_btn-play { 
  0%   { -webkit-transform: translate3d(0,0%,0) ; transform: translate3d(0,0%,0);}
  100% { -webkit-transform: translate3d(0,-5%,0); transform: translate3d(0,-5%,0);}
}


/* --------------------------------------
 * Page 搶紅包
 * -------------------------------------- */

/*搶紅包*/
.Area_game1 {}
.Area_game1 .box .game_close { z-index: 1;  display: block; position: relative; top: 0px; left: 0; width: 960px; margin: 0 auto;}
    @media screen and (max-width:767px){
      .Area_game1 {}
	    .Area_game1 .box .game_close { top: 0; left: 0; width: 100%;}
    }
    /*文字*/
    .Area_game1 .box_txt {position: relative; color: #181e4d; font-size: 36px; padding-top: 0; font-family: "Century Gothic","Microsoft JhengHei";}
	  .Area_game1 .box_txt span {position: relative; color: #a80013;}
    .Area_game1 .box_txt small { font-size: 0.875em; font-weight: 400;}
    .Area_game1 .box_txt .txt_time_period { font-weight: 900; /*font-family: "Century Gothic","Microsoft JhengHei";*/ margin-bottom: 10px; }
    .Area_game1 .box_txt .txt_time_now    { font-size: 48px; line-height: 1.5; font-weight: 900; background: #b08bff; border-radius: 15px 15px 0 0;}
    .Area_game1 .box_txt .txt_cpNum       { font-size: 43px; line-height: 2; color: #a80013; font-weight: 900;}
    .Area_game1 .box_txt2 { margin-top: 10px; margin-bottom: 30px;}
    .Area_game1 .box_txt .txt_description { font-size: inherit;}
    .Area_game1 .box_txt .txt_description small { display: block; /*color: #a80013;*/}
        @media screen and (max-width:767px){
          .Area_game1 .box_txt { font-size: 4.2vw;    padding-top: 1vw;}
          .Area_game1 .box_txt .txt_time_period { margin-bottom: 2vw; }
          .Area_game1 .box_txt .txt_time_now    { font-size: 5vw;line-height: 2;width: 90%;margin: 0 auto;}
          .Area_game1 .box_txt .txt_cpNum       { font-size: 5.2vw; line-height: 1.8;}
          .Area_game1 .box_txt2 { margin-top: 1vw; margin-bottom: 1vw;}
        }
    /*提醒通知*/
    .Area_game1 .box_txt .btn_alert { margin: 20px 0;}
        @media screen and (max-width:767px){
          .Area_game1 .box_txt .btn_alert { margin: 3vw auto; width: 32%;}
          .Area_game1 .box_txt .btn_alert img { width: 100%; height: auto;}
        }
    /*mo幣*/
    .Area_game1 .box_txt .btn_momoney { margin: 20px 0;}
        @media screen and (max-width:767px){
          .Area_game1 .box_txt .btn_momoney { margin: 10px auto; width: 40%;}
          .Area_game1 .box_txt .btn_momoney img { width: 100%; height: auto;}
        }

    /*遊戲內容*/
    .Area_game1 .box_game { position: relative; margin: 30px auto 0; width: 90%;}
    .Area_game1 .box_game:after { content: ""; z-index: -1; position: absolute; top: -8px; left: -8px; width: calc(100% + 16px); height: calc(100% + 16px); border-radius: 16px;}
    .Area_game1 .box_game .txt_time_now { color: #fff; font-size: 42px; line-height: 1.8; font-weight: 900; background: #a80013; border-radius: 15px 15px 0 0;}
    .Area_game1 .box_game video { width: 100%;}
    .Area_game1 .box_game img { width: 100%; height: auto;}
    .Area_game1 .box_game_btn { position: relative; margin: 0 auto -38px; top: -38px;}
    /*.Area_game1PD .Area_boxstyle_box1{position:relative;top: 0px; margin-bottom: 475px;}
    .Area_game1PD .bg_02{position: absolute;top: -25px;left: 0;z-index: -5;pointer-events: none;}*/
        @media screen and (max-width:767px){
          .Area_game1 .box_game { margin: 3.5vw auto 0; /*width: 90%;*/}
          .Area_game1 .box_game:after { top: -4px; left: -4px; width: calc(100% + 8px); height: calc(100% + 8px); border-radius: 8px;}
          .Area_game1 .box_game .txt_time_now { font-size: 5vw; line-height: 2; border-radius: 10px 10px 0 0;}
          .Area_game1 .box_game video { width: 100%}          
          .Area_game1 .box_game_btn { width: 40%; margin: 0 auto -5vw; top: -5vw;}
          /*.Area_game1PD .Area_boxstyle_box1{top: 21vw; margin-bottom: 33vw;}
          .Area_game1PD .bg_02{width: 100%; margin: 0 auto;top: -25px;left: 0;z-index: -5;pointer-events: none;}
          .Area_game1PD .bg_02 img{width: 90%; margin: 0 auto;}*/
        }

.Area_top .sub { display: block;position: absolute; margin:373px 0 0 438px; color: #fff; font-weight: bolder;  font-size: 36px;  line-height: 1.1;z-index: 10  }
  @media screen and (max-width:767px){
.Area_top .sub { display: block;position: absolute; margin:37% 0 0 24.6%; font-size:5vw;}
}

/*頂部*/
.Area_header { background-color: #fff; border-bottom: 5px solid #dbdbdb }
	@media screen and (max-width:767px){
		.Area_header { border-bottom: 1vw solid #dbdbdb}	
	}


.Area_grabgift {font-family: "Century Gothic","Microsoft JhengHei";}
/*登記活動*/
/* .Area_grabgift .box_1 b { line-height: 2;} */
.Area_grabgift .box_grabgift { margin-top:5%;}
.Area_grabgift .box_grabgift:first-child { margin-top: 0;}
.Area_grabgift .box_grabgift .grabgift_btn { top:53%; left: 44%;}
.Area_grabgift .box_grabgift .grabgift_txt {  left: 47%; }
.Area_grabgift .box_grabgift .grabgift_cpNum { top: 66%;}
.Area_grabgift .box_grabgift .grabgift_time { top:69%; color: #273333;}
.Area_grabgift .box_grabgift3 .grabgift_btn { top: 40%;}
.Area_grabgift .box_grabgift3 .grabgift_cpNum { top: 58%;}
.Area_grabgift .box_grabgift3 .grabgift_time { top: 66.5%;}
.Area_grabgift .box_grabgift3 .grabgift_time2 { top: 85.5%; left: 2%; width: 100%; text-align: center; transform-origin: center top; transform: scale(0.75);}
.Area_grabgift .box_list { text-align: left;}
.Area_grabgift .box_grabgift .grabgift_cpNum { top:59%; color: #273333;    left: 73%;}
.Area_grabgift .box_grabgift .grabgift_cpNum span{ color:#c6061b;}

/*登記活動3個一組*/
.Area_grabgift .block00 { position: absolute; top:1%; left:12.5%; width: 74%; height: 4%; margin: 0 auto; font-weight: 800; }
.Area_grabgift .block00 h3 { color: #fdffc2; font-size: 50px; font-weight:bold;  text-align: center; margin:3px 0 5px 0;}

.Area_grabgift .block01 { position: absolute; top:41%; left:15%; width: 22%; height: 11%; margin: 0 auto; font-weight: 800; }
.Area_grabgift .block01 h3 {  color: #fff; font-size: 60px; text-align: center; margin:5px 0 -5px 0;}
.Area_grabgift .block01 h2 {  color: #fdffc2; width: 66%; margin: 0 auto; font-size: 30px; text-align: center; line-height: 1.1 }

.Area_grabgift .block02 { position: absolute; top:41%; left:38%; width: 22%; height: 11%; margin: 0 auto; font-weight: 800; }
.Area_grabgift .block02 h3 {  color: #fff; font-size: 60px; text-align: center; margin:5px 0 -5px 0;}
.Area_grabgift .block02 h2 {  color: #fdffc2;  width: 66%; margin: 0 auto; font-size: 32px; text-align: center; line-height: 1.1 }

.Area_grabgift .block03 { position: absolute; top:45%; left:60%; width: 28%; height: 11%; margin: 0 auto; font-weight: 800; }
.Area_grabgift .block03 h3 {  color: #fff; font-size:65px; text-align: center; margin:5px 0 0 0;}
.Area_grabgift .block03 h2 {  color: #fdffc2; width: 66%; margin: 0 auto; font-size: 32px; text-align: center; line-height: 1.1 }

/*登記活動4個一組*/
.Area_grabgift .block04 { position: absolute; top:41%; left:4.5%; width: 22%; height: 10%; margin: 0 auto; font-weight: 800; }
.Area_grabgift .block04 h3 {  color: #fff; font-size: 60px; text-align: center; margin:5px 0 -5px 0;}
.Area_grabgift .block04 h2 {  color: #fdffc2; width: 66%; margin: 0 auto; font-size: 30px; text-align: center; line-height: 1.1 }

.Area_grabgift .block05 { position: absolute; top:41%; left: 26.5%; width: 22%; height: 10%; margin: 0 auto; font-weight: 800; }
.Area_grabgift .block05 h3 {  color: #fff; font-size: 60px; text-align: center; margin:5px 0 -5px 0;}
.Area_grabgift .block05 h2 {  color: #fdffc2;  width: 66%; margin: 0 auto; font-size: 30px; text-align: center; line-height: 1.1 }

.Area_grabgift .block06 { position: absolute; top:41%; left: 48.5%; width: 22%; height: 10%; margin: 0 auto; font-weight: 800; }
.Area_grabgift .block06 h3 {  color: #fff; font-size: 60px; text-align: center; margin:5px 0 -5px 0;display: flex;justify-content: center;}
.Area_grabgift .block06 spen {font-size: 27px;position: relative;width:16%;top:48%}
.Area_grabgift .block06 h2 {  color: #fdffc2;  width:80%; margin: 0 auto; font-size: 30px; text-align: center; line-height: 1.1 }

.Area_grabgift .block07 { position: absolute; top:47%; left: 73.5%; width: 22%; height: 10%; margin: 0 auto; font-weight: 800; }
.Area_grabgift .block07 h3 {  color: #fff; font-size: 60px; text-align: center; margin:5px 0 -4px 0;}
.Area_grabgift .block07 h2 {  color: #fdffc2; width: 66%; margin: 0 auto; font-size: 32px; text-align: center; line-height: 1.1 }


.Area_grabgift .box_grabgift .title01 { position: absolute; top:3%; left: 0%; width: 100%; font-size: 38px; font-weight: 800; text-align: center; white-space:nowrap; overflow: hidden; text-overflow: ellipsis; }
.Area_grabgift .box_grabgift .title02 { position: absolute; top:23%; left: 47%; width: 49%; color: #002543; font-size: 46px; font-weight: 800; text-align: left; white-space:nowrap;overflow: hidden; text-overflow: ellipsis; }
.Area_grabgift .box_grabgift .title03 { position: absolute; top:36%; left: 47%; width: 53%; color: #002543; font-size: 28px; font-weight: 800; text-align: left; white-space:nowrap; overflow: hidden; text-overflow: ellipsis; }

 @media screen and (max-width:767px){
	 
.Area_grabgift .block00 {  top:3%; left:18vw; width: 61%; height: 8%; }
.Area_grabgift .block00 h3 {  font-size: 6.5vw;   margin:-1vw 0; }

/*登記活動3個一組*/
.Area_grabgift .block01 {  top:37%; left: 7.5vw; width:21%; height: 8%; }
.Area_grabgift .block01 h3 {  font-size: 8vw;   margin:0; }
.Area_grabgift .block01 h2 { width: 100%; margin: 0 auto;  font-size: 4vw; line-height: 1.1;  }

.Area_grabgift .block02 { top:37%; left:38.4%;width:20%; height: 8%;   }
.Area_grabgift .block02 h3 { font-size: 8vw;  margin:0; }
.Area_grabgift .block02 h2 {    width: 100%; margin: 0 auto;  font-size: 4vw; line-height: 1.1; }

.Area_grabgift .block03 {  top:45%; left: 67.5%; width: 29%; height: 7%;   }
.Area_grabgift .block03 h3 {  font-size: 8vw;   margin:0; letter-spacing: -0.05em;}
.Area_grabgift .block03 h2 {   width: 100%; margin: 0 auto;  font-size: 4vw; line-height: 1.1;  }

/*登記活動4個一組*/
.Area_grabgift .block04 { position: absolute; top:37%; left: 0%; width: 22%; height: 10%; margin: 0 auto; font-weight: 800; }
.Area_grabgift .block04 h3 {  color: #ffffff; font-size:7vw; text-align: center; margin:0;}
.Area_grabgift .block04 h2 {  color: #fdffc2; width:70%; margin: 0 auto; font-size:3vw; text-align: center; line-height: 1.1 }

.Area_grabgift .block05 { position: absolute; top:37%; left: 25%; width: 22%; height: 10%; margin: 0 auto; font-weight: 800; }
.Area_grabgift .block05 h3 {  color: #ffffff; font-size:7vw; text-align: center; margin:0;}
.Area_grabgift .block05 h2 {  color: #fdffc2; width:70%; margin: 0 auto; font-size:3vw; text-align: center; line-height: 1.1 }

.Area_grabgift .block06 { position: absolute; top:37%; left: 50%; width: 22%; height: 10%; margin: 0 auto; font-weight: 800; }
.Area_grabgift .block06 h3 { font-size:7vw; text-align: center; margin:0;display: flex;flex-direction: row;justify-content: center;}
.Area_grabgift .block06 h3 spen {font-size:3vw;position: relative;line-height: 3.5vw;}	 
.Area_grabgift .block06 h2 { color: #fdffc2; width:80%; margin: 0 auto; font-size:3vw; text-align: center; line-height: 1.1  }

.Area_grabgift .block07 { position: absolute; top: 47%; left: 78.5%; width: 22%; height: 10%; margin: 0 auto; font-weight: 800; }
.Area_grabgift .block07 h3 { font-size:7vw; text-align: center; margin:0;}
.Area_grabgift .block07 h2 { color: #fdffc2; width:70%; margin: 0 auto; font-size:3vw; text-align: center; line-height: 1.1 }

	 
.Area_grabgift .box_grabgift .title01 {font-size: 4.1vw;}
.Area_grabgift .box_grabgift .title02 {font-size: 5.5vw;top:21%}
.Area_grabgift .box_grabgift .title03 {font-size: 3vw;top:36%;}

	 
    }    


    .Area00 {background-color: #6235bd; padding: 60px 0; border-radius: 30px;}
    .title01 {background-color: #000000; padding: 7px 0;z-index: 5;}
    .Area_grabgift .box_grabgift .grabgift_img{ background-color: #ffffff; border-radius: 10px;}

    @media screen and (max-width:767px){
      .Area00 {background-color: #fb113b; padding: 4vw 0; border-radius: 0;}
      .Area00 .box{width: 96%; position: relative; left: 2vw;}
      .title01 {background-color: #000000; padding: 2vw 0;z-index: 5;}
      .Area_grabgift .box_grabgift .grabgift_img{ background-color: #ffffff; border-radius: 2vw;}
    }


    /*活動提醒按鈕(登記版)*/
.btn_alert_danji{ position: absolute; top:22%; left: 0; z-index: 99;}


/*文案底色這裡換 */
.game_remind{
  --remind-txtcolor: #fff;
  --remind-bg: #000000;
  background-color:var(--remind-bg);
  border-radius: 0 5em 5em 0;
  width: 60px;
  height: 42px;
}
.danji-pd-container .game_remind{
  --remind-txtcolor: #fff;
  --remind-bg: #000000;
}

/*鈴鐺icon--用SVG格式(改顏色搜尋【fill='rgb(252, 129, 36)'】)*/
.game_remind::before{
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='295px' height='348px'%3E%3Cpath fill-rule='evenodd' fill='rgb(255, 255, 255)' d='M294.496,272.105 C294.132,274.973 292.956,281.433 289.179,280.959 L3.553,280.767 C-6.068,258.136 13.398,252.817 26.074,240.802 C38.266,229.244 45.048,213.504 45.368,197.353 C45.967,167.135 43.205,136.722 48.384,106.746 C50.908,92.140 55.319,77.409 63.932,65.166 C73.634,51.377 88.810,43.321 103.319,35.455 C106.757,33.590 110.229,31.782 113.768,30.114 C120.273,27.049 126.961,23.729 134.094,22.607 C136.917,20.594 131.951,1.633 145.469,0.261 C153.283,-0.532 158.630,2.684 159.588,10.698 C159.970,13.894 158.799,19.212 160.668,21.349 C175.635,27.276 190.432,33.859 204.115,42.388 C220.597,52.663 235.303,66.657 241.282,85.624 C250.847,115.972 250.296,150.413 249.867,181.989 C249.514,207.900 253.982,227.635 274.329,245.364 C278.812,249.271 286.626,252.978 290.213,257.809 C292.372,260.716 293.249,263.918 294.496,267.217 C294.364,268.806 294.692,270.552 294.496,272.105 ZM169.696,342.234 C136.983,357.435 98.562,337.069 94.256,301.434 L198.771,301.434 C198.125,318.698 185.022,335.113 169.696,342.234 Z'/%3E%3C/svg%3E");  content: "";
  position: absolute;
  top: 0.8em;
  left: 0.25em;
  display: inline-block;
  width: 1em;
  height: 1em;
  background-size:auto 100%;
  background-repeat: no-repeat;
}
.danji-pd-container .game_remind::before{
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='295px' height='348px'%3E%3Cpath fill-rule='evenodd' fill='rgb(255, 255, 255)' d='M294.496,272.105 C294.132,274.973 292.956,281.433 289.179,280.959 L3.553,280.767 C-6.068,258.136 13.398,252.817 26.074,240.802 C38.266,229.244 45.048,213.504 45.368,197.353 C45.967,167.135 43.205,136.722 48.384,106.746 C50.908,92.140 55.319,77.409 63.932,65.166 C73.634,51.377 88.810,43.321 103.319,35.455 C106.757,33.590 110.229,31.782 113.768,30.114 C120.273,27.049 126.961,23.729 134.094,22.607 C136.917,20.594 131.951,1.633 145.469,0.261 C153.283,-0.532 158.630,2.684 159.588,10.698 C159.970,13.894 158.799,19.212 160.668,21.349 C175.635,27.276 190.432,33.859 204.115,42.388 C220.597,52.663 235.303,66.657 241.282,85.624 C250.847,115.972 250.296,150.413 249.867,181.989 C249.514,207.900 253.982,227.635 274.329,245.364 C278.812,249.271 286.626,252.978 290.213,257.809 C292.372,260.716 293.249,263.918 294.496,267.217 C294.364,268.806 294.692,270.552 294.496,272.105 ZM169.696,342.234 C136.983,357.435 98.562,337.069 94.256,301.434 L198.771,301.434 C198.125,318.698 185.022,335.113 169.696,342.234 Z'/%3E%3C/svg%3E");  content: "";
}

.game_remind span { 
  z-index:1; 
  position:relative; 
  display: block; 
  padding: 0.4em 0 0 .625em; 
  height: 2.4em; 
  line-height:1.1em; 
  overflow: hidden; 
  font-weight: 600; 
  font-size: 0.9em; 
  color:var(--remind-txtcolor); 
  vertical-align:middle;
}