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

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

	@media screen and (max-width:767px){
	body { font-size:14px;}
	}
#edm{line-height:0}
#footer{display:none}
.AreaTitlemo{display:none}

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


/*全BOX版面*/
.WRAPPER { position: relative; display:block; margin: 0 auto; padding: 0; width:100%; min-width:1220px; font-family:"微軟正黑體","Microsoft JhengHei",Helvetica; overflow:hidden; }
.WRAPPER ul { margin:0; padding:0; list-style: none outside none;}
.WRAPPER img { border:0px; vertical-align:top }
.WRAPPER a { text-decoration:none }
		@media screen and (max-width:767px){
		.WRAPPER {  position:relative; display:inline-block; margin:0; padding:0; width:100%; min-width: inherit }
		.WRAPPER img {  width:100%;  height:auto;}
		.snowArea { display:none;}
	}
	
/*背景*/
.bg_color { z-index:-3; position: absolute; top:0; left:0; width:100%; height:100%; background:#ffcfd8 ; pointer-events:none; }
.bg_cloud { z-index:-3; position: absolute; top:0; left:0; width:100%; height:100%; background: url(bg_cloud-0313.jpg) repeat center top; pointer-events:none;}
.bg_bl { z-index: -3;    position: fixed;    top: 0;    left: 50%;    width: 2000px;    transform: translateX(-50%);}
	.bg_bl .bl { z-index: 0; position:absolute; left:0px; top:0px; transform-origin: center center; pointer-events:none;}
.bg_container { z-index:-3; position: absolute; top:25px; left:0px; width:100%; height:100%; background: url(bg_container-0313.png) no-repeat center top; pointer-events:none;}
.bg_woman1 { z-index:-3; position: absolute; top:143px; left:-430px; width:100%; height:100%; background: url(bg_woman-0313.png) no-repeat center top; pointer-events:none;  filter: drop-shadow(3px 4px 2px rgba(141,67,83,0.6)) brightness(0.85); -webkit-filter: drop-shadow(3px 4px 2px rgba(141,67,83,0.6)) brightness(0.85);}
.bg_woman2 { z-index:-3; position: absolute; top:143px; left:-430px; width:100%; height:100%; background: url(bg_woman-0313.png) no-repeat center top; pointer-events:none;  filter: drop-shadow(0px 0px 3px rgba(255,252,213,1)) ; -webkit-filter: drop-shadow(0px 0px 3px rgba(255,252,213,1)) ; }
.bg_thing1 { z-index:-3; position: absolute; top:59px; left:410px; width:100%; height:100%; background: url(bg_thing1-0313.png) no-repeat center top; pointer-events:none;}
.bg_leaf1 { z-index:-3; position: absolute; top:435px; left:-479px; width:100%; height:100%; background: url(bg_leaf-0313.png) no-repeat center top; pointer-events:none; filter: drop-shadow(0px 10px 4px rgba(67,2,9,0.2)); -webkit- filter: drop-shadow(0px 10px 4px rgba(67,2,9,0.2));}
.bg_leaf2 { z-index:-3; position: absolute; top:361px; left:380px; width:100%; height:100%; background: url(bg_leaf-0313.png) no-repeat center top; pointer-events:none; filter: drop-shadow(0px 10px 4px rgba(67,2,9,0.2)); -webkit- filter: drop-shadow(0px 10px 4px rgba(67,2,9,0.2));
			  transform:scaleX(-1); -webkit-transform:scaleX(-1);}
.bg_lamp { z-index:-3; position: absolute; top:55px; left:0px; width:100%; height:100%; background: url(bg_lamp-0313.png) no-repeat center top; pointer-events:none;}

.bg_co { z-index: 2;    position: absolute;    top: 0;    left: 50%;    width: 2000px;    transform: translateX(-50%);  pointer-events:none;}
	.bg_co .co1 { z-index: 0; position:absolute; right:-1034px; top:160px; transform-origin: center center; pointer-events:none;}
	.bg_co .co2 { z-index: 0; position:absolute; left:-1141px; top:290px; transform-origin: center center; pointer-events:none;}

@media screen and (max-width:767px){
	.bg_cloud {background: none ; display:none;}
	.bg_bl {background: none ; display:none;}
		.bg_bl .bl {background: none ; display:none;}
		
	.bg_container { background-size:350%; top:-17vw;}
	.bg_woman1 { background: none ; display:none;}
	.bg_woman2 { background: none ; display:none;}
	.bg_thing1 {background-size: 70%;  top: 34vw;  left: 24vw;}
	.bg_leaf1 { background-size:30%; top:82vw; left:-35vw;}
	.bg_leaf2 { background-size:30%; top:12vw; left:35vw;}
	.bg_lamp { background-size:200%; top:44px; left:0vw;background-position: -81vw 0vw;}
	.bg_co {background: none ; display:none;}
		.bg_co .co1 {background: none ; display:none;}
		.bg_co .co2 {background: none ; display:none;}
	}



/*區塊_all*/
.Area { z-index:1; 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;}
.Area1300 { margin:0 auto; width:1300px;}
.Area1410 { margin:0 auto; width:1410px;}
.Area960 { margin:0 auto; width:960px;}

	@media screen and (max-width:767px){
		.Area1220 { width:100%;}
		.Area1300 { width:100%;}
		.Area1410 { width:100%;}
		.Area960 { margin:0 auto; width:100%;}		
	}


/*Area_top*/
.Area_top { height:869px; }
.Area_top .titlebox { z-index: 0; position:absolute; left:0px; top:0px; width:1220px; height: auto;}
.Area_top .titlebox .title { z-index: 0; position:absolute; left:383px; top:111px; animation-delay:1s; pointer-events:none;}
.Area_top .titlebox .stage { z-index: 0; position:absolute; left:105px; top:601px; animation-delay:1s; pointer-events:none;}
.Area_top .titlebox .subtitle { z-index: 0; position:absolute; left:557px; top:533px; animation-delay:1.2s;}
.Area_top .titlebox .date { z-index: 0; position:absolute; left:374px; top:522px; animation-delay:1.5s;}
.Area_top .titlebox .obj1 { z-index: 0; position:absolute; left:19px; top:67px; animation-delay:0s;}
.Area_top .titlebox .obj2 { z-index: 0; position:absolute; left:19px; top:67px; animation-delay:0s;}

@media screen and (max-width:767px){
	/*Area_top*/
	.Area_top { height: 120vw }
	.Area_top .titlebox { z-index: 0; position:absolute; left:0px; top:0px; width:100%; height:auto; }
    .Area_top .titlebox .title { left:6vw; top:7vw; width:90vw; }
    .Area_top .titlebox .stage { display:none; }
    .Area_top .titlebox .subtitle { left: 13%; top: 95vw; width: 74%; }
    .Area_top .titlebox .date { left: 16%; top: 74vw; width: 24%;}
    .Area_top .titlebox .obj1 { display:none; }
    .Area_top .titlebox .obj2 { display:none; }
}



/*按鈕*/
.Area_btn_top {position: relative; left:0; margin:0 auto 60px; padding:0; text-align: center; overflow:hidden; height:593px; background:url(area_btn_bg-0313.png) center top no-repeat;}
.Area_btn_top ul { display:inline-block; margin:200px 0 0; padding:0;}
.Area_btn_top ul li a { position:relative;}
.Area_btn_top ul li a img {  transition-duration: 0.2s;}
.Area_btn_top ul li { float:left; margin:0px 25px; transition-duration: 0.5s;}
.Area_btn_top ul li:nth-child(even) { margin-top:-70px}
.Area_btn_top ul li:hover { 
animation: ease-in-out;
-webkit-transform: scale(0.95);filter:brightness(115%);
-moz-transform: scale(0.95);filter:brightness(115%);
-ms-transform: scale(0.95);filter:brightness(115%);
-o-transform: scale(0.95);filter:brightness(115%);
transform: scale(0.95);filter:brightness(115%);
}
@media screen and (max-width:767px){
	.Area_btn_top { width:100%; height:auto; margin:0 auto 5vw; padding:0; background:url(area_btn_bg-m-0313.jpg) center top repeat; background-size:100%; height:142vw; }
	.Area_btn_top ul { margin:0vw 0 0 4vw; padding:0}
	.Area_btn_top ul li a { position:relative;}
	.Area_btn_top ul li a img {  transition-duration: 0.2s;}
	.Area_btn_top ul li { margin:0vw 1vw 6vw ; width:96%; height:auto;}
	.Area_btn_top ul li:nth-child(even) { margin-top:0}
	.Area_btn_top ul li:hover { 
		animation: ease-in-out;
		-webkit-transform: scale(0.95);filter:brightness(115%);
		-moz-transform: scale(0.95);filter:brightness(115%);
		-ms-transform: scale(0.95);filter:brightness(115%);
		-o-transform: scale(0.95);filter:brightness(115%);
		transform: scale(0.95);filter:brightness(115%);
	}
}

/*按鈕*/
.Area_btn {position: relative; left:0; margin:40px auto; padding:0; text-align: center; overflow:hidden; }
.Area_btn ul { display:inline-flex; -webkit-display:inline-flex; margin:0 auto; padding:0;}
.Area_btn ul li a { position:relative; }
.Area_btn ul li a img {  transition-duration: 0.2s; width:100%;}
.Area_btn ul li { float:left; margin:0px 10px; transition-duration: 0.5s;}
.Area_btn ul li:hover { 
animation: ease-in-out;
-webkit-transform: scale(0.95);filter:brightness(115%);
-moz-transform: scale(0.95);filter:brightness(115%);
-ms-transform: scale(0.95);filter:brightness(115%);
-o-transform: scale(0.95);filter:brightness(115%);
transform: scale(0.95);filter:brightness(115%);
}

/*純文字版
.Area_btn ul li a { text-shadow:0 1px 1px rgba(0,0,0,0.5); font-size:22px; line-height:24px; font-weight: bolder; font-family:"Century Gothic", "微軟正黑體", sans-serif; text-decoration:none; color:#fff; width:126px; padding:16px 0; }
.Area_btn ul li { background: linear-gradient(#ff298d,#e80266); border-radius:100px;}
*/

@media screen and (max-width:767px){
	.Area_btn { width:94%; height:auto; margin:0 auto; padding:0; }
	.Area_btn ul { margin:0 2% 0 8%; padding:0; display:inline-block; -webkit-display:inline-block;}
	.Area_btn ul li a { position:relative; font-size:4.5vw; width:100%;}
	.Area_btn ul li a img {  transition-duration: 0.2s;}
	.Area_btn ul li { margin:0vw 2% 5vw ; width:27%;}
	.Area_btn ul li:hover { 
		animation: ease-in-out;
		-webkit-transform: none;filter:brightness(100%);
		-moz-transform: none;filter:brightness(100%);
		-ms-transform: none;filter:brightness(100%);
		-o-transform: none;filter:brightness(100%);
		transform: none;filter:brightness(100%);
	}

	/*純文字版
	.Area_btn ul li a { font-size:4.5vw; width:100%;}
	*/

}

/*hover*/
.hover0 {transition-duration: 0.3s;}
.hover0:hover { 
animation: ease-in-out;
-webkit-transform: scale(1.02);filter:brightness(115%);
-moz-transform: scale(1.02);filter:brightness(115%);
-ms-transform: scale(1.02);filter:brightness(115%);
-o-transform: scale(1.02);filter:brightness(115%);
transform: scale(1.02);filter:brightness(115%);
}

/*hover1*/
.hover1 {transition-duration: 0.3s;}
.hover1:hover { 
animation: ease-in-out;
-webkit-transform: scale(1);filter:brightness(120%);
-moz-transform: scale(1);filter:brightness(120%);
-ms-transform: scale(1);filter:brightness(120%);
-o-transform: scale(1);filter:brightness(120%);
transform: scale(1);filter:brightness(120%);
}

/*hover2*/
.hover2 {transition-duration: 0.3s;}
.hover2:hover { 
animation: ease-in-out;
-webkit-transform: translateY(-5px); scale(1);filter:brightness(115%);
-moz-transform: translateY(-5px); scale(1);filter:brightness(115%);
-ms-transform: translateY(-5px); scale(1);filter:brightness(115%);
-o-transform: translateY(-5px); scale(1);filter:brightness(115%);
transform: translateY(-5px); scale(1);filter:brightness(115%);
}

/*hover3*/
.hover3 {transition-duration: 0.3s;}
.hover3:hover { 
animation: ease-in-out;
-webkit-transform: scale(0.96); scale(1);filter:brightness(115%);
-moz-transform: scale(0.96); scale(1);filter:brightness(115%);
-ms-transform: scale(0.96); scale(1);filter:brightness(115%);
-o-transform: scale(0.96); scale(1);filter:brightness(115%);
transform: scale(0.96); scale(1);filter:brightness(115%);
}

	@media screen and (max-width: 736px) {
	.hover0:hover,.hover1:hover,.hover2,.hover3:hover { 
		-webkit-transform: scale(1) translateY(0);filter:brightness(100%);
		-moz-transform: scale(1) translateY(0);filter:brightness(100%);
		-ms-transform: scale(1) translateY(0);filter:brightness(100%);
		-o-transform: scale(1) translateY(0);filter:brightness(100%);
		transform: scale(1) translateY(0);filter:brightness(100%);

	}