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

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



/*全BOX版面*/
.WRAPPER { position: relative; display:block; margin: 0 auto; padding: 0; width:100%;  min-width:1220px; overflow:hidden; font-family:"微軟正黑體","Microsoft JhengHei",Helvetica; background:#fffdf3;}
.WRAPPER img {width: 100%; border:0px; vertical-align:top;}
.WRAPPER a { text-decoration:none;}
		@media screen and (max-width:767px){
		.WRAPPER { min-width: inherit; padding-bottom:0px; }
		.WRAPPER img {  width:100%;  height:auto;}
	}
	
	
/*背景*/
@media screen and (min-width:767px){
.bg{ z-index:0; position:absolute;top:0; width:100%; min-width:1220px; height:1130px; background: url(bg_01.jpg?t=1782728989867) no-repeat center top ;}

}
	@media screen and (max-width:767px){
.mbg{ z-index:0; position:absolute;top:0; width:100%;height:133vw; background: url(mb_01.jpg?t=1782728989867) center 100% / 100% no-repeat scroll;}

	}


/*背景*/
.bgtop  { z-index:0; position:absolute; top:0; left:0; width:100%; min-width:1220px; height:100%;}
	@media screen and (max-width:767px){
		.bgtop { min-width: inherit; background-size:100%;}
	}
	
	

	
/*黏人快速鍵(白色款)*/
.fixed_Area {z-index:999; position:fixed; top:20px; right:0px; width:100px; font-weight:800; font-size:16px; line-height:48px; font-family:Century Gothic, "微軟正黑體",Helvetica; text-align:center;
			-webkit-transform: rotate3d(0,0,0,0deg) translate3d(0,0,0); transform: rotate3d(0,0,0,0deg) translate3d(0,0,0); -webkit-transform-origin:top right; transform-origin:top right;
			  -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;}
.fixed_Area a { display:block; text-decoration: none; color: #000;}
.fixed_Area img {-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;}
.fixed_Area .box ul { margin:0; padding:0; list-style:none;}
.fixed_Area .box li { margin:0 0 1px 0; padding:0; height:48px; background-color:rgba(255,255,255,0.6);}
.fixed_Area .box li a { letter-spacing:-1px;height:48px; overflow:hidden;}
.fixed_Area .box li a:hover { background-color:rgba(255,255,255,1);}
.fixed_Area .box li.cate-hover { background-color:rgba(255,255,255,1);}
.fixed_Area .box h2 { margin:0; padding:0;}
	/*快速導覽*/
	.fixed_Area h3 { position: absolute; top:100px; right:-50px; margin:0; padding:35px 0 0 0; border-radius:10px; width:48px; height:82px; font-size: 16px; line-height:30px; writing-mode: tb-lr; writing-mode: vertical-lr; -webkit-writing-mode: vertical-lr; background-color:rgba(255,255,255,0.6); text-align:left; cursor:pointer;
			-webkit-transform-origin:top left; transform-origin:top left;
			  -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;}
	.fixed_Area h3 i { position: absolute; top:0; right:0; display:block; width:50px; height:50px; cursor:pointer;}
	.fixed_Area h3 i:before { content: ""; position:absolute; top:41%; left:37%; display:block; border:1px solid #000; border-width:0 1px 1px 0; width:15%; height:15%; -webkit-transform:translate(-50%,-50%) rotate(135deg); transform:translate(-50%,-50%) rotate(135deg); -webkit-transition: all 0.3s ease; transition: all 0.3s ease;}
			/*黑色款*/
			.fixed_Area.fixed_Area-dark a { color: #fff;}
			.fixed_Area.fixed_Area-dark .box li { background-color:rgba(0,0,0,0.5);}
			.fixed_Area.fixed_Area-dark .box li a:hover { background-color:rgba(0,0,0,1);}
			.fixed_Area.fixed_Area-dark .box li.cate-hover { background-color:rgba(0,0,0,1);}
            .fixed_Area.fixed_Area-dark h3 {background-color:rgba(0,0,0,0.5);color: #fff; }
            .fixed_Area.fixed_Area-dark h3  i:before { border-color:#fff;}



			/*收合黏人精*/
			.fixed_Area.fixed_Area_hide { -webkit-transform: rotate3d(0,0,0,0deg) translate3d(150px,0,0); transform: rotate3d(0,0,0,0deg) translate3d(150px,0,0); }
			.fixed_Area.fixed_Area_hide h3 { -webkit-transform: rotate3d(0,0,0,0deg) translate3d(-185px,0,0); transform: rotate3d(0,0,0,0deg) translate3d(-185px,0,0); 
											 -webkit-transition-delay:0.2s; transition-delay:0.2s;}
/*區塊_all*/
.Area { position: relative; margin:0 auto; padding:0; border-radius:0; text-align:center; }
.Area a { display:block;margin: auto;} 
.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){
		.Area1220 { width:100%;}
		.Area960 { width:100%;}
		
	}


/*版頭*/
.Area_top {height:500px;}
	/*一般LOGO*/
.momologo { z-index:2; position: absolute; top: 15px; left:15px;}
.momologo a { display:block; width:140px; height:21px;}
.momologo a svg { width:140px; height:21px; }
.momologo a path { fill:#EA27C2; }
.momologo-pink  a path { fill:#EA27C2; }
.momologo-white a path { fill:#ffffff; }
	@media screen and (max-width:767px){
		.momologo { display:none;}
	}

.bank_bn{ position:absolute; top:200px; left:0; z-index:3;}

  @media screen and (min-width:768px){
	.event_tittle{
		width: 100%;
		margin: 0 auto;
		padding: 10px;
		text-align: center;
		font-size: 34px;
		letter-spacing: 2px;
		color: #595757;
		font-weight: bold;
		padding-top: 100px;
	}

}


@media screen and (min-width:768px){
	.PD_layout.PD_layout-btn li .PD h3{width:390px;height: 2.76em;font-size: 1.7em!important;}
}
@media screen and (max-width:767px){
	.PD_layout.PD_layout-btn li .PD h3{width: 60vw;}
}

.PD_layout.PD_layout-btn li .PD h3{	height: 2.76em; 
	height: 2.76em;
	line-height: 1em;
	text-align: center;
	color: #fff;
	background: #3cbaad;
	border-radius: 4px;
	border:1px solid #ffffff;
	margin: 10% auto;
	border-radius: 20px;
}


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


.event_tittle {   font-size: 2.4em;
font-weight: 700;
margin-bottom: 16px;
color: #d62a7c;}


	.card-group {
		display: flex;
		justify-content: center;
		gap: 5%;
		flex-wrap: wrap;
		}
	  
	  /* 卡片本體 */
	  .card {
		width: 40%;
		padding: 26px 22px;
		border-radius: 20px;
		border: 1px solid #e6cddd;
		background: #ffffff;
		text-align: center;
		box-sizing: border-box;
		}
	  
	  /* 方案標題 */
	  .card h3 {
		font-size: 2em;
		font-weight: 700;
		margin: 0;
		color: #333;
		}
	  
	  /* 上方資訊 */
	  .card .info {
		font-size: 1.8em;
		line-height: 1.6;
		color: #333;
		margin: 20px;
		}
	  
	  /* 強調粉紅 */
	  .highlight-text {
		color: #d62a7c;
		font-weight: 700;
	  }
	  
	  /* 下方優惠區（重點） */
	  .bonus-box {
		background: #f7eef4;
		border-radius: 16px;
		padding: 15px 5px;
		}
	  
	  /* momo標題 */
	  .bonus-box h4 {
		font-size: 1.8em;
		font-weight: 700;
		color: #d62a7c;
		margin: 0px;
		}
	  
	  /* momo內容 */
	  .bonus-box p {
		font-size: 1.8em;
		line-height: 1.9;
		margin: 0;
		}
	  
	  /* mo幣數字 */
	  .bonus-box span {
		color: #d62a7c;
		font-weight: 700;
		font-size: 1em;
		}

	/* 方案一 */
	.card h3.underline::after {
		content: "";
		display: block;
		width: 130px;
		height: 3px;
		background: #f7eef4;
		margin: 8px auto 0;
		border-radius: 2px;
		}
		  

	/* momo會員加碼 */
	.card h4.underline::after {
		content: "";
		display: block;
		width: 160px;
		height: 2px;
		background: #f5dae7;
		margin: 5px auto 0;
		border-radius: 2px;
		}
		  
		  

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

			.card-group {
				display: flex;
				justify-content: center;
				gap: 1%;
				flex-wrap: wrap;
				}
			  
			  /* 卡片本體 */
			  .card {
				width: 48%;
				padding: 1%;
				border-radius: 20px;
				border: 1px solid #e6cddd;
				background: #ffffff;
				text-align: center;
				box-sizing: border-box;
				}
			  
			  /* 方案標題 */
			  .card h3 {
				font-size: 1.8em;
				font-weight: 700;
				margin-bottom: 16px;
				color: #333;
				}
			  
			  /* 上方資訊 */
			  .card .info {
				font-size: 1.1em;
				line-height: 1.8;
				color: #333;
				margin: 3% 1%;
				}
			  
			  /* 強調粉紅 */
			  .highlight-text {
				color: #d62a7c;
				font-weight: 700;
			  }
			  
			  /* 下方優惠區（重點） */
			  .bonus-box {
				background: #f7eef4;
				border-radius: 16px;
				padding: 5% 2%;
				}
			  
			  /* momo標題 */
			  .bonus-box h4 {
				font-size: 1.3em;
				font-weight: 700;
				color: #d62a7c;
				margin-bottom: 10px;
				}
			  
			  /* momo內容 */
			  .bonus-box p {
				font-size: 1.1em;
				line-height: 1.8;
				margin: 0;
				}
			  
			  /* mo幣數字 */
			  .bonus-box span {
				color: #d62a7c;
				font-weight: 700;
				font-size: 1em;
				}
		
		
		}
	

