
/*背景*/
@media screen and (min-width:768px){
  .bg_fix {z-index: -1;position:absolute;top: 0;left:0;width:100%;height: 100%;background-repeat:no-repeat;background-position: center top;pointer-events:none;}
  .bg_01 {z-index: -1;position:absolute;top: 1046px;left: 0;width:100%;height: 100%;background-repeat:repeat-y;background-position: center top;pointer-events:none;}
  .bg_deco {z-index: -2;position:fixed;top: 500px;left:0;width:100%;height:100%;background-position:center 0px;background-repeat:repeat-y;transition:0.5s linear;pointer-events:none;}
  }
@media screen and (max-width:767px){
  .m_bg_fix {z-index: -40;position:absolute;top: 10vw;left:0;width:100%;height:100%;background-repeat:no-repeat;background-position: center top;pointer-events:none;background-size: 100%;}
  /* .WRAPPER {margin-bottom: 0;min-width: inherit;min-height: 100vh;overflow: hidden;padding-bottom: 0; background-image: url("m_bg.jpg?t=1786582424516");background-repeat:repeat-y;background-size:100%;} */
  .WRAPPER img {  width:100%;  height:auto; }
}



/*區背景*/
.Area .bg, .Area .bg_btom{ position: absolute;pointer-events: none;z-index:0; }
@media screen and (min-width: 768px){
  .Area .bg, .Area .bg_btom{ left: 50%; transform: translateX(-50%); width: 2000px;}
  .AreaPD01:before{ left: 50%; transform: translateX(-50%); }

  .Area_group-2 .bg {top:-355px;left: 50%; z-index: -1;}	
  /* .AreaPD01 .bg_btom {bottom:-41px;}	
  .AreaPD01:before{ content:''; width: 2000px; height: 82%; background:url(AreaPD01_center.png?t=1786582424516) repeat-y center / 100%; position: absolute; top: 155px;}  */
}

@media screen and (max-width:767px){
  .Area_group-2 .bg {top:-4vw;left:0;width:100%; z-index: -1;}	
  /* .AreaPD01 .bg_btom {bottom:-3vw;left:0;width:100%; }	
  .AreaPD01:before{ content:''; width: 100%; height: 83%; background:url(mAreaPD01_center.png?t=1786582424516) repeat-y center / 100%; position: absolute; top: 21vw; left: 0;} */
}

/*版頭*/
.AreaTop ul { padding: 0!important; }
@media screen and (min-width: 768px){
  .AreaTop ul { width: 741px!important; }
}


