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

/*基本*/
body{ margin: 0; padding: 0;}

/*隱鑶*/
.for_pc {}
.for_phone, .for_m { display:none !important;}
    @media screen and (max-width:767px){
      .for_pc { display:none !important;}
      .for_phone, .for_m { display: inherit !important;}
    }

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

/*區塊_all*/
.Area { position: relative; margin: 0 auto; padding: 0; border-radius: 0; text-align: center; }
.Area a { display: block;} 
.Area .go_bt {
  -webkit-transition: all 0.4s ease;
     -moz-transition: all 0.4s ease;
      -ms-transition: all 0.4s ease;
       -o-transition: all 0.4s ease;
          transition: all 0.4s ease;}
.Area .go_bt:hover {
  -webkit-transform: scale(0.95);
     -moz-transform: scale(0.95);
      -ms-transform: scale(0.95);
       -o-transform: scale(0.95);
          transform: scale(0.95);}
.Area1220 { margin: 0 auto; width: 1220px;}
.Area960 { margin: 0 auto; width: 960px;}
@media screen and (max-width:767px){
  .Area .go_bt:hover {  
    -webkit-transform: none;
     -moz-transform: none;
      -ms-transform: none;
       -o-transform: none;
          transform: none;}

  .Area1220 { width: 100%;}
  .Area960 { width: 100%;}
}



/*間距*/
.Area_bottom { margin-bottom:100px!important; }
@media screen and (max-width:767px){
  .Area_bottom { margin-bottom: 10vw!important; }
}


/*公版框*/
.box_repeat { }
@media screen and (max-width:767px){
  .box_top img { vertical-align: bottom;}
}



