
/* ====(((( 個別定義 ))))===== */


/*PC背景*/
@media screen and (min-width:767px){
.bg_deco00 { z-index:-9; position:fixed; top:200px; left:0; width:100%; min-width:1220px; height:100%; background-repeat:repeat-y; background-position:center top; pointer-events:none;}
.bgtop01 { z-index: -8; position:absolute; top:0; left:0; width:100%; min-width:1220px; height:1156px; background-repeat:no-repeat; background-position:center top; }
.bgtop_repeat { z-index:-30; position:absolute; top:0; left:0; width:100%; min-width:1220px; height:100%; background-repeat:repeat-y; background-position:center top; pointer-events:none;}
.bgtop_fixed { z-index:-10; position:fixed; top:0; left:0; width:100%; min-width:1220px; height:100%; background-repeat:no-repeat; background-position:center top; pointer-events:none;}
}

/*mb背景*/
@media screen and ( max-width:767px) {
.m_bg01 { z-index:-1; position:fixed; top:0; left:0; width:100%; height:100%; background-repeat:no-repeat; background-position:center bottom; background-size:100%; }	
}



/*版頭區塊*/
@media screen and (min-width:768px){
.Area_hero {position: relative;aspect-ratio: 960 / 600;overflow: hidden;}
.Area_hero .deco01{position:absolute;top: 120px;left: 430px;width: 100%;z-index:50;pointer-events: none;}

}
 @media screen and (max-width:767px){
.Area_hero {position: relative;aspect-ratio: 960 / 610;overflow: hidden;}
.Area_hero .deco01{position:absolute;top: 12.5vw;left: 91vw;width: 7%;z-index:50;pointer-events: none;}

}


/*版頭-logo*/
.Area_hero-visual_002 .Area_hero--logo {top: 16%;left: 4.5%;width: 50.2%;}


/*版頭-日期*/
.Area_hero-visual_002 .Area_hero--tag {top: 4.9%;left: 50.5%;width: 49.1%;}


/*版頭-主標*/
.Area_hero-visual_002 .Area_hero--title{top: 30%;left: 0%;width: 58%;}


/*版頭-版頭品*/
.Area_hero-visual_002 .Area_hero--PD {position: absolute;top: 11%;right: 1px;width: 55%;}
.Area_hero .Area_swiper_box .PD_layout-heroPDBN.PD_layout {.PD .PD_into {top: 60.5%;left: 17.5%;}}
.Area_hero .Area_swiper_box .PD_layout-heroPDBN.PD_layout {h3, h4 {color: #fff;text-align: left;}}
.Area_hero .Area_swiper_box .PD_layout-heroPDBN.PD_layout {p {color: #ffe562;font-size: 0.6em}}




.Area_pd-grid-4x2[org="1"] .PD_layout ul {border: 5px solid #ffd5b6;}



.Area_group-1 .Area_content {background: url("bgg02.png?t=1788855299724") center top/ 100% repeat-y scroll;}


.Area_bn-grid-1x1[org="2"] .PD_layout[data-pd-li=BN] ul{padding: 0 1.5em;}

/*折價券*/
.PD_layout.PD_layout-coupon3{width: 100%;}
.PD_layout.PD_layout-coupon3 .PD .divine_coupon, .PD_layout.PD_layout-coupon3 .PD .threshold {color: #fff;}
@media screen and (max-width:767px){
.PD_layout.PD_layout-coupon3{width: 96%;padding-bottom: 2vw;}
}

h2:where(.Area_title_lbtclass:not(.Area_boxstyle_title)) { 
    --min-height: calc(var(--font-size) * var(--font-size-scale) * 0);
}

/*下方公版標題調整
.Area_title_lbtclass h3 {position: absolute;top: 14px;}
@media screen and (max-width: 767px) {
.Area_title_lbtclass h3 {top: 1.5vw;}
}*/



/*單獨標題調整
.Area_pd-D3_01[org="1"] .PD_layout-D3_01 .PD h3{top:60%;}*/


/*黏人精*/
.Area_hammerAD {z-index: 9999;position: fixed;bottom: 170px;right: 0;}
.Area_hammerAD .box { position: relative; margin-right: 10px; opacity: 1;}
.Area_hammerAD img { width: 100%; height: auto; position: absolute; top: 0; left: 0;}
.Area_hammerAD .closeButton a { display: block; cursor: pointer; position: absolute; width: 20px; height: 20px; border-radius: 50%; font: bold 20px/1em "Century Gothic"; color: #FFF; text-align: center; background-color: rgba(0%,0%,0%,0.5); text-decoration: none; z-index: 2;}
.Area_hammerAD .Ahammer_text { position: absolute; z-index: 2; display: flex; align-items: center; justify-content: center; width: 90%; color: #000; font-family: "Century Gothic","Noto Sans CJK TC"; font-weight: 700;}
.Area_hammerAD .Ahammer_black .img_0, .Area_hammerAD .img_1 { filter: brightness(0%);}
.Area_hammerAD .Ahammer_black .img_1 { filter: none;}
.Area_hammerAD .Ahammer_black .Ahammer_text { color: #fff;}
@media screen and (min-width:768px){
  .Area_hammerAD { position: fixed; z-index: 300; left: 50%; right: auto; bottom: 50px; display: block; width: 210px; height: 200px; transform: translateX(618px) translate3d(0,200px,0);}
  .Area_hammerAD .closeButton a { top: 0; right: 0;}
  .Area_hammerAD .Ahammer_text { font-size: 2.3em; line-height: 1em; height: 1em; top: 40px;}
}
@media screen and (max-width:767px){
  .Area_hammerAD { display: block; width: 26%; transform: translate3d(0px, -215px, 0px) !important;}
  .Area_hammerAD .closeButton a { top: 1vw; right: 1vw;}
  .Area_hammerAD .Ahammer_text { font-size: 1.5em; line-height: 1.5em; height: 1.5em; top: 3.6vw;}
}

