@charset "utf-8";


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


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


/*共用--區塊_all*/
.Area { z-index: 1; position: relative; margin: 0 auto; padding: 0; border-radius: 0;}
.Area a { position: relative; 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: none; -moz-transform: none; -ms-transform: none; -o-transform: none; transform: none; filter: brightness(110%);}
@media screen and (min-width:768px){
  .Area .go_bt:hover { -webkit-transform:translateY(-6px); -moz-transform:translateY(-6px); -ms-transform:translateY(-6px); -o-transform:translateY(-6px); transform:translateY(-6px);}
}
/*寬度,間距*/
.Area1220 { margin: 0 auto; width: 100%;}
.Area960 { margin: 0 auto; width: 100%;}
@media screen and (min-width:768px){
  .Area1220 { width: 1220px;}
  .Area960 { width: 960px;}
}


/*PC背景*/
@media screen and (min-width:768px){
  .Area_bgtop { pointer-events: none;}
  .Area_bgtop span { background-repeat: no-repeat;}
  .Area_bgtop .bgtop_ { position: fixed; top: 0; left: 0; width: 100%; height: 100%;}
  .Area_bgtop .bgtop_ span { position: absolute; display: block; width: 100%; height: 100%; background-position: center top;}
	.Area_bgtop_1 .bgtop_ { z-index: 0; height: 1210px; overflow: hidden;}
	.Area_bgtop_1 .bgtop_1_1 span { background-image: url(bgtop_1_1.jpg?t=1765421120224);}
}

/*Phone背景*/
@media screen and (max-width:767px){
  .m_Area_bgtop { pointer-events: none;}
  .m_Area_bgtop span { background-repeat: no-repeat;}
  .m_Area_bgtop .m_bgtop_ { position: absolute; top: -8vw; left: 0; width: 100%; height: 100%; padding-bottom: 0;}
  .m_Area_bgtop .m_bgtop_ span { position: absolute; display: block; width: 100%; height: 100%; padding-bottom: 100%; overflow: hidden; background-position: center top; background-size: 100%;}
  .m_Area_bgtop_1 .m_bgtop_1_1 span { position: absolute; top: 44px; left: 0; width: 100%; height:100%; background: url(m_bgtop_1.jpg?t=1765421120224) center top no-repeat; background-size: 100%;}
}



/*版頭*/
.Area_top .title { z-index: 2; position: relative;}
@media screen and (min-width:768px){
  .Area_top { height: 320px; top: -15px;}
  .Area_top .box_PD img { width: 100%; height: auto;}
  /*加文案*/
  /* .Area_top .warningTxt { position: absolute; bottom: 56px; left:47%; transform: translateX(-47.7%);}
  .Area_top .warningTxt h3 { font-size: 23px; font-weight: 600; color: #fef3de;} */
}
@media screen and (max-width:767px){
  .Area_top .title { top: -2vw;}
  .Area_top { padding-bottom: 9vw;}
  /*加文案*/
  /* .Area_top .warningTxt { position: absolute; bottom: 10.5vw; left: 50%; transform: translateX(-48%); width: 100%;}
  .Area_top .warningTxt h3 { font-size: 0.85rem; font-weight: 600; color: #fef3de;} */
}
/*副標輪播*/
.Area_top .box_PD { z-index: 3; position: absolute; top: 215px; left: 0; width: 100%;}
.Area_top .box_PD .subBG { position: absolute; top: 0; left: -33px; width: 110%;}
.Area_top .box_PD .Area_swiper { margin: 0; padding: 0;}
.Area_top .box_PD .Area_swiper_box { padding-bottom: 0;}
.Area_top .box_PD .Area_swiper ul { margin: 0 auto; padding: 0;}
.Area_top .box_PD .Area_swiper li { list-style: none;}
  @media screen and (max-width:767px){
    .Area_top .box_PD { position: absolute; top: 20vw; left:0; width: 100%; height: auto;}
    .Area_top .box_PD .Area_swiper ul { margin: 0;}
    .Area_top .box_PD .subBG { position: absolute; top: 0; left: 0; width: 100%;}
  }


/*01-3顆*/
.Area01 .PD_layout ul { margin: 0 auto; width: 78%; grid-gap: 2%;}