/*移除公版設定*/
.Area .remove_box_style ul { background-color: transparent; grid-gap: 10px;}
.Area .remove_box_style ul li { border: none!important;}
@media screen and (max-width:767px){
  .Area .remove_box_style ul { width: 100%; grid-gap: 0.2em;}
  .Area .remove_box_style ul {}
}
/*輪播移除公版設定*/
.Area .swiper_remove_box_style ul { background-color: transparent; grid-gap: 0;}
.Area .swiper_remove_box_style ul li { border: none!important; background-color: #fff;}
.Area .swiper_remove_box_style ul li,
.Area .swiper_remove_box_style ul li .PD_img img { border-radius: 10px;}
@media screen and (max-width:767px){
  .Area .swiper_remove_box_style ul { width: 100%; grid-gap: 0.2em;}
  .Area .swiper_remove_box_style ul {}
}

/*3品公版間距*/
.Area .PD_layout-add2cart ul { padding: 20px;}

@media screen and (max-width:767px){
  .Area .PD_layout-add2cart ul { padding: 0.2em 0;}
  .Area .PD_layout-add2cart ul li { padding: 0.2em;}
}
/*新公版設定*/
.PD_layout ul {
    flex-wrap: wrap;
    align-items: stretch;
    border-radius: 15px;  

}
 .PD_layout[data-pd-col-pc="3"] ul {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

 .PD_layout[data-pd-col-pc="2"] ul {
        grid-template-columns: repeat(2, minmax(0, 1fr))!important;
    }



/*背景*/
.bgtop { z-index:0; position:absolute;top:0;left:0;width:100%;height:100%;background: url(bgtop.jpg?t=1753085853935) no-repeat center top; pointer-events:none;}
.bgrepeat { z-index:-1; position:absolute; top:0; left:0; width:100%; min-width:1220px; height:100%; background: none; background-position:center top;background-color: #f5f5f5; }
.bgdeco { z-index:0; position:absolute;top:100px;left:0;width:100%;height:100%;background: url(bg_deco.png?t=1753085853935) repeat-y center top; pointer-events:none;}
@media screen and (max-width:767px){
.bgtop { min-width: inherit; top: -11vw; background: url(mbgtop.jpg?t=1753085853935) no-repeat center 44px; background-size: 100%;}
.bgrepeat {min-width: inherit;position:absolute;top: 136vw;background:none;background-size: 100%;z-index:0;}	
}



/*線上標題*/
.Area_txt { height: 120px; }
.Area_txt::before { content: ""; position: absolute; display: block; top: 0 ; left: 130px ; width: 960px ; height: 100%; background: url(mArea_txt.png?t=1753085853935) center top / 100% no-repeat scroll; z-index: 1; pointer-events: none; }	
.Area_txt ul {padding: 0;margin: 0;list-style: none;height:100%!important;}
.Area_txt ul li { background-color: transparent; pointer-events: none;}
.Area_txt ul li h5 {position: relative;z-index: 1;font: 900 55px/55px "微軟正黑體","Microsoft JhengHei",Helvetica;float: left;color:#022f86;width: 100%;margin: 0 auto;padding: 25px 0 0 0;}	
.Area_txt .PD_slide { padding: 0 ; border-radius: 0!important ; border:none ; background-image: none; background-color:transparent;}
.Area_txt .PD_layout .PD_slide {background-color:transparent!important;min-width: 100%;}
@media screen and (max-width:767px){
.Area_txt { height: 13vw; }
.Area_txt::before { content: ""; position: absolute; display: block; top: 0 ; left: 0; width: 100%; height: 100%; background: url(mArea_txt.png?t=1753085853935) center top / 100% no-repeat scroll; z-index: 1; pointer-events: none; }	
.Area_txt ul {margin-top: 0 ;list-style: none;}
.Area_txt ul li { background-color: transparent; pointer-events: none;}
.Area_txt ul li h5 {position: relative;top:2vw;margin: 0vw;padding: 0vw;font: 6vw/6vw "微軟正黑體","Microsoft JhengHei",Helvetica;font-weight: bolder;text-align: center;color:#02378f;letter-spacing: 0vw;overflow: hidden;/*text-shadow: 0px 0px 5px #000;*/}	
.Area_txt .PD_slide { padding: 0 ;border-radius: 0!important;border:none;background-image: none;background-color:transparent;}
.Area_txt .PD_layout .PD_slide {background-color:transparent!important;min-width: 100%;}

}


/*線上標題2*/
.layout_text::before { content: ""; position: absolute; display: block; top: 20px ; left: 130px ; width: 960px ; height: 100%; background: url(layout_text.png?t=1753085853935) center top / 100% no-repeat scroll; z-index: 1; pointer-events: none; }	
.layout_text ul {padding: 0;margin: 0;list-style: none;height:100%!important;}
.layout_text ul li { background-color: transparent; pointer-events: none;}
.layout_text ul li h5 {position: relative;z-index: 1;font: 900 55px/55px "微軟正黑體","Microsoft JhengHei",Helvetica;float: left;color:#fff;width: 100%;margin: 0 auto; padding: 0; top: 45px ; }	
.layout_text .PD_slide { padding: 0 ; border-radius: 0!important;border:none; background-image: none; background-color:transparent; }
.layout_text .PD_layout .PD_slide {background-color:transparent!important;min-width: 100%;}

@media screen and (max-width:767px){
.layout_text::before { content: ""; position: absolute; display: block; top: 0 ; left: 0; width: 100%; height: 100%; background: url(layout_text.png?t=1753085853935) center top / 100% no-repeat scroll; z-index: 1; pointer-events: none; }	
.layout_text ul {margin-top: 0vw;list-style: none;}
.layout_text ul li { background-color: transparent; pointer-events: none;}
.layout_text ul li h5 { position: relative; top: 2vw ; margin: 0 ; padding: 0 ; font: 6vw/6vw "微軟正黑體","Microsoft JhengHei",Helvetica ; font-weight: bolder; text-align: center; color:#fff; letter-spacing: 0 ;overflow: hidden; }	
.layout_text .PD_slide {padding: 0 ;border-radius: 0!important;border:none;background-image: none;background-color:transparent;}
.layout_text .PD_layout .PD_slide {background-color:transparent!important;min-width: 100%;}
}



/* 版頭 */
@media screen and (min-width:767px){
.Area_top { position: relative; height: 960px ; z-index: 30; }
.title_light {z-index: 99;position:absolute;left:-88px;top: 165px;mix-blend-mode:overlay;pointer-events:none;width: 830px;}
.light {mix-blend-mode: screen }

/*日期*/	
.Area_top .topPD .TIMER_DAY {position:absolute;top:405px;left:694px;z-index:90!important;display:block;font-size:46px;font-weight:bolder;color: #ffffff!important;letter-spacing:0;font-family:Century Gothic;text-align:center;color: #8c1f1f!important;    width: 20%;}
.Area_top .topPD .TIMER_DAY small {font-size:25px;line-height:5px; margin-left:10px;}
.Area_top .topPD .TIMER_DAY #sendMonth {width: 13px;text-align: center;display: inline-block;}
.Area_top .topPD .TIMER_DAY #sendToday {width: 69px;margin-left: -10px;text-align: center;display: inline-block;}

	
/*主標*/
.Area_top .toptitle { width:60% ; left:5px ; top:40px ; z-index: 50; }	
	
/*副標*/
.Area_top .main_titile {position: absolute; z-index:51; top:288px; left:211px; width:704px;height:180px;overflow:hidden;}
.Area_top .main_titile .lbtclass  ul { padding-bottom: 30px !important; height:300px !important;list-style: none;}
.Area_top .main_titile .Area_boxstyle_pagination{top:433px;}
.Area_top .main_titile .PD_layout2 ul li img {  width:117%;}
	
/*公版上下標隱藏*/	
.Area_top .Toppd .imgTagBottom {display:none!important;}
.Area_top .Toppd .prdImgWrap .imgTagRectangle {display:none!important;}
.Area_top .Toppd .prdImgWrap .imgTag {display:none!important;} 
	
 /*pd*/
.Area_top .Toppd{ width:100%; margin:0 auto;  overflow:hidden; z-index: 9; height: 569px; position:relative;left:292px;top:193px;}
.Area_top .Toppd .PD_layout .PD h3 {font-size: 20px; font-weight: 800;}
.Area_top .Toppd .PD_layout .PD h4 {margin-bottom: 0.35em;font-size: 20px;}
.Area_top .Toppd .PD_layout .PD p .Price { font-size:33px;max-height: 1.5em;  }
.Area_top .Toppd .PD_layout .PD p { height:2.5em!important;  }
  
/*公版調整*/
.Area_top .Toppd.Area_01 .box ul.PD_wrapper { padding: 0 0 50px;}
.Area_top .Toppd.Area_01 .box ul.PD_wrapper li{ width:710px!important; margin: 0; padding: 0;}
	
	
}
@media screen and (max-width:768px){
.Area_top { height: 150vw ; }
.Area_top .PD_layout[data-pd-btn*="icon-4"][data-pd-btn-pdgo] .PD .PD_btn {bottom: -1.5em; right: -0.5em;display: none; }
  	
	
/*主標*/
.Area_top .toptitle { width:85%; left: 0 ; top: 3vw ; z-index: 50; }
.title_light{position:absolute;left:2vw;top:0vw;z-index:30;width:36%;animation-delay:.8s;}
.Area_top .deco {width: 100%;position: relative; left: 0;top:-42vw;z-index:-1;}	
	
/*副標*/
.Area_top .main_titile {position: absolute; top:28.7vw; width:100%;left:3vw;z-index:50;height: 20vw;}
.Area_top .main_titile .PD_layout2 {    position: absolute;top:3vw;left:-8vw;width: 100%;height:25vw;overflow: hidden;}
.Area_top .main_titile .PD_layout2 ul li img {  width:97%;}
.Area_top .main_titile .lbtclass  ul { height:42vw !important;list-style:none!important;}
.Area_top .main_titile .Area_boxstyle_pagination{top: 55vw;}
	
	
/*公版上下標隱藏*/	
.Area_top .Toppd .imgTagBottom {display:none!important;}
.Area_top .Toppd .prdImgWrap .imgTagRectangle {display:none!important;}
.Area_top .Toppd .prdImgWrap .imgTag {display:none!important;} 
	
/*日期*/	
.Area_top .topPD .TIMER_DAY {position:relative;top:36vw;left:64vw;z-index:99!important;display:block;font-size:1.6em;font-weight:bolder;color: #ffffff;letter-spacing:0;font-family:Century Gothic;text-align:center;width:20%;}
.Area_top .topPD .TIMER_DAY small {font-size: 1.2em;line-height:5px;margin-left:-10px;}
.Area_top .topPD .TIMER_DAY #sendMonth { width:26px; text-align: center;display: inline-block;}
.Area_top .topPD .TIMER_DAY #sendToday {width:22px;  margin-left:-1vw; text-align: center;display: inline-block;}

 /*pd*/
.Area_top .Toppd{ width:100%; margin:0 auto;  overflow:hidden; z-index: 9; height: auto; position:relative;left:0;top:23vw;}
.Area_top .Toppd .PD_layout .PD h3 {font-size:1em; font-weight: 800;}
.Area_top .Toppd .PD_layout .PD h4 {margin-bottom: 0.35em;font-size:1em;}
.Area_top .Toppd .PD_layout .PD p .Price { font-size:1.5em;max-height:1.5em;  }
.Area_top .Toppd .PD_layout[data-pd-h3="5"] .PD h3 span {display: inline-block;padding: 0 0.5em;  max-width:100%;  border-radius: 4px;color: #000;background-color: rgba(218, 218, 218, 0.9);}
	
/*公版調整*/
  .Area_top .Toppd.Area_01 .box { width: 96%;}
  .Area_top .Toppd.Area_01 .box ul.PD_wrapper { padding: 0 0 10vw;}
  .Area_top .Toppd.Area_01 .box ul.PD_wrapper li{  width:92vw; margin: 0; padding: 0;}
  .Area_top .Toppd.Area_01 .PD_layout .PD .Price{ font-size:24px; }
  .Area_top .Toppd.Area_01 .PD_layout .PD p b, .Area_01 .PD_layout .PD p del, .Area_01 .PD_layout .PD p .money{ font-size:14px; }
}


/*7品版頭品*/
.Area_PD1 ul{display: flex!important}
@media screen and (min-width:768px){
	.Area_PD1{ position: relative; top: 100px ; }
}
@media screen and (max-width:767px){
	.Area_PD1{ position: relative; top: 8vw ; }
}



/*隱鑶*/
.for_pc {}
.for_phone { display: none !important;}
	@media screen and (max-width:767px){
		.for_pc {display: none !important;}
		.for_phone { display: inherit !important;}
	}

  


/*注意事項區*/
.edm_notice{ text-align:center; padding:10px 10px 15px 10px; color:#000 ; font:12px/18px Helvetica;}
.edm_notice .apple_notice{  padding:10px 0px 10px 0px; }




/* 活動 */
@media screen and (min-width:768px){
  .Area_active .layout_active { width: 75%; }
  .Area_active .layout_active ul { grid-gap: 1em ; }
}
@media screen and (max-width:767px){
	.Area_active .layout_active { width: 96%; }
  .Area_active .layout_active ul { grid-gap: .5em ; }
}



/* 下方公版 */
@media screen and (min-width:768px){
	.Area_4pdb .layout_4pdb { background-image: url(pc_layout_bg.png?t=1753085853935); background-size: 100% ; background-repeat: repeat-y ; padding: 70px 40px 50px ; border-radius: 20px; }
}
@media screen and (max-width:767px){
	.Area_4pdb .layout_4pdb { background-image: url(mb_layout_bg.png?t=1753085853935); background-size: 100% ; background-repeat: repeat-y ; padding: 7vw 0 5vw 0 ; border-radius: 2vw ; margin-top: -3vw; }
}




/* 館連結 */
@media screen and (min-width:768px){
  .Area_guan .layout_guan { width: 80%; }
  .Area_guan .layout_guan ul { grid-gap: 0 1em ; }
}
@media screen and (max-width:767px){
	.Area_guan .layout_guan { width: 96%; }
  .Area_guan .layout_guan ul { grid-gap: 0 .5em ; }
}




