@charset "utf-8";
/*基本*/
@media screen and (min-width:768px){
body {margin: 0; padding:0;background-color: #fff;}
}
@media screen and (max-width:767px){
body{margin: 0; padding:0;background-color: #b91e28;}
}




/*全BOX版面*/
.WRAPPER { position: relative;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;  display:inline-block;}
.WRAPPER .Area_top{position: relative; }
.WRAPPER .mainArea { position:relative; display:block; margin:0 auto; padding: 0; width:1220px;}
	@media screen and (max-width:767px){
		.WRAPPER { padding-bottom:0px; margin:0 auto; display: block; min-width:100%;z-index: 0;}
		.WRAPPER .mainArea { position:relative; display:block; margin:0 auto; padding: 0; width:100%;  }
	}

/*區塊_all*/
.Area { position: relative; margin:0 auto; padding:0; text-align:center;  }
.Area .box_bg{position:absolute;top:0;left: 0;z-index: 0;} 
.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 img{ width:100%;}
	.Area { position: relative;}

	}


/*Appletxt*/
.apple_txt{ position: relative;margin:30px auto; color:#000;font-size: 12px; text-align: center;}
@media screen and (max-width:767px){
.apple_txt{position: relative;margin:0 0 0 0;padding: 3% 4% 3% 4%; color:#000;height: 30vw;}
}


/*隱鑶*/
.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;}
	}


/**延遲載圖用**/
.mainArea .articleList * img.lazy {display:none;} 

/*分享浮層*/
.floatBox { position:relative; margin:2% auto; padding: 2% 0; width: 700px; height:auto; background-color:rgba(0,0,0,0.8); text-align:center;  border-radius:20px;}
.floatBox img { width:100%; height:auto;}
.floatBox .go_bt {
  -webkit-transition: all 0.2s ease;
	 -moz-transition: all 0.2s ease;
	  -ms-transition: all 0.2s ease;
	   -o-transition: all 0.2s ease;
		  transition: all 0.2s ease;}
.floatBox .go_bt:hover { filter: brightness(120%);
  -webkit-transform:translateY(-6px);
	 -moz-transform:translateY(-6px);
	  -ms-transform:translateY(-6px);
	   -o-transform:translateY(-6px);
		  transform:translateY(-6px);}
.floatBox .closeButton a { display:block; cursor:pointer; position:absolute; top:-20px; right:-20px; width:40px; height:40px; border-radius:50%; border:solid 2px #999999; font:bold 40px/1em "Century Gothic"; color:#FFF; text-align:center; background-color:rgba(0%,0%,0%,0.5);text-decoration: none; z-index:2}
.floatBox .closeButton:hover {background-color:#666; text-decoration:none;}
.floatBox .title  { display:inline-block; margin:0 0 10px 0; border-bottom:1px solid #ffd800; font:bold 45px/1.5em "微軟正黑體","Microsoft JhengHei", Arial, Helvetica;letter-spacing: -0.05em;  color:#ffd800; text-align:center}
.floatBox .box_ { margin:0 auto; width:90%;}
.floatBox .box_:after { content: ""; display:block; clear:both;}
.floatBox .box_btn { margin:20px auto 0; width: 80%;}
.floatBox .box_btn a { display:block; margin:3% 0;}
.floatBox .box_btn img { width:100%;}
.floatBox .box_btn .btn { margin:0 auto; width:60%;}
.floatBox .box_btn2 a { float:left; margin:0 1%; width:48%;}
	@media screen and (max-width:767px){
		.floatBox { padding:5% 0; width:90%; height: auto;}
		.floatBox .closeButton a {display:block; position:absolute; top:-15px; right:-15px; width:30px; height:30px; border-radius:50%; border:solid 2px #999999; font:bold 30px/1em "Century Gothic"; color:#FFF; text-align:center; background-color:rgba(0%,0%,0%,0.5);text-decoration: none; z-index:2}
		.floatBox .closeButton:hover {background-color:#666; text-decoration:none}
		.floatBox .title  { margin:0 5% 3vw; font-size: 6vw; line-height:2rem;}
		.floatBox .box_btn { margin:2% auto 0;}
		.floatBox .box_btn .btn { margin:0 auto; width:80%;}
	}

/* 背景 */
@media screen and (min-width:768px){
	.top_bg{z-index: 0;position: absolute;top: 0;left: 0;height: 100%;width: 100%;min-width: 1220px;background-repeat: no-repeat;background-position: center top;pointer-events: none;}
	.top_foreground{z-index: 1;position: absolute;top: 440px;left: 0;height: 100%;width: 100%;min-width: 1220px;background-repeat: no-repeat;background-position: center top;pointer-events: none;}
	.top_deco{z-index: 0;position: absolute;top: 160px;left: 0;height: 100%;width: 100%;min-width: 1220px;background-repeat: no-repeat;background-position: center top;pointer-events: none;}
	.bg_repeat{z-index: -1;position: absolute;top: 0;left: 0;height: 100%;width: 100%;min-width: 1220px;background-repeat: repeat-y;background-position: center top;pointer-events: none;}
	.bg_deco{z-index: 1;position: absolute;top: 1000px;left: 0;height: 100%;width: 100%;min-width: 1220px;background-repeat: repeat-y;background-position: center top;pointer-events: none;}
}
@media screen and (max-width:767px){
  	.top_bg{z-index: 0;position: absolute;top: 10vw;left: 0;height: 100%;width: 100%;max-width: 100%;background-size: 100%;background-position: center top;background-repeat: no-repeat;pointer-events: none;}
  	.top_foreground{z-index: 1;position: absolute;top: 80vw;left: 0;height: 100%;width: 100%;max-width: 100%;background-size: 100%;background-position: center top;background-repeat: no-repeat;pointer-events: none;}
  	.bg_repeat{z-index: -1;position: absolute;top: 0;left: 0;height: 100%;width: 100%;max-width: 100%;background-size: 100%;background-position: center top;background-repeat: repeat-y;pointer-events: none;}
}

/* 間距 */
@media screen and (min-width:768px){
	.bottom{margin-bottom: 100px;}
	.bottom01{margin-bottom: 30px;}
	.bottom02{margin-bottom: 80px;}
}

@media screen and (max-width:767px){
	.bottom{margin-bottom: 5vw;}
	.bottom01{margin-bottom: 3vw;}
	.bottom02{margin-bottom: 8vw;}
}

/* 00.版頭 */
.top .main a,.top .sub a,.top .top_pd a{pointer-events: none;}
.top .main ul,.top .sub ul,.top .top_pd ul{padding: 0 !important;grid-gap: 0 !important;}
@media screen and (min-width:768px){
	.top{height: 1130px;}
	.top .main{width: 75%;position: absolute;top: 0;left: 180px;}
	.top .sub{width: 80%;position: absolute;top: 320px;left: 150px;}
	.top .star01{position: absolute;top: 30px;left: 960px;}
	.top .star02{position: absolute;top: 200px;left: 200px;}
	.top .top_pd{width: 80%;position: absolute;top: 430px;left: 150px;z-index: 0;}
	.top .logo{position: absolute;top: 920px;left: 130px;z-index: 2;}
}

@media screen and (max-width:767px){
	.top{height: 120vw}
	.top .main{position: absolute;top: 0;}
	.top .sub{position: absolute;top: 35vw;}
	.top .star01{width: 15%;position: absolute;top: 4vw;left: 84vw;}
	.top .star02{width: 15%;position: absolute;top: 40vw;left: 3vw;}
	.top .Ghost{position: absolute;top: 23vw;}
	.top .top_pd{position: absolute;top: 47vw;}
	.top .logo{position: absolute;top: 101vw;z-index: 2;}
	
}

/* 標題 */
.txt a{pointer-events: none;}
@media screen and (min-width:768px){
	.txt{width: 80%;}
}

@media screen and (max-width:767px){

}

/* 公式 */
.formula{z-index: 2;}
@media screen and (min-width:768px){
	.formula .formula_img{width: 70%;}
}

@media screen and (max-width:767px){
	.formula .formula_img{width: 90%;}
}

/* 按鈕 */
.btn{z-index: 1;}
@media screen and (min-width:768px){
	
}

@media screen and (max-width:767px){

}

/* 登記 */
@media screen and (min-width:768px){

}

@media screen and (max-width:767px){
	.danji .danji_box .Area_danji{width: 96%;}
}

/* 作圖區 */
@media screen and (min-width:768px){
	/* 文案位置 */
	.item .PD_layout-PDBN_01 li:nth-child(odd) .PD_into{position: relative;top: -518px;left: -135px;text-align: center}
	.item .PD_layout-PDBN_01 li:nth-child(odd) .PD_into h3{font-size: 30px;color: #000;}
	.item .PD_layout-PDBN_01 li:nth-child(odd) .PD_into h4{font-size: 25px;position: absolute;top: 180px;left: 345px;color: #000;}
	.item .PD_layout-PDBN_01 li:nth-child(odd) .PD_into p{position: absolute;top: 280px;left: 345px;}
	.item .PD_layout-PDBN_01 li:nth-child(odd) .PD_into p del{color: #606060;font-size: 20px;}
	.item .PD_layout-PDBN_01 li:nth-child(odd) .PD_into p b{background: none;-webkit-text-fill-color: #d62672;font-size: 30px;}
	.item .PD_layout-PDBN_01 li:nth-child(odd) .PD_into p .money{background: none;-webkit-text-fill-color: #d62672;font-size: 30px;}
	.item .PD_layout-PDBN_01 li:nth-child(odd) .PD_into p .Price{background: none;-webkit-text-fill-color: #d62672;font-size: 50px;}
	.item .PD_layout-PDBN_01 li:nth-child(odd) .PD_into p small{background: none;-webkit-text-fill-color: #d62672;font-size: 30px;}

	.item .PD_layout-PDBN_01 li:nth-child(even) .PD_into{position: relative;top: -518px;left: 135px;text-align: center}
	.item .PD_layout-PDBN_01 li:nth-child(even) .PD_into h3{font-size: 30px;color: #000;}
	.item .PD_layout-PDBN_01 li:nth-child(even) .PD_into h4{font-size: 25px;position: absolute;top: 180px;left: -345px;color: #000;}
	.item .PD_layout-PDBN_01 li:nth-child(even) .PD_into p{position: absolute;top: 280px;left: -345px;}
	.item .PD_layout-PDBN_01 li:nth-child(even) .PD_into p del{color: #606060;font-size: 20px;}
	.item .PD_layout-PDBN_01 li:nth-child(even) .PD_into p b{background: none;-webkit-text-fill-color: #d62672;font-size: 30px;}
	.item .PD_layout-PDBN_01 li:nth-child(even) .PD_into p .money{background: none;-webkit-text-fill-color: #d62672;font-size: 30px;}
	.item .PD_layout-PDBN_01 li:nth-child(even) .PD_into p .Price{background: none;-webkit-text-fill-color: #d62672;font-size: 50px;}
	.item .PD_layout-PDBN_01 li:nth-child(even) .PD_into p small{background: none;-webkit-text-fill-color: #d62672;font-size: 30px;}
}

@media screen and (max-width:767px){
	/* 文案位置 */
	.item .PD_layout-PDBN_01 li:nth-child(odd) .PD_into{position: relative;top: -59.5vw;left: -14.5vw;text-align: center;}
	.item .PD_layout-PDBN_01 li:nth-child(odd) .PD_into h3{font-size: 4.5vw;color: #000;}
	.item .PD_layout-PDBN_01 li:nth-child(odd) .PD_into h4{font-size: 3.5vw;position: absolute;top: 23vw;left: 38vw;color: #000;}
	.item .PD_layout-PDBN_01 li:nth-child(odd) .PD_into p{position: absolute;top: 34vw;left: 38vw;}
	.item .PD_layout-PDBN_01 li:nth-child(odd) .PD_into p del{color: #606060;}
	.item .PD_layout-PDBN_01 li:nth-child(odd) .PD_into p b{background: none;-webkit-text-fill-color: #d62672}
	.item .PD_layout-PDBN_01 li:nth-child(odd) .PD_into p .money{background: none;-webkit-text-fill-color: #d62672}
	.item .PD_layout-PDBN_01 li:nth-child(odd) .PD_into p .Price{background: none;-webkit-text-fill-color: #d62672;font-size: 6vw;}
	.item .PD_layout-PDBN_01 li:nth-child(odd) .PD_into p small{background: none;-webkit-text-fill-color: #d62672}

	.item .PD_layout-PDBN_01 li:nth-child(even) .PD_into{position: relative;top: -59.5vw;left: 15.5vw;text-align: center;}
	.item .PD_layout-PDBN_01 li:nth-child(even) .PD_into h3{font-size: 4.5vw;color: #000;}
	.item .PD_layout-PDBN_01 li:nth-child(even) .PD_into h4{font-size: 3.5vw;position: absolute;top: 23vw;left: -38vw;color: #000;}
	.item .PD_layout-PDBN_01 li:nth-child(even) .PD_into p{position: absolute;top: 34vw;left: -38vw;}
	.item .PD_layout-PDBN_01 li:nth-child(even) .PD_into p del{color: #606060;}
	.item .PD_layout-PDBN_01 li:nth-child(even) .PD_into p b{background: none;-webkit-text-fill-color: #d62672}
	.item .PD_layout-PDBN_01 li:nth-child(even) .PD_into p .money{background: none;-webkit-text-fill-color: #d62672}
	.item .PD_layout-PDBN_01 li:nth-child(even) .PD_into p .Price{background: none;-webkit-text-fill-color: #d62672;font-size: 6vw;}
	.item .PD_layout-PDBN_01 li:nth-child(even) .PD_into p small{background: none;-webkit-text-fill-color: #d62672}

}

/* 8品 */
@media screen and (min-width:768px){

}

@media screen and (max-width:767px){
	.pd8 .version{width: 96%;}
}

/* 頁籤6x3 */
@media screen and (min-width:768px){

}

@media screen and (max-width:767px){
	.tab_pd6x3 .page ul{width: 95%;}
}

/*Area_page*/
.Area_page h3 { color: #fff; margin: 0; padding: 0}
  @media screen and (min-width:768px){ 
    .Area_page { overflow: hidden; background-color: #de3f1a; padding: 20px 0 ; border-radius: 1em } 
    .Area_page h3 { color: #fff; margin: 0 auto 20px; padding: 0}
    .Area_page .PD_layout { width: 96%}
  }
  @media screen and (max-width:767px){
    .Area_page { width: 96%; overflow: hidden; background-color: #de3f1a; padding: 5vw 0 ; border-radius: 1em } 
    .Area_page h3 { color: #fff; margin: 0 auto 2vw; padding: 0}
  }
/* --------------------------------------
     * Page 頁籤_202405291900
     * -------------------------------------- */
		 .NavArea_tabbar_page { margin: 0 auto 20px  ; width: 94%; }  
		 .NavArea_tabbar_page .Nav { overflow: visible; transform: translate3d(-30.5%, 0, 0);}  
		 .NavArea_tabbar_page .Nav_box { border-radius: 8px; overflow: hidden; padding: 0 2%;}
		 .NavArea_tabbar_page[data-num="2"] .Nav-wrapper { transform: translate3d(55.5%, 0, 0)!important}
		 .NavArea_tabbar_page[data-num="3"] .Nav-wrapper { transform: translate3d(43.0%, 0, 0)!important}
		 .NavArea_tabbar_page[data-num="4"] .Nav-wrapper { transform: translate3d(30.5%, 0, 0)!important}
		 .NavArea_tabbar_page[data-light="box"] .Nav ul { padding: 0 }
		 .NavArea_tabbar_page .Nav li { overflow: visible; }
			/*頁籤高亮顏色設定 */  
		 .NavArea_tabbar_page .Nav .swiper-slide-active a { color:#fff;}
		 .NavArea_tabbar_page .Nav .swiper-slide-active i { display:block; border: 1px solid #000000 !important; background-color: #000000 !important;}
			/*推編輯按鈕 */  
		 .NavArea_tabbar_page .Nav input { position: fixed; left: 30%}
			 @media screen and (min-width:768px){ 
				 .NavArea_tabbar_page { display: block; }
			 }

/* 06.下方公版 */
@media screen and (min-width:768px){

}

@media screen and (max-width:767px){
	.bottom_version .bottom_version_box .version{width: 96%;}
}

/* 旗艦館 */
@media screen and (min-width:768px){
	.guan .guan_img{width: 70%;}
}

@media screen and (max-width:767px){
	.guan .guan_img{width: 90%;}
}