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



/*基本*/
body{ margin:0; padding:0;text-align: center;}
a{cursor: pointer;}


/*全BOX版面*/
.WRAPPER { 
	position: relative; 
	display:block; margin: 0 auto; padding: 0; width:100%;  min-width:1200px; overflow:hidden; 
	font-family:"微軟正黑體","Microsoft JhengHei",Helvetica; 
	background-color: #14035e;
	background-image: url(../images/bg.jpg?t=1751276032549);
	background-position: top;
	background-repeat: no-repeat;
	background-size: cover;
	
}

.WRAPPER img { border:0px; vertical-align:top;}
.WRAPPER a { text-decoration:none;}
		@media screen and (max-width:767px){
		.WRAPPER { min-width: inherit; padding-bottom:150px; }
		.WRAPPER img {  width:100%;  height:auto;}
	}
	
/*背景*/
.bgtop  { z-index:0; position:absolute; top:0; left:0; width:100%; min-width:1220px; height:100%; background: url(bgtop.png?t=1751276032549) repeat-x center top ;}
	@media screen and (max-width:767px){
		.bgtop { min-width: inherit;  background: url(m_bgtop.jpg?t=1751276032549) no-repeat center 40px; background-size:100%;}
	}


/*區塊_all*/
.Area { position: relative; margin:0 auto; padding:0; border-radius:0; text-align:center; }
.Area a { display:block;} 
.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_1bn { margin: 0 auto; padding:0; overflow:hidden;}
		.Area_1bn a { float:left; margin:0 0 2% 0; padding:0; width:100%; list-style: none;}
		.Area_2bn { margin: 0 auto; padding:0; overflow:hidden;}
		.Area_2bn a { float:left; margin:0 1% 2%; padding:0; width:48%; list-style: none;}
		.Area_3bn { margin: 0 auto; padding:0; overflow:hidden;}
		.Area_3bn a { float:left; margin:0 1% 2% ; padding:0; width:31.3%; list-style: none;}
		.Area_1bn_nopadding { margin: 0 auto; padding:0; overflow:hidden;}
		.Area_1bn_nopadding a { float:left; margin:0; padding:0; width:100%; list-style: none;}
		.Area_2bn_nopadding { margin: 0 auto; padding:0; overflow:hidden;}
		.Area_2bn_nopadding a { float:left; margin:0; padding:0; width:50%; list-style: none;}
		.Area_3bn_nopadding { margin: 0 auto; padding:0; overflow:hidden;}
		.Area_3bn_nopadding a { float:left; margin:0; padding:0; width:33.3%; list-style: none;}
	}


/*版頭*/
.Area_top .momologo { z-index:2; position: absolute;top: 15px; left:40px;}
.tlogo { 
	width: 202px; height: 42px;
    background: url(tlogo.svg) no-repeat center;
    background-size: 100%;
	position: absolute;
	top: 80px;
	left: 40px;
	z-index: 1;
}
	
.Area_top .momologo a { display:block; width:200px; height:30px; background: url(momo_logo.png?t=1751276032549) no-repeat;}
.Area_top .momologo a:hover{ background: url(momo_logo_on.png?t=1751276032549) no-repeat;}

@media screen and (max-width:767px){
	.Area_top { height: auto;}.Area_top .momologo { display:none;}
	.WRAPPER { 
		background-image: url(../images/bg_m.jpg?t=1751276032549);
		background-repeat: no-repeat;
		background-position: bottom center;
		background-size:  cover;
		background-color:#cff6ff;
	}
}

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

/* 新增 */
.main{
	display: flex;
	width: 100%;
	justify-content: center;
	align-items: center;
}

.p-relative{position: relative;}
.p-absolute{position: absolute;}

img{
	transform:scale(1);
	transition: .4ms;
}





.light{
	position: absolute;
	left: 10%;
	top: 12%;
}

.top{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	position: absolute;
	top: 11%;
}

.item{display: flex;flex-wrap: wrap;justify-content: center;}

.item a{
	margin: 12px;
	border-radius: 16px;
	overflow: hidden;
}



.btn{cursor: pointer;}
 a:hover, .btn:hover{transform:scale(1.02);cursor: pointer;}

/* video */
.videobox {
	position: relative;
	  padding-bottom: 51%;
	  height: 0;
	  max-width: 94%;
	  margin: 
	  12px auto; 
	  border-radius: 24px;
	  overflow: hidden;
  }
  
  .videobox iframe {position: absolute;top: 0;left: 0;width: 100%;height: 100%;}




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

	p{
		padding-right: 16px;
		margin-top:8px;margin-bottom: 36px;
	}
	.item a{
		width: 45%;
		margin: 6px;
	}
	.light img, .classic img,.top img{
		width: 100%;
	}
	.light{left: 6%;top: 11%;}

	.videobox {border-radius: 8px;}
	.top{
		top:7%;
	}
	  

 }
 @media screen and (max-width:600px){
	.light{left: 0;top: 10%;}

	.light img, .top img{
		width: 85%;
	}
}