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


/*全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: -1;position: absolute;top: 0;left: 0;height: 100%;width: 100%;min-width: 1220px;background-repeat: no-repeat;background-position: center top;pointer-events: none;}
	.order_bg{z-index: -1;position: absolute;top: 1103px;left: 0;height: 100%;width: 100%;min-width: 1220px;background-repeat: no-repeat;background-position: center top;pointer-events: none;}
	.explanation_bg{z-index: -1;position: absolute;top:3500px;left: 0;height: 100%;width: 100%;min-width: 1220px;background-repeat: no-repeat;background-position: center top;pointer-events: none;}
	.bg_repeat{z-index: -2;position: fixed;top: 0;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: -1;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;}
  	.m_bg01{z-index: -1;position: absolute;top:150vw;left: 0;height: 100%;width: 100%;max-width: 100%;background-size: 100%;background-position: center top;background-repeat: no-repeat;pointer-events: none;}
  	.m_bg02{z-index: -1;position: absolute;top:331vw;left: 0;height: 100%;width: 100%;max-width: 100%;background-size: 100%;background-position: center top;background-repeat: no-repeat;pointer-events: none;}
  	.m_bg03{z-index: -1;position: absolute;top:521vw;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: -2;position: fixed;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: 80px;}
	.bottom01{margin-bottom: 30px;}
	.bottom02{margin-bottom: 10px;}
}

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

/*黏人精*/
.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: 50px; 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;left: 0;}
}
@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;left: 0;}
}

/* 黏人精 */
@media screen and (min-width:768px){
	/* .fixarea_tabbar{top: 50px;} */
}

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

}

/* 00.版頭 */
.top .date a,.top .title a,.top .sub a{pointer-events: none;}
.top .date ul,.top .title ul,.top .sub ul,.top .top_pd ul{padding: 0 !important;grid-gap: 0 !important;}

@media screen and (min-width:768px){
	.top{height: 932px}
	.top .title_shine{position: absolute;top: 0;}
	
}

@media screen and (max-width:767px){
	.top{height:113vw}
	.top .title_shine{position: absolute;top: 0;}
	
}

/* 區標 */
.txt a{pointer-events: none}
.txt ul{padding: 0 !important;grid-gap: 0 !important;}
@media screen and (min-width:768px){
	.txt{width: 80%;}
	/* .txt .PD_into h3{font-family: Noto Sans CJK TC;font-weight: 500;margin-top: 12px;background: -webkit-linear-gradient(90deg, #ffd274 10%, #fff 50%);-webkit-background-clip: text;-webkit-text-fill-color: rgba(0,0,0,0);font-size: 40px !important;} */
}

@media screen and (max-width:767px){
	/* .txt{height: 20vw;} */
	/* .txt .PD_into h3{font-family: Noto Sans CJK TC;font-weight: 500;margin-top: 1.5vw;background: -webkit-linear-gradient(90deg, #ffd274 10%, #fff 50%);-webkit-background-clip: text;-webkit-text-fill-color: rgba(0,0,0,0);} */
}

/* 訂購 */
@media screen and (min-width:768px){
	.order .btn_img{width:58%;padding: 329px 0 26px 0;}
}

@media screen and (max-width:767px){
	.order{background: url(order_bg.jpg?t=1780280118331)top center no-repeat;background-size: 100%;}
	.order .btn_img{padding: 16vw 0 2vw 0;width: 75%;}
}

