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




/*PC背景*/
@media screen and (min-width:767px){
.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:repeat-y; background-position:center top; background-size:100%; }	
}*/



.momo_logo_super{position: absolute;top:25px;left: 30px;}
.momo_logo_super img{width:85%;}
 @media screen and (max-width:767px){
.momo_logo_super{position: absolute;top: 3vw;left: 2vw;width: 29.5%;z-index: 1;}

}


/*版頭區塊*/
@media screen and (min-width:768px){
.Area_hero {position: relative;aspect-ratio: 960 / 620;overflow: hidden;}
}
 @media screen and (max-width:767px){
.Area_hero {position: relative;aspect-ratio: 960 / 640;overflow: hidden;}
.Area_hero .mb_01{position:absolute; top:0; left:0 ;width: 100%; z-index:0;}
}

.Area_hero .Area_swiper_box .PD_layout-heroPDBN.PD_layout {& .PD:hover {h4 { color: #fff; }}}


/*版頭-logo*/
.Area_hero--logo {top: 15%;left: 0%;width: 56%;}
@media screen and (max-width:767px){
.Area_hero--logo{top: 13.5%;left: 0%;width: 58%;}
 }


.Area_hero--tag {top: 3.7%;left: 49.5%;width: 50%;}
@media screen and (max-width:767px){
.Area_hero--tag{top: 2.4vw;left: 50vw;width: 50%;}
 }
/*版頭-主標tltle*/
.Area_hero--title{top: 184px;left: 3px;width: 63%;}
@media screen and (max-width:767px){
.Area_hero--title{top: 19vw;left: 0vw;width: 64%;}
 }
 

/*版頭商品微調*/
.Area_hero--PD {position: absolute;top: 10px;right: 37px;width: 100%;}
.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}}
@media screen and (max-width:767px){
 .Area_hero--PD {position: absolute;top: 1vw;right: 4vw;width: 100%;} 
 .Area_hero .Area_swiper_box .PD_layout-heroPDBN.PD_layout {.PD .PD_into {top: 60.5%;left: 17.5%;}}

 }


/*倒數計時
@media screen and (min-width: 768px) {
 .Area_hero--TimerNick {top: 830px;left: 570px;font-size: 33px;}
}
@media screen and (max-width:767px){
 .Area_hero--TimerNick {top: 87.5vw;left: 45vw;font-size: 3.5vw;z-index: 99;}
}*/


/*折價券*/
.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;}
}



/*線上作圖
@media screen and (min-width: 768px) {
.PD_layout-CSSBG_01.PD_layout-CSSBG_01 .PD .PD_img {padding-top: 0;}*/
/*文案
.PD_layout-CSSBG_01.PD_layout .PD_into{position: absolute;top: 16%;left: 23%;}
.PD_layout-CSSBG_01.PD_layout .PD h3 {margin-bottom: 11.5em;font-size: 30px;}
.PD_layout-CSSBG_01 .PD p .Price {font-size: 50px;line-height: 0.9em;}
}
.PD_layout-CSSBG_01.PD_layout .PD h3 span {color: #fff;background-color: rgba(218, 218, 218, 0);}
.PD_layout-CSSBG_01.PD_layout .PD h4 {color: #fff;}
.PD_layout-CSSBG_01.PD_layout .PD p del{color: #bcbcbc;}
.PD_layout-CSSBG_01.PD_layout .PD p{color: #fff; }*/


/*@media screen and (max-width: 767px) {
圖片
.PD_layout-CSSBG_01.PD_layout-CSSBG_01 .PD .PD_img {padding-top: 0;}*/
/*文案
.PD_layout-CSSBG_01.PD_layout .PD_into{position: absolute;top: 15%;left: 12%;}
.PD_layout-CSSBG_01.PD_layout .PD h3 {margin-bottom: 7.6em;font-size: 18px;}
.PD_layout-CSSBG_01 .PD p .Price {font-size:28px;line-height: 0.9em;}
}*/

/* :nth-of-type(odd)
:nth-of-type(even) */


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


@media screen and (min-width:768px){
.Area_bn-grid-1x1[org="3"] .PD_layout[data-pd-li="BN"] ul{width:75%;}

}


/*黏人精*/
.Area_hammerAD { z-index: 9999; position: fixed; bottom: 0; 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: 200px; 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;}
}
