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

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

/*隱鑶*/
.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; overflow:hidden; font-family:"微軟正黑體","Microsoft JhengHei",Helvetica; background-image: linear-gradient(to left, #ddc19a, #cabdad); z-index:0;}
.WRAPPER img { border:0px; vertical-align:top;}
.WRAPPER a { text-decoration:none;}
	@media screen and (max-width:767px){
	.WRAPPER {  padding-bottom:0; min-width: inherit;}
	.WRAPPER img {  width:100%;  height:auto;}
}
	
/*背景*/
.bgtop { z-index:-3; position: absolute; top:0; left: 0; width: 100%; min-width:1220px; height:100%; background: url(pc_01.jpg?t=1757580737162) top center no-repeat;}

/*版頭*/
.Area_top { height: 1060px;}
.Area_top .titleBoxA { position: absolute; top: 900px; left: 175px;}
.Area_top .titleBoxB { position: absolute; top: 175px; left: 785px;}
.Area_top .titleBoxA img { width:900px;}
.Area_top .titleBoxB img { width:370px;}
.Area_top .PD_layout.btn {top:418px;left:370px;z-index: 9999;}
.Area_top .PD_layout.btn ul img {width:25%;}
	@media screen and (max-width:767px){
		.Area_top { height: 117vw; background-image: url(m_01.jpg?t=1757580737162); background-repeat: no-repeat; background-size: 100%;}
		.Area_top .titleBoxA { position:relative; top: 86.5vw; left: 0vw;}
		.Area_top .titleBoxA img { width:90%;}
		.Area_top .titleBoxB { position:relative; top: 12vw; left: 29vw; display: block;}
		.Area_top .titleBoxB img { width:32%;}
		.Area_top .txtBox{ display: none;}
		.Area_top .mbg .titleBoxA { position:absolute; top:12%; left: 13%; width: 70%;}
		.Area_top .mbg .titleBoxB { position:absolute; top:45%; left: 13%; width: 75%; display: block;}
		.Area_top .PD_layout.btn {top:64vw;left:0vw;}
		.Area_top .PD_layout.btn ul {width:80%;grid-gap:1.2em;}
		.Area_top .PD_layout.btn ul img {width:100%;}
	}

/*momo_logo*/
.Area_top .momologo { 
	z-index: 5; 
	position: absolute; 
	top: 15px;
    left: 90px;
  }
  .Area_top .momologo a { 
	display: block; 
	width: 350px;
    height: 80px;
	background: url(momologo_01.png?t=1757580737162) no-repeat; 
	background-size: 100%;
  }
	@media screen and (max-width:767px){
	  .Area_top .momologo { 
        top: 3.8vw;
        left: 27vw;
        width: 46%;
	  }
	  .Area_top .momologo a { 
		width: 88%; 
		height: 15vw;
		left: 2.5vw;
	  }
	}
		
/*區塊*/
.Area .box { z-index:1; position: relative; margin: 0;}

/*Area01*/	
.Area01 { height: 1648px; z-index: 3;}
.Area01_txt { position: absolute; top: 60px; left: 175px;}
.bgArea01 { z-index: -1; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url('Area01_bg.jpg?t=1757580737162') center top no-repeat;}
@media screen and (max-width:767px){
	.Area01 { height: 184vw;}
	.Area01_txt { width: 38%; top: 4vw; left: 5.8vw;}	
	.bgArea01 { z-index: -1; position: absolute; top: 0vw; left: 0; width: 100%; height: 100%; background: url('m_Area01_bg.jpg?t=1757580737162') center top no-repeat; background-size: 100%;}
}
/*影片*/   
.Area01 .youtubeArea { position: absolute; top: 1026px; left: 220px; width: 650px; height: 368px;}
.Area01 .youtubeArea iframe.mo { width: 100%; height: 100%;}
 @media screen and ( max-width:736px){
	.Area01 .youtubeArea { position: absolute; left: 11vw; top: 108.5vw; width: 71vw; height: 36vw; z-index: 99;}
	.Area01 .youtubeArea * { margin: 0; padding: 0;}
	.Area01 .youtubeArea iframe.mo { position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
	.Area01 .youtubeArea img { display: none;}
 }

/*Area02*/
.Area02 { z-index: 2; height: 1905px; margin-top: -95px;}		
.Area02_txt { position: absolute; top: 925px; left: 239px;}

.bgArea02 { z-index:-1; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background:url('Area02_bg.jpg?t=1757580737162') center top no-repeat;}
@media screen and (min-width:767px){
.Area02_txt img {width:90%;}
}	
@media screen and (max-width:767px){
	.Area02 { height: 200vw; background-image: url(m_Area02_bg.jpg?t=1757580737162); background-repeat: no-repeat; background-size:100%;}
	.Area02_txt { position: relative; margin: 0 auto; width: 79%; top: 94vw; left: 0;}
}

/*Area03*/
.Area03 { height: 2818px;}
.Area03_txt { position: absolute; top: 77px; left: 213px;}
.PD { margin-top:0;}
.bgArea03 { z-index: -1; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background:url('Area03_bg.jpg?t=1757580737162') center top no-repeat;}
.Area03_btn { z-index: 99; position: absolute; top: 1150px; left: 230px;z-index:999999;}
@media screen and (max-width:767px){
	.Area03 { height: 305vw;}
	.Area03_txt { position: relative; margin: 0 auto; width: 84%; top: 8vw; left: 0vw;}
	.bgArea03 { z-index: -1; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background:url('m_Area03_bg.jpg?t=1757580737162') center top no-repeat; background-size:100%;}
	.bgArea03_2 { z-index: -1; position: absolute; top: 93vw; left: 0; width: 100%; height: 100%; background:url('m_Area03_bg_2.jpg?t=1757580737162') center top no-repeat; background-size:100%;}
	.Area03_btn { width: 44%; top: 120vw; left: 28vw;z-index:999999;}
}
/*bg1選單*/	
.Area03 .box { z-index: 1; padding: 0; position: absolute; top: 585px;left:170px;}
.Area03 ul { padding: 0; margin: 0; text-align: left; margin-left: 60px;}
.Area03 li { list-style: none; display: inline-block; margin-right: 20px;}
.Area03 .menu .label_btn { display: inline-block; width:265px; text-align: center; transition: opacity .2s ease-in-out;}
.Area03 .menu .label_btn img { width: 100%;}
.Area03 .menu .label_btn_off { opacity: 1;}
.Area03 .menu .label_btn_on { position: absolute; top: 0; left: 0; opacity: 0;}
.Area03 .menu .selected .label_btn { display: inline-block; width: 265px; text-align: center;}
.Area03 .menu .selected .label_btn_on { opacity: 1;}
.Area03 .menu .selected .label_btn_on img { width: 100%;}	
.Area03 .tab_content .page { display: none; width: 100%; position: absolute; top: 205px; left: -40px;}
@media screen and (max-width:767px){
	.Area03 .box { top: 63vw;left:0;}
	.Area03 ul { margin-left: 6vw;}
	.Area03 li { margin-right: 3vw;}
	.Area03 .menu .label_btn { width: 34vw;}
	.Area03 .menu .selected .label_btn { width: 34vw;}
	.Area03 .tab_content .page {position: relative; width: 100%; top: 4.5vw; left: 0vw;}
}

/*Area04*/	
.Area04 { height: 2458px;}
.Area04_txt { padding: 45px 0 0 5px;}
.bgArea04 { z-index: -1; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url('Area04_bg.jpg?t=1757580737162') center top no-repeat;}	
.Area04 .Area_swiper.BN {top: 290px;}
.Area04 .Area_swiper.BN img {width:100%;}
.Area04 .Area_swiper.BN ul {grid-gap:10px;}
@media screen and (max-width:767px){
	.Area04 { height: 243vw; background-image: url(m_Area04_bg.jpg?t=1757580737162); background-repeat: no-repeat; background-size:100%;}
	.Area04_txt { position: relative; margin: 0 auto; padding: 0; width: 83%; top: 4vw; left: 0;}
	.Area04 .Area_swiper.BN {top: 25vw;z-index:99;}
}