@charset "utf-8";
/* CSS Document */
/*
 * Ghvzon
 * 共用元件 js_link-v3.1
 *******************************************************************
 *  --2019.04.03--修改上傳圖片路徑設定9~16行(v3.1)
 *******************************************************************
 */


  /*基本*/
html, body { background-color:#b81b6d;}
  @media screen and (max-width:767px){
    html, body { background-color:#b81b6d; }
  }


/*全BOX版面*/
.WRAPPER { z-index:0; position: relative; display:block; margin: 0 auto; padding:0; overflow:hidden; width:100%; min-width:1220px; text-align:left; font-family:"微軟正黑體","Microsoft JhengHei",Helvetica;}
.WRAPPER img { border:0px; vertical-align:top;}
.WRAPPER a { text-decoration:none; -webkit-tap-highlight-color: transparent;}
  @media screen and (max-width:767px){
    .WRAPPER { min-width: inherit; min-height:100%;/*overflow:visible;*/}
    .WRAPPER img { width:100%; height:auto;}
  }


/*PC背景*/
.Area_bgtop { z-index:-40; position:absolute; top:0; left:50%; width:2000px; -webkit-transform:translateX(-50%); transform:translateX(-50%); pointer-events: none; }
.Area_bgtop .bgtop_  { position:absolute; top:0; left:0; width:100%; height:1000px;}
.Area_bgtop .bgtop_  span { position:absolute; display: block; width:100%; height:100%; background-position:center top;}


/*Phone背景*/
.m_Area_bgtop { z-index:-40; position:absolute; top:0; left:0; width:100%; height:100%; pointer-events: none;}
.m_Area_bgtop .m_bgtop_  { position:absolute; top:0; left:0; width:100%; height:0; padding-bottom:100%;}
.m_Area_bgtop .m_bgtop_  span { position:absolute; display: block; width:100%; height:0; padding-bottom:100%; overflow:hidden; background-position:center top; background-size:100%;}


/*版頭*/
.Area_top {z-index: 999;}
.Area_top .go_bt:hover { filter: brightness(110%);
  -webkit-transform:none;
   -moz-transform:none;
    -ms-transform:none;
     -o-transform:none;
      transform:none;}
.Area_top > .box { }
  @media screen and (max-width:767px){
    .Area_top { }
    .Area_top > .box { }
  }
    /*主標*/
    .Area_top .box_title { }
    /*按鈕btn*/
    .Area_top .btn_ { z-index:5; position:absolute; top:70px; right:10px;}
    .Area_top .btn_ a { display:block;}
    .Area_top .btn_ a:after { content:""; display:block; z-index:1; position:absolute; top:0; left:0; width:100%; height:100%; background-size: auto 100%; background-repeat:no-repeat; background-position: 100% center; pointer-events: none;}
      @media screen and (max-width:767px){
        .Area_top .btn_ { top: 4vw; right: 1%;}
      }
      /*CSS樣式*/
      .Area_top .btn_ a { display:block; border-radius:100px; font-weight:800;      
          /*box-shadow: inset 0 20px 15px -17px rgba(247, 156, 112, 0.35), inset -2px 2px 2px 1px rgba(57, 19, 10, 1), inset 0 0 1px 2px rgba(57, 19, 10, .5), inset 0 1px 20px rgba(0,0,0,0), 0 3px 0 #421303, 0 3px 2px rgba(0,0,0,.2), 0 5px 10px rgba(0,0,0,.1), 0 10px 20px rgba(0,0,0,.1)*/;
      }
        @media screen and (max-width:767px){
            .Area_top .btn_ { top: 4vw; right: 1%;}
            .Area_top .btn_ a { padding: 0 4vw; font-size:5vw; line-height:1.7; }
        }


	/*共用--區塊背景*/
	.Area_boxstyle {}
      @media screen and (min-width:768px){
          .Area_boxstyle > .Area_boxstyle_box { padding-bottom: 40px;}
      }
      @media screen and (max-width:767px){
          .Area_boxstyle > .Area_boxstyle_box { margin: 0 auto; width: 100%;}
          .Area_boxstyle > .Area_boxstyle_box1 { margin: 0 auto; padding: 1vw 1% 0; width: 100%;}
          .Area_boxstyle > .Area_boxstyle_box2 { margin: 0 auto; width: 100%;}
          .Area_boxstyle > .Area_boxstyle_box3 { margin: 0 auto; padding: 1vw 1% 0; width: 100%;}
          .Area_boxstyle > .Area_boxstyle_box0 { margin: 0 auto; width: 100%;}
      }
      /*底圖*/
      .Area_boxstyle > .Area_boxstyle_box { position:relative; background-repeat: no-repeat; background-position: center bottom; box-sizing: border-box;}
      .Area_boxstyle > .Area_boxstyle_box:before { content:""; display:block; z-index:-1; position:absolute; left:0; width:100%; background-repeat: no-repeat; background-position: center bottom;}
      .Area_boxstyle > .Area_boxstyle_box:after  { content:""; display:block; z-index:0; position:absolute; top:0; left:0; width:100%; height:100%; background-repeat: no-repeat; background-position: center top;}
      .Area_boxstyle > .Area_boxstyle_box > .Area_boxstyle_boxbg,
      .Area_boxstyle > .Area_boxstyle_box > .Area_boxstyle_boxbg:before,
      .Area_boxstyle > .Area_boxstyle_box > .Area_boxstyle_boxbg:after  { background-size: 100%;}

          /*圖片模式*/
                @media screen and (min-width:768px){
                .Area_boxstyle > .Area_boxstyle_box { padding-top: 0px; padding-bottom: 30px;}
                .Area_boxstyle > .Area_boxstyle_box { }
                .Area_boxstyle > .Area_boxstyle_box:before { }
                .Area_boxstyle > .Area_boxstyle_box:after  { }   
                .Area_boxstyle > .Area_boxstyle_box1:before { top: -210px; height: 210px;}
                .Area_boxstyle > .Area_boxstyle_box1:after { z-index: -1; top: 0; height: calc(100% - 30px); background-repeat: repeat-y;}
                .Area_boxstyle > .Area_boxstyle_box1 { background-image:url(Area_boxstyle_bottom1.png?t=1748417368569); }
                .Area_boxstyle > .Area_boxstyle_box1:before { background-image:url(Area_boxstyle_top1.png?t=1748417368569);}
                .Area_boxstyle > .Area_boxstyle_box1:after  { background-image:url(Area_boxstyle_center1.png?t=1748417368569);}
                .Area_boxstyle > .Area_boxstyle_box0 { padding-top: 0; padding-bottom: 0;}
                .Area_boxstyle > .Area_boxstyle_box0:before { display: none;}
                .Area_boxstyle > .Area_boxstyle_box0:after { display: none;}
                .Area_boxstyle > .Area_boxstyle_box0 { background-image: none;}
                .Area_boxstyle > .Area_boxstyle_box0:before { background-image: none;}
                .Area_boxstyle > .Area_boxstyle_box0:after  { background-image: none;}
                /*第2層背景*/
                .Area_boxstyle > .Area_boxstyle_box > .Area_boxstyle_boxbg { z-index: -2; position: absolute;top: -72px;left: 17px;/* border-radius: 50px; */width: 1186px;height: calc(100% - -51px);background-repeat: repeat-y;}
                .Area_boxstyle > .Area_boxstyle_box > .Area_boxstyle_boxbg { background-image:repeating-linear-gradient(180deg, #940607 0%, #360000 100%); opacity: 0.8;}
                }
                 @media screen and (max-width:767px){
                .Area_boxstyle > .Area_boxstyle_box,
                .Area_boxstyle > .Area_boxstyle_box:before,
                .Area_boxstyle > .Area_boxstyle_box:after  { background-size: 100%;}
                .Area_boxstyle > .Area_boxstyle_box { padding-top: 0vw; padding-bottom: 5vw; }
                .Area_boxstyle > .Area_boxstyle_box:before {  top: -22.5vw;  height: 23vw;}
                .Area_boxstyle > .Area_boxstyle_box:after { z-index: -1; top: 0; height: calc(100% - 5vw); background-repeat: repeat-y;}
                .Area_boxstyle > .Area_boxstyle_box1 { background-image: url(Area_boxstyle_bottom1.png?t=1748417368569);}
                .Area_boxstyle > .Area_boxstyle_box1:before { background-image: url(Area_boxstyle_top1.png?t=1748417368569);}
                .Area_boxstyle > .Area_boxstyle_box1:after  { background-image: url(Area_boxstyle_center1.png?t=1748417368569);}
                .Area_boxstyle > .Area_boxstyle_box0 { padding-top: 0; padding-bottom: 0;}
                .Area_boxstyle > .Area_boxstyle_box0:before { display: none;}
                .Area_boxstyle > .Area_boxstyle_box0:after { display: none;}
                .Area_boxstyle > .Area_boxstyle_box0 { background-image: none;}
                .Area_boxstyle > .Area_boxstyle_box0:before { background-image: none;}
                .Area_boxstyle > .Area_boxstyle_box0:after  { background-image: none;}
                 /*第2層背景*/
                .Area_boxstyle > .Area_boxstyle_box > .Area_boxstyle_boxbg,
                .Area_boxstyle > .Area_boxstyle_box > .Area_boxstyle_boxbg:before,
                .Area_boxstyle > .Area_boxstyle_box > .Area_boxstyle_boxbg:after  { background-size: 100%;}
                .Area_boxstyle > .Area_boxstyle_box > .Area_boxstyle_boxbg { z-index: -2; position: absolute; top: -8vw; left: 3%; width: 94%; height: calc(100% + 5vw); background-repeat: repeat-y;}
                .Area_boxstyle > .Area_boxstyle_box > .Area_boxstyle_boxbg {background-image:repeating-linear-gradient(180deg, #940607 0%, #360000 100%); opacity: 0.8;}
              }




/* 自訂義 */
@media screen and (max-width: 768px) {
  .Area960 { width: 96%; }
  .Areabottom { margin-bottom: 0; }
}
.Area_logo { display: none !important }
.hero { margin-bottom: 80px; }
.Area_boxstyle > .Area_boxstyle_box1:before { background-size: contain; }
.Area_boxstyle > .Area_boxstyle_box1 { background-size: contain; }

/*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;}
    .Area_bgtop_1 .bgtop_1_1 span { background-image: url(bgtop_1_1.jpg?t=1748417368569);}
    .Area_bgtop_1 .bgtop_1_2 span { background-image: url(bgtop_1_2.png?t=1748417368569);}
  }
/*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=1748417368569);}

/*背景fixed擋到logo修正*/
.Area_header_momologo {  z-index: 1;}    

/*每時段名額*/
.Area_grabmoney_NUM {}
.Area_grabmoney_NUM .Area960 { padding: 15px 0 30px;}
    @media screen and (max-width:767px){
      .Area_grabmoney_NUM .Area960 { padding: 2.8vw 0 1vw;}
    }

.Area_top .btn_ a { display:block; padding:1px 20px; font-weight:800; font-size:25px; height: 45px; line-height:30px; color:#fff; background:url(btn_more_bg.png?t=1748417368569) no-repeat center top; background-size: 100%; text-shadow: 0 2px 0 rgba(0,0,0,.4); border-radius: 0; transition: .2s;}
.Area_top .btn_ a:after { content:""; display:block; z-index:1; position:absolute; top:0; left:0; width:100%; height:100%; background-size: auto 100%; background-repeat:no-repeat; background-position: 100% center; pointer-events: none;}
.Area_top .btn_:hover a { -webkit-transform:translateY(-6px); -moz-transform:translateY(-6px); -ms-transform:translateY(-6px); -o-transform:translateY(-6px); transform:translateY(-6px); }
  @media screen and (max-width:767px){
    .Area_top .btn_ { top: 4vw; right: 15vw;}
    .Area_top .btn_ a { padding: 0 5vw 0 3vw; border-width:0.4vw; font-size:5vw; line-height: 7vw;}
    .Area_top .btn_2n a { padding: 0px 6vw 0 3vw;}
    .Area_top .btn_:hover a { -webkit-transform:none; -moz-transform:none; -ms-transform:none; -o-transform:none; transform:none; }
  }
