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

/*基本*/
body{ margin:0; padding:0; background-color:#e7c1c2; height: 1370px;}
	@media screen and (max-width:767px){
		body{ background-color:#e7c1c2; height: auto;}
	}


/*全BOX版面*/
.WRAPPER { z-index:0; position: relative; display:block; margin: 0 auto; padding:0; overflow:hidden; width:100%; min-width:1220px; text-align:left; font-family:"微軟正黑體","Microsoft JhengHei",Helvetica; overflow: hidden; }
.WRAPPER img { border:0px; vertical-align:top;}
.WRAPPER a { text-decoration:none; -webkit-tap-highlight-color: transparent}
.Area ul {display:inline-block; padding:0; margin:0 auto;}
.Area li {list-style:none;float:left;overflow: hidden;}
	@media screen and (max-width:767px){
		.WRAPPER {min-width: inherit; min-height:100vh;}
		.WRAPPER img {  width:100%;  height:auto;}
	}



/*背景*/
.bg_01 { z-index:-2; position:absolute;top:0;left:0; width:100%; height:100%; background-repeat:no-repeat; background-position:center top; pointer-events:none;}

  @media screen and (max-width:767px){
 .m_bg01 { z-index:0; position:absolute; top:0; left: 0; width: 100%; height:100%; background-repeat:no-repeat; background-position: center top; pointer-events:none;background-size: 100%;}
 .momoco  { z-index:-2; position: absolute; top:-3vw; left:0vw; width:28%; height:100%; background: no-repeat center 120px;  pointer-events:none; animation-delay:0.5s;}

}

		

/*區塊_all*/
.Area { position: relative; margin:0 auto; padding:0; border-radius:0; text-align:center; }
.Area a { position:relative; display:block;} 
		  
.Area1220 { margin:0 auto; width:1220px;}
.Area1290 { margin:0 auto; width:1290px;}
.Area960 { margin:0 auto; width:960px;}
.Area_img { margin:0vw auto 80px; position: relative;}
@media screen and (max-width:767px){
		.Area1220 { width:100%;}
		.Area1290 { width:100%;}
		.Area960 { width:100%;}
		.Area_img { width:90%; margin: 0 auto 8vw;}
	}



/*logo*/
.Area_top .logo { z-index:2; position: absolute; top: 20px; left:145px;}
.Area_top .logo a { display:block; width:438px; height:67px; background: url(logo.png?t=1750846216754) no-repeat;}
	

/*版頭區塊*/
.Area_title { height:728px; }
.Area_title .titlebox { z-index: 0; position:absolute; left:0px; top:0px; width:1220px; height: auto;}
.Area_title .titlebox .title1 { z-index: 0; position:absolute; left:145px; top:30px; animation-delay:0.2s; pointer-events:none;}

.Area_title .deco { z-index:0; position:absolute;top:499px;left: -176px; width:100%; height:100%; background-repeat:no-repeat; background-position:center top; pointer-events:none; opacity: 3.3;}

/* .Area_title .light1 { z-index: 5; position:absolute; top: 103px; left: -188px; width: 100%; height:100%; background-repeat:no-repeat; background-position: center top; pointer-events:none;background-size: 100%; mix-blend-mode: screen; animation: shine 3s infinite;}
.Area_title .light2 { z-index: 5; position:absolute; top: 241px; left: -406px; width: 100%; height:100%; background-repeat:no-repeat; background-position: center top; pointer-events:none;background-size: 100%; mix-blend-mode: screen; animation: shine 3s infinite;}
.Area_title .light3 { z-index: 5; position:absolute; top: 272px; left: -88px; width: 100%; height:100%; background-repeat:no-repeat; background-position: center top; pointer-events:none;background-size: 100%; mix-blend-mode: screen; animation: shine 3s infinite;} */


.Area_title .titlebox .momoco { z-index:-2; position: absolute; top:225px; left:330px; width:100%; height:100%; background: no-repeat center;  pointer-events:none; }
.Area_title .titlebox .momoco img{width: 29.5%;position: absolute;left: 278px;top: -48px;}

.Area_title .titlebox .Kiwi { z-index:0; position: absolute; top: -8px;left: 62px; width:100%; height:100%; background: no-repeat center;  pointer-events:none; }
.Area_title .titlebox .Kiwi img{position: absolute;left: 270px;top: 195px;}


@keyframes shine{
	0%{ filter: brightness(100%); opacity:0.5;}
	50%{ filter: brightness(200%); opacity:1;}
	100%{ filter: brightness(100%); opacity:0.5;}
	}



@media screen and (max-width:767px){
		.Area_title { height: 101vw; z-index: 5; }
		.Area_title .titlebox { z-index: 0; position:absolute; left:0; top:0vw; width:100%; height:auto;}
		.Area_title .titlebox .title1 { width:111%; left:4%; top:15.5vw; z-index:2}
	
		.Area_title .titlebox .momoco{  z-index:99; position: absolute; top:42vw; left:-23vw; width:132%; height:100%; background: no-repeat center 120px;  pointer-events:none; animation-delay:0.5s;}	

		.Area_title .titlebox .Kiwi  { z-index:-2; position: absolute; top:-11vw; left: -56vw; width:34%; height:100%; background: no-repeat center 120px;  pointer-events:none; animation-delay:0.5s;}
		
		.Area_title .deco { z-index:0; position:absolute;top:43.5vw;left:0vw; width:100%; height:100%; background-repeat:no-repeat; background-position:center top; pointer-events:none; opacity: 0.3;}

		.Area_title .light1 { z-index: 5; position:absolute; top: 24vw; left:30vw; width: 14%; height:100%; background-repeat:no-repeat; background-position: center top; pointer-events:none;background-size: 100%; mix-blend-mode: screen; animation: shine 3s infinite;}
		.Area_title .light2 { z-index: 5; position:absolute; top: 40vw; left: 3.5vw; width: 14%; height:100%; background-repeat:no-repeat; background-position: center top; pointer-events:none;background-size: 100%; mix-blend-mode: screen; animation: shine 3s infinite;}
		.Area_title .light3 { z-index: 5; position:absolute; top: 44vw; left: 42vw; width: 14%; height:100%; background-repeat:no-repeat; background-position: center top; pointer-events:none;background-size: 100%; mix-blend-mode: screen; animation: shine 3s infinite;}
}



.Area01 {height:642px; }
.Area01 .txt h4{font-size: 35px;color:#f02398;text-align:left; font-family:"微軟正黑體","Microsoft JhengHei",Helvetica; margin-bottom: 35px; }
.Area01 .txt p{font-size: 34px;color:#595959;text-align: left; font-family:"微軟正黑體","Microsoft JhengHei",Helvetica; line-height: 40pt;}
.Area01 .txt {position: absolute;z-index: 1;left:236px;top:-87px;width:69%;}
.Area01 .bg1 {position: absolute;top:-236px;left:126px;z-index: -1}

.Area01 .btn {position: relative;top: 472px;left: 27px }



@media screen and (max-width:767px){
.Area01 {height:75vw;}
.Area01 .txt h4{font-size: 21px;color:#f02398;text-align: left; font-family:"微軟正黑體","Microsoft JhengHei",Helvetica;margin-bottom: -3vw ; }
.Area01 .txt p{font-size:20px;color:#595959;text-align: left; font-family:"微軟正黑體","Microsoft JhengHei",Helvetica; line-height: 23pt; }
.Area01 .txt {position: absolute;z-index: 1;left:7.4vw;top:-3.5vw;width:87%;}	
.Area01 .bg2 {position: absolute;top:-25vw;left:1.5vw;z-index: 0 ;width: 98%}

.Area01 .btn {position: relative; top: 60vw; left: 25vw;width: 50%;}

}