@charset "utf-8";
/* --------------------------------------
 * pageGameRWDLayout RWD分頁用 2021/11/04 21:00(正式)
 * -------------------------------------- */
/* .articleList img.lazy_off { background-image: none!important;} */
/*基本*/
html, body {  font-size: inherit; }
    @media screen and (max-width:767px){
      html, body {  font-size: inherit; }
    }

.WRAPPER { overflow: hidden; }

/*PC選單*/
/* .cantantBase1 { display: none;}
.cantantBase2 { display: block;}
 */
/*圖片模式*/
@media screen and (min-width:768px){
  .Area960.Area_boxstyle > .Area_boxstyle_box0 { padding: 0;}
  /* .Area960.Area_boxstyle > .Area_boxstyle_box1 { padding: 60px 0;}
  .Area960.Area_boxstyle > .Area_boxstyle_box2 { padding: 186px 0 70px;} */
  .Area960.Area_boxstyle > .Area_boxstyle_box10 { z-index: -2; background-image: none; padding: 140px 0 0;}
  .Area960.Area_boxstyle > .Area_boxstyle_box10:before { background-image:url(m_Area_boxstyle_top10.png?t=1751623026283); height: 105px; top: 20px;}
  .Area960.Area_boxstyle > .Area_boxstyle_box10:after  { background-image: none;} 
  .Area960.Area_boxstyle > h2 { text-shadow: 0 0 black;} 
}
@media screen and (max-width:767px){
  .Area960.Area_boxstyle > .Area_boxstyle_box0 { padding: 0;}
  /* .Area960.Area_boxstyle > .Area_boxstyle_box1 { padding: 6vw 0;}
  .Area960.Area_boxstyle > .Area_boxstyle_box2 { padding: 21vw 0 7vw;} */
  .Area960.Area_boxstyle > .Area_boxstyle_box10 { z-index: -2; background-image: none; padding-left: 0; padding-right: 0;}
  .Area960.Area_boxstyle > .Area_boxstyle_box10:before { background-image:url(m_Area_boxstyle_top10.png?t=1751623026283); height: 11vw; top: 2vw;}
  .Area960.Area_boxstyle > .Area_boxstyle_box10:after  { background-image: none;} 
  /* .Area960.Area_boxstyle > h2 { text-shadow: 0 0 black;}  */
  /* .Area_PD .PD_layout ul { padding-left: 1em; padding-right: 1em;} */
}

/*預載vue框架首屏骨架*/
.Area_SkeletonScreen { opacity: 1; pointer-events: none; z-index: -99; position: relative; transition: opacity 0.4s;}
    .v-SkeletonScreen .Area_SkeletonScreen { z-index: 10; opacity: 1; display: block; }  
    .v-loaded         .Area_SkeletonScreen { z-index: 10; opacity: 0; display: block; position: absolute; left: 50%; transform: translateX(-50%); transition: opacity 0.4s;}  
    /* .v-loaded .Area_SkeletonScreen { opacity: 1; mix-blend-mode: luminosity; }   */
    .Area_SkeletonScreen > .box { margin: 0 !important; padding: 0 !important;}
    .Area_SkeletonScreen .SkeletonScreen { position: relative; margin: 0 auto;}
    .Area_SkeletonScreen .SkeletonScreen .box { position: relative; width: 100%; height: 0; padding-bottom: 200%;}
    .Area_SkeletonScreen .SkeletonScreen svg { position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
    .Area_SkeletonScreen .SkeletonScreen svg #linearGradient stop { 
      mix-blend-mode: soft-light;  
      stop-color:hsl(5, 100%, 85%); stop-opacity:0.5;
      animation: skeleton-loading 0.5s linear infinite alternate;
    }
    .Area_SkeletonScreen .SkeletonScreen svg #linearGradient stop:nth-of-type(1) { animation-delay: -4s;}
    .Area_SkeletonScreen .SkeletonScreen svg #linearGradient stop:nth-of-type(2) { animation-delay: -0.3s;}
    .Area_SkeletonScreen .SkeletonScreen svg #linearGradient stop:nth-of-type(3) { animation-delay: -0.2s;}
    .Area_SkeletonScreen .SkeletonScreen svg #linearGradient stop:nth-of-type(4) { animation-delay: -0.1s;}
    .Area_SkeletonScreen .SkeletonScreen svg #linearGradient stop:nth-of-type(5) { animation-delay: 0s;}
        @keyframes skeleton-loading { 
          0%   { stop-color:hsl(5, 100%, 85%); stop-opacity:0.5;}
          100% { stop-color:hsl(5,  20%, 95%); stop-opacity:0.5;}
        }
        @media screen and (min-width:768px){
          .Area_SkeletonScreen .SkeletonScreen { width: 100%;}
        }
        @media screen and (max-width:767px){
          .Area_SkeletonScreen .SkeletonScreen { width: 100%;}
        }

/* --------------------------------------
 * Page 機制頁共用樣式
 * -------------------------------------- */ 
