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

/*基本*/
html, body { margin: 0; padding: 0; background: url(bg_repeat.jpg?t=1782266935587) top center / 50%;}
@media screen and (max-width:767px){
	html, body { background: url(bg_repeat.jpg?t=1782266935587) top center / 100%;}
}

/*全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: 0; vertical-align: top;}
.WRAPPER a { text-decoration:none; -webkit-tap-highlight-color: transparent}
.Area ul { display:inline-block; margin: 0 auto;}
@media screen and (max-width:767px){
	.WRAPPER {min-width: inherit; min-height:100vh;}
	.WRAPPER img {  width:100%;  height:auto;}
}

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


/*背景*/
.bg_top   { z-index: -1; position: absolute; top: -5px; left: 0; width: 100%; height: 925px; background: no-repeat center top;}
.bg_top_2 { z-index:  0; position: absolute; top: -5px; left: 0; width: 100%; height: 925px; background: no-repeat center top; transform-origin: center top;}
@media screen and (max-width:767px){
	.bg_top_m 	{ z-index: -1; display: inherit; position: absolute; top: 10vw; left: 0; width: 100%; height:80vw; background: no-repeat center top; background-size: 100%;}
	.bg_top_m_2 { z-index:  0; display: inherit; position: absolute; top: 10vw; left: 0; width: 100%; height:80vw; background: no-repeat center top; background-size: 100%;}
}


/*版頭LOGO-PC*/
.Area_top { height: 690px;}
.Area_top .momologo { z-index:99; position: absolute;}
.Area_top .momologo a { display: block; width: 489px; height:67px; left:253px; top: 0;}
@media screen and (max-width:767px){	
	.Area_top { height: 78vw;}	
}
	
/*MB-LOGO*/
.Area_logo   { z-index: 50; position: absolute;}
@media screen and (max-width:767px){
  .Area_logo { top: 0; left: 0; width: 100%;}
  .Area_logo img { width:100%; height:auto;}
}

/*按鈕*/
.Area_btn2 { position: relative; top: 30px; left: 0; margin: 0 auto; padding: 0; text-align: center;}
.Area_btn2 ul { display: inline-block; margin: 170px auto 0; padding: 0;  width:454px; list-style: none;}
.Area_btn2 ul li a { position: relative;}
.Area_btn2 ul li a img {  transition-duration: 0.2s; width:100%;}
.Area_btn2 ul li { float: left; margin: 0 auto 9px; transition-duration: 0.3s;}
.Area_btn2 ul li:nth-child(2) { margin: 0 auto 0;}
.Area_btn2 ul li: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%);
}
@media screen and (max-width:767px){
	.Area_btn2 { width: 100%; height: 48vw; margin: 0 auto; padding: 0; background-size: 100%;}
	.Area_btn2 ul { width: 50%; margin: 15vw auto 0; float:inherit; display: inline-block;}
	.Area_btn2 ul li a { position:relative; font-size:4.5vw; width:100%;}
	.Area_btn2 ul li a img { transition-duration: 0.2s;}
	.Area_btn2 ul li { margin: 0 auto 4vw; width: 100%; height: 9vw;}
	.Area_btn2 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_banner .bg { position: absolute; left: 50%; top: 0; width: 955px; height: 1455px; transform: translateX(-50%); background: url(m_layout_bg.png?t=1782266935587) no-repeat top / 100%;}
	.Area_banner { margin-bottom: 260px;}
@media screen and (max-width:767px){
	.Area_banner { margin-bottom: 17vw;}
	.Area_banner .bg { position: absolute; left: 50%; top:0vw; width: 100%; height: 180vw; transform: translateX(-50%); background: url(m_layout_bg.png?t=1782266935587) no-repeat top / 100%;}
}

/*輪播*/
.Area_momocard { padding: 25px 0 0; height: 830px; margin: 0 auto 40px}
.Area_momocard .momoareatitle { margin: 10px 70px 32px; height: 100px;}
.Area_momocard .pc_momocard_swiper { width: 800px; height: auto; padding: 0 0 30px; margin: 0 auto;}
.Area_momocard .pc_momocard_swiper .swiper-slide img { width: 100%; height: auto;}
@media screen and (max-width:767px){
	.Area_momocard { height: 118vw; padding: 0; margin: 0 auto 8vw; width: 100%; background-size: 102%;}			
	.Area_momocard .momoareatitle { margin: 0 auto; height: 9vw; width: 90%;}
	.Area_momocard .pc_momocard_swiper { height: 110vw; background-image: none; padding: 0; margin: 5% auto 0 5%; width: 90%; left: 0;}	
}


/*活動辦法*/
.Area1 .text01 { position: relative; top: 0; left: 0; font-size: 24px; color: #000; margin: 20px 0;}
.QAbox .moreButton .fix.up::after { transform: rotate(0deg);}
.QAbox .moreButton .fix.down::after { transform: rotate(180deg);}
@media screen and (min-width:768px){
  .QAbox { padding: 0 150px;}
}
@media screen and (max-width:767px){
	.QAbox { width: 95%; margin: 0 auto;}
	.Area1 { margin-bottom: 5vw;}
	.Area1 .text01 { position: relative; top: 0; left: 0; font-size: 4vw; color: #000; margin: 2vw 0;}
	.Area2 { margin-bottom: 20vw;}
}


/*隱鑶*/

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