/*02-訂閱方案表格*/
.box_txt .PD_layout .PD_into { padding: 0;}
.box_txt .PD_layout ul { padding: 0;}
@media screen and (min-width: 768px){
  .Area02 { margin-top: 80px; margin-bottom: 80px;}
  .box_txt { position: absolute; z-index: 5; top: 15px; padding: 0; width: 100%; height: auto;}
  .box_txt ul li h5 { padding: 0; margin: 0; font: bold 47px / 47px "Noto Sans CJK SC", "Microsoft JhengHei", Arial, Helvetica; color: #503219; text-shadow: -1px 1px #fff5e6;; letter-spacing: 0; text-align: center;}	
  .A02_table{margin-bottom: 50px;}
}
@media screen and (max-width:767px){	
  .Area02 { margin-top: 6vw; margin-bottom: 6vw;}
  .box_txt { position: absolute; z-index: 5; top: 1.8vw; margin: 0 auto; width: 100%; height: auto;}
  .box_txt ul li h5 { font: bold 5vw / 5vw "Noto Sans CJK SC"; margin: 0; color: #503219; text-shadow: -0.5px 0.5px #fff5e6; letter-spacing: -.05em; text-align: center;}	
  .A02_table{margin-bottom: 5vw;}

}


/*03-頁籤*/
.Area03 .A03_box a { position: relative;}
.Area03 .A03_box .swiper-wrapper .swiper-slide { margin: 0; padding: 10px 0;}
.A03_page .Area_swiper .Area_swiper_box li { background: transparent;}
.A03_page a { pointer-events: none;}
.A03_swiper { overflow: hidden;}
.A03_more { z-index: 50;}
@media screen and (min-width:768px){
  .Area03 { margin-bottom: 80px;}
  .Area03 .A03_more { position: absolute; bottom: 6%; padding: 0 35%; width: 30%;}
}
@media screen and (max-width: 767px){
  .Area03 { margin-bottom: 8vw;}
  .Area03 .A03_more { position: absolute; bottom: 6%; padding: 0 33%; width: 34%;}
}
/*PC－tab頁籤及背景*/
@media screen and (min-width: 768px){
  .Area03 .A03_box .PD_tag { display: flex; width: 100%; margin-bottom: 30px;}
  /*取消公用素材預設的tab*/
  .Area03 .A03_box .PD_tag .go_bt { filter: unset;}
  .Area03 .A03_box .PD_tag .go_bt:hover { transform: unset;}
  .Area03 .A03_box .PD_tag img { width: 100%;}
  /*選中的頁籤切換*/
  .Area03 .A03_box .PD_tag a.cate-hover::after { content: ""; position: absolute; top: 2px; left: 50%; width: 100%; z-index: 100; transform: translateX(-50%); aspect-ratio: 480 / 116;}
  .Area03 .A03_box .PD_tag a:nth-child(1).cate-hover::after { background: url(A03_p1_on.png?t=1765421120224) no-repeat top / 100%;}
  .Area03 .A03_box .PD_tag a:nth-child(2).cate-hover::after { background: url(A03_p2_on.png?t=1765421120224) no-repeat top / 100%;}
}
/*MB－tab頁籤及背景*/
@media screen and (max-width: 767px){
  .Area03 .A03_box .PD_tag { display: flex; width: 100%;margin: 0 0 1vw 0vw;  }
  /*取消公用素材預設的tab*/
  .Area03 .A03_box .PD_tag .go_bt { filter: unset;}
  .Area03 .A03_box .PD_tag .go_bt:hover { transform: unset;}
  .Area03 .A03_box .PD_tag img { width: 100%;}
  /*選中的頁籤切換*/
  .Area03 .A03_box .PD_tag a.cate-hover::after { content: ""; position: absolute; top: 1px; left: 50%; width: 100%; z-index: 100; transform: translateX(-50%); aspect-ratio: 480 / 116;}
  .Area03 .A03_box .PD_tag a:nth-child(1).cate-hover::after { background: url(A03_p1_on.png?t=1765421120224) no-repeat top / 100%;}
  .Area03 .A03_box .PD_tag a:nth-child(2).cate-hover::after { background: url(A03_p2_on.png?t=1765421120224) no-repeat top / 100%;}
  /*背景*/
  .A03_swiper { background: url(A03_mbg.png?t=1765421120224) center bottom / 100% no-repeat;} 
}


/*可拖移廣告icon*/
/* .Area_hammerAD { z-index: 300; display: none; position: fixed; bottom: 0; right: 5px;}
.Area_hammerAD .box { position: relative; margin-right: 10px; opacity: 1;}
.Area_hammerAD img { width: 100%; height: auto;}
.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;}
@media screen and (min-width:768px){
  .Area_hammerAD { position: fixed; z-index: 300; bottom: inherit; top: 385px; right: inherit; left: 5px; display: block; width: 210px; height:200px;}
  .Area_hammerAD .closeButton a { top: 0; right: 0;}
  .Area_hammerAD_phone { display: none;}
}
@media screen and (max-width:767px){
  .Area_hammerAD { display: block; width: 26%; bottom: -10px;}
  .Area_hammerAD .closeButton a { top: 1vw; right: 1vw;}
}
@media screen and (min-width:1670px){
  .Area_hammerAD { right: inherit; left: 50%; transform: translateX(-836px);}
} */


/*注意事項區*/
.edm_notice { position: relative; margin: 30px auto; text-align:center; padding: 10px 10px 15px 10px; color: #e4d1ad; font: 12px/18px Helvetica;}
.edm_notice .apple_notice { padding: 10px 0px 10px 0px;}
@media screen and (max-width:767px){
  .edm_notice { position: relative; margin: 0 ; text-align: center; padding: 10px 10px 15px 10px; color:#e4d1ad; font: 12px/18px Helvetica;}
}


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