.Area_GameStyle { color: #714247; font-family: "Century Gothic","Microsoft JhengHei"; font-size: 16px;}
.Area_GameStyle h3 { margin: 0; padding: 0;}
.Area_GameStyle strong { color: #bd7666;}
.Area_GameStyle b      { color: #bd7666;}
.Area_GameStyle small  { font-size: 0.875em;}
.Area_GameStyle .money { position: relative; top: -0.05em; font-size: 0.8em;}
.Area_GameStyle .Price { font-size: 1.2em; font-weight: 800;}
    @media screen and (min-width:768px){
      .Area_GameStyle h3 { font-size: 2.4em;}
    }
    @media screen and (max-width:767px){
      .Area_GameStyle h3 { font-size: 1.125em; }
    }
    /*獲得*/
    .Area_GameStyle .earn { display: inline-block;width: 42%; margin: 0.5em auto; padding: 0.5em 1em 0.7em; border-radius: 0.45em; color: #fff; box-shadow: inset -0.1em -0.1em 0.3em rgba(0,0,0,0.5); background: rgba(0,0,0,0.5);}
    .Area_GameStyle .earn .Price { font-size: 1.5em; }
        @media screen and (min-width:768px){
          .Area_GameStyle .earn { font-size: 2.2em;}
        }
        @media screen and (max-width:767px){
          .Area_GameStyle .earn { font-size: 1em; width: 50%; }
        }
    /*btn*/
    .Area_GameStyle .btn { margin: 0.5em auto; width: 40%; }
    /*判斷顯示隱藏*/
    .Area_GameStyle .is_if span { display: block;}
    .Area_GameStyle .is_if .end { display: none;}
    .Area_GameStyle .is_if .on  { display: none;}
        /*切換*/
        .Area_GameStyle .is_end .off { display: none;}
        .Area_GameStyle .is_end .end { display: block;}
        .Area_GameStyle .is_on  .off { display: none;}
        .Area_GameStyle .is_on  .on  { display: block;}
    /*表格*/
    .Area_GameStyle .box_table { margin: 0 auto; }
    .Area_GameStyle .box_table table { margin: 0 auto ; border-radius: 10px; overflow: hidden; border-collapse: collapse ; width: 100%; box-shadow: 0 0.1em 0.25em rgba(7,31,28,1);}
    .Area_GameStyle .box_table table { font-weight: 300; font-size: 1em; text-align: center; line-height: 1.2;}
    .Area_GameStyle .box_table th { padding: 0.6em 0.4em; color: #fff; background-color:#d24b41; }
    .Area_GameStyle .box_table td { padding: 0.6em 0.4em; color: #432717 ; border-right: dashed 1px #ffc4bd; border-bottom: solid 1px #ffc4bd; background-color: #fff;}
    .Area_GameStyle .box_table tr:first-child td { border-top: none;}
    .Area_GameStyle .box_table tr td:first-child { border-left: none}
    .Area_GameStyle .box_table tr td:last-child { border-right: none;color: #ba0000;}
    .Area_GameStyle .box_table td p { margin: 0; padding: 0;}
    .Area_GameStyle .box_table td a { color: #942a0e;}
        @media screen and (min-width:768px){
          .Area_GameStyle .box_table table { font-size: 1.5em;}
        }
        @media screen and (max-width:767px){
          .Area_GameStyle .box_table table { font-size: 0.875em; }
        }


/*活動說明*/
.Area_GameStyle .box_list { text-align: justify;}
.Area_GameStyle .box_list h3 { font-size: 1.25em; margin-bottom: 0.25em;}
.Area_GameStyle .box_list ol { margin: 0; padding: 0; padding-left: 1em;}
.Area_GameStyle .box_list ul { margin: 0; padding: 0; list-style: none;}
.Area_GameStyle .box_list li { margin: 0; padding: 0; margin-bottom: 0.75em;}
.Area_GameStyle .box_list li img { margin: 0.2em 0; width: 70%; max-width: 480px; box-shadow: 0em 0.3em 1.5em rgba(0,0,0,0.1);}
    @media screen and (min-width:768px){
      .Area_GameStyle .box_list { font-size: 1.5em; padding: 0 8%;}
    }
    @media screen and (max-width:767px){
      .Area_GameStyle .box_list { font-size: 0.875em; padding: 0 8%;}
    }
    /*li樣式(自定樣式) (1) (2) (3) */
    .Area_GameStyle .box_list .counter_increment_num { list-style:none;}
    .Area_GameStyle .box_list .counter_increment_num li { counter-increment: num; text-indent:-1.5rem;}
    .Area_GameStyle .box_list .counter_increment_num li:before { content: "(" counter(num) ") " ;}


/*登記區塊*/
.Area_grabgift .box_grabgift { position: relative; margin: 0.5em auto; width: 88%;}
    /*贈品介紹*/
    .Area_grabgift .box_grabgift .grabgift_img { position: relative;}
    .Area_grabgift .box_grabgift .grabgift_img img { width: 100%; height: auto; filter: drop-shadow(0.3em 0.3em 0.2em rgba(231,66,61,0.4));}
    .Area_grabgift .box_grabgift .grabgift_img .grabgift_img_more { z-index: 1; position: absolute; top: 9%; left: 5%; width: 42%; height: 0; padding-bottom: 47%;}
    .Area_grabgift .box_grabgift .grabgift_img .grabgift_img_more a { position: absolute; top: 0; left: 0; display: block; width: 100%; height: 100%;}
    /*按鈕*/
    .Area_grabgift .box_grabgift .grabgift_btn { position: absolute; top: 53%; left: 50%; width: 35%; }
    /*文案*/
    .Area_grabgift .box_grabgift .grabgift_txt   { position: absolute; left: 49.5%; letter-spacing: -0.04rem; text-align: left;}
    .Area_grabgift .box_grabgift .grabgift_cpNum { top: 75%; color: #fff;}
    .Area_grabgift .box_grabgift .grabgift_cpNum span { letter-spacing: 0;}
    .Area_grabgift .box_grabgift .grabgift_time  { top: 84.5%; color: #942a0e;}
        @media screen and (min-width:768px){
          .Area_grabgift .box_grabgift .grabgift_txt { font-size: 28px;}
        } 
        @media screen and (max-width:767px){
          .Area_grabgift .box_grabgift .grabgift_txt { font-size: 3vw;}
        } 
    /*活動說明*/
    .Area_grabgift .box_list { margin-top: 1em;}
    .Area_grabgift .box_list a { display: inline; text-decoration: underline; color: #942a0e;}


/*浮層--加價購商品介紹*/
.agreeArea .box {border-radius: 10px;background-color: #fff; overflow: hidden;-webkit-box-shadow: none;}
.agreeArea .box_title { padding: 5% 5% 0; font-weight: 800; line-height: 1; text-align: center;}
.agreeArea .box_title b { position: relative; display: block;}
.agreeArea .box_title span { z-index: 1; position: relative; display: inline-block; padding: 0 0.5em; background-color: #fff;}
.agreeArea .box_title b:before { content: ""; position: absolute; bottom: -0.55em; display: block; width: 100%; height: 1px; background-color: #000;}
.agreeArea .box_title img { width: 35%;}
.agreeArea .box_sub { text-align: center;}
.agreeArea .box_derails { padding: 0 5%; font-weight: 800;}
.agreeArea .box_derails dt { margin: 0; margin-top: 0.8em; padding: 0.5em 0; border-top: 1px solid #000; text-align: center;}
.agreeArea .box_derails dd { margin: 0; padding: 0; color: #9d9d9d; line-height: 1.2;}
.agreeArea .box_derails dd ul { margin: 0; padding: 0; padding-left: 2em;}
.agreeArea .box_derails dd li img { margin: 0.2em 0; width: 70%; max-width: 480px; box-shadow: 0em 0.3em 1.5em rgba(0,0,0,0.1);}
.agreeArea .box_derails .txt_into { color: #5a5958;}
.agreeArea .box_derails .txt_spec ul { padding-left: 1em; list-style: none;}
.agreeArea .box_derails .txt_note ul { list-style: decimal; }
        @media screen and (min-width:768px){
          .agreeArea .box_title { font-size: 40px; }
          .agreeArea .box_title span { font-size: 34px;}
		      .agreeArea .box_sub { font-size: 18px; line-height: 30px; margin: 22px 0 10px; padding: 0 5%}
          .agreeArea .box_derails { font-size: 30px;}
          .agreeArea .box_derails dd { font-size: 26px;}
        }
        @media screen and (max-width:767px){
          .agreeArea .box_title { font-size: 1.2rem; }
          .agreeArea .box_title span { font-size: 1.25rem;}
		      .agreeArea .box_sub { font-size: 1rem; line-height: 1.5rem; margin: 0.5rem 0 0.5rem; padding: 0 10% ;}
          .agreeArea .box_derails { font-size: 1.25rem;}
          .agreeArea .box_derails dd { font-size: 1.1rem;}
        }

    
/*特殊--1區有2個登記btn區塊*/
/* .Area_grabgift .box_grabgift .box_btn_ { position: absolute; left: 44%; width: 60%; }
.Area_grabgift .box_grabgift .box_btn_ .btn { position: relative; width: 62%;}
.Area_grabgift .box_grabgift .box_btn_ .txt_cpNum { position: absolute; top: 10%; left: 64%; width: 45%; font-size: 28px; font-weight: 300; line-height: 2; color: #323232; letter-spacing: -0.01rem; text-align: left;}
.Area_grabgift .box_grabgift .box_btn_1 { top: 68%;}
.Area_grabgift .box_grabgift .box_btn_2 { top: 77%;}
    @media screen and (max-width:767px){
      .Area_grabgift .box_grabgift .box_btn_ .txt_cpNum { font-size: 2.8vw; transform: scale(0.85); transform-origin: left center;}
    } */
/*安全文字*/

/* .Area_msg { color:rgb(255, 204, 174) !important;} */