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

/*基本*/
body{ margin: 0; padding: 0; background-color: #630619;}


/*全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;}
  .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%;}
}


/*背景*/
.bgtop { z-index: 0; position: absolute; top: 0; left: 0; width: 100%; min-width: 1220px; height: 100%; background: url(pctopbg.png?t=1751523739903) no-repeat center top;}
.bgrepeat { z-index: -2; position: absolute; top: 753px; left: 0; width: 100%; min-width: 1220px; height: 100%; background: url(bgrepeat.jpg?t=1751523739903)top center repeat-y; pointer-events: none;}
@media screen and (max-width:767px){
  .bgtop { min-width: inherit;  background: url(mbtopbg.png?t=1751523739903) no-repeat center 44px; background-size: 100%;}
  .bgrepeat {min-width: inherit;position:absolute;top: 139vw;background: url(bgrepeat_m.jpg?t=1751523739903) repeat-y center;background-size: 100%;z-index: -1;}
  .bgrepeatball {min-width: inherit; background: url(mballL.png?t=1751523739903) no-repeat center 44px;background-size: 100%;top: 144vw;position: fixed;height: 100%;width: 101%;}
}


/*線光效果*/
@media screen and (min-width:768px){
.circle-wrp { z-index: 0; position: absolute; top: 346px; left: 206px; width: 65%; height:60px; transform: translateX(-50%); transform: rotate(355deg);}
.circle-wrp .circle {position: absolute;top:0;left: 0;width: 100%;height:60px;border-radius: 50%;border: 2px solid #7f0b22 ;shadow: 4px 0 5px #bf4c4c;}
.circle-light {position: absolute;top: 197px;left: 170px;}
}
@media screen and (max-width:767px){
.circle-wrp { position: absolute; top: 43vw; left: 8%; width: 85%; height: 10vw; transform: translateX(-50%); transform: rotate(355deg);}
.circle-wrp .circle {position: absolute;top:0;left: 0;width: 100%;height: 5vw;border-radius: 50%;border: 1px solid #7f0b22;box-shadow: 5px 0 5px #bf4c4c;}
}


/*mb-金色球動畫*/
@media screen and (max-width:767px){
.Area_top .ball1 { width: 12%; position: absolute; top: 8vw; left: 2vw; pointer-events: none; z-index: 10;}
.Area_top .ball2 { width: 13%; position: absolute; top: 10vw; left: 7vw; pointer-events: none; z-index: 10;}
.Area_top .ball3 { width: 14%; position: absolute; top: 41vw; left: 83vw; pointer-events: none; z-index: 10;}
}


/*版頭區塊*/
@media screen and (min-width:768px){
	.Area_top { height:820px; margin-bottom: 0 !important;}
	.title_01 { width: 58%; position:absolute; top:45px; left:255px; z-index:2;}
	}
@media screen and (max-width:767px){
	.Area_top { overflow:hidden; height:129vw; margin-bottom: 0 !important;}			
	.title_01 { width:92%; position:absolute; top:3vw; left: 4.5vw; z-index:2}
	}


/*版頭輪播品*//*上下標隱藏*/
.Area_topPD { position: relative; z-index: 10;}
.Area_topPD .imgTagBottom { display:none!important;}
.Area_topPD .prdImgWrap .imgTagRectangle { display:none!important;}
.Area_topPD .prdImgWrap .imgTag { display:none!important;} 
@media screen and (min-width: 768px){
.Area_topPD { position: relative; top: 410px; z-index: 10;}
.Area_topPD .PD_layout { width: 86%;margin: 0 auto; z-index: 10;}
}
@media screen and (max-width:767px){
.Area_topPD { position: relative; top:52vw;}
}


/*小標題*/
@media screen and (min-width:768px){
/*登記*/.layoutBG_txt { width: 90%; margin:1% auto 0%; position: relative; top: 20px; z-index: 2;}
/*登記*/.layoutBG_txt img { width: 100%;}
.layoutBG_txt1 { width: 70%; margin: 0 auto; position: relative; z-index: 2;}
.layoutBG_txt1 img{ width: 100%;}
.layoutBG_txt2 { width: 70%; margin: 0 auto; position: relative; z-index: 2;}
.layoutBG_txt2 img{ width: 100%;}
}
@media screen and (max-width:767px){
/*登記*/.layoutBG_txt { width: 100%; margin:0 auto; position: relative; top: 5vw; z-index: 2;}
.layoutBG_txt1{ width: 95%; margin:0 auto; position: relative; z-index: 2;}
.layoutBG_txt2{ width: 95%; margin:0 auto; position: relative; z-index: 2;}
}


/*間距*/
@media screen and (min-width:768px){
.Area_bottom { margin-bottom: 50px; }
.Area_bottom2 { margin-bottom: 30px !important; }
}
@media screen and (max-width:767px){
.Area_bottom { margin-bottom: 6vw; }
.Area_bottom2 { margin-bottom: 8vw !important; }

}


/*登記*/
.Area_alldanji { height: auto;}
.Area_alldanji .box01 { height: auto;}
@media screen and (min-width:768px){
.Area_alldanji .box01 { width: 100%; background: url(danji-pcbg.jpg?t=1751523739903)top center repeat-y; padding: 50px 0px 10px; z-index: 20; }
.Area_alldanji .Area_danji { width: 96%; padding: 0px auto 20px;}
.Area_alldanji .danjiboard { width: 100%; position:relative; bottom: 55px; }
}
@media screen and (max-width:767px){
.Area_alldanji .box01 { width: 94%; background: url(danji-mbbg.jpg?t=1751523739903)top center repeat-y; padding: 8vw 0vw 2vw; margin: 0 auto; z-index: 20; }
.Area_alldanji .Area_danji { width: 94%; padding: 0px auto 8vw;}
.Area_alldanji .danjiboard { width: 114%; position:relative;  right: 7vw; bottom: 5vw; }
}


/*4活動按鈕*/
@media screen and (min-width: 768px){
.Area_4btn .box01 { width: 960px; margin: 0 auto;}
.Area_4btn .PD_layout .PD_wrapper { width: 100%; grid-gap: 25px; margin: 0 auto;}
}
@media screen and (max-width: 767px){
.Area_4btn .box01 { width: 100%; margin: 0 auto;}
.Area_4btn .PD_layout .PD_wrapper { width: 90%; grid-gap: 2vw; margin: 0 auto;}
}


/*8品公版*/
@media screen and (min-width: 768px){
.Area_8pd { height: 968px;}
.Area_8pd .box01 { height: auto; position: absolute; top: 80px; left: 0px; border: 2px solid #d0ab6b; background-color: rgba(52,3,12,0.8); border-radius: 40px; margin: 0 auto; z-index: 1;}
.Area_8pd .PD_layout { width: 96%; padding: 60px 0px 25px; margin: 0 auto; position: relative; z-index: 5}
}
@media screen and (max-width: 767px){
.Area_8pd { height: 280vw;}
.Area_8pd .box01 { height: auto; width: 94%; position: absolute; top: 8vw; left: 2.8vw; border: 1px solid #d0ab6b; background-color: rgba(52,3,12,0.8);border-radius: 20px; margin: 0 auto;}
.Area_8pd .box01 .PD_layout { width: 96%; padding: 9vw 0px 4vw; margin: 0 auto;}
}


/*輪播BN*/
@media screen and (min-width:768px){
.Areabn .PD_layout { height: 252px; overflow: hidden; position: relative; }
.Areabn .box_BN ul { display: flex; padding: 0; grid-gap: 0;}
}
@media screen and (max-width:767px){
.Areabn { width: 94%;}
.Areabn .PD_layout { height: 47vw; overflow: hidden; position: relative; }
.Areabn .box_BN ul { display: flex; padding: 0; grid-gap: 0;}
}


/*作圖區*/
@media screen and (min-width:768px){
.Area03	.PD_layout[data-pd-col-pc=""] ul { padding:0 }
.Area03 { width:1220px; height:auto; position:relative; margin:0 auto; box-sizing:border-box; padding:0 0 0 0;}
	.Area03 .PD_layout{ width: 70%; margin: 0 auto;}
	.Area03 .PD_layout .PD_slide .PD { height: 548px;}
	.Area03 .PD_layout .PD_slide .PD_into { width:100%; position: absolute; top:72px; padding-left:0px; text-align:center;}
	.Area03 .PD_layout .PD_slide .PD_into h3 { font-size:2em; font-weight: bolder; max-height: 1.9em; line-height: 1.3em; color:#fff; padding: 0;}
	.Area03 .PD_layout .PD_slide .PD_into h4 { font-size:1.5em; color:#ffffff; width:100%; top: 80px;}
	.Area03 .PD_layout .PD_slide .PD p { font-size: 1.5em; text-align: center; padding-top:0px; color: #e8c090;}
	.Area03 .PD_layout .PD_slide .PD p del { font-size: 1em; color: #fff;}
	.Area03 .PD_layout .PD_slide .PD p .Price { font-size: 2.3em;}
	.Area03 .PD_layout .PD_slide .PD b { font-size: 1em;}
	.Area03 .PD_layout .PD_slide .PD span { font-size: 1em;}
.Area03 .PD_layout[data-pd-col-pc="3"] li { margin-bottom:50px;}
}
@media screen and (max-width:767px){
.Area03 { width:100%; height:auto; margin:0 auto; margin-bottom:3vw !important; padding:0 0 0 0}
.Area03 .box { width:98%; margin:0 auto;}
.Area03 .PD_layout{ width: 100%;}
.Area03 .PD_layout .PD img { width:100%; height: auto;}	 
.Area03 ul { padding: 0; margin: 0; grid-gap:0px;}
	.Area03 .PD_layout .PD_slide .PD { height: 60vw;}
	.Area03 .PD_layout .PD_slide .PD_into { width:78%; position: absolute; top:2vw; left: 5.5vw; text-align:center;}
	.Area03 .PD_layout .PD_slide .PD_into h3 { font-size:1.2em; font-weight: bolder; max-height: 2em; line-height: 2em; color:#fff; padding: 0;}
	.Area03 .PD_layout .PD_slide .PD_into h4 { font-size: 1em; width:100%; color:#ffffff; padding: 0px;}
	.Area03 .PD_layout .PD_slide .PD p { margin:1vw 0 3vw 0;color:#e8c090;}
	.Area03 .PD_layout .PD_slide .PD p del { display: none;}
	.Area03 .PD_layout .PD_slide .PD p .Price { font-size:2em;}
	.Area03 .PD_layout .PD_slide .PD b { display: none;}
	.Area03 .PD_layout .PD p money { font-size:1.8em;}
.Area03 .PD_layout[data-pd-col-phone="2"] li {margin-bottom:4vw;}		
}


/*5品公版*/
@media screen and (min-width: 768px){
.Area_5pd { height:532px;}
.Area_5pd .box01 { height: auto; position: absolute; top: 80px; left: 0px; border: 2px solid #d0ab6b; background-color: rgba(52,3,12,0.8); border-radius: 40px; margin: 0 auto; z-index: 1;}
.Area_5pd .PD_layout { width: 96%; padding: 60px 0px 25px; margin: 0 auto; position: relative; z-index: 5}
}
@media screen and (max-width: 767px){
.Area_5pd { height: 198vw;}
.Area_5pd .box01 { height: auto; width: 94%; position: absolute; top: 8vw; left: 2.8vw; border: 1px solid #d0ab6b; background-color: rgba(52,3,12,0.8); border-radius: 20px; margin: 0 auto;}
.Area_5pd .box01 .PD_layout { width: 96%; padding: 9vw 0px 4vw; margin: 0 auto;}
}


/*旗艦館*/
@media screen and (min-width:768px){
.Area_BTN { height: 580px;}
.Area_BTN .PD_layout .PD_slide { padding: 15px;}
.Area_BTN .box01 { height: auto; position: absolute; top: 80px; left: 0px; border: 2px solid #d0ab6b; background-color: rgba(52,3,12,0.8); border-radius: 40px; margin: 0 auto;}
.Area_BTN .PD_layout { width: 96%; padding: 60px 0px 10px; margin: 0 auto; position: relative; z-index: 5}
/*新增測試*/.Area_BTN .PD_layout ul li.cate-hover { filter: brightness(1);}
/*新增測試*/.Area_BTN .PD_layout ul li { filter: grayscale(0.9);}
}
@media screen and (max-width:767px){
.Area_BTN { height: 92vw;}
.Area_BTN .PD_layout .PD_slide { padding: 1.6vw;}
.Area_BTN .box01 { height: auto; width: 94%; position: absolute; top: 8vw; left: 2.8vw; border: 1px solid #d0ab6b; background-color: rgba(52,3,12,0.8);border-radius: 20px; margin: 0 auto;}
.Area_BTN .box01 .PD_layout { width: 96%; padding: 8vw 0px 1vw; margin: 0 auto;}
}




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


/*移除公版設定*/
.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: rgba(0,0,0,0.00);}
.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;}
}