/*版頭頁籤*/
.hero .top_txt  { z-index: 12; width: 1220px;margin:0 auto !important; }
.hero .top_txt .PD_layout-D1_03 ul::before { display: none; }
.hero .top_txt .PD_layout ul li { position: relative; background-color: transparent;  display: block; }
.hero .top_txt .PD_layout ul li::after{ content: ""; height: 32px; width: 1px; background-color: #eddbb6; position: absolute; left: 2px; top: 7px;  }
.hero .top_txt .PD_layout-D1_03 ul::after{ content: ""; height: 32px; width: 1px; background-color: #eddbb6; position: absolute; right: 103px; top: 7px;  }
.hero .top_txt .PD_layout-D1_03 .PD h3:hover {  color: #ffffff; }
.hero .top_txt .PD_layout-D1_03.PD_layout ul {  grid-template-columns: repeat(4, 250px); padding:0 0; justify-content: center;}
.hero .top_txt .PD_layout-D1_03[data-pd-style=off] .PD_into {  padding: 0 0.2em; }
.hero .top_txt .PD_layout-D1_03 .PD h3 { color: #eddbb6; font-weight: 400;}
.hero .top_txt .PD_layout-D1_03 .PD h3 span::before { display: none; }
@media screen and (max-width: 767px){
    .hero .top_txt  { width: 100%; }
    .hero .top_txt .PD_layout-D1_03 .PD h3 {  font-size: 0.9em }   
    .hero .top_txt .PD_layout-D1_03.PD_layout ul {  grid-template-columns: repeat(4, 24vw);padding:0; }
    .hero .top_txt .PD_layout ul li::after{ content: ""; height: 0.9em; width: 1px; background-color: #eddbb6; position: absolute; left: -2px; top: 7px;  }
    .hero .top_txt .PD_layout ul li:first-child::after{ display: none;  }
    .hero .top_txt .PD_layout-D1_03 ul::after{ display: none;  }
}


/*區標隱藏*/
.Area_title{ height: 0; min-height: 0; }


/*關掉ul的padding*/
.nopa ul{ padding: 0!important; }


/*輪播固定高度*/
.Area_bn-carousel01 ul{ height: 480px; }
@media screen and (max-width:767px){
  .Area_bn-carousel01 ul{ height: 50vw; }
}


/*調整ul的gap*/
.Area_group-1 .Area_bn-grid-3x1 ul{ grid-gap:15px!important; }
@media screen and (max-width:767px){
  .Area_group-1 .Area_bn-grid-3x1 ul{ grid-gap:1vw!important; }
}

.pedal ul{ height: 322px; }
@media screen and (max-width:767px){
  .pedal ul{ height: 43vw; }
}


/*主打區*/
.Area_group-2 .Area_bn-grid-3x1 li:hover{ z-index: 0; }
@media screen and (min-width: 768px){
  .Area_group-2 { margin-bottom: -920px;}
  .Area_group-2 .Area_bn-grid-3x1 li:nth-child(1){ position: relative; top: -111px; }
  .Area_group-2 .Area_bn-grid-3x1 li:nth-child(2){ position: relative; top: -287px; }
  .Area_group-2 .Area_bn-grid-3x1 li:nth-child(3){ position: relative; top: -487px; }
  .Area_group-2 .Area_bn-grid-3x1 li:nth-child(4){ position: relative; top: -678px; }
  .Area_group-2 .Area_bn-grid-3x1 li:nth-child(5){ position: relative; top: -858px; }
}
@media screen and (max-width:767px){
  .Area_group-2 { margin-bottom: -88vw;}
  .Area_group-2 .Area_bn-grid-3x1 li:nth-child(1){ position: relative; top: -10vw; }
  .Area_group-2 .Area_bn-grid-3x1 li:nth-child(2){ position: relative; top: -27vw }
  .Area_group-2 .Area_bn-grid-3x1 li:nth-child(3){ position: relative; top: -46vw }
  .Area_group-2 .Area_bn-grid-3x1 li:nth-child(4){ position: relative; top: -66vw }
  .Area_group-2 .Area_bn-grid-3x1 li:nth-child(5){ position: relative; top: -82vw }
}


/*調整ul的gap*/
.Area_group-3 .Area_bn-grid-3x1 ul{ grid-gap:20px!important; }
@media screen and (max-width:767px){
  .Area_group-3 .Area_bn-grid-3x1 ul{ grid-gap:2vw!important; }
}


/*直影片*/
.youtubeDiv{ display: block!important; }
@media screen and (min-width:768px){
  .youtube_reel { height:auto ; }
  .youtube_reel .box { display: flex;  flex-wrap: nowrap;  width: 95%;  margin: auto;  grid-gap: 20px;}
  .youtube_reel .box_youtube { width: 450px; height: 789px; border-radius: 20px ; margin: 0 auto ; overflow: hidden }
  }
@media screen and (max-width:767px){
  .youtube_reel {width: 100%;}   
  .youtube_reel .box {  display: flex; flex-wrap: nowrap; width: 100%; width: 96%; margin: auto;  grid-gap: 2vw;}
  .youtube_reel .box_youtube { width: 47vw; height: 83vw; border-radius: 3vw; margin-bottom:2vw ; overflow: hidden } 
}  


/*橫影片*/
.Area_youtube-video .youtubeArea { overflow: hidden; border-radius: 20px; }
@media screen and (max-width:767px){
  .Area_youtube-video .youtubeArea { border-radius: 3vw; }
}
