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


/*背景*/
@media screen and (min-width:768px){
  .bg_01 { z-index:-46; position:absolute; top:0; left:0; width:100%; height:100%; background-repeat:no-repeat; background-position: center top; pointer-events:none;}
  }
  @media screen and (max-width:767px){
  .m_bg { z-index: 0; position: absolute; top: 10.5vw; left: 0; width: 100%; height: 100%; background-repeat: no-repeat; background-position: center top; pointer-events:none; background-size: 100%;}
  }




  /*版頭區塊*/
  @media screen and (min-width:768px){
    .Area_top {height: 385px;}
  }
    @media screen and (max-width:767px){
    .Area_top {height: 43vw;}
    .Area_top .mb_01{position:absolute; top:0; left:0 ;width: 100%; z-index:0;}
    }
  
  
  /*版頭主標微調*/
  .title01{z-index: 0;position: absolute;}
  .title01 .PD_layout .PD img { width:100%!important; }
  .title01 .PD_layout .PD a { pointer-events: none; }
  .title01 .PD_layout .PD_slide:hover {transform: translateY(0); }
  .title01 .PD_layout .PD_slide {min-width: 100%;}
  @media screen and (min-width: 768px){
  .title01 {top: 0px;left: 70px;width: 80%;}
  }
  @media screen and (max-width:767px){
  .title01{width: 100%; }
  .title01 ul{ padding: 0!important; }
  .title01 .PD_layout {position: relative;top: 0vw;left: -8vw;width: 107%;}
  .title01 .PD_layout .PD img { width: 100%!important; }
  }
  
  
  
  /*副標輪播*/
  .Area_top .topPD2 {position: absolute;top: 200px;left: 385px;width:432px;height: 188px;overflow: hidden;z-index: 21;}
  .Area_top .topPD2 ul.PD_wrapper { display: flex; flex-wrap: nowrap; margin: 0; padding: 0; width: 100%; box-sizing: content-box; grid-gap: inherit;}
  .Area_top .topPD2 ul.PD_wrapper li { flex-shrink: 0; margin: 0; padding: 0; opacity: 0; transform: translate(5%,0);}
  .Area_top .topPD2 ul.PD_wrapper li.swiper-slide-active { opacity: 1; transition: .8s ease-out; transform: translate(0,0);}
  @media screen and (min-width: 768px){
    .Area_top .topPD2 ul.PD_wrapper li img{width: 100%;}
  }
  
  @media screen and (max-width:767px){
    .Area_top .topPD2 {width: 86%;height: 18vw;position: absolute;top: 23.7vw;left: 7vw;overflow: hidden;}
    .Area_top .topPD2 ul.PD_wrapper li img{width: 62%;}
  }
  



/*版頭公版*/
@media screen and (min-width: 768px){
  .Area00 {
    padding-bottom: 30px;
}
  .Area00 .layout_PD {width: 82%;z-index: 3;padding-bottom: 22px;}
  .Area00 .layout_logo {width: 86%;}
  .Area00 .warningTxt h3 {font: 20px/20px "Noto Sans CJK SC";font-weight: 700;color: #ffffff;padding-top: 10px;}
  }
  @media screen and (max-width: 767px){
    .Area00 {padding-bottom: 1vw;}
    .Area00 .layout_PD {width: 93%;z-index: 3;padding-bottom: 2.5vw;}
    .Area00 .warningTxt h3 {font: 3vw/4vw "Noto Sans CJK SC";font-weight: 700;color: #ffffff;padding-top: 1vw;}
  }  




/*活動倒數*/
.TimerNick2 {display:inline-block;height: 57px;z-index:99;font-weight: 700;width: 55%;text-align:center;position: relative;/* background-color: #fff; */border-radius: 50px;padding: 0% 0 0%;margin: 0 0 5px;}
.TimerNick2 .FontStyle2 {display: inline-block;margin: 0 0 0 2px;padding: 0;border: 0;font: bold 40px/30px Arial;color: #ffe79a;border-radius:5px;letter-spacing: 0px;text-align: center;}
.TimerNick2 span {padding-left: 2px;font: 400 37px/48px "微軟正黑體","Microsoft JhengHei", Arial, Helvetica;letter-spacing: -0em;color: #ffffff;}
@media screen and (max-width:767px){
.TimerNick2 {width: 73%;height:5vw;background-size:100%;transform: scale(0.85);padding: 2% 0 1%;margin: 0 0 0vw;}
.TimerNick2 .FontStyle2 {margin: 0;padding: 0;border: 0;font: bold 5vw/5vw Arial;}
.TimerNick2 span {padding-left:0;font: normal 5vw/5vw "微軟正黑體","Microsoft JhengHei", Arial, Helvetica;letter-spacing: -0.05em;}
}



  @media screen and (min-width:768px){
    .PD_layout.layout_PD01{ width: 97%;}
    }
    @media screen and (max-width:767px){
    .PD_layout.layout_PD01{ width: 100%;} 
    }