/* 作圖區 */
@media screen and (min-width:768px){
	.item{height:2200px;}
	.item .item_img li{height: 476px;}
	.item .item_img li:nth-child(even){margin-top: 200px;}
	.item .PD_into{position: relative;top: -145px;left: 30px;text-align: center;}
	.item .item_img .PD_into h3{font-size: 30px;color: #fff;}
	.item .item_img .PD_into p{top: 80px;}
	.item .item_img .PD_into p del{font-size: 30px;color: #fff;text-decoration: none}
	.item .item_img .PD_into p b{font-size: 30px;background: -webkit-linear-gradient(90deg, #fbc855 20%, #fff 60%);-webkit-background-clip: text}
	.item .item_img .PD_into p .money{font-size: 30px;background: -webkit-linear-gradient(90deg, #fbc855 20%, #fff 60%);-webkit-background-clip: text}
	.item .item_img .PD_into p .Price{font-size: 40px;background: -webkit-linear-gradient(90deg, #fbc855 20%, #fff 60%);-webkit-background-clip: text}
	.item .item_img .PD_into p small{display: none;}
	.item .flower { position: absolute; z-index: -1; }
	.item .p01 {top: 32px; left: -86px ;}
	.item .p02 {top:0px; right:-86px ;}
	.item .p03 {top: 1102px; left: -132px ;}
	.item .p04 {top:1329px; right: -86px ;}
	.item .p05 {top: 32px; left: -156px ;}
	.item .p06 {top: 1868px; left: 505px ;}
}

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

	.item .item_img{width: 90%;margin-left: 2.5vw;}
	.item .item_img ul li { padding-bottom: 5vw;}
	.item .item_img .PD_into{position: relative;top: -23.5vw;left: 20px;text-align: center;}
	.item .item_img .PD_into h3{font-size: 4.5vw;color: #fff;}
	.item .item_img .PD_into p{top: 13.5vw;}
	.item .item_img .PD_into p del{font-size: 4vw;color: #fff;text-decoration: none}
	.item .item_img .PD_into p b{font-size: 4vw;background: -webkit-linear-gradient(90deg, #fbc855 20%, #fff 60%);-webkit-background-clip: text}
	.item .item_img .PD_into p .money{font-size: 4vw;background: -webkit-linear-gradient(90deg, #fbc855 20%, #fff 60%);-webkit-background-clip: text}
	.item .item_img .PD_into p .Price{font-size: 7vw;background: -webkit-linear-gradient(90deg, #fbc855 20%, #fff 60%);-webkit-background-clip: text}
	.item .item_img .PD_into p small{display: none;}

}

/*QA區塊*/
.Area_QA {position: relative;}
.QAbox .moreButton .fix.up::after{ transform:rotate(0deg);}
.QAbox .moreButton .fix.down::after { transform:rotate(180deg);}
@media screen and (min-width:768px){
  .QAbox {padding: 623px 95px 120px 36px;}  
  .Area_QA { min-height: 630px; margin-top: -130px;}
  .Area_QA .box_title { width: 100%;margin: 0 auto -4vw;} 
  .Area_QA .box{position: relative;top: 80px;left: -41px;}
  .Area_QA .QA_btn {position: absolute; top: 271px; right:18px; width:27%;z-index: 999;}
  .Area_forewarned .box{}
  .Area_forewarned .box img{width: 80%;margin: 0 auto 75px;}
}
@media screen and (max-width:767px){
  .Area_QA { margin-top: 8vw; padding-bottom:0vw;}
  .Area_QA .box_title {width: 100%;margin: 0 auto ; z-index: -1;} 
  .brand_deco {position: relative;bottom: 4.1vw;}
  .Area_forewarned {/*background: url(m_bg3_02.png?t=1780280118332) no-repeat;background-size: 100%;*/position:relative;top:0vw;}
  .QA_btn {position: absolute; top: 29vw; right: 4vw;  width:32%; margin:0;}  	
  .QAbox {width: 94%;margin: 69.3vw auto 11vw;}
}



/*QA區塊*/
.Area_QA { 
  .box_title{
    position: relative;
    top: 10px;
  }
    @media screen and (max-width:767px){
      position: relative;
      top: 0;
      /* width: 70vw; */
      margin: 0 auto;
    }
  }

  .box-img{
    position: absolute;
    right: -30px;
    top: -30px;
    @media screen and (max-width:767px){
      position: relative;
      top: 0;
      width: 90vw;
      margin: 0 auto;
    }
  }


.QAbox .moreButton .fix.up::after{ transform:rotate(0deg);}
  .QAbox .moreButton .fix.down::after { transform:rotate(180deg);}
  @media screen and (min-width:768px){
    .QAbox { width:100%;}  
    /* .Area_QA {margin: 90px auto 0 auto;} */
    .order_btn {padding: 40px 0;}
    .Area_QA .box_txt{margin: 0 auto 0 auto;padding: 310px 0 0 0;}
  }
  @media screen and (max-width:767px){
    .Area_QA {margin-top: -2vw;padding-bottom: 3vw;}
    /* .Area_forewarned {background: url(m_bg3_02.png?t=1756110435243) no-repeat;background-size: 100%; position:relative;top:-1vw;} */
    .order_btn {width:50%;margin: 5vw auto 8vw;}  	
    .QAbox { width: 95%; margin: 0 auto;}
  }

	/*訂閱說明 展開選單*/
.QAbox .moreButton { width:100%;   }
.QAbox .moreButton .title { font:20px/1.7em '微軟正黑體'; letter-spacing: 0; text-align:left; margin-bottom:10px; display:inline-block; color: #000;}
.QAbox .moreButton dl {}
.QAbox .moreButton dt { cursor:pointer; }
.QAbox .moreButton dd { display: none; margin:0; padding:3%; font:18px/1.8em '微軟正黑體', 'Century Gothic'; text-align:left; color:#2c2c2c; background-color:#ffffff; }
.QAbox .moreButton .menu_btn { position: relative; display: block; height:50px; width: 100%; font:bold 21px/50px 微軟正黑體; color: #ffffff; text-align: left; box-sizing: border-box; padding-left: 2% }
.QAbox .moreButton .up::after{ content: ""; position: absolute; top:45%; right:2%; width: 0; height: 0; border-style: solid; border-width: 0.6em 0.4em 0 0.4em; border-color: #ffffff transparent transparent transparent;transform:rotate(180deg);}
.QAbox .moreButton .down::after { content: ""; position: absolute; top:45%; right:2%; width: 0; height: 0; border-style: solid; border-width:0.6em 0.4em 0 0.4em; border-color: #ffffff transparent transparent transparent;}
.QAbox .moreButton .up img{ width:100%; height:auto }
.QAbox .moreButton .down img{ width:100%; height:auto}
.QAbox .moreButtontag { display:none!important;}

	@media screen and (max-width:767px){
	.QAbox .moreButton { width:100%; margin:1vw auto; }
    .QAbox .moreButton .title {font:16px/1.7em '微軟正黑體'; letter-spacing: 0; text-align:left; margin-bottom:10px; display:inline-block}
    .QAbox .moreButton dl {}
    .QAbox .moreButton dt {cursor:pointer; }
    .QAbox .moreButton dd {display: none; margin:0; padding:3%; font:16px/1.8em '微軟正黑體', 'Century Gothic'; text-align:left; color:#2c2c2c; background-color:#fff;}
    .QAbox .moreButton .menu_btn { position: relative; display: block; height:2em; font:bold 16px/2em 微軟正黑體;color: #ffffff;text-align:left; padding: 0 2% ; }
/*    .moreButton .up::after{content: ""; position: absolute; top:44%; right:10vw; width: 0; height: 0; border-style: solid; border-width: 3vw 2vw 0 2vw; border-color: #fff transparent transparent transparent;transform:rotate(180deg);}*/
/*    .moreButton .down::after {content: ""; position: absolute; top:44%; right:10vw; width: 0; height: 0; border-style: solid; border-width: 3vw 2vw 0 2vw; border-color: #fff transparent transparent transparent;}*/
	.QAbox .moreButton .up img{ width:100%; height:auto }
    .QAbox .moreButton .down img{ width:100%; height:auto}
    .QAbox .moreButtontag { display:none!important;}
	}



/* 公版 */
@media screen and (min-width:768px){
}
@media screen and (max-width:767px){
	.version{width: 95%;}
}

/* 館連結 */
@media screen and (min-width:768px){
	.guan .guan_img{width: 65%;}
}

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